Donation

Add:
- (user)/donation/[id]/(transaction-flow)/[invoiceId]

Fix:
Integrasi dalam alur transaksi
- Buat invoice dan list transaksi

### No Issue

app/(application)/(user)/donation/[id]/(transaction-flow)/[invoiceId]/invoice.tsx

@@ -13,12 +13,15 @@ import { MainColor } from "@/constants/color-palet";
 import { router, useLocalSearchParams } from "expo-router";
 
 export default function DonationInvoice() {
-  const { id, transaction } = useLocalSearchParams();
+  const { invoiceId } = useLocalSearchParams();
+  console.log("invoiceId", invoiceId);
   return (
     <>
       <ViewWrapper>
         <StackCustom>
-          <InformationBox text={`Mohon transfer donasi anda ke rekening dibawah dengan Id: ${transaction}`} />
+          <InformationBox
+            text={`Mohon transfer donasi anda ke rekening dibawah dengan Id: ${invoiceId}`}
+          />
           <BaseBox>
             <StackCustom gap={"xs"}>
               <TextCustom>Nama BANK</TextCustom>
@@ -97,7 +100,7 @@ export default function DonationInvoice() {
 
           <ButtonCustom
             onPress={() => {
-              router.push(`/donation/${id}/(transaction-flow)/process`);
+              router.push(`/donation/${invoiceId}/(transaction-flow)/process`);
             }}
           >
             Saya Sudah Transfer

app/(application)/(user)/donation/[id]/(transaction-flow)/index.tsx

@@ -9,15 +9,44 @@ import {
 } from "@/components";
 import { MainColor } from "@/constants/color-palet";
 import { ICON_SIZE_SMALL } from "@/constants/constans-value";
+import { LOCAL_STORAGE_KEY } from "@/constants/local-storage-key";
+import { formatCurrencyDisplay } from "@/utils/formatCurrencyDisplay";
 import { Ionicons } from "@expo/vector-icons";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 import { router, useLocalSearchParams } from "expo-router";
+import { useState } from "react";
 
 export default function InvestmentInputDonation() {
   const { id } = useLocalSearchParams();
+  const [nominal, setNominal] = useState<number>(0);
+
+  const handlerSubmit = async () => {
+    try {
+      console.log("jumlah", nominal);
+      await AsyncStorage.setItem(
+        LOCAL_STORAGE_KEY.transactionDonation,
+        JSON.stringify({ nominal: nominal.toString() })
+      );
+      router.replace(`/donation/${id}/select-bank`);
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
+  const displayJumlah = formatCurrencyDisplay(nominal);
+
+  const handleChangeCurrency = (text: string) => {
+    const numeric = text.replace(/\D/g, "");
+    setNominal(Number(numeric));
+  };
+
   const bottomComponent = (
     <BoxButtonOnFooter>
       <ButtonCustom
-        onPress={() => router.replace(`/donation/${id}/select-bank`)}
+        disabled={nominal < 10000 || nominal === 0}
+        onPress={() => {
+          handlerSubmit();
+        }}
       >
         Lanjutan
       </ButtonCustom>
@@ -27,7 +56,7 @@ export default function InvestmentInputDonation() {
     <>
       <ViewWrapper footerComponent={bottomComponent}>
         {listData.map((item, i) => (
-          <BaseBox key={i}>
+          <BaseBox key={i} onPress={() => setNominal(item.value)}>
             <Grid>
               <Grid.Col span={8}>
                 <TextCustom bold size="large">
@@ -51,6 +80,8 @@ export default function InvestmentInputDonation() {
             label="Nominal lainnya"
             placeholder="0"
             iconLeft="Rp."
+            value={displayJumlah}
+            onChangeText={(value) => handleChangeCurrency(value)}
           />
           <TextCustom size="small" color="gray">
             Minimal donasi Rp. 10.000

app/(application)/(user)/donation/[id]/(transaction-flow)/select-bank.tsx

@@ -5,24 +5,93 @@ import {
   ViewWrapper,
 } from "@/components";
 import { RadioCustom, RadioGroup } from "@/components/Radio/RadioCustom";
+import { LOCAL_STORAGE_KEY } from "@/constants/local-storage-key";
+import { useAuth } from "@/hooks/use-auth";
 import { dummyMasterBank } from "@/lib/dummy-data/_master/bank";
-import { router, useLocalSearchParams } from "expo-router";
-import { useState } from "react";
+import { apiDonationCreateInvoice } from "@/service/api-client/api-donation";
+import { apiMasterBank } from "@/service/api-client/api-master";
+import AsyncStorage from "@react-native-async-storage/async-storage";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import { useCallback, useEffect, useState } from "react";
 
 export default function DonationSelectBank() {
-  const { id, transaction } = useLocalSearchParams();
-  const [value, setValue] = useState<any | number>("");
+  const { user } = useAuth();
+  const { id } = useLocalSearchParams();
+
+  console.log("id", id);
+  const [select, setSelect] = useState<any | number>("");
+  const [listBank, setListBank] = useState<any>([]);
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+
+  useEffect(() => {
+    loadListBank();
+  }, []);
+
+  const loadListBank = async () => {
+    try {
+      const response = await apiMasterBank();
+
+      setListBank(response.data);
+    } catch (error) {
+      console.log("[ERROR]", error);
+      setListBank([]);
+    }
+  };
+
+  const handlerSubmit = async () => {
+    try {
+      setIsLoading(true);
+      const dataStorage = await AsyncStorage.getItem(
+        LOCAL_STORAGE_KEY.transactionDonation
+      );
+
+      if (dataStorage) {
+        const storage = JSON.parse(dataStorage);
+        const newData = {
+          ...storage,
+          bankId: select,
+          authorId: user?.id,
+        };
+
+        console.log("[NEW DATA]", newData);
+
+        const response = await apiDonationCreateInvoice({
+          id: id as string,
+          data: newData,
+        });
+        console.log("[RESPONSE CREATE>>]", response);
+
+        if (response.success) {
+          const invoiceId = response.data.id;
+
+          const delStorage = await AsyncStorage.removeItem(
+            LOCAL_STORAGE_KEY.transactionDonation
+          );
+
+          console.log("[DEL STORAGE]", delStorage);
+          router.replace(
+            `/(application)/(user)/donation/[id]/(transaction-flow)/${invoiceId}/invoice`
+          );
+        } else {
+          console.log("[FAILED]", response);
+        }
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
 
   const buttonSubmit = () => {
     return (
       <>
         <BoxButtonOnFooter>
           <ButtonCustom
-            onPress={() =>
-              router.replace(
-                `/(application)/(user)/donation/${id}/(transaction-flow)/${transaction}/invoice`
-              )
-            }
+            isLoading={isLoading}
+            disabled={!select}
+            onPress={() => handlerSubmit()}
           >
             Pilih
           </ButtonCustom>
@@ -32,12 +101,14 @@ export default function DonationSelectBank() {
   };
   return (
     <ViewWrapper footerComponent={buttonSubmit()}>
-      <RadioGroup value={value} onChange={setValue}>
-        {dummyMasterBank.map((item) => (
-          <BaseBox key={item.name}>
-            <RadioCustom label={item.name} value={item.code} />
-          </BaseBox>
-        ))}
+      <RadioGroup value={select} onChange={setSelect}>
+        {_.isEmpty(listBank)
+          ? []
+          : listBank?.map((item: any, index: number) => (
+              <BaseBox key={index}>
+                <RadioCustom label={item.namaBank} value={item.id} />
+              </BaseBox>
+            ))}
       </RadioGroup>
     </ViewWrapper>
   );

app/(application)/(user)/donation/[id]/infromation-fundrising.tsx

@@ -1,15 +1,13 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import {
   AvatarComp,
-  AvatarCustom,
   BaseBox,
   ButtonCustom,
-  CenterCustom,
   Grid,
   LoaderCustom,
   Spacing,
   TextCustom,
-  ViewWrapper,
+  ViewWrapper
 } from "@/components";
 import Donation_BoxPublish from "@/screens/Donation/BoxPublish";
 import { apiDonationFundrising } from "@/service/api-client/api-donation";