Poortofoloio

Fix:
- service/api-client/api-portofolio.ts : api edit detail. logo, medsos

### No Issue

app/(application)/(user)/portofolio/[id]/edit.tsx

@@ -1,57 +1,134 @@
 import {
-    BoxButtonOnFooter,
-    ButtonCenteredOnly,
-    ButtonCustom,
-    Grid,
-    SelectCustom,
-    Spacing,
-    StackCustom,
-    TextAreaCustom,
-    TextCustom,
-    TextInputCustom,
-    ViewWrapper,
+  BoxButtonOnFooter,
+  ButtonCustom,
+  SelectCustom,
+  Spacing,
+  StackCustom,
+  TextAreaCustom,
+  TextCustom,
+  TextInputCustom,
+  ViewWrapper,
 } from "@/components";
 import { MainColor } from "@/constants/color-palet";
-import dummyMasterBidangBisnis from "@/lib/dummy-data/master-bidang-bisnis";
-import dummyMasterSubBidangBisnis from "@/lib/dummy-data/master-sub-bidang-bisnis";
-import { Ionicons } from "@expo/vector-icons";
+import { apiMasterBidangBisnis } from "@/service/api-client/api-master";
+import {
+  apiGetOnePortofolio,
+  apiUpdatePortofolio,
+} from "@/service/api-client/api-portofolio";
+import { IMasterBidangBisnis } from "@/types/Type-Master";
 import { router, useLocalSearchParams } from "expo-router";
-import { useState } from "react";
-import { Text, TouchableOpacity, View } from "react-native";
+import { useEffect, useState } from "react";
+import { Text, View } from "react-native";
 import PhoneInput, { ICountry } from "react-native-international-phone-number";
+import Toast from "react-native-toast-message";
+
+interface IFormData {
+  id_Portofolio: string;
+  namaBisnis: string;
+  alamatKantor: string;
+  tlpn: string;
+  deskripsi: string;
+  masterBidangBisnisId: string;
+}
 
 export default function PortofolioEdit() {
   const { id } = useLocalSearchParams();
+  const [isLoading, setIsLoading] = useState(false);
   const [selectedCountry, setSelectedCountry] = useState<null | ICountry>(null);
-  const [inputValue, setInputValue] = useState<string>("");
-
-  const [data, setData] = useState({
-    namaBisnis: "",
-    bidang_usaha: "",
-    sub_bidang_usaha: "",
-    alamat: "",
-    nomor_telepon: "",
-    deskripsi: "",
-  });
+  const [bidangBisnis, setBidangBisnis] = useState<IMasterBidangBisnis[]>([]);
+  const [data, setData] = useState<any>({});
 
   function handleInputValue(phoneNumber: string) {
-    setInputValue(phoneNumber);
+    setData({ ...data, tlpn: phoneNumber });
   }
 
   function handleSelectedCountry(country: ICountry) {
     setSelectedCountry(country);
   }
 
-  function handleSave() {
-    console.log(`Update portofolio berhasil ${id}`);
-    router.back();
-  }
+  useEffect(() => {
+    onLoadData(id as string);
+    onLoadMaster();
+  }, [id]);
+
+  const onLoadData = async (id: string) => {
+    const response = await apiGetOnePortofolio({ id: id });
+
+    if (response.data.tlpn && response.data.tlpn.includes("62")) {
+      const fixNumber = response.data.tlpn.replace("62", "");
+      console.log("Fix Number >>", fixNumber);
+      setData({ ...response.data, tlpn: fixNumber });
+    }
+  };
+
+  const onLoadMaster = async () => {
+    try {
+      const response = await apiMasterBidangBisnis();
+      setBidangBisnis(response.data);
+    } catch (error) {
+      setBidangBisnis([]);
+      console.log("Error onLoadMasterBidangBisnis", error);
+    }
+  };
+
+  const handleSubmitUpdate = async () => {
+    try {
+      setIsLoading(true);
+      const callingCode = selectedCountry?.callingCode.replace(/^\+/, "") || "";
+      const fixNumber = data.tlpn.replace(/\s+/g, "");
+      const realNumber = callingCode + fixNumber;
+
+      const newData: IFormData = {
+        id_Portofolio: data.id_Portofolio,
+        namaBisnis: data.namaBisnis,
+        alamatKantor: data.alamatKantor,
+        tlpn: realNumber,
+        deskripsi: data.deskripsi,
+        masterBidangBisnisId: data.masterBidangBisnisId,
+      };
+
+      const response = await apiUpdatePortofolio({
+        id: id as string,
+        data: newData,
+        category: "detail",
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "info",
+          text1: "Info",
+          text2: response.message,
+        });
+
+        return
+      }
+
+        Toast.show({
+              type: "success",
+              text1: "Sukses",
+              text2: "Data terupdate",
+            });
+
+      router.back();
+    } catch (error) {
+      console.log("Error handleSubmitUpdate", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
 
   const buttonUpdate = (
     <BoxButtonOnFooter>
-      <ButtonCustom onPress={handleSave}>Simpan</ButtonCustom>
+      <ButtonCustom
+        isLoading={isLoading}
+        disabled={isLoading}
+        onPress={handleSubmitUpdate}
+      >
+        Update
+      </ButtonCustom>
     </BoxButtonOnFooter>
   );
+
   return (
     <>
       <ViewWrapper footerComponent={buttonUpdate}>
@@ -60,22 +137,26 @@ export default function PortofolioEdit() {
             required
             label="Nama Bisnis"
             placeholder="Masukkan nama bisnis"
+            value={data.namaBisnis}
+            onChangeText={(value: any) =>
+              setData({ ...data, namaBisnis: value })
+            }
           />
 
           <SelectCustom
             label="Bidang Usaha"
             required
-            data={dummyMasterBidangBisnis.map((item) => ({
+            data={bidangBisnis?.map((item) => ({
               label: item.name,
               value: item.id,
             }))}
-            value={data.bidang_usaha}
+            value={data.masterBidangBisnisId}
             onChange={(value) => {
-              setData({ ...(data as any), bidang_usaha: value });
+              setData({ ...(data as any), masterBidangBisnisId: value });
             }}
           />
 
-          <Grid>
+          {/* <Grid>
             <Grid.Col span={10}>
               <SelectCustom
                 // disabled
@@ -85,9 +166,9 @@ export default function PortofolioEdit() {
                   label: item.name,
                   value: item.id,
                 }))}
-                value={data.sub_bidang_usaha}
+                value={data.masterSubBidangBisnisId}
                 onChange={(value) => {
-                  setData({ ...(data as any), sub_bidang_usaha: value });
+                  setData({ ...(data as any), masterSubBidangBisnisId: value });
                 }}
               />
             </Grid.Col>
@@ -99,11 +180,12 @@ export default function PortofolioEdit() {
                 <Ionicons name="trash" size={24} color={MainColor.red} />
               </TouchableOpacity>
             </Grid.Col>
-          </Grid>
-          <ButtonCenteredOnly onPress={() => console.log("add")}>
+          </Grid> */}
+          {/* <ButtonCenteredOnly onPress={() => console.log("add")}>
             Tambah Pilihan
           </ButtonCenteredOnly>
-          <Spacing />
+          <Spacing /> */}
+
           <View>
             <View style={{ flexDirection: "row", alignItems: "center" }}>
               <TextCustom semiBold style={{ color: MainColor.white_gray }}>
@@ -113,7 +195,7 @@ export default function PortofolioEdit() {
             </View>
             <Spacing height={5} />
             <PhoneInput
-              value={inputValue}
+              value={data.tlpn}
               onChangePhoneNumber={handleInputValue}
               selectedCountry={selectedCountry}
               onChangeSelectedCountry={handleSelectedCountry}
@@ -127,6 +209,10 @@ export default function PortofolioEdit() {
             required
             label="Alamat Bisnis"
             placeholder="Masukkan alamat bisnis"
+            value={data.alamatKantor}
+            onChangeText={(value: any) =>
+              setData({ ...data, alamatKantor: value })
+            }
           />
 
           <TextAreaCustom
@@ -141,7 +227,7 @@ export default function PortofolioEdit() {
             maxRows={5}
             required
             showCount
-            maxLength={100}
+            maxLength={1000}
           />
           <Spacing />
         </StackCustom>