Fix: voting status

Deskripsi:
- Perubahan router status & riwayat

src/app_modules/vote/component/card_view_status.tsx

@@ -5,6 +5,8 @@ import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/noti
 import { Badge, Card, Group, Stack, Text } from "@mantine/core";
 import { useRouter } from "next/navigation";
 import { MODEL_VOTING } from "../model/interface";
+import { useState } from "react";
+import { ComponentGlobal_CardLoadingOverlay, ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
 
 export default function ComponentVote_CardViewStatus({
   path,
@@ -14,59 +16,53 @@ export default function ComponentVote_CardViewStatus({
   data?: MODEL_VOTING;
 }) {
   const router = useRouter();
+  const [visible, setVisible] = useState(false);
+  
   return (
     <>
-      <Card
-        p={30}
-        mb={"lg"}
-        style={{
-          backgroundColor: AccentColor.darkblue,
-          borderRadius: "10px",
-          border: `2px solid ${AccentColor.blue}`,
-          color: "white",
-        }}
-        onClick={() => {
+      <ComponentGlobal_CardStyles
+        onClickHandler={() => {
           if (data?.id === undefined) {
             ComponentGlobal_NotifikasiPeringatan("Path tidak ditemukan");
           } else {
+            setVisible(true);
             router.push((path as string) + data?.id);
           }
         }}
       >
         {/* Isi deskripsi */}
-        <Card.Section>
-          <Stack px={"xs"} align="center">
-            <Text fw={"bold"} lineClamp={1} align="center">
-              {data?.title}
-            </Text>
-            <Badge
-              // size="md"
-              styles={{
-                root: {
-                  backgroundColor: AccentColor.blue,
-                  border: `1px solid ${AccentColor.skyblue}`,
-                  color: "white",
-                  width: "80%",
-                },
-              }}
-            >
-              <Group>
-                <Text>
-                  {data?.awalVote.toLocaleDateString(["id-ID"], {
-                    dateStyle: "medium",
-                  })}
-                </Text>
-                <Text>-</Text>
-                <Text>
-                  {data?.akhirVote.toLocaleDateString(["id-ID"], {
-                    dateStyle: "medium",
-                  })}
-                </Text>
-              </Group>
-            </Badge>
-          </Stack>
-        </Card.Section>
-      </Card>
+        <Stack px={"xs"} align="center">
+          <Text fw={"bold"} lineClamp={1} align="center">
+            {data?.title}
+          </Text>
+          <Badge
+            // size="md"
+            styles={{
+              root: {
+                backgroundColor: AccentColor.blue,
+                border: `1px solid ${AccentColor.skyblue}`,
+                color: "white",
+                width: "80%",
+              },
+            }}
+          >
+            <Group>
+              <Text>
+                {data?.awalVote.toLocaleDateString(["id-ID"], {
+                  dateStyle: "medium",
+                })}
+              </Text>
+              <Text>-</Text>
+              <Text>
+                {data?.akhirVote.toLocaleDateString(["id-ID"], {
+                  dateStyle: "medium",
+                })}
+              </Text>
+            </Group>
+          </Badge>
+        </Stack>
+        {visible && <ComponentGlobal_CardLoadingOverlay />}
+      </ComponentGlobal_CardStyles>
     </>
   );
 }