From 72e2dac328563cff62f100fe851f8c3b7237aabe Mon Sep 17 00:00:00 2001
From: Ardeman <are.theman@gmail.com>
Date: Fri, 7 Mar 2025 14:58:35 +0800
Subject: [PATCH] feat: refactor category routes and components for improved
 organization and clarity

---
 app/pages/dashboard-categories/index.tsx      | 36 +++++++++----------
 ....lg-admin._dashboard.categories._index.tsx |  5 +--
 ....lg-admin._dashboard.categories.create.tsx |  4 +++
 ...min._dashboard.categories.update.$slug.tsx |  4 +++
 ...in.lg-admin._dashboard.category.create.tsx |  4 ---
 ...admin._dashboard.category.update.$slug.tsx |  4 ---
 ....ts => actions.admin.categories.create.ts} |  0
 7 files changed, 29 insertions(+), 28 deletions(-)
 create mode 100644 app/routes/_admin.lg-admin._dashboard.categories.create.tsx
 create mode 100644 app/routes/_admin.lg-admin._dashboard.categories.update.$slug.tsx
 delete mode 100644 app/routes/_admin.lg-admin._dashboard.category.create.tsx
 delete mode 100644 app/routes/_admin.lg-admin._dashboard.category.update.$slug.tsx
 rename app/routes/{actions.admin.category.create.ts => actions.admin.categories.create.ts} (100%)

diff --git a/app/pages/dashboard-categories/index.tsx b/app/pages/dashboard-categories/index.tsx
index e2c92a1..1f2f8cf 100644
--- a/app/pages/dashboard-categories/index.tsx
+++ b/app/pages/dashboard-categories/index.tsx
@@ -1,5 +1,5 @@
-import DataTable from 'datatables.net-dt'
-import DT from 'datatables.net-react'
+import DT from 'datatables.net-dt'
+import DataTable from 'datatables.net-react'
 import { Link, useRouteLoaderData } from 'react-router'
 
 import { Button } from '~/components/ui/button'
@@ -10,9 +10,10 @@ export const CategoriesPage = () => {
   const loaderData = useRouteLoaderData<typeof loader>(
     'routes/_admin.lg-admin._dashboard.categories._index',
   )
-  const dataTable = loaderData?.dataCategories
+  const categoriesData = loaderData?.dataCategories
 
   DataTable.use(DT)
+  const dataTable = categoriesData
   const dataColumns = [
     {
       title: 'No',
@@ -38,7 +39,18 @@ export const CategoriesPage = () => {
       data: 'id',
     },
   ]
-
+  const dataSlot = {
+    3: (value: string) => (
+      <Button
+        as="a"
+        href={`/lg-admin/categories/update/${value}`}
+        className="text-md rounded-md"
+        size="sm"
+      >
+        Update Kategori
+      </Button>
+    ),
+  }
   const dataOptions = {
     paging: true,
     searching: true,
@@ -46,18 +58,6 @@ export const CategoriesPage = () => {
     info: true,
   }
 
-  const dataSlot = {
-    3: (value: string) => (
-      <Button
-        as="a"
-        href={`/lg-admin/category/update/${value}`}
-        className="text-md rounded-md"
-        size="sm"
-      >
-        Lihat Detail
-      </Button>
-    ),
-  }
   return (
     <div className="relative">
       <TitleDashboard title="Kategori" />
@@ -65,11 +65,11 @@ export const CategoriesPage = () => {
         <div className="flex-1">{/* TODO: Filter */}</div>
         <Button
           as={Link}
-          to="/lg-admin/category/create"
+          to="/lg-admin/categories/create"
           className="text-md h-[42px] rounded-md"
           size="lg"
         >
-          Create New
+          Buat Kategori
         </Button>
       </div>
 
diff --git a/app/routes/_admin.lg-admin._dashboard.categories._index.tsx b/app/routes/_admin.lg-admin._dashboard.categories._index.tsx
index e2b970e..0a82712 100644
--- a/app/routes/_admin.lg-admin._dashboard.categories._index.tsx
+++ b/app/routes/_admin.lg-admin._dashboard.categories._index.tsx
@@ -11,5 +11,6 @@ export const loader = async ({ request }: Route.LoaderArgs) => {
   })
   return { dataCategories }
 }
-const DashboardCategoriesLayout = () => <CategoriesPage />
-export default DashboardCategoriesLayout
+
+const DashboardCategoriesIndexLayout = () => <CategoriesPage />
+export default DashboardCategoriesIndexLayout
diff --git a/app/routes/_admin.lg-admin._dashboard.categories.create.tsx b/app/routes/_admin.lg-admin._dashboard.categories.create.tsx
new file mode 100644
index 0000000..39b04d5
--- /dev/null
+++ b/app/routes/_admin.lg-admin._dashboard.categories.create.tsx
@@ -0,0 +1,4 @@
+import { CreateCategoryPage } from '~/pages/dashboard-category-create'
+
+const DashboardCategoriesCreateLayout = () => <CreateCategoryPage />
+export default DashboardCategoriesCreateLayout
diff --git a/app/routes/_admin.lg-admin._dashboard.categories.update.$slug.tsx b/app/routes/_admin.lg-admin._dashboard.categories.update.$slug.tsx
new file mode 100644
index 0000000..fd8f151
--- /dev/null
+++ b/app/routes/_admin.lg-admin._dashboard.categories.update.$slug.tsx
@@ -0,0 +1,4 @@
+import { UpdateCategoryPage } from '~/pages/dashboard-category-update'
+
+const DashboardCategoriesUpdateLayout = () => <UpdateCategoryPage />
+export default DashboardCategoriesUpdateLayout
diff --git a/app/routes/_admin.lg-admin._dashboard.category.create.tsx b/app/routes/_admin.lg-admin._dashboard.category.create.tsx
deleted file mode 100644
index 5f475e0..0000000
--- a/app/routes/_admin.lg-admin._dashboard.category.create.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import { CreateCategoryPage } from '~/pages/dashboard-category-create'
-
-const DashboardCategoryLayout = () => <CreateCategoryPage />
-export default DashboardCategoryLayout
diff --git a/app/routes/_admin.lg-admin._dashboard.category.update.$slug.tsx b/app/routes/_admin.lg-admin._dashboard.category.update.$slug.tsx
deleted file mode 100644
index 2da33fd..0000000
--- a/app/routes/_admin.lg-admin._dashboard.category.update.$slug.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import { UpdateCategoryPage } from '~/pages/dashboard-category-update'
-
-const DashboardCategoryUpdateLayout = () => <UpdateCategoryPage />
-export default DashboardCategoryUpdateLayout
diff --git a/app/routes/actions.admin.category.create.ts b/app/routes/actions.admin.categories.create.ts
similarity index 100%
rename from app/routes/actions.admin.category.create.ts
rename to app/routes/actions.admin.categories.create.ts