From 0dcdfa6df3f599b09cbb55f0293876068cd5766c Mon Sep 17 00:00:00 2001
From: Bagasbanuna02 <bagasbanuna02@gmail.com>
Date: Wed, 26 Mar 2025 14:45:09 +0800
Subject: [PATCH] fix button detail - fix admin table donasi - fix admin event
 status on detail data

---
 .../admin/donasi/detail/publish/[id]/page.tsx |  11 --
 .../_component/comp_admin_modal.tsx           |   9 +-
 .../_component/comp_button_user_on_navbar.tsx |  36 +++-
 .../donasi/detail/publish/detail_publish.tsx  | 163 ++++++++++--------
 .../admin/donasi/sub_menu/table_publish.tsx   |  83 ++++-----
 .../admin/donasi/sub_menu/table_reject.tsx    |  61 ++++---
 .../admin/donasi/sub_menu/table_review.tsx    |  68 ++++----
 .../admin/event/_ui/ui_new_detail.tsx         |   1 -
 .../admin/vote/component/comp_detail.tsx      |   2 +-
 9 files changed, 242 insertions(+), 192 deletions(-)

diff --git a/src/app/dev/admin/donasi/detail/publish/[id]/page.tsx b/src/app/dev/admin/donasi/detail/publish/[id]/page.tsx
index 7aeca3ba..d35f3207 100644
--- a/src/app/dev/admin/donasi/detail/publish/[id]/page.tsx
+++ b/src/app/dev/admin/donasi/detail/publish/[id]/page.tsx
@@ -1,29 +1,18 @@
 import { AdminDonasi_DetailPublish } from "@/app_modules/admin/donasi";
 import { AdminDonasi_funCountDonatur } from "@/app_modules/admin/donasi/fun/count/fun_count_donatur";
-import { adminDonasi_getListDonatur } from "@/app_modules/admin/donasi/fun/get/get_list_donatur_by_id";
 import { AdminDonasi_getListPencairanDana } from "@/app_modules/admin/donasi/fun/get/get_list_pencairan_dana_by_id";
-import { AdminDonasi_getOneById } from "@/app_modules/admin/donasi/fun/get/get_one_by_id";
-import adminDonasi_getMasterStatus from "@/app_modules/admin/donasi/fun/master/get_status_id";
 
 export default async function Page({ params }: { params: { id: string } }) {
   let donasiId = params.id;
   // const dataPublish = await AdminDonasi_getOneById(params.id);
   const countDonatur = await AdminDonasi_funCountDonatur(params.id);
-  const listMasterStatus = await adminDonasi_getMasterStatus();
-  const listDonatur = await adminDonasi_getListDonatur({
-    donasiId: donasiId,
-    page: 1,
-  });
   const listPencairan = await AdminDonasi_getListPencairanDana(params.id);
 
   return (
     <>
       <AdminDonasi_DetailPublish
-        // dataPublish={dataPublish as any}
-        // listDonatur={listDonatur as any}
         countDonatur={countDonatur}
         listPencairan={listPencairan as any}
-        // listMasterStatus={listMasterStatus as any}
       />
     </>
   );
diff --git a/src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx b/src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx
index 185bbb3d..e7f626f7 100644
--- a/src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx
+++ b/src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx
@@ -8,12 +8,16 @@ export function Admin_ComponentModal({
   onClose,
   title,
   size,
+  withCloseButton,
+  closeOnClickOutside,
 }: {
   children: React.ReactNode;
   opened: boolean;
   onClose: () => void;
   size?: "sm" | "md" | "lg" | "xl";
-  title: string
+  title: any;
+  withCloseButton?: boolean | undefined;
+  closeOnClickOutside?: boolean | undefined;
 }) {
   return (
     <>
@@ -25,10 +29,11 @@ export function Admin_ComponentModal({
         }}
         opened={opened}
         onClose={onClose}
-        withCloseButton={false}
         size={size ? size : "sm"}
         centered
         title={title}
+        withCloseButton={withCloseButton ? withCloseButton : false}
+        closeOnClickOutside={closeOnClickOutside}
       >
         {children}
       </Modal>
diff --git a/src/app_modules/admin/_admin_global/_component/comp_button_user_on_navbar.tsx b/src/app_modules/admin/_admin_global/_component/comp_button_user_on_navbar.tsx
index 0b50f5a4..8fb64a80 100644
--- a/src/app_modules/admin/_admin_global/_component/comp_button_user_on_navbar.tsx
+++ b/src/app_modules/admin/_admin_global/_component/comp_button_user_on_navbar.tsx
@@ -22,6 +22,7 @@ import {
 import { IconPhone, IconUser, IconUserCircle } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
+import { Admin_ComponentModal } from "./comp_admin_modal";
 
 export function Admin_ComponentButtonUserCircle({
   dataUser,
@@ -102,7 +103,7 @@ export function Admin_ComponentButtonUserCircle({
         </Popover.Dropdown>
       </Popover>
 
-      <Modal
+      {/* <Modal
         opened={openModal}
         onClose={() => setOpenModal(false)}
         centered
@@ -132,7 +133,38 @@ export function Admin_ComponentButtonUserCircle({
             </Button>
           </Group>
         </Stack>
-      </Modal>
+      </Modal> */}
+
+      <Admin_ComponentModal
+        opened={openModal}
+        onClose={() => setOpenModal(false)}
+        title={"Anda yakin ingin keluar ?"}
+        withCloseButton={false}
+        closeOnClickOutside={false}
+      >
+        <Stack>
+          <Group align="center" position="center">
+            <Button
+              onClick={() => {
+                setOpenModal(false);
+              }}
+              radius={50}
+            >
+              Batal
+            </Button>
+            <Button
+              loaderPosition="center"
+              loading={loadingLogout ? true : false}
+              radius={50}
+              bg={Warna.merah}
+              color="red"
+              onClick={() => onClickLogout()}
+            >
+              Keluar
+            </Button>
+          </Group>
+        </Stack>
+      </Admin_ComponentModal>
     </>
   );
 
diff --git a/src/app_modules/admin/donasi/detail/publish/detail_publish.tsx b/src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
index 12a1e487..d5e5cad8 100644
--- a/src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
+++ b/src/app_modules/admin/donasi/detail/publish/detail_publish.tsx
@@ -1,56 +1,34 @@
 "use client";
 
-import { AccentColor, AdminColor } from "@/app_modules/_global/color/color_pallet";
+import { AdminColor } from "@/app_modules/_global/color/color_pallet";
 import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
-import { apiGetMasterStatusTransaksi } from "@/app_modules/_global/lib/api_fetch_master";
-import { globalStatusTransaksi } from "@/app_modules/_global/lib/master_list_app";
 import { Admin_ComponentLoadImageLandscape } from "@/app_modules/admin/_admin_global";
-import { ComponentAdminGlobal_TitlePage } from "@/app_modules/admin/_admin_global/_component";
 import CustomSkeletonAdmin from "@/app_modules/admin/_admin_global/_component/skeleton/customSkeletonAdmin";
-import { ComponentAdminGlobal_NotifikasiBerhasil } from "@/app_modules/admin/_admin_global/admin_notifikasi/notifikasi_berhasil";
-import { ComponentAdminGlobal_NotifikasiGagal } from "@/app_modules/admin/_admin_global/admin_notifikasi/notifikasi_gagal";
 import AdminGlobal_ComponentBackButton from "@/app_modules/admin/_admin_global/back_button";
-import adminNotifikasi_funCreateToUser from "@/app_modules/admin/notifikasi/fun/create/fun_create_notif_user";
-import TampilanRupiahDonasi from "@/app_modules/donasi/component/tampilan_rupiah";
 import {
   MODEL_DONASI,
-  MODEL_DONASI_PENCAIRAN_DANA
+  MODEL_DONASI_PENCAIRAN_DANA,
 } from "@/app_modules/donasi/model/interface";
-import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
-import { RouterAdminGlobal } from "@/lib";
 import { RouterAdminDonasi } from "@/lib/router_admin/router_admin_donasi";
 import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
 import { clientLogger } from "@/util/clientLogger";
-import mqtt_client from "@/util/mqtt_client";
 import {
-  ActionIcon,
-  Badge,
-  Box,
   Button,
   Center,
   Grid,
-  Group,
   Modal,
-  Pagination,
   Paper,
-  ScrollArea,
-  Select,
   SimpleGrid,
-  Spoiler,
   Stack,
-  Table,
   Text,
   TextInput,
   Title,
 } from "@mantine/core";
 import { useDisclosure, useShallowEffect } from "@mantine/hooks";
-import { IconReload } from "@tabler/icons-react";
 import { toNumber } from "lodash";
-import moment from "moment";
 import { useParams, useRouter } from "next/navigation";
 import { useState } from "react";
-import adminDonasi_funUpdateStatusDanTotal from "../../fun/update/fun_update_status_dan_total";
-import { apiGetAdminAllDaftarDonatur, apiGetAdminDonasiById } from "../../lib/api_fetch_admin_donasi";
+import { apiGetAdminDonasiById } from "../../lib/api_fetch_admin_donasi";
 import TampilanListDonatur from "./detail_list_donatur";
 import TampilanListPencairan from "./detail_list_pencairan";
 
@@ -65,31 +43,28 @@ export default function AdminDonasi_DetailPublish({
   const [isReload, setReload] = useState(false);
   const params = useParams<{ id: string }>();
   const [data, setData] = useState<MODEL_DONASI | null>(null);
-  console.log("Ini data", data)
-  // 
 
   useShallowEffect(() => {
     loadInitialData();
-  }, [isReload])
+  }, [isReload]);
 
   const loadInitialData = async () => {
     try {
       const response = await apiGetAdminDonasiById({
         id: params.id,
-      })
+      });
 
       if (response?.success && response?.data) {
-        setData(response.data)
-        setReload(false)
-
+        setData(response.data);
+        setReload(false);
       } else {
-        setData(null)
+        setData(null);
       }
     } catch (error) {
       clientLogger.error("Invalid data format recieved:", error);
       setData(null);
     }
-  }
+  };
 
   return (
     <>
@@ -99,19 +74,23 @@ export default function AdminDonasi_DetailPublish({
           <AdminGlobal_ComponentBackButton
             path={RouterAdminDonasi.table_publish}
           />
-          {!data ? (<CustomSkeletonAdmin height={"40vh"} />) : (
-            <TampilanDetailDonasi
-              countDonatur={countDonatur} donasi={data} />
+          {!data ? (
+            <CustomSkeletonAdmin height={"40vh"} />
+          ) : (
+            <TampilanDetailDonasi countDonatur={countDonatur} donasi={data} />
           )}
-          {!data ? (<CustomSkeletonAdmin height={"80vh"} />) : (
+          {!data ? (
+            <CustomSkeletonAdmin height={"80vh"} />
+          ) : (
             <TampilanListDonatur
               setReloadDonasi={(val) => {
-                setReload(val)
+                setReload(val);
               }}
               donasi={data}
               isReload={isReload}
-            />)}
-          <TampilanListPencairan  pencairan={pencairan} />
+            />
+          )}
+          <TampilanListPencairan pencairan={pencairan} />
         </>
       </Stack>
     </>
@@ -120,20 +99,15 @@ export default function AdminDonasi_DetailPublish({
 
 function TampilanDetailDonasi({
   countDonatur,
-  donasi
-
+  donasi,
 }: {
   countDonatur: number;
   donasi: MODEL_DONASI;
-
 }) {
-
-
   const [opened, { open, close }] = useDisclosure(false);
   const router = useRouter();
   const [isLoadingPencairanDana, setIsLoadingPencairanDana] = useState(false);
 
-
   return (
     <>
       <Paper bg={AdminColor.softBlue} radius={"md"} p={"md"}>
@@ -158,12 +132,18 @@ function TampilanDetailDonasi({
 
             <Paper p={"sm"} bg={AdminColor.softBlue}>
               <Stack spacing={5}>
-                <Title c={AdminColor.white} order={4}>Detail Donasi</Title>
+                <Title c={AdminColor.white} order={4}>
+                  Detail Donasi
+                </Title>
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Judul</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Judul
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title order={5} c={AdminColor.white}>
                       {donasi?.title}
@@ -173,9 +153,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Penggalang Dana</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Penggalang Dana
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title order={5} c={AdminColor.white}>
                       {donasi?.Author.username}
@@ -185,9 +169,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Durasi</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Durasi
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title c={AdminColor.white} order={5}>
                       {donasi?.DonasiMaster_Durasi.name} hari
@@ -197,9 +185,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Dana dibutuhkan</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Dana dibutuhkan
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <ComponentGlobal_TampilanRupiah
                       nominal={+donasi?.target}
@@ -210,9 +202,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Kategori</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Kategori
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title c={AdminColor.white} order={5}>
                       {donasi?.DonasiMaster_Ketegori?.name}
@@ -222,9 +218,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={"xs"}>Total donatur</Text>
+                    <Text c={AdminColor.white} fz={"xs"}>
+                      Total donatur
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title order={5} c={AdminColor.white}>
                       {countDonatur}
@@ -234,9 +234,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={12}>Progres</Text>
+                    <Text c={AdminColor.white} fz={12}>
+                      Progres
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Title order={5} c={AdminColor.white}>
                       {toNumber(donasi.progres).toFixed(2)} %
@@ -246,9 +250,13 @@ function TampilanDetailDonasi({
 
                 <Grid>
                   <Grid.Col span={4}>
-                    <Text c={AdminColor.white} fz={12}>Dana terkumpul</Text>
+                    <Text c={AdminColor.white} fz={12}>
+                      Dana terkumpul
+                    </Text>
+                  </Grid.Col>
+                  <Grid.Col c={AdminColor.white} span={"content"}>
+                    :
                   </Grid.Col>
-                  <Grid.Col c={AdminColor.white} span={"content"}>:</Grid.Col>
                   <Grid.Col span={"auto"}>
                     <ComponentGlobal_TampilanRupiah
                       nominal={+donasi?.terkumpul}
@@ -263,12 +271,16 @@ function TampilanDetailDonasi({
             <Paper bg={AdminColor.softBlue} p={"sm"}>
               <Stack spacing={"xl"}>
                 <Center>
-                  <Title c={AdminColor.white} order={4}>Pencairan Dana</Title>
+                  <Title c={AdminColor.white} order={4}>
+                    Pencairan Dana
+                  </Title>
                 </Center>
                 <Grid>
                   <Grid.Col span={"auto"}>
                     <Stack spacing={0}>
-                      <Text c={AdminColor.white} fz={"xs"}>Total Dana Dicairkan</Text>
+                      <Text c={AdminColor.white} fz={"xs"}>
+                        Total Dana Dicairkan
+                      </Text>
                       <ComponentGlobal_TampilanRupiah
                         nominal={donasi?.totalPencairan}
                         color={AdminColor.yellow}
@@ -277,7 +289,9 @@ function TampilanDetailDonasi({
                   </Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Stack spacing={0}>
-                      <Text c={AdminColor.white} fz={"xs"}>Bank Tujuan</Text>
+                      <Text c={AdminColor.white} fz={"xs"}>
+                        Bank Tujuan
+                      </Text>
                       <Title order={6} c={AdminColor.white}>
                         {donasi?.namaBank}
                       </Title>
@@ -287,7 +301,9 @@ function TampilanDetailDonasi({
                 <Grid>
                   <Grid.Col span={"auto"}>
                     <Stack spacing={0}>
-                      <Text c={AdminColor.white} fz={"xs"}>Akumulasi Pencairan</Text>
+                      <Text c={AdminColor.white} fz={"xs"}>
+                        Akumulasi Pencairan
+                      </Text>
                       <Title order={6} c={AdminColor.white}>
                         {donasi?.akumulasiPencairan} Kali
                       </Title>
@@ -295,7 +311,9 @@ function TampilanDetailDonasi({
                   </Grid.Col>
                   <Grid.Col span={"auto"}>
                     <Stack spacing={0}>
-                      <Text fz={"xs"} c={AdminColor.white}>Nomor Rekening</Text>
+                      <Text fz={"xs"} c={AdminColor.white}>
+                        Nomor Rekening
+                      </Text>
                       <Title order={6} c={AdminColor.white}>
                         {donasi?.rekening}
                       </Title>
@@ -304,7 +322,9 @@ function TampilanDetailDonasi({
                 </Grid>
 
                 <Stack align="center" spacing={0}>
-                  <Text c={AdminColor.white} fz={"xs"}>Sisa Dana</Text>
+                  <Text c={AdminColor.white} fz={"xs"}>
+                    Sisa Dana
+                  </Text>
                   <ComponentGlobal_TampilanRupiah
                     nominal={
                       toNumber(donasi.terkumpul) -
@@ -348,6 +368,3 @@ function PencairanDana() {
     </>
   );
 }
-
-
-
diff --git a/src/app_modules/admin/donasi/sub_menu/table_publish.tsx b/src/app_modules/admin/donasi/sub_menu/table_publish.tsx
index 15ddcf66..aac9cf41 100644
--- a/src/app_modules/admin/donasi/sub_menu/table_publish.tsx
+++ b/src/app_modules/admin/donasi/sub_menu/table_publish.tsx
@@ -1,33 +1,31 @@
 "use client";
 
-import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
+import { AccentColor } from "@/app_modules/_global/color";
+import { AdminColor } from "@/app_modules/_global/color/color_pallet";
 import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
 import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
+import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
+import { clientLogger } from "@/util/clientLogger";
 import {
-  Button,
+  Box,
   Center,
-  Group,
   Pagination,
   Paper,
   ScrollArea,
   Stack,
   Table,
   Text,
-  TextInput,
-  Title
+  TextInput
 } from "@mantine/core";
-import { IconEyeCheck, IconSearch } from "@tabler/icons-react";
+import { useShallowEffect } from "@mantine/hooks";
+import { IconSearch } from "@tabler/icons-react";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
-import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
-import adminDonasi_getListPublish from "../fun/get/get_list_publish";
 import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
-import { AccentColor, MainColor } from "@/app_modules/_global/color";
-import { AdminColor } from "@/app_modules/_global/color/color_pallet";
-import { useShallowEffect } from "@mantine/hooks";
-import { clientLogger } from "@/util/clientLogger";
+import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
+import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
 import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
-import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
 
 export default function AdminDonasi_TablePublish() {
   return (
@@ -56,8 +54,8 @@ function TableStatus() {
         const response = await apiGetAdminDonasiByStatus({
           name: "Publish",
           page: `${isActivePage}`,
-          search: isSearch
-        })
+          search: isSearch,
+        });
 
         if (response?.success && response?.data.data) {
           setData(response.data.data);
@@ -70,18 +68,18 @@ function TableStatus() {
         clientLogger.error("Invalid data format recieved:", error);
         setData([]);
       }
-    }
+    };
     loadInitialData();
-  }, [isActivePage, isSearch])
+  }, [isActivePage, isSearch]);
 
   const onSearch = (searchTerm: string) => {
     setSearch(searchTerm);
     setActivePage(1);
-  }
+  };
 
   const onPageClick = (page: number) => {
     setActivePage(page);
-  }
+  };
   const renderTableBody = () => {
     if (!Array.isArray(data) || data.length === 0) {
       return (
@@ -92,12 +90,23 @@ function TableStatus() {
             </Center>
           </td>
         </tr>
-      )
+      );
     }
     return data.map((e, i) => (
       <tr key={i}>
         <td>
-          <Center c={AccentColor.white}>{e.title}</Center>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={1}>{e?.Author?.username}</Text>
+            </Box>
+          </Center>
+        </td>
+        <td>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={2}>{e.title}</Text>
+            </Box>
+          </Center>
         </td>
         <td>
           <Center c={AccentColor.white}>
@@ -109,15 +118,15 @@ function TableStatus() {
             <ComponentGlobal_TampilanRupiah nominal={+e.terkumpul} />
           </Center>
         </td>
-        <td>
+        {/* <td>
           <Center c={AccentColor.white}>{e.DonasiMaster_Ketegori.name}</Center>
         </td>
         <td>
           <Center c={AccentColor.white}>{e.DonasiMaster_Durasi.name} hari</Center>
-        </td>
+        </td> */}
         <td>
           <Center>
-            <Button
+            {/* <Button
               loaderPosition="center"
               loading={isLoading && e?.id === idData ? true : false}
               style={{ backgroundColor: MainColor.green, }}
@@ -131,13 +140,15 @@ function TableStatus() {
               }}
             >
               Tampilkan
-            </Button>
+            </Button> */}
+            <Admin_DetailButton
+              path={RouterAdminDonasi_OLD.detail_publish + e.id}
+            />
           </Center>
         </td>
       </tr>
     ));
-  }
-
+  };
 
   return (
     <>
@@ -179,15 +190,12 @@ function TableStatus() {
         ) : (
           <Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
             <ScrollArea w={"100%"} h={"90%"}>
-              <Table
-                verticalSpacing={"md"}
-                horizontalSpacing={"md"}
-                p={"md"}
-                w={1120}
-
-              >
+              <Table verticalSpacing={"md"} horizontalSpacing={"md"} p={"md"}>
                 <thead>
                   <tr>
+                    <th>
+                      <Center c={AccentColor.white}>Username</Center>
+                    </th>
                     <th>
                       <Center c={AccentColor.white}>Judul</Center>
                     </th>
@@ -197,12 +205,6 @@ function TableStatus() {
                     <th>
                       <Center c={AccentColor.white}>Terkumpul</Center>
                     </th>
-                    <th>
-                      <Center c={AccentColor.white}>Ketegori</Center>
-                    </th>
-                    <th>
-                      <Center c={AccentColor.white}>Durasi</Center>
-                    </th>
                     <th>
                       <Center c={AccentColor.white}>Aksi</Center>
                     </th>
@@ -224,7 +226,6 @@ function TableStatus() {
             </Center>
           </Paper>
         )}
-
       </Stack>
     </>
   );
diff --git a/src/app_modules/admin/donasi/sub_menu/table_reject.tsx b/src/app_modules/admin/donasi/sub_menu/table_reject.tsx
index 9bb8b501..9b8745af 100644
--- a/src/app_modules/admin/donasi/sub_menu/table_reject.tsx
+++ b/src/app_modules/admin/donasi/sub_menu/table_reject.tsx
@@ -6,6 +6,7 @@ import { AdminColor } from "@/app_modules/_global/color/color_pallet";
 import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
 import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
 import {
+  Box,
   Button,
   Center,
   Modal,
@@ -16,7 +17,7 @@ import {
   Table,
   Text,
   TextInput,
-  Title
+  Title,
 } from "@mantine/core";
 import { useDisclosure, useShallowEffect } from "@mantine/hooks";
 import { IconEyeEdit, IconSearch } from "@tabler/icons-react";
@@ -29,6 +30,7 @@ import { IconEyeCheck } from "@tabler/icons-react";
 import { clientLogger } from "@/util/clientLogger";
 import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
 import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
 
 export default function AdminDonasi_TableReject() {
   return (
@@ -51,15 +53,14 @@ function TableStatus() {
   const [isActivePage, setActivePage] = useState(1);
   const [isSearch, setSearch] = useState("");
 
-
   useShallowEffect(() => {
     const loadInitialData = async () => {
       try {
         const response = await apiGetAdminDonasiByStatus({
           name: "Reject",
           page: `${isActivePage}`,
-          search: isSearch
-        })
+          search: isSearch,
+        });
 
         if (response?.success && response?.data.data) {
           setData(response.data.data);
@@ -72,19 +73,18 @@ function TableStatus() {
         clientLogger.error("Invalid data format recieved:", error);
         setData([]);
       }
-    }
+    };
     loadInitialData();
-  }, [isActivePage, isSearch])
-
+  }, [isActivePage, isSearch]);
 
   const onSearch = (searchTerm: string) => {
     setSearch(searchTerm);
     setActivePage(1);
-  }
+  };
 
   const onPageClick = (page: number) => {
     setActivePage(page);
-  }
+  };
 
   const renderTableBody = () => {
     if (!Array.isArray(data) || data.length === 0) {
@@ -96,48 +96,49 @@ function TableStatus() {
             </Center>
           </td>
         </tr>
-      )
+      );
     }
     return data.map((e, i) => (
       <tr key={i}>
         <td>
-          <Center c={AccentColor.white}>{e?.Author?.username}</Center>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={1}>{e?.Author?.username}</Text>
+            </Box>
+          </Center>
         </td>
         <td>
-          <Center c={AccentColor.white}>{e?.title}</Center>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={2}>{e.title}</Text>
+            </Box>
+          </Center>
         </td>
         <td>
           <Center c={AccentColor.white}>
-            <ComponentGlobal_TampilanRupiah  nominal={+e.target} />
+            <ComponentGlobal_TampilanRupiah nominal={+e.target} />
           </Center>
         </td>
         <td>
           <Center c={AccentColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
         </td>
         <td>
-          <Center c={AccentColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center>
+          <Center c={AccentColor.white}>
+            {e?.DonasiMaster_Durasi.name} hari
+          </Center>
         </td>
         <td>
           <Center>
-            <Button
-              style={{ backgroundColor: MainColor.green }}
-              color={AccentColor.white}
-              leftIcon={<IconEyeCheck />}
-              radius={"xl"}
-              onClick={() =>
-                router.push(RouterAdminDonasi_OLD.detail_reject + `${e.id}`)
-              }
-            >
-              Lihat Alasan
-            </Button>
+            <Admin_DetailButton
+              path={RouterAdminDonasi_OLD.detail_reject + e.id}
+            />
           </Center>
 
           {/* <ModalReject opened={opened} close={close} /> */}
         </td>
       </tr>
     ));
-  }
-
+  };
 
   return (
     <>
@@ -177,16 +178,12 @@ function TableStatus() {
         {!data ? (
           <CustomSkeleton height={"80vh"} width={"100%"} />
         ) : (
-
-
           <Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
             <ScrollArea w={"100%"} h={"90%"}>
               <Table
                 verticalSpacing={"md"}
                 horizontalSpacing={"md"}
                 p={"md"}
-                w={1125}
-
               >
                 <thead>
                   <tr>
@@ -206,7 +203,7 @@ function TableStatus() {
                       <Center c={AccentColor.white}>Durasi</Center>
                     </th>
                     <th>
-                      <Center c={AccentColor.white}>Alasan</Center>
+                      <Center c={AccentColor.white}>Aksi</Center>
                     </th>
                   </tr>
                 </thead>
diff --git a/src/app_modules/admin/donasi/sub_menu/table_review.tsx b/src/app_modules/admin/donasi/sub_menu/table_review.tsx
index 5f5dc97b..3b94b6fc 100644
--- a/src/app_modules/admin/donasi/sub_menu/table_review.tsx
+++ b/src/app_modules/admin/donasi/sub_menu/table_review.tsx
@@ -1,15 +1,18 @@
 "use client";
 
+import { AccentColor, MainColor } from "@/app_modules/_global/color";
+import { AdminColor } from "@/app_modules/_global/color/color_pallet";
+import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
 import { gs_adminDonasi_triggerReview } from "@/lib/global_state";
 import { RouterAdminDonasi_OLD } from "@/lib/router_hipmi/router_admin";
-import { AccentColor, MainColor } from "@/app_modules/_global/color";
-import { ComponentGlobal_TampilanRupiah } from "@/app_modules/_global/component";
-import { MODEL_DONASI } from "@/app_modules/donasi/model/interface";
+import { clientLogger } from "@/util/clientLogger";
 import {
   Affix,
+  Box,
   Button,
   Center,
-  Group,
   Pagination,
   Paper,
   rem,
@@ -18,21 +21,16 @@ import {
   Table,
   Text,
   TextInput,
-  Title,
 } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
 import { IconEyeCheck, IconRefresh, IconSearch } from "@tabler/icons-react";
 import { useAtom } from "jotai";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
-import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
-import adminDonasi_getListReview from "../fun/get/get_list_review";
 import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
-import { AdminColor } from "@/app_modules/_global/color/color_pallet";
+import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
 import { apiGetAdminDonasiByStatus } from "../lib/api_fetch_admin_donasi";
-import { error } from "console";
-import { clientLogger } from "@/util/clientLogger";
-import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import Admin_DetailButton from "../../_admin_global/_component/button/detail_button";
 
 export default function AdminDonasi_TableReview() {
   return (
@@ -70,9 +68,8 @@ function TableStatus() {
       const response = await apiGetAdminDonasiByStatus({
         name: "Review",
         page: `${isActivePage}`,
-        search: isSearch
-      })
-
+        search: isSearch,
+      });
 
       if (response?.success && response?.data?.data) {
         setData(response.data.data);
@@ -85,7 +82,7 @@ function TableStatus() {
       clientLogger.error("Error get data table publish", error);
       setData([]);
     }
-  }
+  };
   async function onLoadData() {
     loadInitialData();
     setLoadingReload(false);
@@ -96,11 +93,11 @@ function TableStatus() {
   const onSearch = async (searchTerm: string) => {
     setSearch(searchTerm);
     setActivePage(1);
-  }
+  };
 
   const onPageClick = (page: number) => {
     setActivePage(page);
-  }
+  };
 
   const renderTableBody = () => {
     if (!Array.isArray(data) || data.length === 0) {
@@ -112,16 +109,24 @@ function TableStatus() {
             </Center>
           </td>
         </tr>
-      )
+      );
     }
 
     return data.map((e, i) => (
       <tr key={i}>
         <td>
-          <Center c={AdminColor.white}>{e?.Author?.username}</Center>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={1}>{e?.Author?.username}</Text>
+            </Box>
+          </Center>
         </td>
         <td>
-          <Center c={AdminColor.white}>{e?.title}</Center>
+          <Center c={AdminColor.white}>
+            <Box w={100}>
+              <Text lineClamp={2}>{e.title}</Text>
+            </Box>
+          </Center>
         </td>
         <td>
           <Center c={AdminColor.white}>
@@ -132,14 +137,19 @@ function TableStatus() {
           <Center c={AdminColor.white}>{e?.DonasiMaster_Ketegori.name}</Center>
         </td>
         <td>
-          <Center c={AdminColor.white}>{e?.DonasiMaster_Durasi.name} hari</Center>
+          <Center c={AdminColor.white}>
+            {e?.DonasiMaster_Durasi.name} hari
+          </Center>
         </td>
         <td>
           <Center>
-            <Button
+            {/* <Button
               loaderPosition="center"
               loading={isLoading && e?.id == idData ? true : false}
-              style={{ backgroundColor: MainColor.green, color: AccentColor.white }}
+              style={{
+                backgroundColor: MainColor.green,
+                color: AccentColor.white,
+              }}
               leftIcon={<IconEyeCheck />}
               radius={"xl"}
               onClick={() => {
@@ -149,13 +159,16 @@ function TableStatus() {
               }}
             >
               Tampilkan
-            </Button>
+            </Button> */}
+
+            <Admin_DetailButton
+              path={RouterAdminDonasi_OLD.detail_review + e?.id}
+            />
           </Center>
         </td>
       </tr>
     ));
-  }
-
+  };
 
   return (
     <>
@@ -221,9 +234,7 @@ function TableStatus() {
                 verticalSpacing={"md"}
                 horizontalSpacing={"md"}
                 p={"md"}
-                w={1120}
                 h={"100%"}
-
               >
                 <thead>
                   <tr>
@@ -261,7 +272,6 @@ function TableStatus() {
             </Center>
           </Paper>
         )}
-
       </Stack>
     </>
   );
diff --git a/src/app_modules/admin/event/_ui/ui_new_detail.tsx b/src/app_modules/admin/event/_ui/ui_new_detail.tsx
index cbb39216..58bf3288 100644
--- a/src/app_modules/admin/event/_ui/ui_new_detail.tsx
+++ b/src/app_modules/admin/event/_ui/ui_new_detail.tsx
@@ -31,7 +31,6 @@ export function AdminEvent_UiNewDetail() {
       });
 
       if (response?.success && response?.data) {
-        console.log("res >>", response.data);
         setData(response.data);
       } else {
         console.error("Invalid data format received:", response);
diff --git a/src/app_modules/admin/vote/component/comp_detail.tsx b/src/app_modules/admin/vote/component/comp_detail.tsx
index 03ef4942..a44da841 100644
--- a/src/app_modules/admin/vote/component/comp_detail.tsx
+++ b/src/app_modules/admin/vote/component/comp_detail.tsx
@@ -35,7 +35,7 @@ export function AdminVoting_ComponentDetail({ data }: Props) {
     {
       title: "Status",
       value: (
-        <Badge variant="light">{cekHari < 0 ? "Riwayat" : "Publish"}</Badge>
+        <Badge variant="light">{data.Voting_Status.name === "Publish" && cekHari < 0 ? "Riwayat" : data.Voting_Status.name}</Badge>
       ),
     },
   ];