Admin : Investasi integarsi API

### NO Issue

app/(application)/admin/investment/[id]/[status]/transaction-detail.tsx

@@ -2,26 +2,33 @@
 import {
   BadgeCustom,
   BaseBox,
-  BoxButtonOnFooter,
   ButtonCustom,
+  Spacing,
   StackCustom,
   TextCustom,
-  ViewWrapper,
+  ViewWrapper
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
 import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
-import { apiAdminInvestmentGetOneInvoiceById } from "@/service/api-admin/api-admin-investment";
+import GridTwoView from "@/components/_ShareComponent/GridTwoView";
+import { MainColor } from "@/constants/color-palet";
+import {
+  apiAdminInvestmentGetOneInvoiceById,
+  apiAdminInvestmentUpdateInvoice,
+} from "@/service/api-admin/api-admin-investment";
 import { colorBadgeTransaction } from "@/utils/colorBadge";
 import { dateTimeView } from "@/utils/dateTimeView";
 import { formatCurrencyDisplay } from "@/utils/formatCurrencyDisplay";
 import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import { useCallback, useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminInvestmentTransactionDetail() {
   const { id } = useLocalSearchParams();
   console.log("[ID]", id);
 
   const [data, setData] = useState<any | null>(null);
+  const [isLoading, setLoading] = useState<boolean>(false);
 
   useFocusEffect(
     useCallback(() => {
@@ -43,24 +50,22 @@ export default function AdminInvestmentTransactionDetail() {
     }
   };
 
-  const buttonAction = (
-    <BoxButtonOnFooter>
-      <ButtonCustom onPress={() => router.back()}>Terima</ButtonCustom>
-    </BoxButtonOnFooter>
-  );
-
   const listData = [
     {
       label: "Investor",
-      value: data?.Author?.username || "-",
+      value: (data && data?.Author?.username) || "-",
     },
     {
       label: "Bank",
-      value: data?.MasterBank?.namaBank || "-",
+      value: (data && data?.MasterBank?.namaBank) || "-",
     },
     {
       label: "Jumlah Investasi",
-      value: `Rp. ${formatCurrencyDisplay(data?.nominal) || "-"}`,
+      value: (data && `Rp. ${formatCurrencyDisplay(data?.nominal)}`) || "-",
+    },
+    {
+      label: "Lembar terbeli",
+      value: (data && formatCurrencyDisplay(data?.lembarTerbeli)) || "-",
     },
     {
       label: "Status",
@@ -79,29 +84,128 @@ export default function AdminInvestmentTransactionDetail() {
     },
     {
       label: "Tanggal",
-      value: data && dateTimeView({ date: data?.createdAt }) || "-",
+      value: (data && dateTimeView({ date: data?.createdAt })) || "-",
     },
     {
       label: "Bukti Transfer",
-      value: (
-        <ButtonCustom
-          onPress={() =>
-            router.push(`/(application)/(image)/preview-image/${data?.imageId}`)
-          }
-        >
-          Cek
-        </ButtonCustom>
-      ),
+      value:
+        data && data?.imageId ? (
+          <ButtonCustom
+            onPress={() =>
+              router.push(
+                `/(application)/(image)/preview-image/${data?.imageId}`
+              )
+            }
+          >
+            Cek
+          </ButtonCustom>
+        ) : (
+          "-"
+        ),
     },
   ];
 
+  const handlerSubmit = async ({
+    category,
+  }: {
+    category: "accept" | "deny";
+  }) => {
+    try {
+      setLoading(true);
+      const response = await apiAdminInvestmentUpdateInvoice({
+        id: id as string,
+        category: category,
+        data: {
+          investasiId: data?.investasiId,
+          lembarTerbeli: data?.lembarTerbeli,
+        },
+      });
+
+      console.log("[RESPONSE SUBMIT]", JSON.stringify(response, null, 2));
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal update status transaksi",
+        });
+
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Berhasil update status transaksi",
+      });
+      router.back();
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const buttonAction = () => {
+    if (data?.StatusInvoice?.name === "Proses") {
+      return (
+        <GridTwoView
+          spanLeft={6}
+          spanRight={6}
+          styleLeft={{ paddingRight: 10 }}
+          styleRight={{ paddingLeft: 10 }}
+          leftIcon={
+            <ButtonCustom
+              isLoading={isLoading}
+              backgroundColor={MainColor.red}
+              textColor="white"
+              onPress={() => {
+                handlerSubmit({
+                  category: "deny",
+                });
+              }}
+            >
+              Tolak
+            </ButtonCustom>
+          }
+          rightIcon={
+            <ButtonCustom
+              isLoading={isLoading}
+              onPress={() => {
+                handlerSubmit({
+                  category: "accept",
+                });
+              }}
+            >
+              Terima
+            </ButtonCustom>
+          }
+        />
+      );
+    } else if (data?.StatusInvoice?.name === "Gagal") {
+      return (
+        <>
+          <ButtonCustom textColor="red" onPress={() => router.back()}>
+            Gagal
+          </ButtonCustom>
+        </>
+      );
+    } else {
+      return (
+        <>
+          <ButtonCustom disabled={true}>
+            Status: {data?.StatusInvoice?.name}
+          </ButtonCustom>
+        </>
+      );
+    }
+  };
+
   return (
     <>
       <ViewWrapper
         headerComponent={
           <AdminBackButtonAntTitle title="Detail Transaksi Investor" />
         }
-        footerComponent={buttonAction}
+        // footerComponent={buttonAction()}
       >
         <BaseBox>
           <StackCustom>
@@ -114,6 +218,8 @@ export default function AdminInvestmentTransactionDetail() {
             ))}
           </StackCustom>
         </BaseBox>
+        <Spacing />
+        {buttonAction()}
       </ViewWrapper>
     </>
   );