Tambahan

src/app_modules/admin/colab/dashboard/index.tsx

@@ -5,37 +5,122 @@ import { useRouter } from "next/navigation";
 import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
 import { IconAlertTriangle, IconMessage2, IconUpload } from "@tabler/icons-react";
 import { AccentColor, AdminColor } from "@/app_modules/_global/color/color_pallet";
+import { useState } from "react";
+import { clientLogger } from "@/util/clientLogger";
+import { apiGetAdminCollaborationStatusCountDashboard } from "../lib/api_fetch_admin_collaboration";
+import global_limit from "@/app/lib/limit";
+import { useShallowEffect } from "@mantine/hooks";
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
 
-export default function AdminColab_Dashboard({
-  countPublish,
-  countRoom,
-  countReject,
-}: {
-  countPublish: number;
-  countRoom: number;
-  countReject: number;
-}) {
+export default function AdminColab_Dashboard() {
+  const [countPublish, setCountPublish] = useState<number | null>(null);
+  const [countRoom, setCountRoom] = useState<number | null>(null);
+  const [countReject, setCountReject] = useState<number | null>(null);
   const router = useRouter();
 
+ 
+
+  useShallowEffect(() => {
+    handlerLoadData()
+  }, []);
+
+  async function handlerLoadData() {
+    try {
+      const listLoadData = [
+        global_limit(() => onLoadCountPublish()),
+        global_limit(() => onLoadCountRoom()),
+        global_limit(() => onLoadCountReject()),
+      ]
+      const result = await Promise.all(listLoadData);
+    } catch (error) {
+      clientLogger.error("Error handler load data", error)
+    }
+  }
+  async function onLoadCountPublish() {
+    try {
+      const response = await apiGetAdminCollaborationStatusCountDashboard({
+        name: "Publish",
+      })
+      if (response) { 
+        setCountPublish(response.data);
+      }
+    } catch (error) {
+      clientLogger.error("Error get count publish", error);
+    }
+  }
+
+
+  async function onLoadCountRoom() {
+    try {
+      const response = await apiGetAdminCollaborationStatusCountDashboard(
+        {
+          name: "Room",
+        }
+      )
+      if (response) {
+        setCountRoom(response.data);
+      }
+    } catch (error) {
+      clientLogger.error("Error get count room", error);
+    }
+  }
+
+  async function onLoadCountReject() {
+    try {
+      const response = await apiGetAdminCollaborationStatusCountDashboard({
+        name: "Reject",
+      })
+      if (response) {
+        setCountReject(response.data);
+      }
+    } catch (error) {
+      clientLogger.error("Error get count reject", error);
+    }
+  }
+
   const listStatus = [
     {
       id: 1,
       name: "Publish",
-      jumlah: countPublish,
+      jumlah: countPublish
+      == null ? (
+        <CustomSkeleton height={40} width={40} />
+      ) : countPublish ? (
+        countPublish
+      ) : (
+        "-"
+      )
+      ,
       color: "green",
       icon: <IconUpload size={18} color="#4CAF4F" />
     },
     {
       id: 2,
       name: "Group Chat",
-      jumlah: countRoom,
+      jumlah: countRoom
+      == null ? (
+        <CustomSkeleton height={40} width={40} />
+      ) : countRoom ? (
+        countRoom
+      ) : (
+        "-"
+      )
+      ,
       color: "orange",
       icon: <IconMessage2 size={18} color="#FF9800" />
     },
     {
       id: 3,
       name: "Reject",
-      jumlah: countReject,
+      jumlah: countReject
+       == null ? (
+        <CustomSkeleton height={40} width={40} />
+      ) : countReject ? (
+        countReject
+      ) : (
+        "-"
+        )
+      ,
       color: "red",
       icon: <IconAlertTriangle size={18} color="#FF4B4C" />
     },
@@ -84,3 +169,7 @@ export default function AdminColab_Dashboard({
     </>
   );
 }
+function apiGetAdminCollaborationStatuCountDashboard(arg0: { name: string; }) {
+  throw new Error("Function not implemented.");
+}
+

src/app_modules/admin/colab/lib/api_fetch_admin_collaboration.ts

@@ -0,0 +1,25 @@
+export {
+    apiGetAdminCollaborationStatusCountDashboard,
+   
+}
+const apiGetAdminCollaborationStatusCountDashboard = async ({
+    name
+}: {
+        name: "Publish" | "Reject" | "Room";
+}) => {
+    const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+    if (!token) return await token.json().catch(() => null);
+
+    // console.log("Ini Token", token);
+    const response = await fetch(`/api/admin/collaboration/dashboard/${name}`, {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+            "Access-Control-Allow-Origin": "*",
+            Authorization: `Bearer ${token}`,
+        }
+    })
+    // console.log("Ini Response", await response.json());
+    return await response.json().catch(() => null);
+}