Voting

Fix: - Integrasi API pada (tabs) status & detail - Integrasi API beranda & detail - Integrasi API pada voting ### No Issue
2025-09-18 17:35:18 +08:00
parent ce79d7c240
commit 391430de46
12 changed files with 735 additions and 155 deletions
--- a/screens/Voting/BoxDetailHasilVotingSection.tsx
+++ b/screens/Voting/BoxDetailHasilVotingSection.tsx
@@ -6,7 +6,11 @@ import {
  CircleContainer,
 } from "@/components";

-export default function Voting_BoxDetailHasilVotingSection() {
+export default function Voting_BoxDetailHasilVotingSection({
+  listData,
+}: {
+  listData?: any[];
+}) {
  return (
    <>
      <BaseBox>
@@ -16,10 +20,12 @@ export default function Voting_BoxDetailHasilVotingSection() {
          </TextCustom>

          <Grid>
-            {Array.from({ length: 4 }).map((_, i) => (
-              <Grid.Col span={3} style={{ alignItems: "center" }} key={i}>
-                <CircleContainer value={9 % (i + 4)} />
-                <TextCustom size="small">Pilihan {i + 1}</TextCustom>
+            {listData?.map((item: any, i: number) => (
+              <Grid.Col span={12 / listData?.length} style={{ alignItems: "center" }} key={i}>
+                <StackCustom>
+                  <CircleContainer value={item?.jumlah} />
+                  <TextCustom align="center" size="small">{item?.value}</TextCustom>
+                </StackCustom>
              </Grid.Col>
            ))}
          </Grid>
--- a/screens/Voting/BoxDetailPublishSection.tsx
+++ b/screens/Voting/BoxDetailPublishSection.tsx
@@ -1,45 +1,95 @@
 import {
+  BadgeCustom,
  BoxWithHeaderSection,
  ButtonCustom,
+  CenterCustom,
  Spacing,
  StackCustom,
-  TextCustom
+  TextCustom,
 } from "@/components";
 import { RadioCustom, RadioGroup } from "@/components/Radio/RadioCustom";
 import { useState } from "react";
 import { View } from "react-native";
 import { Voting_ComponentDetailDataSection } from "./ComponentDetailDataSection";
+import { apiVotingVote } from "@/service/api-client/api-voting";
+import { useAuth } from "@/hooks/use-auth";

 export function Voting_BoxDetailPublishSection({
  headerAvatar,
+  data,
+  userId,
+  isContribution,
+  nameChoice,
 }: {
  headerAvatar?: React.ReactNode;
+  data?: any;
+  userId: string;
+  isContribution?: boolean;
+  nameChoice?: string;
 }) {
  const [value, setValue] = useState<any | number>("");
+
+  const handlerSubmitVote = async () => {
+    const newData = {
+      chooseId: value,
+      userId: userId,
+    };
+
+    try {
+      const response = await apiVotingVote({
+        id: data?.id,
+        data: newData,
+      });
+      console.log("[RES VOTE]", response);
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
  return (
    <>
      <BoxWithHeaderSection>
-        {headerAvatar ? headerAvatar : <Spacing />}
+        {headerAvatar && (
+          <>
+            {headerAvatar}
+            <Spacing />
+          </>
+        )}
+
        <StackCustom gap={"lg"}>
-          <Voting_ComponentDetailDataSection />
+          <Voting_ComponentDetailDataSection data={data} />

-          <View>
-            <TextCustom bold size="small">
-              Pilihan :
-            </TextCustom>
-            <RadioGroup value={value} onChange={setValue}>
-              {Array.from({ length: 4 }).map((_, i) => (
-                <View key={i}>
-                  <RadioCustom
-                    label={`Pilihan ${i + 1}`}
-                    value={`Pilihan ${i + 1}`}
-                  />
-                </View>
-              ))}
-            </RadioGroup>
-          </View>
+          {isContribution ? (
+            <StackCustom gap={"sm"}>
+              <TextCustom align="center" size="small" bold>
+                Pilihan Anda :
+              </TextCustom>
+              <View style={{ alignSelf: "center" }}>
+                <BadgeCustom variant="light" size="lg">
+                  {nameChoice || "-"}
+                </BadgeCustom>
+              </View>
+            </StackCustom>
+          ) : (
+            <>
+              <StackCustom>
+                <TextCustom bold size="small">
+                  Pilihan :
+                </TextCustom>
+                <RadioGroup value={value} onChange={setValue}>
+                  {data?.Voting_DaftarNamaVote?.map((item: any, i: number) => (
+                    <View key={i}>
+                      <RadioCustom label={item?.value} value={item?.id} />
+                    </View>
+                  ))}
+                </RadioGroup>
+              </StackCustom>

-          <ButtonCustom onPress={() => console.log("vote")}>Vote</ButtonCustom>
+              <ButtonCustom disabled={value === ""} onPress={handlerSubmitVote}>
+                Vote
+              </ButtonCustom>
+            </>
+          )}
        </StackCustom>
      </BoxWithHeaderSection>
    </>
--- a/screens/Voting/BoxPublishSection.tsx
+++ b/screens/Voting/BoxPublishSection.tsx
@@ -15,37 +15,43 @@ export default function Voting_BoxPublishSection({
  href,
  id,
  bottomComponent,
+  data,
 }: {
-  href?: Href
-  id?: string
+  href?: Href;
+  id?: string;
  bottomComponent?: React.ReactNode;
+  data?: any;
 }) {
  return (
    <>
      <BoxWithHeaderSection href={href}>
-        <AvatarUsernameAndOtherComponent avatarHref="/profile/1" />
-        <Spacing />
-        <StackCustom>
+        <AvatarUsernameAndOtherComponent
+          avatar={data?.Author?.Profile?.imageId || ""}
+          name={data?.Author?.username || "Username"}
+          avatarHref="/profile/1"
+        />
+        <Spacing height={0} />
+        <StackCustom gap={"lg"}>
          <TextCustom align="center" bold truncate size="large">
-            Voting Title {id}
+            {data?.title || "-"}
          </TextCustom>

          <BadgeCustom
            style={{ width: "70%", alignSelf: "center" }}
            variant="light"
          >
-            {dayjs().format("DD/MM/YYYY")} -{" "}
-            {dayjs().add(1, "day").format("DD/MM/YYYY")}
+            {dayjs(data?.awalVote).format("DD/MM/YYYY")} -{" "}
+            {dayjs(data?.akhirVote).format("DD/MM/YYYY")}
          </BadgeCustom>

-          <Grid>
+          {/* <Grid>
            {Array.from({ length: 4 }).map((_, i) => (
              <Grid.Col span={3} style={{ alignItems: "center" }} key={i}>
                <CircleContainer value={9 % (i + 4)} />
                <TextCustom size="small">Pilihan {i + 1}</TextCustom>
              </Grid.Col>
            ))}
-          </Grid>
+          </Grid> */}
          {bottomComponent}
        </StackCustom>
      </BoxWithHeaderSection>
--- a/screens/Voting/ButtonStatusSection.tsx
+++ b/screens/Voting/ButtonStatusSection.tsx
@@ -1,14 +1,21 @@
 import { AlertDefaultSystem, ButtonCustom, Grid } from "@/components";
-import { apiVotingUpdateStatus } from "@/service/api-client/api-voting";
+import {
+  apiVotingDelete,
+  apiVotingUpdateStatus,
+} from "@/service/api-client/api-voting";
 import { router } from "expo-router";
-import { View } from "react-native";
+import Toast from "react-native-toast-message";

 export default function Voting_ButtonStatusSection({
  id,
  status,
+  isLoading,
+  onSetLoading,
 }: {
  id: string;
  status: string;
+  isLoading: boolean;
+  onSetLoading: (value: boolean) => void;
 }) {
  const handleBatalkanReview = () => {
    AlertDefaultSystem({
@@ -16,15 +23,33 @@ export default function Voting_ButtonStatusSection({
      message: "Apakah Anda yakin ingin batalkan review ini?",
      textLeft: "Batal",
      textRight: "Ya",
-      onPressRight: async() => {
-        // console.log("Hapus");
-        // router.back();
-        const response = await apiVotingUpdateStatus({
-          id: id as string,
-          status: "draft",
-        })
-        console.log("[RES BATALKAN REVIEW]", JSON.stringify(response, null, 2));
-        // router.back();
+      onPressRight: async () => {
+        try {
+          onSetLoading(true);
+          const response = await apiVotingUpdateStatus({
+            id: id as string,
+            status: "draft",
+          });
+
+          if (response?.success) {
+            Toast.show({
+              type: "success",
+              text1: response.message,
+            });
+            router.back();
+          } else {
+            Toast.show({
+              type: "info",
+              text1: "Info",
+              text2: response.message,
+            });
+            router.back();
+          }
+        } catch (error) {
+          console.log("[ERROR]", error);
+        } finally {
+          onSetLoading(false);
+        }
      },
    });
  };
@@ -35,9 +60,33 @@ export default function Voting_ButtonStatusSection({
      message: "Apakah Anda yakin ingin ajukan review ini?",
      textLeft: "Batal",
      textRight: "Ya",
-      onPressRight: () => {
-        console.log("Hapus");
-        router.back();
+      onPressRight: async () => {
+        try {
+          onSetLoading(true);
+          const response = await apiVotingUpdateStatus({
+            id: id as string,
+            status: "review",
+          });
+
+          if (response?.success) {
+            Toast.show({
+              type: "success",
+              text1: response.message,
+            });
+            router.back();
+          } else {
+            Toast.show({
+              type: "info",
+              text1: "Info",
+              text2: response.message,
+            });
+            router.back();
+          }
+        } catch (error) {
+          console.log("[ERROR]", error);
+        } finally {
+          onSetLoading(false);
+        }
      },
    });
  };
@@ -48,9 +97,33 @@ export default function Voting_ButtonStatusSection({
      message: "Apakah Anda yakin ingin edit kembali ini?",
      textLeft: "Batal",
      textRight: "Ya",
-      onPressRight: () => {
-        console.log("Hapus");
-        router.back();
+      onPressRight: async () => {
+        try {
+          onSetLoading(true);
+          const response = await apiVotingUpdateStatus({
+            id: id as string,
+            status: "draft",
+          });
+
+          if (response?.success) {
+            Toast.show({
+              type: "success",
+              text1: response.message,
+            });
+            router.back();
+          } else {
+            Toast.show({
+              type: "info",
+              text1: "Info",
+              text2: response.message,
+            });
+            router.back();
+          }
+        } catch (error) {
+          console.log("[ERROR]", error);
+        } finally {
+          onSetLoading(false);
+        }
      },
    });
  };
@@ -61,9 +134,32 @@ export default function Voting_ButtonStatusSection({
      message: "Apakah Anda yakin ingin menghapus data ini?",
      textLeft: "Batal",
      textRight: "Hapus",
-      onPressRight: () => {
-        console.log("Hapus");
-        router.back();
+      onPressRight: async () => {
+       try {
+        onSetLoading(true);
+         const response = await apiVotingDelete({
+           id: id as string,
+         });
+
+         if (response?.success) {
+           Toast.show({
+             type: "success",
+             text1: response.message,
+           });
+           router.back();
+         } else {
+           Toast.show({
+             type: "info",
+             text1: "Info",
+             text2: response.message,
+           });
+           router.back();
+         }
+       } catch (error) {
+         console.log("[ERROR]", error);
+       } finally {
+         onSetLoading(false);
+       }
      },
    });
  };
@@ -72,6 +168,7 @@ export default function Voting_ButtonStatusSection({
    return (
      <>
        <ButtonCustom
+          isLoading={isLoading}
          backgroundColor="red"
          textColor="white"
          onPress={handleOpenDeleteAlert}
@@ -88,7 +185,7 @@ export default function Voting_ButtonStatusSection({

    case "review":
      return (
-        <ButtonCustom onPress={handleBatalkanReview}>
+        <ButtonCustom isLoading={isLoading} onPress={handleBatalkanReview}>
          Batalkan Review
        </ButtonCustom>
      );
@@ -97,15 +194,14 @@ export default function Voting_ButtonStatusSection({
      return (
        <>
          <Grid>
-            <Grid.Col span={5}>
-              <ButtonCustom onPress={handleAjukanReview}>
+            <Grid.Col span={6} style={{ paddingRight: 10 }}>
+              <ButtonCustom isLoading={isLoading} onPress={handleAjukanReview}>
                Ajukan Review
              </ButtonCustom>
            </Grid.Col>
-            <Grid.Col span={2}>
-              <View />
+            <Grid.Col span={6} style={{ paddingRight: 10 }}>
+              {DeleteButton()}
            </Grid.Col>
-            <Grid.Col span={5}>{DeleteButton()}</Grid.Col>
          </Grid>
        </>
      );
@@ -114,15 +210,14 @@ export default function Voting_ButtonStatusSection({
      return (
        <>
          <Grid>
-            <Grid.Col span={5}>
-              <ButtonCustom onPress={handleEditKembali}>
+            <Grid.Col span={6} style={{ paddingRight: 10 }}>
+              <ButtonCustom isLoading={isLoading} onPress={handleEditKembali}>
                Edit Kembali
              </ButtonCustom>
            </Grid.Col>
-            <Grid.Col span={2}>
-              <View />
+            <Grid.Col span={6} style={{ paddingLeft: 10 }}>
+              {DeleteButton()}
            </Grid.Col>
-            <Grid.Col span={5}>{DeleteButton()}</Grid.Col>
          </Grid>
        </>
      );
--- a/screens/Voting/ComponentDetailDataSection.tsx
+++ b/screens/Voting/ComponentDetailDataSection.tsx
@@ -1,8 +1,6 @@
 import { BadgeCustom, StackCustom, TextCustom } from "@/components";
 import { GStyles } from "@/styles/global-styles";
 import { dateTimeView } from "@/utils/dateTimeView";
-import dayjs from "dayjs";
-import { View } from "react-native";

 export function Voting_ComponentDetailDataSection({ data }: { data?: any }) {
  return (