Integrasi API: Admin Job

Add:
app/(application)/admin/job/[id]/[status]/reject-input.tsx
screens/Admin/Job/

Fix:
Tampilan ke UI sudah terintegrasi

### No Issue

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

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   AlertDefaultSystem,
   BadgeCustom,
@@ -7,17 +8,42 @@ import {
   Spacing,
   StackCustom,
   TextCustom,
-  ViewWrapper
+  ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
 import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
 import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
 import { MainColor } from "@/constants/color-palet";
-import { router, useLocalSearchParams } from "expo-router";
+import funUpdateStatus from "@/screens/Admin/Job/funUpdateStatus";
+import { apiAdminJobGetById } from "@/service/api-admin/api-admin-job";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
+import { useCallback, useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminJobDetailStatus() {
   const { id, status } = useLocalSearchParams();
+  const [data, setData] = useState<any | null>(null);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+
+  const onLoadData = async () => {
+    try {
+      const response = await apiAdminJobGetById({
+        id: id as string,
+      });
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
 
   const colorBadge = () => {
     if (status === "publish") {
@@ -32,11 +58,11 @@ export default function AdminJobDetailStatus() {
   const listData = [
     {
       label: "Username",
-      value: "Bagas Banuna",
+      value: data?.Author?.username || "-",
     },
     {
       label: "Judul",
-      value: `Judul Proyek: ${id}Lorem ipsum dolor sit amet consectetur adipisicing elit.`,
+      value: data?.title || "-",
     },
     {
       label: "Status",
@@ -48,24 +74,43 @@ export default function AdminJobDetailStatus() {
     },
     {
       label: "Konten",
-      value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+      value: data?.content || "-",
     },
     {
       label: "Deskripsi",
-      value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+      value: data?.deskripsi || "-",
     },
-    // {
-    //   label: "Poster",
-    //   value: (
-    //     <ButtonCustom
-    //       href={`/(application)/()/${id}`}
-    //     >
-    //       Lihat Poster
-    //     </ButtonCustom>
-    //   ),
-    // },
   ];
 
+  const handleUpdate = async ({
+    changeStatus,
+  }: {
+    changeStatus: "publish" | "review" | "reject";
+  }) => {
+    try {
+      const response = await funUpdateStatus({
+        id: id as string,
+        changeStatus,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal mempublikasikan data",
+        });
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Berhasil mempublikasikan data",
+      });
+
+      router.back();
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
   return (
     <>
       <ViewWrapper
@@ -73,8 +118,8 @@ export default function AdminJobDetailStatus() {
       >
         <BaseBox>
           <StackCustom>
-            {listData.map((item, i) => (
+            {listData?.map((item, index) => (
-              <Grid key={i}>
+              <Grid key={index}>
                 <Grid.Col
                   span={4}
                   style={{ justifyContent: "center", paddingRight: 10 }}
@@ -87,12 +132,24 @@ export default function AdminJobDetailStatus() {
               </Grid>
             ))}
 
-            <TextCustom bold>Poster</TextCustom>
+            {data && data?.imageId && (
-
+              <StackCustom>
-            <DummyLandscapeImage />
+                <TextCustom bold>Poster</TextCustom>
+                <DummyLandscapeImage imageId={data?.imageId} />
+              </StackCustom>
+            )}
           </StackCustom>
         </BaseBox>
 
+        {data && data?.catatan && (
+          <BaseBox>
+            <StackCustom>
+              <TextCustom bold>Catatan report</TextCustom>
+              <TextCustom>{data?.catatan}</TextCustom>
+            </StackCustom>
+          </BaseBox>
+        )}
+
         {status === "review" && (
           <AdminButtonReview
             onPublish={() => {
@@ -101,24 +158,22 @@ export default function AdminJobDetailStatus() {
                 message: "Apakah anda yakin ingin mempublikasikan data ini?",
                 textLeft: "Batal",
                 textRight: "Ya",
-                onPressLeft: () => {
-                  router.back();
-                },
                 onPressRight: () => {
-                  router.back();
+                  handleUpdate({ changeStatus: "publish" });
                 },
               });
             }}
             onReject={() => {
-              router.push(`/admin/job/${id}/reject-input`);
+              router.push(`/admin/job/${id}/${status}/reject-input`);
             }}
           />
         )}
+
         {status === "reject" && (
           <AdminButtonReject
             title="Tambah Catatan"
             onReject={() => {
-              router.push(`/admin/job/${id}/reject-input`);
+              router.push(`/admin/job/${id}/${status}/reject-input`);
             }}
           />
         )}

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

@@ -0,0 +1,115 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import {
+  AlertDefaultSystem,
+  BoxButtonOnFooter,
+  TextAreaCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
+import funUpdateStatus from "@/screens/Admin/Job/funUpdateStatus";
+import { apiAdminJobGetById } from "@/service/api-admin/api-admin-job";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import { useCallback, useState } from "react";
+import Toast from "react-native-toast-message";
+
+export default function AdminJobRejectInput() {
+  const { id, status } = useLocalSearchParams();
+  const [data, setData] = useState<any | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadData();
+    }, [id])
+  );
+
+  const onLoadData = async () => {
+    try {
+      const response = await apiAdminJobGetById({
+        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 funUpdateStatus({
+        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/job/reject/status`);
+      } else if (status === "reject") {
+        router.back();
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const buttonSubmit = (
+    <BoxButtonOnFooter>
+      <AdminButtonReject
+        isLoading={isLoading}
+        title="Report"
+        onReject={() =>
+          AlertDefaultSystem({
+            title: "Reject",
+            message: "Apakah anda yakin ingin menolak data ini?",
+            textLeft: "Batal",
+            textRight: "Ya",
+            onPressRight: () => {
+              handleUpdate({ changeStatus: "reject" });
+            },
+          })
+        }
+      />
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        footerComponent={buttonSubmit}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Job" />}
+      >
+        <TextAreaCustom
+          value={data}
+          onChangeText={setData}
+          placeholder="Masukan alasan"
+          required
+          showCount
+          maxLength={1000}
+        />
+      </ViewWrapper>
+    </>
+  );
+}

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

@@ -1,55 +0,0 @@
-import {
-  AlertDefaultSystem,
-  BoxButtonOnFooter,
-  TextAreaCustom,
-  ViewWrapper,
-} 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";
-
-export default function AdminJobRejectInput() {
-  const { id } = useLocalSearchParams();
-  const [value, setValue] = useState(id as string);
-  const buttonSubmit = (
-    <BoxButtonOnFooter>
-      <AdminButtonReject
-        title="Reject"
-        onReject={() =>
-          AlertDefaultSystem({
-            title: "Reject",
-            message: "Apakah anda yakin ingin menolak data ini?",
-            textLeft: "Batal",
-            textRight: "Ya",
-            onPressLeft: () => {
-              router.back();
-            },
-            onPressRight: () => {
-              console.log("value:", value);
-              router.replace(`/admin/job/reject/status`);
-            },
-          })
-        }
-      />
-    </BoxButtonOnFooter>
-  );
-
-  return (
-    <>
-      <ViewWrapper
-        footerComponent={buttonSubmit}
-        headerComponent={<AdminBackButtonAntTitle title="Penolakan Job" />}
-      >
-        <TextAreaCustom
-          value={value}
-          onChangeText={setValue}
-          placeholder="Masukan alasan"
-          required
-          showCount
-          maxLength={1000}
-        />
-      </ViewWrapper>
-    </>
-  );
-}

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

@@ -21,8 +21,6 @@ import { Divider } from "react-native-paper";
 
 export default function AdminJobStatus() {
   const { status } = useLocalSearchParams();
-  console.log("[STATUS]", status);
-
   const [list, setList] = useState<any | null>(null);
   const [loadList, setLoadList] = useState(false);
   const [search, setSearch] = useState("");
@@ -41,8 +39,6 @@ export default function AdminJobStatus() {
         search,
       });
 
-      console.log("[RESPONSE >>]", JSON.stringify(response, null, 2));
-
       if (response.success) {
         setList(response.data);
       }

components/_ShareComponent/Admin/ButtonReject.tsx

@@ -5,9 +5,11 @@ import { MainColor } from "@/constants/color-palet";
 export default function AdminButtonReject({
   title,
   onReject,
+  isLoading,  
 }: {
   title: string;
   onReject: () => void;
+  isLoading?: boolean;
 }) {
   return (
     <>
@@ -16,6 +18,7 @@ export default function AdminButtonReject({
         backgroundColor={MainColor.red}
         textColor="white"
         onPress={onReject}
+        isLoading={isLoading}
       >
         {title}
       </ButtonCustom>

screens/Admin/Job/funUpdateStatus.ts

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

service/api-admin/api-admin-job.ts

@@ -16,3 +16,34 @@ export async function apiAdminJob({
     throw error;
   }
 }
+
+export async function apiAdminJobGetById({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/job/${id}`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminJobUpdate({
+  id,
+  status,
+  data,
+}: {
+  id: string;
+  status: "publish" | "review" | "reject";
+  data?: string;
+}) {
+  try {
+    const response = await apiConfig.put(
+      `/mobile/admin/job/${id}?status=${status}`,
+      {
+        data: data,
+      }
+    );
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}