Merge pull request #79 from premieroctet/feature/url-slug

feat: allow slug version of model in url
premieroctet · Dec 5, 2023 · dddb9fe · dddb9fe
2 parents ab45bde + c103c33
commit dddb9fe
Show file tree

Hide file tree

Showing 10 changed files with 30 additions and 14 deletions.
diff --git a/.changeset/witty-penguins-camp.md b/.changeset/witty-penguins-camp.md
@@ -0,0 +1,5 @@
+---
+"@premieroctet/next-admin": patch
+---
+
+feat: allow slug version of model in url
diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
@@ -1,4 +1,4 @@
-name: E2E tests
+name: E2E & Unit tests
 on:
   push:
     branches:
@@ -34,6 +34,7 @@ jobs:
         run: yarn start:example &
       - name: Run tests
         run: |
+          yarn test
           yarn turbo test:e2e 
           BASE_URL=http://localhost:3000/pagerouter/admin yarn test:e2e
       - uses: actions/upload-artifact@v3

diff --git a/apps/example/e2e/utils.ts b/apps/example/e2e/utils.ts
@@ -60,7 +60,9 @@ export const deleteItem = async (model: ModelName, page: Page, id: string) => {
   page.on("dialog", async (dialog) => dialog.accept());
   await page.goto(`${process.env.BASE_URL}/${model}/${id}`);
   await page.click('button:has-text("Delete")');
-  await page.waitForURL((url) => url.pathname.endsWith(`/${model}`));
+  await page.waitForURL((url) =>
+    url.pathname.endsWith(`/${model.toLowerCase()}`)
+  );
 };
 
 export const readItem = async (model: ModelName, page: Page, id: string) => {

diff --git a/packages/next-admin/src/components/DataTable.tsx b/packages/next-admin/src/components/DataTable.tsx
@@ -76,8 +76,10 @@ export function DataTable({ columns, data, resource }: DataTableProps) {
                 className="cursor-pointer hover:bg-indigo-50"
                 onClick={() => {
                   router.push({
-                    // @ts-expect-error
-                    pathname: `${basePath}/${resource}/${row.original.id.value}`,
+                    pathname: `${basePath}/${resource.toLowerCase()}/${
+                      // @ts-expect-error
+                      row.original.id.value
+                    }`,
                   });
                 }}
               >

diff --git a/packages/next-admin/src/components/Form.tsx b/packages/next-admin/src/components/Form.tsx
@@ -10,7 +10,7 @@ import {
 } from "@rjsf/utils";
 import validator from "@rjsf/validator-ajv8";
 import clsx from "clsx";
-import { ChangeEvent, useEffect, useState } from "react";
+import { ChangeEvent, useState } from "react";
 import { PropertyValidationError } from "../exceptions/ValidationError";
 import { ModelName, SubmitFormResult } from "../types";
 import { Schemas, getSchemas } from "../utils/jsonSchema";
@@ -192,7 +192,7 @@ const Form = ({
 
       if (result?.deleted) {
         return router.replace({
-          pathname: `${basePath}/${resource}`,
+          pathname: `${basePath}/${resource.toLowerCase()}`,
           query: {
             message: JSON.stringify({
               type: "success",
@@ -204,7 +204,7 @@ const Form = ({
 
       if (result?.created) {
         return router.replace({
-          pathname: `${basePath}/${resource}/${result.createdId}`,
+          pathname: `${basePath}/${resource.toLowerCase()}/${result.createdId}`,
           query: {
             message: JSON.stringify({
               type: "success",

diff --git a/packages/next-admin/src/components/Menu.tsx b/packages/next-admin/src/components/Menu.tsx
@@ -27,7 +27,7 @@ export default function Menu({
   }> =
     resources?.map((resource) => ({
       name: resource,
-      href: `${basePath}/${resource}`,
+      href: `${basePath}/${resource.toLowerCase()}`,
       current: resource === currentResource,
     })) || [];
 

diff --git a/packages/next-admin/src/router.tsx b/packages/next-admin/src/router.tsx
@@ -132,7 +132,7 @@ export const nextAdminRouter = async (
 
             return {
               redirect: {
-                destination: `${options.basePath}/${resource}`,
+                destination: `${options.basePath}/${resource.toLowerCase()}`,
                 permanent: false,
               },
             };
@@ -188,7 +188,7 @@ export const nextAdminRouter = async (
 
           return {
             redirect: {
-              destination: `${options.basePath}/${resource}/${
+              destination: `${options.basePath}/${resource.toLowerCase()}/${
                 createdData.id
               }?message=${JSON.stringify({
                 type: "success",

diff --git a/packages/next-admin/src/tests/prismaUtils.test.ts b/packages/next-admin/src/tests/prismaUtils.test.ts
@@ -28,7 +28,8 @@ describe("getMappedDataList", () => {
       prismaMock,
       "Post",
       options,
-      new URLSearchParams()
+      new URLSearchParams(),
+      {},
     );
     expect(result).toEqual({
       data: postData,

diff --git a/packages/next-admin/src/utils/server.test.ts b/packages/next-admin/src/utils/server.test.ts
@@ -30,6 +30,10 @@ describe("Server utils", () => {
       expect(getResourceFromParams(["User", "1"], ["User"])).toEqual("User");
     });
 
+    it("should return a resource with /admin/user/1", () => {
+      expect(getResourceFromParams(["user", "1"], ["User"])).toEqual("User");
+    });
+
     it("should not return a resource with /admin/Post", () => {
       expect(getResourceFromParams(["Post"], ["User"])).toEqual(undefined);
     });

diff --git a/packages/next-admin/src/utils/server.ts b/packages/next-admin/src/utils/server.ts
@@ -1,6 +1,4 @@
 import { Prisma, PrismaClient } from "@prisma/client";
-import bodyParser from "body-parser";
-import util from "util";
 import {
   EditFieldsOptions,
   EditOptions,
@@ -493,7 +491,10 @@ export const getResourceFromParams = (
   params: string[],
   resources: Prisma.ModelName[]
 ) => {
-  return resources.find((r) => params.includes(r));
+  return resources.find((r) => {
+    const slugifiedResource = r.toLowerCase();
+    return params.some(param => param.toLowerCase() === slugifiedResource)
+  });
 };
 
 /**