feat: refactor news and category schemas, update API response handling, and improve date formatting

app/pages/dashboard-contents/data.ts

@@ -1,102 +0,0 @@
-type TContents = {
-  id: number
-  createdAt: string
-  author: string
-  title: string
-  tags: string
-  category: string
-  status: string
-}
-
-export const CONTENTS: TContents[] = [
-  {
-    id: 1,
-    createdAt: '24/10/2024',
-    author: 'John Doe',
-    title: 'Introduction to TypeScript',
-    tags: 'Normal',
-    category: 'Education',
-    status: 'Published',
-  },
-  {
-    id: 2,
-    createdAt: '24/10/2024',
-    author: 'Jane Smith',
-    title: 'Advanced React Patterns',
-    tags: 'Normal',
-    category: 'Development',
-    status: 'Draft',
-  },
-  {
-    id: 3,
-    createdAt: '24/10/2024',
-    author: 'Alice Johnson',
-    title: 'Understanding Redux',
-    tags: 'Normal',
-    category: 'Development',
-    status: 'Published',
-  },
-  {
-    id: 4,
-    createdAt: '24/10/2024',
-    author: 'Bob Brown',
-    title: 'CSS Grid Layout',
-    tags: 'Premium',
-    category: 'Design',
-    status: 'Published',
-  },
-  {
-    id: 5,
-    createdAt: '24/10/2024',
-    author: 'Charlie Davis',
-    title: 'Node.js Best Practices',
-    tags: 'Premium',
-    category: 'Development',
-    status: 'Published',
-  },
-  {
-    id: 6,
-    createdAt: '24/10/2024',
-    author: 'Diana Evans',
-    title: 'GraphQL for Beginners',
-    tags: 'Premium',
-    category: 'Development',
-    status: 'Draft',
-  },
-  {
-    id: 7,
-    createdAt: '24/10/2024',
-    author: 'Evan Harris',
-    title: 'Building RESTful APIs',
-    tags: 'Premium',
-    category: 'Development',
-    status: 'Published',
-  },
-  {
-    id: 8,
-    createdAt: '24/10/2024',
-    author: 'Fiona Green',
-    title: 'Introduction to Docker',
-    tags: 'Normal',
-    category: 'DevOps',
-    status: 'Published',
-  },
-  {
-    id: 9,
-    createdAt: '24/10/2024',
-    author: 'George King',
-    title: 'Microservices Architecture',
-    tags: 'Normal',
-    category: 'Development',
-    status: 'Draft',
-  },
-  {
-    id: 10,
-    createdAt: '24/10/2024',
-    author: 'Hannah Lee',
-    title: 'Kubernetes Essentials',
-    tags: 'Normal',
-    category: 'DevOps',
-    status: 'Published',
-  },
-]

app/pages/dashboard-contents/index.tsx

@@ -2,7 +2,9 @@ import DT from 'datatables.net-dt'
 import DataTable from 'datatables.net-react'
 import { Link, useRouteLoaderData } from 'react-router'
 
-import type { TCategories } from '~/apis/admin/get-news'
+import type { TNewsSchema } from '~/apis/admin/get-news'
+import type { TCategorySchema } from '~/apis/common/get-categories'
+import type { TTagSchema } from '~/apis/common/get-tags'
 import { Button } from '~/components/ui/button'
 import { UiTable } from '~/components/ui/table'
 import { TitleDashboard } from '~/components/ui/title-dashboard'
@@ -20,28 +22,31 @@ export const ContentsPage = () => {
   const dataColumns = [
     {
       title: 'No',
-      data: undefined,
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      render: function (data: any, type: any, row: any, meta: any) {
+      render: (
+        data: unknown,
+        type: unknown,
+        row: unknown,
+        meta: { row: number },
+      ) => {
         return meta.row + 1
       },
     },
-    { title: 'Tanggal Konten', data: 'live_at' },
+    {
+      title: 'Tanggal Konten',
+      data: 'live_at',
+    },
     {
       title: 'Nama Penulis',
-
-      data: 'author',
     },
     { title: 'Judul', data: 'title' },
-    { title: 'Kategori', data: 'categories' },
     {
-      title: 'Tags',
+      title: 'Kategori',
+      data: 'categories',
+    },
+    { title: 'Tag', data: 'tags' },
+    {
+      title: 'Premium',
       data: 'is_premium',
-      render: (value: string) => {
-        return value
-          ? `<span class="bg-[#FFFCAF] text-[#DBCA6E] px-4 py-2 rounded-full">Premium</span>`
-          : `<span class="bg-[#F5F5F5] text-[#4C5CA0] px-4 py-2 rounded-full">Normal</span>`
-      },
     },
     {
       title: 'Action',
@@ -49,28 +54,35 @@ export const ContentsPage = () => {
     },
   ]
   const dataSlot = {
-    1: (value: string) => {
-      return formatDate(value)
-    },
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    2: (value: any, type: any, data: any) =>
-      `<span>${value.name}</span> <br> <span class="text-sm text-[#7C7C7C]">ID: ${data.id.slice(0, 12)}</span>`,
-    4: (value: TCategories) => {
-      const categories = value.map((item) => item.name).join(', ')
-      return `${categories}`
-    },
-    6: (value: string | number) => {
-      return (
-        <Button
-          as="a"
-          href={`/lg-admin/contents/update/${value}`}
-          className="text-md rounded-md"
-          size="sm"
-        >
-          Lihat Detail
-        </Button>
-      )
-    },
+    1: (value: string) => formatDate(value),
+    2: (_value: unknown, _type: unknown, data: TNewsSchema) => (
+      <div>
+        <div>{data.author.name}</div>
+        <div className="text-sm text-[#7C7C7C]">ID: {data.id.slice(0, 8)}</div>
+      </div>
+    ),
+    4: (value: TCategorySchema[]) => value.map((item) => item.name).join(', '),
+    5: (value: TTagSchema[]) => value.map((item) => item.name).join(', '),
+    6: (value: string) =>
+      value ? (
+        <div className="rounded-full bg-[#FFFCAF] px-2 text-center text-[#DBCA6E]">
+          Premium
+        </div>
+      ) : (
+        <div className="rounded-full bg-[#F5F5F5] px-2 text-center text-[#4C5CA0]">
+          Normal
+        </div>
+      ),
+    7: (value: string) => (
+      <Button
+        as="a"
+        href={`/lg-admin/contents/update/${value}`}
+        className="text-md rounded-md"
+        size="sm"
+      >
+        Lihat Detail
+      </Button>
+    ),
   }
   const dataOptions = {
     paging: true,