Fix: voting status

Deskripsi:
- Perubahan router status & riwayat

src/app_modules/vote/main/layout.tsx

@@ -37,7 +37,7 @@ export default function LayoutVote_Main({
     {
       id: 2,
       name: "Status",
-      path: RouterVote.status,
+      path: RouterVote.status({ id: "1" }),
       icon: <IconReservedLine />,
     },
     {
@@ -49,7 +49,7 @@ export default function LayoutVote_Main({
     {
       id: 4,
       name: "Riwayat",
-      path: RouterVote.riwayat,
+      path: RouterVote.riwayat({ id: "1" }),
       icon: <IconHistory />,
     },
   ];
@@ -91,7 +91,6 @@ export default function LayoutVote_Main({
           </SimpleGrid>
         }
       >
-       
         {children}
       </UIGlobal_LayoutTamplate>
     </>

src/app_modules/vote/main/riwayat/index.tsx

@@ -7,40 +7,53 @@ import Vote_RiwayatSaya from "./saya";
 import { useAtom } from "jotai";
 import { gs_vote_riwayat } from "../../global_state";
 import { MODEL_VOTING } from "../../model/interface";
-import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
+import {
+  AccentColor,
+  MainColor,
+} from "@/app_modules/_global/color/color_pallet";
+import { useRouter } from "next/navigation";
+import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
 
 export default function Vote_Riwayat({
+  riwayatId,
   listRiwayat,
   listRiwayatSaya,
 }: {
-  listRiwayat: MODEL_VOTING[];
-  listRiwayatSaya: MODEL_VOTING[];
+  riwayatId: string;
+  listRiwayat?: MODEL_VOTING[];
+  listRiwayatSaya?: MODEL_VOTING[];
 }) {
-  const [tabsRiwayat, setTabsRiwayat] = useAtom(gs_vote_riwayat);
+  const router = useRouter();
+  const [changeStatus, setChangeStatus] = useState(riwayatId);
+
   const listTabs = [
     {
-      id: 1,
-      path: <Vote_SemuaRiwayat listRiwayat={listRiwayat} />,
+      id: "1",
       value: "Semua",
       label: "Semua Riwayat",
     },
     {
-      id: 2,
-      path: <Vote_RiwayatSaya listRiwayatSaya={listRiwayatSaya} />,
+      id: "2",
       value: "Saya",
       label: "Riwayat Saya",
     },
   ];
 
+  async function onChangeStatus({ statusId }: { statusId: string }) {
+    router.push(RouterVote.riwayat({ id: statusId }));
+  }
+
   return (
     <>
       <Tabs
         mt={1}
         variant="pills"
         radius={"xl"}
-        defaultValue={"Semua"}
-        value={tabsRiwayat}
-        onTabChange={setTabsRiwayat}
+        value={changeStatus}
+        onTabChange={(val: any) => {
+          setChangeStatus(val);
+          onChangeStatus({ statusId: val });
+        }}
         styles={{
           tabsList: {
             backgroundColor: MainColor.darkblue,
@@ -58,15 +71,15 @@ export default function Vote_Riwayat({
             {listTabs.map((e, i) => (
               <Tabs.Tab
                 key={i}
-                value={e.value}
+                value={e.id}
                 fw={"bold"}
                 c={"black"}
                 style={{
                   transition: "0.5s",
                   backgroundColor:
-                    tabsRiwayat === e.value ? MainColor.yellow : "white",
+                    changeStatus === e.id ? MainColor.yellow : "white",
                   border:
-                    tabsRiwayat === e.value
+                    changeStatus === e.id
                       ? `1px solid ${AccentColor.yellow}`
                       : `1px solid white`,
                 }}
@@ -75,11 +88,14 @@ export default function Vote_Riwayat({
               </Tabs.Tab>
             ))}
           </Tabs.List>
-          {listTabs.map((e) => (
-            <Tabs.Panel key={e.id} value={e.value}>
-              {e.path}
-            </Tabs.Panel>
-          ))}
+
+          {riwayatId === "1" && (
+            <Vote_SemuaRiwayat listRiwayat={listRiwayat as any} />
+          )}
+
+          {riwayatId === "2" && (
+            <Vote_RiwayatSaya listRiwayatSaya={listRiwayatSaya as any} />
+          )}
         </Stack>
       </Tabs>
     </>

src/app_modules/vote/main/riwayat/saya.tsx

@@ -28,7 +28,7 @@ export default function Vote_RiwayatSaya({
         // --- Main component --- //
         <Box>
           <ScrollOnly
-            height="75vh"
+            height="76vh"
             renderLoading={() => (
               <Center mt={"lg"}>
                 <Loader color={"yellow"} />

src/app_modules/vote/main/riwayat/semua.tsx

@@ -26,7 +26,7 @@ export default function Vote_SemuaRiwayat({
         // --- Main component --- //
         <Box>
           <ScrollOnly
-            height="75vh"
+            height="76vh"
             renderLoading={() => (
               <Center mt={"lg"}>
                 <Loader color={"yellow"} />

src/app_modules/vote/main/status/index.tsx

@@ -1,51 +1,36 @@
 "use client";
 
+import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
 import {
   AccentColor,
   MainColor,
 } from "@/app_modules/_global/color/color_pallet";
-import { Stack, Tabs } from "@mantine/core";
-import { useAtom } from "jotai";
-import { gs_vote_status } from "../../global_state";
+import { MODEL_NEW_DEFAULT_MASTER } from "@/app_modules/model_global/interface";
+import { Box, Stack, Tabs } from "@mantine/core";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { MODEL_VOTING } from "../../model/interface";
 import Vote_StatusDraft from "./draft";
 import Vote_StatusPublish from "./publish";
 import Vote_StatusReject from "./reject";
 import Vote_StatusReview from "./review";
 
 export default function Vote_Status({
-  listPublish,
-  listReview,
-  listDraft,
-  listReject,
+  statusId,
+  dataVoting,
+  listStatus,
 }: {
-  listPublish: any[];
-  listReview: any[];
-  listDraft: any[];
-  listReject: any[];
+  statusId: string;
+  dataVoting: MODEL_VOTING[];
+  listStatus: MODEL_NEW_DEFAULT_MASTER[];
 }) {
-  const [tabsStatus, setTabsStatus] = useAtom(gs_vote_status);
-  const listTabs = [
-    {
-      id: 1,
-      path: <Vote_StatusPublish listPublish={listPublish} />,
-      value: "Publish",
-    },
-    {
-      id: 2,
-      path: <Vote_StatusReview listReview={listReview} />,
-      value: "Review",
-    },
-    {
-      id: 3,
-      path: <Vote_StatusDraft listDraft={listDraft} />,
-      value: "Draft",
-    },
-    {
-      id: 4,
-      path: <Vote_StatusReject listReject={listReject} />,
-      value: "Reject",
-    },
-  ];
+
+  const router = useRouter();
+  const [changeStatus, setChangeStatus] = useState(statusId);
+
+  async function onChangeStatus({ statusId }: { statusId: string }) {
+    router.replace(RouterVote.status({ id: statusId }));
+  }
 
   return (
     <>
@@ -53,9 +38,11 @@ export default function Vote_Status({
         mt={1}
         variant="pills"
         radius={"xl"}
-        defaultValue={"Publish"}
-        value={tabsStatus}
-        onTabChange={setTabsStatus}
+        value={changeStatus}
+        onTabChange={(val: any) => {
+          setChangeStatus(val);
+          onChangeStatus({ statusId: val });
+        }}
         styles={{
           tabsList: {
             backgroundColor: MainColor.darkblue,
@@ -70,28 +57,36 @@ export default function Vote_Status({
       >
         <Stack>
           <Tabs.List grow>
-            {listTabs.map((e) => (
+            {listStatus.map((e) => (
               <Tabs.Tab
                 w={"20%"}
                 key={e.id}
-                value={e.value}
+                value={e.id}
                 fw={"bold"}
                 c={"black"}
                 style={{
                   transition: "0.5s",
                   backgroundColor:
-                    tabsStatus === e.value ? MainColor.yellow : "white",
+                    changeStatus === e.id ? MainColor.yellow : "white",
+                  border:
+                    changeStatus === e.id
+                      ? `1px solid ${AccentColor.yellow}`
+                      : `1px solid white`,
                 }}
               >
-                {e.value}
+                {e.name}
               </Tabs.Tab>
             ))}
           </Tabs.List>
-          {listTabs.map((e) => (
-            <Tabs.Panel key={e.id} value={e.value}>
-              {e.path}
-            </Tabs.Panel>
-          ))}
+
+          <Box>
+            {statusId === "1" && (
+              <Vote_StatusPublish listPublish={dataVoting} />
+            )}
+            {statusId === "2" && <Vote_StatusReview listReview={dataVoting} />}
+            {statusId === "3" && <Vote_StatusDraft listDraft={dataVoting} />}
+            {statusId === "4" && <Vote_StatusReject listReject={dataVoting} />}
+          </Box>
         </Stack>
       </Tabs>
     </>

src/app_modules/vote/main/status/review.tsx

@@ -1,17 +1,14 @@
 "use client";
 
 import { RouterVote } from "@/app/lib/router_hipmi/router_vote";
-import ComponentVote_CardViewStatus from "../../component/card_view_status";
-import { MODEL_VOTING } from "../../model/interface";
-import { Box, Center, Loader, Stack, Text } from "@mantine/core";
-import _ from "lodash";
-import ComponentVote_IsEmptyData from "../../component/is_empty_data";
 import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
-import job_getAllStatusPublish from "@/app_modules/job/fun/get/status/get_list_publish";
+import { Box, Center, Loader } from "@mantine/core";
+import _ from "lodash";
 import { ScrollOnly } from "next-scroll-loader";
 import { useState } from "react";
-import ComponentVote_CardViewPublish from "../../component/card_view_publish";
+import ComponentVote_CardViewStatus from "../../component/card_view_status";
 import { vote_getAllReview } from "../../fun/get/status/get_all_review";
+import { MODEL_VOTING } from "../../model/interface";
 
 export default function Vote_StatusReview({
   listReview,