Update new github

Add:
- utils/colorActivationForBadge.ts

Fix:
- app/(application)/admin/event/type-create.tsx
- app/(application)/admin/event/type-of-event.tsx
- app/(application)/admin/event/type-update.tsx
- service/api-admin/api-admin-event.ts
- service/api-admin/api-master-admin.ts
- service/api-client/api-event.ts

### No Issue

app.config.js

@@ -70,5 +70,6 @@ export default {
     // Tambahkan environment variables ke sini
     API_BASE_URL: process.env.API_BASE_URL,
     BASE_URL: process.env.BASE_URL,
+    DEEP_LINK_URL: process.env.DEEP_LINK_URL,
   },
 };

app/(application)/(user)/event/(tabs)/index.tsx

@@ -44,6 +44,8 @@ export default function EventBeranda() {
         <TextCustom align="center">Belum ada event</TextCustom>
       ) : (
         listData.map((item: any, index) => (
+
+          
           <Event_BoxPublishSection
             key={index}
             href={`/event/${item.id}/publish`}

app/(application)/(user)/event/[id]/confirmation.tsx

@@ -0,0 +1,554 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable react-hooks/exhaustive-deps */
+import {
+  BaseBox,
+  ButtonCustom,
+  CenterCustom,
+  LoaderCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { AccentColor, MainColor } from "@/constants/color-palet";
+import { useAuth } from "@/hooks/use-auth";
+import {
+  apiEventConfirmationAction,
+  apiEventGetConfirmation,
+  apiEventJoin,
+} from "@/service/api-client/api-event";
+import { Ionicons } from "@expo/vector-icons";
+import dayjs from "dayjs";
+import isBetween from "dayjs/plugin/isBetween";
+import {
+  Redirect,
+  router,
+  Stack,
+  useFocusEffect,
+  useLocalSearchParams,
+} from "expo-router";
+import React, { useCallback, useState } from "react";
+import { View } from "react-native";
+import Toast from "react-native-toast-message";
+
+// Extend Day.js dengan plugin isBetween
+dayjs.extend(isBetween);
+
+interface DataEvent {
+  id: string;
+  title: string;
+  tanggal: Date;
+  tanggalSelesai: Date;
+  lokasi: string;
+  Author: {
+    id: string;
+    username: string;
+    Profile: {
+      id: string;
+      name: string;
+    };
+  };
+}
+
+export default function UserEventConfirmation() {
+  const { token } = useAuth();
+  const { id, userId: authorId } = useLocalSearchParams();
+  const { user } = useAuth();
+  const [data, setData] = useState<DataEvent | null>(null);
+  const [peserta, setPeserta] = useState<boolean | null>(null);
+  const [konfirmasi, setKonfirmasi] = useState<boolean | null>(null);
+
+  useFocusEffect(
+    useCallback(() => {
+      checkTokenAndDataParticipants() || console.log("Token is null");
+    }, [token, id, user?.id])
+  );
+
+  const checkTokenAndDataParticipants = async () => {
+    if (!token) {
+      return <Redirect href={`/`} />;
+    }
+
+    try {
+      const response = await apiEventGetConfirmation({
+        id: id as string,
+        userId: user?.id as string,
+      });
+
+      if (response.success) {
+        setData(response.data?.dataEvent);
+        setPeserta(response.data?.peserta);
+        setKonfirmasi(response.data?.kehadiran);
+      }
+    } catch (error) {
+      console.log("[ERROR CONFIRMATION]", error);
+    }
+  };
+
+  const handlerReturn = () => {
+    const now = dayjs(); // asumsi: UTC, sesuai dengan API
+
+    // --- [1] Loading & Data tidak ditemukan ---
+    if (data === undefined || data === null) {
+      if (peserta === null && konfirmasi === null) {
+        return <LoaderCustom />;
+      }
+      return (
+        <BaseBox>
+          <TextCustom bold align="center" size={"large"}>
+            Data Tidak Ditemukan
+          </TextCustom>
+          <BackToOtherPath path="home" />
+        </BaseBox>
+      );
+    }
+
+    // --- [2] Ambil waktu event dari `data` ---
+    const eventStart = dayjs(data.tanggal);
+    const eventEnd = dayjs(data.tanggalSelesai);
+
+    // --- [3] Definisikan jendela konfirmasi: 1 jam sebelum mulai → 1 jam setelah selesai ---
+    const confirmationStart = eventStart.subtract(1, "hour");
+    const confirmationEnd = eventEnd.add(1, "hour");
+    const isWithinConfirmationWindow = now.isBetween(
+      confirmationStart,
+      confirmationEnd,
+      null,
+      "[]"
+    );
+
+    // --- [4] Status waktu event (untuk pesan UI) ---
+    const isBeforeEvent = now.isBefore(eventStart);
+    const isAfterEvent = now.isAfter(eventEnd);
+    const isDuringEvent = !isBeforeEvent && !isAfterEvent;
+
+    // --- [5] Handle berdasarkan waktu dan status peserta/konfirmasi ---
+
+    // 🟢 Acara sudah selesai
+    if (isAfterEvent) {
+      if (peserta === false) {
+        return (
+          <TamplateBox data={data}>
+            <TamplateText text="Event telah selesai, sehingga konfirmasi kehadiran sudah tidak dapat dilakukan. Terima kasih atas perhatian dan minat Anda. Kami berharap dapat bertemu di acara kami berikutnya." />
+            <BackToOtherPath
+              path="event"
+              id={data.id}
+              isAfterEvent={isAfterEvent}
+            />
+          </TamplateBox>
+        );
+      }
+      return (
+        <TamplateBox data={data}>
+          <TamplateText
+            text={`Event telah selesai, anda terdaftar sebagai peserta dan ${
+              konfirmasi
+                ? "Anda telah mengonfirmasi kehadiran."
+                : "Anda tidak mengonfirmasi kehadiran."
+            } Terima kasih atas perhatian dan minat Anda. Kami berharap dapat bertemu di acara kami berikutnya.`}
+          />
+          <BackToOtherPath
+            path="event"
+            id={data.id}
+            isAfterEvent={isAfterEvent}
+          />
+        </TamplateBox>
+      );
+    }
+
+    // 🔵 Acara belum mulai & belum terdaftar
+    if (isBeforeEvent) {
+      if (peserta === false) {
+        return (
+          <NotStarted_And_UserNotParticipan
+            id={data.id}
+            userId={user?.id as string}
+            data={data}
+          />
+        );
+      }
+
+      // Peserta sudah daftar → cek apakah sudah boleh konfirmasi
+      if (isWithinConfirmationWindow && peserta === true) {
+        if (konfirmasi === false) {
+          return (
+            <UserParticipan_And_DuringEvent
+              id={data.id}
+              userId={user?.id as string}
+              data={data}
+            />
+          );
+        }
+        return (
+          <TamplateBox data={data}>
+            <TamplateText text="Terimakasih telah mengonfirmasi kehadiran. Silahkan lihat peserta lain pada halaman event atau kembali ke halaman home. Selamat menikmati acara dan selamat berpartisipasi." />
+            <BackToOtherPath
+              path="event"
+              id={data.id}
+              isAfterEvent={isAfterEvent}
+            />
+          </TamplateBox>
+        );
+      }
+
+      return (
+        <TamplateBox data={data}>
+          <TamplateText text="Anda telah terdaftar sebagai peserta pada Event ini. Konfirmasi kehadiran dibuka 1 jam sebelum acara dimulai." />
+          <BackToOtherPath
+            path="event"
+            id={data.id}
+            isAfterEvent={isAfterEvent}
+          />
+        </TamplateBox>
+      );
+    }
+
+    // 🟡 Acara sedang berlangsung & belum terdaftar
+    if (isDuringEvent) {
+      if (peserta === false) {
+        return (
+          <UserNotParticipan_And_DuringEvent
+            id={data.id}
+            userId={user?.id as string}
+            data={data}
+          />
+        );
+      }
+
+      if (peserta === true) {
+        if (isWithinConfirmationWindow) {
+          if (konfirmasi === false) {
+            return (
+              <TamplateBox data={data}>
+                <TamplateText text="Konfirmasi Kehadiran" />
+              </TamplateBox>
+            );
+          }
+          return (
+            <TamplateBox data={data}>
+              <TamplateText text="Anda telah mengonfirmasi kehadiran dalam event ini. Terima kasih dan selamat menikmati acara. Have fun!" />
+              <BackToOtherPath
+                path="event"
+                id={data.id}
+                isAfterEvent={isAfterEvent}
+              />
+            </TamplateBox>
+          );
+        }
+
+        // Ini sangat jarang terjadi selama event berlangsung, tapi aman
+        return (
+          <TamplateBox data={data}>
+            <TamplateText text="Konfirmasi kehadiran tidak tersedia saat ini." />
+            <BackToOtherPath path="home" />
+          </TamplateBox>
+        );
+      }
+    }
+
+    // 🛑 Fallback aman
+    return (
+      <BaseBox>
+        <StackCustom>
+          <TamplateText text="Terjadi kesalahan tak terduga pada logika waktu." />
+          <BackToOtherPath path="home" />
+        </StackCustom>
+      </BaseBox>
+    );
+  };
+
+  return (
+    <>
+      <Stack.Screen
+        options={{
+          title: "Konfirmasi Event",
+          headerLeft: () => (
+            <Ionicons
+              name="arrow-back"
+              size={20}
+              color={MainColor.yellow}
+              onPress={() =>
+                router.navigate("/(application)/(user)/event/create")
+              }
+            />
+          ),
+        }}
+      />
+      <ViewWrapper>{handlerReturn()}</ViewWrapper>
+    </>
+  );
+}
+
+const TamplateBox = ({
+  data,
+  children,
+}: {
+  data: DataEvent;
+  children: React.ReactNode;
+}) => {
+  return (
+    <>
+      <CenterCustom>
+        <BaseBox>
+          <StackCustom gap={"lg"}>
+            <StackCustom gap={"sm"}>
+              <TextCustom bold align="center" size={"large"}>
+                {data?.title}
+              </TextCustom>
+              <View
+                style={{
+                  flexDirection: "row",
+                  justifyContent: "center",
+                  //   backgroundColor: AccentColor.blue,
+                  //   borderColor: AccentColor.blue,
+                  //   borderWidth: 1,
+                  //   borderRadius: 4,
+                  //   padding: 3
+                }}
+              >
+                <TextCustom align="center" size="small" bold>
+                  {dayjs(data?.tanggal).format("DD MMM YYYY: HH:mm")}
+                </TextCustom>
+                <TextCustom align="center" size="small" bold>
+                  {" "}
+                  -{" "}
+                </TextCustom>
+                <TextCustom align="center" size="small" bold>
+                  {dayjs(data?.tanggalSelesai).format("DD MMM YYYY: HH:mm")}
+                </TextCustom>
+              </View>
+            </StackCustom>
+
+            {children}
+          </StackCustom>
+        </BaseBox>
+      </CenterCustom>
+    </>
+  );
+};
+
+const TamplateText = ({ text }: { text: React.ReactNode }) => {
+  return (
+    <>
+      <TextCustom align="center">{text}</TextCustom>
+    </>
+  );
+};
+
+type BackToOtherPathProps =
+  | { path: "home" | "beranda-event"; id?: never; isAfterEvent?: never }
+  | { path: "event"; id: string; isAfterEvent: boolean };
+
+const BackToOtherPath = ({ path, id, isAfterEvent }: BackToOtherPathProps) => {
+  return (
+    <>
+      {path === "home" ? (
+        <ButtonCustom
+          onPress={() => {
+            router.replace("/(application)/home");
+          }}
+        >
+          Home
+        </ButtonCustom>
+      ) : (
+        <View
+          style={{
+            flexDirection: "row",
+            gap: 10,
+
+            justifyContent: "center",
+          }}
+        >
+          <ButtonCustom
+            onPress={() => {
+              router.replace("/(application)/home");
+            }}
+          >
+            Home
+          </ButtonCustom>
+          <ButtonCustom
+            onPress={() => {
+              if (path === "event") {
+                if (isAfterEvent) {
+                  router.push(`/(application)/(user)/event/${id}/history`);
+                } else {
+                  router.push(`/(application)/(user)/event/${id}/publish`);
+                }
+              } else if (path === "beranda-event") {
+                router.push(`/(application)/(user)/event`);
+              } else {
+                console.log("[PATH]", path);
+              }
+            }}
+          >
+            Lihat {path === "event" ? "Event" : "Beranda Event"}
+          </ButtonCustom>
+        </View>
+      )}
+    </>
+  );
+};
+
+// 🔵 Acara belum mulai & belum terdaftar
+const NotStarted_And_UserNotParticipan = ({
+  id,
+  userId,
+  data,
+}: {
+  id: string;
+  userId: string;
+  data: DataEvent;
+}) => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+
+  const handlerJoinEvent = async () => {
+    try {
+      setIsLoading(true);
+
+      const response = await apiEventJoin({
+        id: id as string,
+        userId: userId as string,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Anda gagal join",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Anda berhasil join",
+      });
+      router.navigate(`/(application)/(user)/event/${id}/publish`);
+    } catch (error) {
+      console.log("[ERROR JOIN EVENT]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <TamplateBox data={data}>
+        <TamplateText text="Anda belum terdaftar sebagai peserta & Event belum dimulai. Silahkan daftarkan diri anda terlebih dahulu" />
+        <ButtonCustom onPress={handlerJoinEvent} isLoading={isLoading}>
+          Join
+        </ButtonCustom>
+      </TamplateBox>
+    </>
+  );
+};
+
+// 🟡 ZONA ACARA BERLANGSUNG
+// Acara sedang berlangsung & belum terdaftar & user harus join dan konfirmasi
+const UserNotParticipan_And_DuringEvent = ({
+  id,
+  userId,
+  data,
+}: {
+  id: string;
+  userId: string;
+  data: DataEvent;
+}) => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+
+  const handlerSubmit = async () => {
+    try {
+      setIsLoading(true);
+
+      const response = await apiEventConfirmationAction({
+        id: id as string,
+        userId: userId as string,
+        category: "join_and_confirm",
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Anda gagal join & konfirmasi",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Anda berhasil join & konfirmasi",
+      });
+      router.navigate(`/(application)/(user)/event/${id}/publish`);
+    } catch (error) {
+      console.log("[ERROR JOIN & CONFIRMATION EVENT]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <TamplateBox data={data}>
+        <TamplateText text="Anda belum terdaftar sebagai peserta & Event sedang berlangsung. Silahkan daftarkan diri anda & Konfirmasi kehadiran" />
+
+        <ButtonCustom onPress={() => handlerSubmit()} isLoading={isLoading}>
+          Join & Konfirmasi
+        </ButtonCustom>
+      </TamplateBox>
+    </>
+  );
+};
+
+
+// 🟡 ZONA ACARA BERLANGSUN
+// User sudah terdaftar & Event sedang berlangsung & user harus konfirmasi
+const UserParticipan_And_DuringEvent = ({
+  id,
+  userId,
+  data,
+}: {
+  id: string;
+  userId: string;
+  data: DataEvent;
+}) => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+
+  const handlerSubmit = async () => {
+    try {
+      setIsLoading(true);
+
+      const response = await apiEventConfirmationAction({
+        id: id as string,
+        userId: userId as string,
+        category: "confirmation",
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Anda gagal konfirmasi",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Anda berhasil konfirmasi",
+      });
+      router.navigate(`/(application)/(user)/event/${id}/publish`);
+    } catch (error) {
+      console.log("[ERROR JOIN & CONFIRMATION EVENT]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  return (
+    <>
+      <TamplateBox data={data}>
+        <TamplateText text="Anda sudah terdaftar sebagai peserta & Event sedang berlangsung. Silahkan konfirmasi kehadiran" />
+
+        <ButtonCustom onPress={() => handlerSubmit()} isLoading={isLoading}>
+          Konfirmasi
+        </ButtonCustom>
+      </TamplateBox>
+    </>
+  );
+};

app/(application)/(user)/event/[id]/list-of-participants.tsx

@@ -11,29 +11,30 @@ import {
   apiEventGetOne,
   apiEventListOfParticipants,
 } from "@/service/api-client/api-event";
-import { useLocalSearchParams } from "expo-router";
-import { useEffect, useState } from "react";
+import dayjs, { Dayjs } from "dayjs";
+import { useFocusEffect, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 import { View } from "react-native";
 
 export default function EventListOfParticipants() {
   const { id } = useLocalSearchParams();
-  const [startDate, setStartDate] = useState();
-  const [listData, setListData] = useState([]);
-  const [isLoadData, setIsLoadData] = useState(false);
+  const [startDate, setStartDate] = useState<Dayjs | undefined>();
+  const [listData, setListData] = useState<any[] | null>(null);
+  const [loadtData, setLoadData] = useState(false);
 
-  useEffect(() => {
+  useFocusEffect(
+    useCallback(() => {
       handlerLoadData();
-  }, [id]);
+    }, [id])
+  );
 
   const handlerLoadData = () => {
     try {
-      setIsLoadData(true);
       onLoadData();
       onLoadList();
     } catch (error) {
       console.log("[ERROR]", error);
-    } finally {
-      setIsLoadData(false);
     }
   };
 
@@ -41,7 +42,8 @@ export default function EventListOfParticipants() {
     try {
       const response = await apiEventGetOne({ id: id as string });
       if (response.success) {
-        setStartDate(response.data.tanggal);
+        const date = dayjs(response.data.tanggal);
+        setStartDate(date);
       }
     } catch (error) {
       console.log("[ERROR]", error);
@@ -50,30 +52,36 @@ export default function EventListOfParticipants() {
 
   const onLoadList = async () => {
     try {
+      setLoadData(true);
       const response = await apiEventListOfParticipants({ id: id as string });
+     
       if (response.success) {
         setListData(response.data);
       }
     } catch (error) {
       console.log("[ERROR]", error);
+    } finally {
+      setLoadData(false);
     }
   };
 
   return (
     <ViewWrapper>
-      {isLoadData ? (
+      {loadtData && !listData ? (
         <LoaderCustom />
-      ) : listData.length === 0 ? (
-        <TextCustom align="center">Belum ada peserta</TextCustom>
+      ) : _.isEmpty(listData) ? (
+        <TextCustom align="center" color="gray">
+          Belum ada peserta
+        </TextCustom>
       ) : (
-        listData.map((item: any, index: number) => (
+        listData?.map((item: any, index: number) => (
           <BaseBox key={index}>
             <AvatarUsernameAndOtherComponent
               avatar={item?.User?.Profile?.imageId}
               name={item?.User?.username}
               avatarHref={`/profile/${item?.User?.Profile?.id}`}
               rightComponent={
-                new Date().getTime() > new Date(startDate as any).getTime() ? (
+                startDate && startDate.subtract(1, "hour").diff(dayjs()) < 0 ? (
                   <View
                     style={{
                       justifyContent: "flex-end",

app/(application)/(user)/event/[id]/publish.tsx

@@ -55,6 +55,8 @@ export default function EventDetailPublish() {
           userId: user?.id as string,
         });
 
+        console.log("[RES CHECK PARTICIPANTS]", responseCheckParticipants);
+
         if (
           responseCheckParticipants.success &&
           responseCheckParticipants.data
@@ -69,6 +71,8 @@ export default function EventDetailPublish() {
     }
   }
 
+  console.log("[participans]", isParticipant);
+
   const handlePress = (item: IMenuDrawerItem) => {
     console.log("PATH ", item.path);
     router.navigate(item.path as any);

app/(application)/(user)/event/create.tsx

@@ -191,7 +191,7 @@ export default function EventCreate() {
             placeholder="Masukkan deskripsi event"
             required
             showCount
-            maxLength={100}
+            maxLength={1000}
             onChangeText={(value: any) =>
               setData({ ...data, deskripsi: value })
             }

app/(application)/admin/donation/[status]/status.tsx

@@ -1,69 +1,116 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   ActionIcon,
+  LoaderCustom,
   SearchInput,
-    Spacing,
+  StackCustom,
   TextCustom,
   ViewWrapper
 } from "@/components";
 import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
 import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
 import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
+import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { apiAdminDonation } from "@/service/api-admin/api-admin-donation";
 import { Octicons } from "@expo/vector-icons";
-import { router, useLocalSearchParams } from "expo-router";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
+import { useCallback, useState } from "react";
 import { Divider } from "react-native-paper";
 
 export default function AdminDonationStatus() {
   const { status } = useLocalSearchParams();
+  console.log("[STATUS]", status);
+
+  const [data, setData] = useState<any | null>(null);
+  const [search, setSearch] = useState<string>("");
+  const [loadData, setLoadData] = useState<boolean>(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [status, search])
+  );
+
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminDonation({
+        category: status as "publish" | "review" | "reject",
+        search,
+      });
+
+      console.log("[RES]", JSON.stringify(response, null, 2));
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+      setData([]);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
   const rightComponent = (
     <SearchInput
       containerStyle={{ width: "100%", marginBottom: 0 }}
       placeholder="Cari"
+      value={search}
+      onChangeText={(value) => setSearch(value)}
     />
   );
   return (
     <>
-      <ViewWrapper
-        headerComponent={
+      <ViewWrapper headerComponent={<AdminTitlePage title="Donasi" />}>
+        <StackCustom gap={"sm"}>
           <AdminComp_BoxTitle
-            title={`Donasi ${_.startCase(status as string)}`}
+            title={`${_.startCase(status as string)}`}
             rightComponent={rightComponent}
           />
-        }
-      >
           <AdminTitleTable
             title1="Aksi"
             title2="Username"
             title3="Judul Donasi"
           />
-        <Spacing />
           <Divider />
 
-        {Array.from({ length: 10 }).map((_, index) => (
+          {loadData ? (
+            <LoaderCustom />
+          ) : _.isEmpty(data) ? (
+            <TextCustom align="center" size="small" color="gray">
+              Belum ada data
+            </TextCustom>
+          ) : (
+            data?.map((item: any, index: number) => (
               <AdminTableValue
                 key={index}
                 value1={
                   <ActionIcon
                     icon={
-                  <Octicons name="eye" size={ICON_SIZE_BUTTON} color="black" />
+                      <Octicons
+                        name="eye"
+                        size={ICON_SIZE_BUTTON}
+                        color="black"
+                      />
                     }
                     onPress={() => {
-                  router.push(`/admin/donation/${index}/${status}`);
+                      router.push(`/admin/donation/${item.id}/${status}`);
                     }}
                   />
                 }
-            value2={<TextCustom truncate={1}>Username username</TextCustom>}
+                value2={<TextCustom truncate={1}>{item?.Author?.username || "-"}</TextCustom>}
                 value3={
                   <TextCustom truncate={2}>
-                Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                Blanditiis asperiores quidem deleniti architecto eaque et
-                nostrum, ad consequuntur eveniet quisquam quae voluptatum
-                ducimus! Dolorem nobis modi officia debitis, beatae mollitia.
+                    {item?.title || "-"}
                   </TextCustom>
                 }
               />
-        ))}
+            ))
+          )}
+        </StackCustom>
       </ViewWrapper>
     </>
   );

app/(application)/admin/donation/index.tsx

@@ -8,8 +8,63 @@ import {
 import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
 import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
 import { MainColor } from "@/constants/color-palet";
+import { apiAdminDonation } from "@/service/api-admin/api-admin-donation";
+import { useFocusEffect } from "expo-router";
+import { useState, useCallback } from "react";
 
 export default function AdminDonation() {
+  const [data, setData] = useState<any | null>(null);
+  const [loadData, setLoadData] = useState<boolean>(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [])
+  );
+
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminDonation({
+        category: "dashboard",
+      });
+
+      console.log("[RES]", JSON.stringify(response, null, 2));
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+      setData([]);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
+  const listData = [
+    {
+      label: "Publish",
+      value: (data && data.publish) || 0,
+      icon: <IconPublish size={25} color={MainColor.green} />,
+    },
+    {
+      label: "Review",
+      value: (data && data.review) || 0,
+      icon: <IconReview size={25} color={MainColor.orange} />,
+    },
+    {
+      label: "Reject",
+      value: (data && data.reject) || 0,
+      icon: <IconReject size={25} color={MainColor.red} />,
+    },
+    {
+      label: "Kategori",
+      value: (data && data.categoryDonation) || 0,
+      icon: <IconList size={25} color={MainColor.white_gray} />,
+    },
+  ];
+
   return (
     <>
       <ViewWrapper>
@@ -24,26 +79,3 @@ export default function AdminDonation() {
     </>
   );
 }
-
-const listData = [
-  {
-    label: "Publish",
-    value: 4,
-    icon: <IconPublish size={25} color={MainColor.green} />,
-  },
-  {
-    label: "Review",
-    value: 7,
-    icon: <IconReview size={25} color={MainColor.orange} />,
-  },
-  {
-    label: "Reject",
-    value: 5,
-    icon: <IconReject size={25} color={MainColor.red} />,
-  },
-  {
-    label: "Kategori",
-    value: 4,
-    icon: <IconList size={25} color={MainColor.white_gray} />,
-  },
-];

app/(application)/admin/event/[id]/[status]/index.tsx

@@ -1,9 +1,11 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   ActionIcon,
   AlertDefaultSystem,
   BadgeCustom,
   BaseBox,
   DrawerCustom,
+  LoaderCustom,
   MenuDrawerDynamicGrid,
   Spacing,
   StackCustom,
@@ -15,98 +17,94 @@ import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButt
 import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
 import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
 import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
-import { MainColor } from "@/constants/color-palet";
+import ReportBox from "@/components/Box/ReportBox";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
-import dayjs from "dayjs";
-import { router, useLocalSearchParams } from "expo-router";
+import { useAuth } from "@/hooks/use-auth";
+import { funUpdateStatusEvent } from "@/screens/Admin/Event/funUpdateStatus";
+import { apiAdminEventById } from "@/service/api-admin/api-admin-event";
+import { DEEP_LINK_URL } from "@/service/api-config";
+import { colorBadge } from "@/utils/colorBadge";
+import { dateTimeView } from "@/utils/dateTimeView";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
-import React from "react";
+import React, { useCallback } from "react";
 import QRCode from "react-native-qrcode-svg";
+import Toast from "react-native-toast-message";
 
 export default function AdminEventDetail() {
+  const { user } = useAuth();
   const { id, status } = useLocalSearchParams();
   const [openDrawer, setOpenDrawer] = React.useState(false);
 
-  const colorBadge = () => {
-    if (status === "publish") {
-      return MainColor.green;
-    } else if (status === "review") {
-      return MainColor.orange;
-    } else if (status === "reject") {
-      return MainColor.red;
-    } else {
-      return MainColor.placeholder;
+  const [data, setData] = React.useState<any | null>(null);
+  const [loadData, setLoadData] = React.useState(false);
+  const deepLinkURL = `${DEEP_LINK_URL}/--/event/${id}/confirmation?userId=${user?.id}`;
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminEventById({
+        id: id as string,
+      });
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadData(false);
     }
   };
 
   const listData = [
     {
       label: "Pembuat Event",
-      value: `Bagas Banuna ${id}`,
+      value: (data && data?.Author?.username) || "-",
     },
     {
       label: "Judul Event",
-      value: `Event 123`,
+      value: (data && data?.title) || "-",
     },
     {
       label: "Status",
-      value: (
-        <BadgeCustom color={colorBadge()}>
+      value:
+        (data && (
+          <BadgeCustom color={colorBadge({ status: status as string })}>
             {_.startCase(status as string)}
           </BadgeCustom>
-      ),
+        )) ||
+        "-",
     },
     {
       label: "Lokasi",
-      value: "Lokasi Event",
+      value: (data && data?.lokasi) || "-",
     },
     {
       label: "Tipe Acara",
-      value: "Tipe Acara",
+      value: (data && data?.EventMaster_TipeAcara?.name) || "-",
     },
     {
       label: "Mulai Event",
-      value: dayjs().format("DD/MM/YYYY HH:mm:ss"),
+      value:
+        (data && data?.tanggal && dateTimeView({ date: data?.tanggal })) || "-",
     },
     {
       label: "Event Berakhir",
-      value: dayjs().add(3, "day").format("DD/MM/YYYY HH:mm:ss"),
+      value:
+        (data &&
+          data?.tanggalSelesai &&
+          dateTimeView({ date: data?.tanggalSelesai })) ||
+        "-",
     },
     {
       label: "Deskripsi",
-      value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+      value: (data && data?.deskripsi) || "-",
     },
-    // {
-    //   label: "Daftar Tipe Acara",
-    //   value: (
-    //     <>
-    //       <List.Item
-    //         title={<TextCustom>Pilihan 1</TextCustom>}
-    //         left={(props) => (
-    //           <List.Icon {...props} icon="circle" color={MainColor.yellow} />
-    //         )}
-    //       />
-    //       <List.Item
-    //         title={<TextCustom>Pilihan 2</TextCustom>}
-    //         left={(props) => (
-    //           <List.Icon {...props} icon="circle" color={MainColor.yellow} />
-    //         )}
-    //       />
-    //       <List.Item
-    //         title={<TextCustom>Pilihan 3</TextCustom>}
-    //         left={(props) => (
-    //           <List.Icon {...props} icon="circle" color={MainColor.yellow} />
-    //         )}
-    //       />
-    //       <List.Item
-    //         title={<TextCustom>Pilihan 4</TextCustom>}
-    //         left={(props) => (
-    //           <List.Icon {...props} icon="circle" color={MainColor.yellow} />
-    //         )}
-    //       />
-    //     </>
-    //   ),
-    // },
   ];
 
   const rightComponent = (
@@ -118,6 +116,31 @@ export default function AdminEventDetail() {
     />
   );
 
+  const handlerSubmit = async () => {
+    try {
+      const response = await funUpdateStatusEvent({
+        id: id as string,
+        changeStatus: "publish",
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal mempublikasikan event",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Event berhasil dipublikasikan",
+      });
+      router.back();
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
   return (
     <>
       <ViewWrapper
@@ -125,7 +148,7 @@ export default function AdminEventDetail() {
           <AdminBackButtonAntTitle
             title={`Detail Data`}
             rightComponent={
-              (status === "publish" || status === "riwayat") && rightComponent
+              (status === "publish" || status === "history") && rightComponent
             }
           />
         }
@@ -143,12 +166,22 @@ export default function AdminEventDetail() {
 
           <Spacing />
         </BaseBox>
-        {(status === "publish" || status === "riwayat") && (
+
+        {data &&
+          data?.catatan &&
+          (status === "reject" || status === "review") && (
+            <ReportBox text={data?.catatan} />
+          )}
+
+        {(status === "publish" || status === "history") && (
           <BaseBox>
             <StackCustom style={{ alignItems: "center" }}>
               <TextCustom bold>QR Code Event</TextCustom>
+              {loadData ? (
+                <LoaderCustom />
+              ) : (
                 <QRCode
-                value="https://google.com"
+                  value={deepLinkURL}
                   size={200}
                   // logo={require("@/assets/images/logo-hipmi.png")}
                   // logoSize={70}
@@ -156,6 +189,7 @@ export default function AdminEventDetail() {
                   // logoBorderRadius={50}
                   // color="black"
                 />
+              )}
             </StackCustom>
           </BaseBox>
         )}
@@ -168,16 +202,11 @@ export default function AdminEventDetail() {
                 message: "Apakah anda yakin ingin mempublikasikan data ini?",
                 textLeft: "Batal",
                 textRight: "Ya",
-                onPressLeft: () => {
-                  router.back();
-                },
-                onPressRight: () => {
-                  router.back();
-                },
+                onPressRight: () => handlerSubmit(),
               });
             }}
             onReject={() => {
-              router.push(`/admin/event/${id}/reject-input`);
+              router.push(`/admin/event/${id}/reject-input?status=${status}`);
             }}
           />
         )}
@@ -186,7 +215,7 @@ export default function AdminEventDetail() {
           <AdminButtonReject
             title="Tambah Catatan"
             onReject={() => {
-              router.push(`/admin/event/${id}/reject-input`);
+              router.push(`/admin/event/${id}/reject-input?status=${status}`);
             }}
           />
         )}

app/(application)/admin/event/[id]/list-of-participants.tsx

@@ -1,41 +1,81 @@
-import { BadgeCustom, BaseBox, Grid, TextCustom, ViewWrapper } from "@/components";
+/* eslint-disable react-hooks/exhaustive-deps */
+import {
+  BadgeCustom,
+  BaseBox,
+  Grid,
+  LoaderCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
-import { MainColor } from "@/constants/color-palet";
+import { apiAdminEventListOfParticipants } from "@/service/api-admin/api-admin-event";
+import { useFocusEffect, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 
 export default function AdminEventListOfParticipants() {
+  const { id } = useLocalSearchParams();
+  const [listData, setListData] = useState<any[] | null>(null);
+  const [loadData, setLoadData] = useState(false);
 
-    const isPresent = ({id}: {id: number}) => {
-        const check = id % 3 * 3;
-        if (check === 0) {
-            return true;
-        } else {
-            return false;
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminEventListOfParticipants({
+        id: id as string,
+      });
+
+      if (response.success) {
+        setListData(response.data);
       }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadData(false);
     }
+  };
+
 
   return (
     <>
       <ViewWrapper
         headerComponent={<AdminBackButtonAntTitle title="Daftar Peserta" />}
       >
-        {Array.from({ length: 10 }).map((item, index) => (
+        {loadData ? (
+          <LoaderCustom />
+        ) : _.isEmpty(listData) ? (
+          <TextCustom align="center" color="gray">
+            Belum ada peserta
+          </TextCustom>
+        ) : (
+          listData?.map((item: any, index: number) => (
             <BaseBox key={index}>
               <Grid>
                 <Grid.Col span={6}>
-                <TextCustom bold>Username {index + 1}</TextCustom>
-                <TextCustom>+6282123456789</TextCustom>
+                  <StackCustom gap={"sm"}>
+                    <TextCustom bold truncate>{item?.User?.username}</TextCustom>
+                    <TextCustom>+{item?.User?.nomor}</TextCustom>
+                  </StackCustom>
                 </Grid.Col>
                 <Grid.Col span={6} style={{ justifyContent: "center" }}>
                   <BadgeCustom
                     style={{ alignSelf: "flex-end" }}
-                  color={isPresent({id: index}) ? MainColor.green : MainColor.red}
+                    color={item?.isPresent ? "green" : "red"}
                   >
-                  {isPresent({id: index}) ? "Hadir" : "Tidak Hadir"}
+                    {item?.isPresent ? "Hadir" : "Tidak Hadir"}
                   </BadgeCustom>
                 </Grid.Col>
               </Grid>
             </BaseBox>
-        ))}
+          ))
+        )}
       </ViewWrapper>
     </>
   );

app/(application)/admin/event/[id]/reject-input.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   AlertDefaultSystem,
   BoxButtonOnFooter,
@@ -6,15 +7,78 @@ import {
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
 import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
-import { router, useLocalSearchParams } from "expo-router";
-import { useState } from "react";
+import { funUpdateStatusEvent } from "@/screens/Admin/Event/funUpdateStatus";
+import { apiAdminEventById } from "@/service/api-admin/api-admin-event";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import { useCallback, useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminEventRejectInput() {
-  const { id } = useLocalSearchParams();
-  const [value, setValue] = useState(id as string);
+  const { id, status } = useLocalSearchParams();
+
+  const [data, setData] = useState<any>("");
+  const [isLoading, setIsLoading] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+  const onLoadData = async () => {
+    try {
+      const response = await apiAdminEventById({
+        id: id as string,
+      });
+
+      if (response.success) {
+        setData(response.data.catatan);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
+  const handleUpdate = async ({
+    changeStatus,
+  }: {
+    changeStatus: "publish" | "review" | "reject";
+  }) => {
+    try {
+      setIsLoading(true);
+      const response = await funUpdateStatusEvent({
+        id: id as string,
+        changeStatus,
+        data: data,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Report gagal",
+        });
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Report berhasil",
+      });
+
+      if (status === "review") {
+        router.replace(`/admin/event/reject/status`);
+      } else if (status === "reject") {
+        router.back();
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
       <AdminButtonReject
+        isLoading={isLoading}
         title="Reject"
         onReject={() =>
           AlertDefaultSystem({
@@ -22,12 +86,8 @@ export default function AdminEventRejectInput() {
             message: "Apakah anda yakin ingin menolak data ini?",
             textLeft: "Batal",
             textRight: "Ya",
-            onPressLeft: () => {
-              router.back();
-            },
             onPressRight: () => {
-              console.log("value:", value);
-              router.replace(`/admin/event/reject/status`);
+              handleUpdate({ changeStatus: "reject" });
             },
           })
         }
@@ -42,8 +102,8 @@ export default function AdminEventRejectInput() {
         headerComponent={<AdminBackButtonAntTitle title="Penolakan Event" />}
       >
         <TextAreaCustom
-          value={value}
-          onChangeText={setValue}
+          value={data}
+          onChangeText={setData}
           placeholder="Masukan alasan"
           required
           showCount

app/(application)/admin/event/[status]/status.tsx

@@ -1,27 +1,67 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   ActionIcon,
-  BaseBox,
+  LoaderCustom,
   SearchInput,
-  Spacing,
+  StackCustom,
   TextCustom,
-  ViewWrapper,
+  ViewWrapper
 } from "@/components";
 import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
 import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
 import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
 import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { apiAdminEvent } from "@/service/api-admin/api-admin-event";
 import { Octicons } from "@expo/vector-icons";
-import { router, useLocalSearchParams } from "expo-router";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
+import { useCallback, useState } from "react";
 import { Divider } from "react-native-paper";
 
 export default function AdminEventStatus() {
   const { status } = useLocalSearchParams();
+  console.log("[STATUS EVENT]", status);
+
+  const [listData, setListData] = useState<any[] | null>(null);
+  const [loadData, setLoadData] = useState(false);
+  const [search, setSearch] = useState<string>("");
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [status, search])
+  );
+
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminEvent({
+        category: status as "publish" | "review" | "reject" | "history" as any,
+        search,
+      });
+
+      console.log(
+        `[RES LIST BY STATUS: ${status}]`,
+        JSON.stringify(response, null, 2)
+      );
+
+      if (response.success) {
+        setListData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
   const rightComponent = (
     <SearchInput
       containerStyle={{ width: "100%", marginBottom: 0 }}
       placeholder="Cari"
+      value={search}
+      onChangeText={(value) => setSearch(value)}
     />
   );
   return (
@@ -32,16 +72,20 @@ export default function AdminEventStatus() {
           rightComponent={rightComponent}
         />
 
-        <BaseBox>
+        <StackCustom gap={"sm"}>
           <AdminTitleTable
             title1="Aksi"
             title2="Username"
             title3="Judul Event"
           />
-          <Spacing />
           <Divider />
 
-          {Array.from({ length: 10 }).map((_, index) => (
+          {loadData ? (
+            <LoaderCustom />
+          ) : _.isEmpty(listData) ? (
+            <TextCustom align="center" size="small" color="gray">Belum ada data</TextCustom>
+          ) : (
+            listData?.map((item, index) => (
               <AdminTableValue
                 key={index}
                 value1={
@@ -54,22 +98,24 @@ export default function AdminEventStatus() {
                       />
                     }
                     onPress={() => {
-                    router.push(`/admin/event/${index}/${status}`);
+                      router.push(`/admin/event/${item.id}/${status}`);
                     }}
                   />
                 }
-              value2={<TextCustom truncate={1}>Username username</TextCustom>}
+                value2={
+                  <TextCustom truncate={1}>
+                    {item?.Author?.username || "-"}
+                  </TextCustom>
+                }
                 value3={
-                <TextCustom truncate={2}>
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                  Blanditiis asperiores quidem deleniti architecto eaque et
-                  nostrum, ad consequuntur eveniet quisquam quae voluptatum
-                  ducimus! Dolorem nobis modi officia debitis, beatae mollitia.
+                  <TextCustom align="center" truncate={2}>
+                    {item?.title || "-"}
                   </TextCustom>
                 }
               />
-          ))}
-        </BaseBox>
+            ))
+          )}
+        </StackCustom>
       </ViewWrapper>
     </>
   );

app/(application)/admin/event/index.tsx

@@ -9,13 +9,67 @@ import {
 import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
 import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
 import { MainColor } from "@/constants/color-palet";
+import { apiAdminEvent } from "@/service/api-admin/api-admin-event";
+import { useFocusEffect } from "expo-router";
+import { useCallback, useState } from "react";
 
 export default function AdminVoting() {
+  const [data, setData] = useState<any | null>(null);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [])
+  );
+
+  const onLoadData = async () => {
+    try {
+      const response = await apiAdminEvent({
+        category: "dashboard",
+      });
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
+  const listData = [
+    {
+      label: "Publish",
+      value: (data && data.publish) || 0,
+      icon: <IconPublish size={25} color={MainColor.green} />,
+    },
+    {
+      label: "Review",
+      value: (data && data.review) || 0,
+      icon: <IconReview size={25} color={MainColor.orange} />,
+    },
+    {
+      label: "Reject",
+      value: (data && data.reject) || 0,
+      icon: <IconReject size={25} color={MainColor.red} />,
+    },
+    {
+      label: "Riwayat",
+      value: (data && data.history) || 0,
+      icon: <IconArchive size={25} color={MainColor.placeholder} />,
+    },
+    {
+      label: "Tipe Acara",
+      value: (data && data.typeOfEvent) || 0,
+      icon: <IconList size={25} color={MainColor.placeholder} />,
+    },
+  ];
+
   return (
     <>
       <ViewWrapper>
         <AdminTitlePage title="Event" />
         <Spacing />
+
         <StackCustom gap={"xs"}>
           {listData.map((item, i) => (
             <AdminComp_BoxDashboard key={i} item={item} />
@@ -25,31 +79,3 @@ export default function AdminVoting() {
     </>
   );
 }
-
-const listData = [
-  {
-    label: "Publish",
-    value: 3,
-    icon: <IconPublish size={25} color={MainColor.green} />,
-  },
-  {
-    label: "Review",
-    value: 8,
-    icon: <IconReview size={25} color={MainColor.orange} />,
-  },
-  {
-    label: "Reject",
-    value: 4,
-    icon: <IconReject size={25} color={MainColor.red} />,
-  },
-  {
-    label: "Riwayat",
-    value: 6,
-    icon: <IconArchive size={25} color={MainColor.placeholder} />,
-  },
-  {
-    label: "Tipe Acara",
-    value: 7,
-    icon: <IconList size={25} color={MainColor.placeholder} />,
-  },
-];

app/(application)/admin/event/type-create.tsx

@@ -5,13 +5,48 @@ import {
   ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { apiEventCreateTypeOfEvent } from "@/service/api-admin/api-master-admin";
 import { useRouter } from "expo-router";
+import { useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminEventTypeOfEventCreate() {
   const router = useRouter();
+  const [value, setValue] = useState("");
+  const [isLoading, setLoading] = useState<boolean>(false);
+
+  const handlerSubmit = async () => {
+    try {
+      setLoading(true);
+      const response = await apiEventCreateTypeOfEvent({
+        data: value,
+      });
+
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal menambahkan tipe acara",
+        });
+        return;
+      }
+      Toast.show({
+        type: "success",
+        text1: "Berhasil menambahkan tipe acara",
+      });
+      router.back();
+    } catch (error) {
+      console.log("[ERROR CREATE TYPE EVENT]", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
-      <ButtonCustom onPress={() => router.back()}>Simpan</ButtonCustom>
+      <ButtonCustom isLoading={isLoading} onPress={() => handlerSubmit()}>
+        Simpan
+      </ButtonCustom>
     </BoxButtonOnFooter>
   );
   return (
@@ -20,7 +55,11 @@ export default function AdminEventTypeOfEventCreate() {
         headerComponent={<AdminBackButtonAntTitle title="Tambah Tipe Acara" />}
         footerComponent={buttonSubmit}
       >
-        <TextInputCustom placeholder="Masukkan Tipe Acara" />
+        <TextInputCustom
+          placeholder="Masukkan Tipe Acara"
+          value={value}
+          onChangeText={setValue}
+        />
       </ViewWrapper>
     </>
   );

app/(application)/admin/event/type-of-event.tsx

@@ -1,23 +1,53 @@
 import {
   ActionIcon,
-  BaseBox,
+  BadgeCustom,
   CenterCustom,
+  LoaderCustom,
   Spacing,
   StackCustom,
   TextCustom,
-  ViewWrapper,
+  ViewWrapper
 } from "@/components";
 import { IconEdit } from "@/components/_Icon";
 import AdminActionIconPlus from "@/components/_ShareComponent/Admin/ActionIconPlus";
 import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
 import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
-import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import { GridViewCustomSpan } from "@/components/_ShareComponent/GridViewCustomSpan";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
-import { router } from "expo-router";
+import { apiAdminMasterTypeOfEvent } from "@/service/api-admin/api-master-admin";
+import { colorActivationForBadge } from "@/utils/colorActivationForBadge";
+import { router, useFocusEffect } from "expo-router";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 import { View } from "react-native";
 import { Divider } from "react-native-paper";
 
 export default function AdminEventTypeOfEvent() {
+  const [listData, setListData] = useState<any[] | null>(null);
+  const [loadData, setLoadData] = useState<boolean>(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [])
+  );
+
+  const onLoadData = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminMasterTypeOfEvent();
+
+      if (response.success) {
+        setListData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]",error);
+      setListData([]);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
   return (
     <>
       <ViewWrapper headerComponent={<AdminTitlePage title="Event" />}>
@@ -32,73 +62,68 @@ export default function AdminEventTypeOfEvent() {
           }
         />
 
-        <BaseBox>
-          <GridDetail_4_8
-            label={
+        <>
+          <GridViewCustomSpan
+            span1={2}
+            span2={5}
+            span3={5}
+            component1={
               <TextCustom bold align="center">
                 Aksi
               </TextCustom>
             }
-            value={<TextCustom bold>Tipe Acara</TextCustom>}
+            component2={<TextCustom bold align="center">Status</TextCustom>}
+            component3={<TextCustom bold>Tipe Acara</TextCustom>}
           />
           <Divider />
           <Spacing />
 
           <StackCustom>
-            {listData.map((item, index) => (
+            {loadData ? (
+              <LoaderCustom />
+            ) : _.isEmpty(listData) ? (
+              <TextCustom align="center" color="gray">
+                Belum ada data
+              </TextCustom>
+            ) : (
+              listData?.map((item, index) => (
                 <View key={index}>
-                <GridDetail_4_8
-                  label={
+                  <GridViewCustomSpan
+                    span1={2}
+                    span2={5}
+                    span3={5}
+                    component1={
                       <CenterCustom>
                         <ActionIcon
                           icon={
                             <IconEdit size={ICON_SIZE_BUTTON} color="black" />
                           }
                           onPress={() => {
-                          router.push(`/admin/event/type-update?id=${index}`);
+                            router.push(`/admin/event/type-update?id=${item.id}`);
                           }}
                         />
                       </CenterCustom>
                     }
-                  value={<TextCustom bold>{item.label}</TextCustom>}
+                    style2={{ alignItems: "center" }}
+                    component2={
+                      <CenterCustom>
+                        <BadgeCustom
+                          color={colorActivationForBadge({
+                            status: item?.active,
+                          })}
+                        >
+                          {item?.active ? "Aktif" : "Tidak Aktif"}
+                        </BadgeCustom>
+                      </CenterCustom>
+                    }
+                    component3={<TextCustom >{item.name}</TextCustom>}
                   />
-                <Divider />
                 </View>
-            ))}
+              ))
+            )}
           </StackCustom>
-        </BaseBox>
+        </>
       </ViewWrapper>
     </>
   );
 }
-
-const listData = [
-  {
-    label: "Seminar",
-    value: "seminar",
-  },
-  {
-    label: "Workshop",
-    value: "workshop",
-  },
-  {
-    label: "Konferensi",
-    value: "konferensi",
-  },
-  {
-    label: "Lomba",
-    value: "lomba",
-  },
-  {
-    label: "Pameran",
-    value: "pameran",
-  },
-  {
-    label: "Pesta",
-    value: "pesta",
-  },
-  {
-    label: "Pertandingan",
-    value: "pertandingan",
-  },
-];

app/(application)/admin/event/type-update.tsx

@@ -1,20 +1,91 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   BoxButtonOnFooter,
   ButtonCustom,
+  Spacing,
+  TextCustom,
   TextInputCustom,
   ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
-import { useLocalSearchParams, useRouter } from "expo-router";
+import { MainColor } from "@/constants/color-palet";
+import {
+  apiAdminMasterTypeOfEventGetOne,
+  apiAdminMasterTypeOfEventUpdate,
+} from "@/service/api-admin/api-master-admin";
+
+import { useFocusEffect, useLocalSearchParams, useRouter } from "expo-router";
+import { useCallback, useState } from "react";
+import { Switch } from "react-native-paper";
+import Toast from "react-native-toast-message";
 
 export default function AdminEventTypeOfEventUpdate() {
   const { id } = useLocalSearchParams();
-  console.log("id >", id);
-
   const router = useRouter();
+
+  const [data, setData] = useState<{ name: string; active: boolean }>({
+    name: "",
+    active: false,
+  });
+  const [isLoading, setLoading] = useState<boolean>(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+
+  const onLoadData = async () => {
+    try {
+      const response = await apiAdminMasterTypeOfEventGetOne({
+        id: id as string,
+      });
+
+      if (response.success) {
+        setData({
+          name: response.data.name,
+          active: response.data.active,
+        });
+      }
+    } catch (error) {
+      console.log("[ERROR UPDATE]", error);
+    }
+  };
+
+  const handlerSubmit = async () => {
+    try {
+      setLoading(true);
+
+      const response = await apiAdminMasterTypeOfEventUpdate({
+        id: id as string,
+        data: data,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal mengupdate tipe acara",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Berhasil mengupdate tipe acara",
+      });
+      router.back();
+    } catch (error) {
+      console.log("[ERROR UPDATE]", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
-      <ButtonCustom onPress={() => router.back()}>Update</ButtonCustom>
+      <ButtonCustom isLoading={isLoading} onPress={() => handlerSubmit()}>
+        Update
+      </ButtonCustom>
     </BoxButtonOnFooter>
   );
   return (
@@ -23,7 +94,19 @@ export default function AdminEventTypeOfEventUpdate() {
         headerComponent={<AdminBackButtonAntTitle title="Ubah Tipe Acara" />}
         footerComponent={buttonSubmit}
       >
-        <TextInputCustom placeholder="Masukkan Tipe Acara" value="" />
+        <TextInputCustom
+          placeholder="Masukkan Tipe Acara"
+          value={data.name}
+          onChangeText={(text) => setData({ ...data, name: text })}
+        />
+
+        <TextCustom>Aktivasi</TextCustom>
+        <Spacing height={10} />
+        <Switch
+          color={MainColor.yellow}
+          value={data.active}
+          onValueChange={(value) => setData({ ...data, active: value })}
+        />
       </ViewWrapper>
     </>
   );

app/(application)/admin/job/[id]/[status]/index.tsx

@@ -13,6 +13,7 @@ import {
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
 import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
 import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
+import ReportBox from "@/components/Box/ReportBox";
 import { MainColor } from "@/constants/color-palet";
 import funUpdateStatusJob from "@/screens/Admin/Job/funUpdateStatus";
 import { apiAdminJobGetById } from "@/service/api-admin/api-admin-job";
@@ -141,13 +142,8 @@ export default function AdminJobDetailStatus() {
           </StackCustom>
         </BaseBox>
 
-        {data && data?.catatan && (
-          <BaseBox>
-            <StackCustom>
-              <TextCustom bold>Catatan report</TextCustom>
-              <TextCustom>{data?.catatan}</TextCustom>
-            </StackCustom>
-          </BaseBox>
+        {data && data?.catatan && (status === "reject" || status === "review") && (
+          <ReportBox text={data?.catatan}/>
         )}
 
         {status === "review" && (

components/DateInput/DataTimeAndroid.tsx

@@ -196,6 +196,7 @@ const DateTimeInput_Android: React.FC<DateTimeInputProps> = ({
           onChange={handleConfirmTime}
           minimumDate={minimumDate}
           maximumDate={maximumDate}
+          themeVariant="light"
         />
       )}
     </>

components/DateInput/DateTimeIOS.tsx

@@ -145,6 +145,7 @@ const DateTimeInput_IOS: React.FC<DateTimeInputProps> = ({
               onChange={handleConfirm}
               minimumDate={minimumDate}
               maximumDate={maximumDate}
+              themeVariant="light"
             />
           </View>
         </>

screens/Admin/Event/funUpdateStatus.ts

@@ -0,0 +1,23 @@
+import { apiAdminEventUpdateStatus } from "@/service/api-admin/api-admin-event";
+
+export const funUpdateStatusEvent = async ({
+  id,
+  changeStatus,
+  data,
+}: {
+  id: string;
+  changeStatus: "publish" | "review" | "reject";
+  data?: string;
+}) => {
+  try {
+    const response = await apiAdminEventUpdateStatus({
+      id: id,
+      changeStatus: changeStatus as any,
+      data: data,
+    });
+    return response;
+  } catch (error) {
+    console.log("[ERROR]", error);
+    throw error;
+  }
+};

screens/Admin/listPageAdmin.tsx

@@ -38,7 +38,7 @@ const adminListMenu: NavbarItem[] = [
       { label: "Review", link: "/admin/event/review/status" },
       { label: "Reject", link: "/admin/event/reject/status" },
       { label: "Tipe Acara", link: "/admin/event/type-of-event" },
-      { label: "Riwayat", link: "/admin/event/riwayat/status" },
+      { label: "Riwayat", link: "/admin/event/history/status" },
     ],
   },
   {
@@ -131,7 +131,7 @@ const superAdminListMenu: NavbarItem[] = [
       { label: "Review", link: "/admin/event/review/status" },
       { label: "Reject", link: "/admin/event/reject/status" },
       { label: "Tipe Acara", link: "/admin/event/type-of-event" },
-      { label: "Riwayat", link: "/admin/event/riwayat/status" },
+      { label: "Riwayat", link: "/admin/event/history/status" },
     ],
   },
   {

service/api-admin/api-admin-donation.ts

@@ -0,0 +1,18 @@
+import { apiConfig } from "../api-config";
+
+export async function apiAdminDonation({
+  category,
+  search,
+}: {
+  category: "dashboard" | "publish" | "review" | "reject" ;
+  search?: string;
+}) {
+  try {
+    const response = await apiConfig.get(
+      `/mobile/admin/donation?category=${category}&search=${search}`
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}

service/api-admin/api-admin-event.ts

@@ -0,0 +1,62 @@
+import { apiConfig } from "../api-config";
+
+export async function apiAdminEvent({
+  category,
+  search,
+}: {
+  category: "dashboard" | "history" | "publish" | "review" | "type-of-event";
+  search?: string;
+}) {
+  try {
+    const response = await apiConfig.get(
+      `/mobile/admin/event?category=${category}&search=${search}`
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminEventById({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/event/${id}`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminEventUpdateStatus({
+  id,
+  changeStatus,
+  data,
+}: {
+  id: string;
+  changeStatus: "publish" | "review" | "reject";
+  data?: string;
+}) {
+  try {
+    const response = await apiConfig.put(
+      `/mobile/admin/event/${id}?status=${changeStatus}`,
+      {
+        data: data,
+      }
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminEventListOfParticipants({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(
+      `/mobile/admin/event/${id}/participants`
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+

service/api-admin/api-master-admin.ts

@@ -62,7 +62,9 @@ export async function apiAdminMasterBusinessField() {
 
 export async function apiAdminMasterBusinessFieldById({ id }: { id: string }) {
   try {
-    const response = await apiConfig.get(`/mobile/admin/master/business-field/${id}`);
+    const response = await apiConfig.get(
+      `/mobile/admin/master/business-field/${id}`
+    );
     return response.data;
   } catch (error) {
     throw error;
@@ -77,26 +79,91 @@ export async function apiAdminMasterBusinessFieldUpdate({
   data: any;
 }) {
   try {
-    const response = await apiConfig.put(`/mobile/admin/master/business-field/${id}`, {
+    const response = await apiConfig.put(
+      `/mobile/admin/master/business-field/${id}`,
+      {
         data: data,
-    });
+      }
+    );
     return response.data;
   } catch (error) {
     throw error;
   }
 }
 
-export async function apiAdminMasterBusinessFieldCreate({ data }: { data: any }) {
+export async function apiAdminMasterBusinessFieldCreate({
+  data,
+}: {
+  data: any;
+}) {
   try {
-    const response = await apiConfig.post(`/mobile/admin/master/business-field`, {
+    const response = await apiConfig.post(
+      `/mobile/admin/master/business-field`,
+      {
         data: data,
-    });
+      }
+    );
     return response.data;
   } catch (error) {
     throw error;
   }
 }
 
-
-
 // ================== END BUSINNES FIELD ================== //
+
+// ================== START EVENT ================== //
+export async function apiAdminMasterTypeOfEvent() {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/master/type-of-event`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiEventCreateTypeOfEvent({ data }: { data: string }) {
+  try {
+    const response = await apiConfig.post(
+      `/mobile/admin/master/type-of-event`,
+      {
+        data: data,
+      }
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterTypeOfEventGetOne({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(
+      `/mobile/admin/master/type-of-event/${id}`
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterTypeOfEventUpdate({
+  id,
+  data,
+}: {
+  id: string;
+  data: any;
+}) {
+  try {
+    const response = await apiConfig.put(
+      `/mobile/admin/master/type-of-event/${id}`,
+      {
+        data: data,
+      }
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+// ================== END EVENT ================== //

service/api-client/api-event.ts

@@ -138,3 +138,44 @@ export async function apiEventCheckParticipants({
     throw error;
   }
 }
+
+export async function apiEventGetConfirmation({
+  id,
+  userId,
+}: {
+  id: string;
+  userId?: string;
+}) {
+  try {
+    const response = await apiConfig.get(`/mobile/event/${id}/confirmation?userId=${userId}`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiEventConfirmationAction({
+  id,
+  userId,
+  category,
+}: {
+  id: string;
+  userId?: string;
+  category?: "join_and_confirm" | "confirmation";
+}) {
+  try {
+    const response = await apiConfig.post(
+      `/mobile/event/${id}/confirmation?category=${category}`,
+      {
+        data: {
+          userId: userId,
+        },
+      }
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+

service/api-config.ts

@@ -3,6 +3,7 @@ import axios, { AxiosInstance } from "axios";
 import Constants from "expo-constants";
 export const BASE_URL = Constants.expoConfig?.extra?.BASE_URL;
 export const API_BASE_URL = Constants.expoConfig?.extra?.API_BASE_URL;
+export const DEEP_LINK_URL = Constants.expoConfig?.extra?.DEEP_LINK_URL;
 
 export const apiConfig: AxiosInstance = axios.create({
   baseURL: API_BASE_URL,

utils/colorActivationForBadge.ts

@@ -0,0 +1,9 @@
+import { AccentColor } from "@/constants/color-palet";
+
+export const colorActivationForBadge = ({ status }: { status: boolean }) => {
+  if (status) {
+    return AccentColor.blue;
+  } else {
+    return AccentColor.blackgray;
+  }
+};