Integrasi API: App Information & Maps

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

Fix:
app/(application)/admin/app-information/business-field/[id]/index.tsx
app/(application)/admin/app-information/business-field/create.tsx
app/(application)/admin/app-information/index.tsx
app/(application)/admin/app-information/information-bank/[id]/index.tsx
app/(application)/admin/app-information/information-bank/create.tsx
app/(application)/admin/maps.tsx
screens/Admin/App-Information/BusinessFieldSection.tsx
screens/Admin/App-Information/InformationBankSection.tsx
screens/Admin/App-Information/StickerSection.tsx
screens/Authentication/LoginView.tsx
service/api-client/api-master.ts

- Perbaikan berupa integrasi API

### No Issue

app/(application)/admin/app-information/business-field/[id]/index.tsx

@@ -1,18 +1,89 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
   BoxButtonOnFooter,
   ButtonCustom,
   StackCustom,
+  TextCustom,
   TextInputCustom,
   ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
-import { router } from "expo-router";
+import { MainColor } from "@/constants/color-palet";
+import {
+  apiAdminMasterBusinessFieldById,
+  apiAdminMasterBusinessFieldUpdate,
+} from "@/service/api-admin/api-master-admin";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import { useCallback, useState } from "react";
+import { Switch } from "react-native-paper";
+import Toast from "react-native-toast-message";
 
 export default function AdminAppInformation_BusinessFieldDetail() {
+  const { id } = useLocalSearchParams();
+  const [data, setData] = useState<any | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadDetail();
+    }, [id])
+  );
+
+  const onLoadDetail = async () => {
+    try {
+      const response = await apiAdminMasterBusinessFieldById({
+        id: id as string,
+      });
+
+      setData(response.data);
+    } catch (error) {
+      console.log("[ERROR]", error);
+      setData(null);
+    }
+  };
+
+  const handlerSubmit = async () => {
+    if (!data.name) {
+      Toast.show({
+        type: "error",
+        text1: "Lengkapi Data",
+      });
+      return;
+    }
+
+    try {
+      setIsLoading(true);
+      const response = await apiAdminMasterBusinessFieldUpdate({
+        id: id as string,
+        data: data,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal update data",
+        });
+        return;
+      }
+
+      Toast.show({
+        type: "success",
+        text1: "Data berhasil di update",
+      });
+      router.back();
+    } catch (error) {
+      console.log(error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
       <ButtonCustom
-        onPress={() => router.back()}
+        disabled={!data?.name}
+        isLoading={isLoading}
+        onPress={() => handlerSubmit()}
       >
         Update
       </ButtonCustom>
@@ -28,6 +99,15 @@ export default function AdminAppInformation_BusinessFieldDetail() {
             label="Nama Bidang Bisnis"
             placeholder="Masukan Nama Bidang Bisnis"
             required
+            value={data?.name}
+            onChangeText={(value) => setData({ ...data, name: value })}
+          />
+
+          <TextCustom>Status Aktivasi</TextCustom>
+          <Switch
+            color={MainColor.yellow}
+            value={data?.active}
+            onValueChange={(value) => setData({ ...data, active: value })}
           />
         </StackCustom>
       </ViewWrapper>

app/(application)/admin/app-information/business-field/create.tsx

@@ -6,13 +6,52 @@ import {
     ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { apiAdminMasterBusinessFieldCreate } from "@/service/api-admin/api-master-admin";
 import { router } from "expo-router";
+import { useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminAppInformation_BusinessFieldCreate() {
+  const [data, setData] = useState<any>({
+    name: "",
+  });
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handlerSubmit = async () => {
+    if (!data.name) {
+      Toast.show({
+        type: "error",
+        text1: "Lengkapi Data",
+      });
+      return;
+    }
+    try {
+      setIsLoading(true);
+      const response = await apiAdminMasterBusinessFieldCreate({ data: data });
+
+      if (response.success) {
+        Toast.show({
+          type: "success",
+          text1: "Data berhasil di tambah",
+        });
+        router.back();
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+      Toast.show({
+        type: "error",
+        text1: "Gagal tambah data",
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
       <ButtonCustom
-        onPress={() => router.back()}
+        onPress={() => handlerSubmit()}
+        isLoading={isLoading}
       >
         Tambah
       </ButtonCustom>
@@ -28,6 +67,8 @@ export default function AdminAppInformation_BusinessFieldCreate() {
             label="Nama Bidang Bisnis"
             placeholder="Masukan Nama Bidang Bisnis"
             required
+            value={data.name}
+            onChangeText={(value) => setData({ ...data, name: value })}
           />
         </StackCustom>
       </ViewWrapper>

app/(application)/admin/app-information/index.tsx

@@ -1,8 +1,4 @@
-import {
+import { ScrollableCustom, StackCustom, ViewWrapper } from "@/components";
-  ScrollableCustom,
-  StackCustom,
-  ViewWrapper
-} from "@/components";
 import AdminActionIconPlus from "@/components/_ShareComponent/Admin/ActionIconPlus";
 import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
 import AdminAppInformation_BusinessFieldSection from "@/screens/Admin/App-Information/BusinessFieldSection";
@@ -10,6 +6,7 @@ import AdminAppInformation_Bank from "@/screens/Admin/App-Information/Informatio
 import AdminAppInformation_StickerSection from "@/screens/Admin/App-Information/StickerSection";
 import { router } from "expo-router";
 import { useState } from "react";
+import { Alert } from "react-native";
 
 export default function AdminInformation() {
   const [activeCategory, setActiveCategory] = useState<string | null>("bank");
@@ -57,7 +54,8 @@ export default function AdminInformation() {
                 } else if (activeCategory === "business") {
                   router.push("/admin/app-information/business-field/create");
                 } else if (activeCategory === "sticker") {
-                  router.push("/admin/app-information/sticker/create");
+                  Alert.alert("Coming Soon", "Next Update");
+                  // router.push("/admin/app-information/sticker/create");
                 }
               }}
             />

app/(application)/admin/app-information/information-bank/[id]/index.tsx

@@ -1,18 +1,90 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import {
-    BoxButtonOnFooter,
+  BoxButtonOnFooter,
-    ButtonCustom,
+  ButtonCustom,
-    StackCustom,
+  CenterCustom,
-    TextInputCustom,
+  Grid,
-    ViewWrapper,
+  StackCustom,
+  TextCustom,
+  TextInputCustom,
+  ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
-import { router } from "expo-router";
+import { MainColor } from "@/constants/color-palet";
+import {
+  apiAdminMasterBankById,
+  apiAdminMasterBankUpdate,
+} from "@/service/api-admin/api-master-admin";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
+import { useCallback, useState } from "react";
+import { Switch } from "react-native-paper";
+import Toast from "react-native-toast-message";
 
 export default function AdminAppInformation_BankDetail() {
+  const { id } = useLocalSearchParams();
+  const [data, setData] = useState<any | null>(null);
+  const [isLoading, setLoading] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadList();
+    }, [id])
+  );
+
+  const onLoadList = async () => {
+    try {
+      const response = await apiAdminMasterBankById({ id: id as string });
+
+      if (response.success) {
+        setData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    }
+  };
+
+  const handlerUpdate = async () => {
+    if (!data.namaBank || !data.namaAkun || !data.norek) {
+      Toast.show({
+        type: "error",
+        text1: "Lengkapi Data",
+      });
+      return;
+    }
+
+    try {
+      setLoading(true);
+      const response = await apiAdminMasterBankUpdate({
+        id: id as string,
+        data: data,
+      });
+
+      if (!response.success) {
+        Toast.show({
+          type: "error",
+          text1: "Gagal update data",
+        });
+      } else {
+        Toast.show({
+          type: "success",
+          text1: "Success",
+          text2: "Data berhasil di update",
+        });
+        router.back();
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
       <ButtonCustom
-        onPress={() => router.back()}
+        disabled={!data?.namaBank || !data?.namaAkun || !data?.norek}
+        isLoading={isLoading}
+        onPress={() => handlerUpdate()}
       >
         Update
       </ButtonCustom>
@@ -25,22 +97,46 @@ export default function AdminAppInformation_BankDetail() {
           <AdminBackButtonAntTitle title="Update Bank" />
 
           <StackCustom>
-            <TextInputCustom
+            <Grid>
-              label="Nama Bank"
+              <Grid.Col span={6}>
-              placeholder="Masukan Nama Bank"
+                <TextInputCustom
-              required
+                  label="Nama Bank"
-            />
+                  placeholder="Masukan Nama Bank"
+                  required
+                  value={data?.namaBank}
+                  onChangeText={(value) =>
+                    setData({ ...data, namaBank: value })
+                  }
+                />
+              </Grid.Col>
+              <Grid.Col span={6} style={{ alignItems: "center" }}>
+                <TextCustom>Status Aktivasi</TextCustom>
+                <CenterCustom>
+                  <Switch
+                    onValueChange={(value) =>
+                      setData({ ...data, isActive: value })
+                    }
+                    color={MainColor.yellow}
+                    value={data?.isActive}
+                  />
+                </CenterCustom>
+              </Grid.Col>
+            </Grid>
 
             <TextInputCustom
               label="Nama Rekening"
               placeholder="Masukan Nama Rekening"
               required
+              value={data?.namaAkun}
+              onChangeText={(value) => setData({ ...data, namaAkun: value })}
             />
 
             <TextInputCustom
               label="Nomor Rekening"
               placeholder="Masukan Nomor Rekening"
               required
+              value={data?.norek}
+              onChangeText={(value) => setData({ ...data, norek: value })}
             />
           </StackCustom>
         </StackCustom>

app/(application)/admin/app-information/information-bank/create.tsx

@@ -1,19 +1,51 @@
 import {
-    BoxButtonOnFooter,
+  BoxButtonOnFooter,
-    ButtonCustom,
+  ButtonCustom,
-    StackCustom,
+  StackCustom,
-    TextInputCustom,
+  TextInputCustom,
-    ViewWrapper
+  ViewWrapper,
 } from "@/components";
 import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { apiAdminMasterBankCreate } from "@/service/api-admin/api-master-admin";
 import { router } from "expo-router";
+import { useState } from "react";
+import Toast from "react-native-toast-message";
 
 export default function AdminAppInformation_BankCreate() {
+  const [data, setData] = useState<any>({
+    namaBank: "",
+    namaAkun: "",
+    norek: "",
+  });
+
+  const [isLoading, setLoading] = useState(false);
+
+  const handlerSubmit = async () => {
+    try {
+      setLoading(true);
+      const response = await apiAdminMasterBankCreate({ data: data });
+
+      if (response.success) {
+        Toast.show({
+          type: "success",
+          text1: "Data berhasil di tambah",
+        });
+        router.back();
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+      Toast.show({
+        type: "error",
+        text1: "Gagal tambah data",
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
   const buttonSubmit = (
     <BoxButtonOnFooter>
-      <ButtonCustom
+      <ButtonCustom isLoading={isLoading} onPress={handlerSubmit}>
-        onPress={() => router.back()}
-      >
         Tambah
       </ButtonCustom>
     </BoxButtonOnFooter>
@@ -29,18 +61,25 @@ export default function AdminAppInformation_BankCreate() {
               label="Nama Bank"
               placeholder="Masukan Nama Bank"
               required
+              value={data.namaBank}
+              onChangeText={(value) => setData({ ...data, namaBank: value })}
             />
 
             <TextInputCustom
               label="Nama Rekening"
               placeholder="Masukan Nama Rekening"
               required
+              value={data.namaAkun}
+              onChangeText={(value) => setData({ ...data, namaAkun: value })}
             />
 
             <TextInputCustom
+              keyboardType="numeric"
               label="Nomor Rekening"
               placeholder="Masukan Nomor Rekening"
               required
+              value={data.norek}
+              onChangeText={(value) => setData({ ...data, norek: value })}
             />
           </StackCustom>
         </StackCustom>

app/(application)/admin/maps.tsx

@@ -1,11 +1,224 @@
-import { MapCustom, ViewWrapper } from "@/components";
+import { ButtonCustom, DrawerCustom, DummyLandscapeImage, Grid, MapCustom, Spacing, StackCustom, TextCustom, ViewWrapper } from "@/components";
+import GridTwoView from "@/components/_ShareComponent/GridTwoView";
+import API_IMAGE from "@/constants/api-storage";
+import { ICON_SIZE_SMALL } from "@/constants/constans-value";
+import { apiMapsGetAll } from "@/service/api-client/api-maps";
+import { openInDeviceMaps } from "@/utils/openInDeviceMaps";
+import { FontAwesome, Ionicons } from "@expo/vector-icons";
+import { Image } from "expo-image";
+import { router, useFocusEffect } from "expo-router";
+import { useState, useCallback } from "react";
+import { View } from "react-native";
+import MapView, { Marker } from "react-native-maps";
 
+const defaultRegion = {
+  latitude: -8.737109,
+  longitude: 115.1756897,
+  latitudeDelta: 0.1,
+  longitudeDelta: 0.1,
+  height: 300,
+};
+
+export interface LocationItem {
+  id: string | number;
+  latitude: number;
+  longitude: number;
+  name: string;
+  imageId?: string;
+}
 export default function AdminMaps() {
+  const [list, setList] = useState<any[] | null>(null);
+  const [loadList, setLoadList] = useState(false);
+  const [openDrawer, setOpenDrawer] = useState(false);
+  const [selected, setSelected] = useState({
+    id: "",
+    bidangBisnis: "",
+    nomorTelepon: "",
+    alamatBisnis: "",
+    namePin: "",
+    imageId: "",
+    portofolioId: "",
+    latitude: 0,
+    longitude: 0,
+  });
+
+  useFocusEffect(
+    useCallback(() => {
+      handlerLoadList();
+    }, [])
+  );
+
+  const handlerLoadList = async () => {
+    try {
+      setLoadList(true);
+      const response = await apiMapsGetAll();
+
+      if (response.success) {
+        setList(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR]", error);
+    } finally {
+      setLoadList(false);
+    }
+  };
+
   return (
     <>
-      <ViewWrapper>
+      <ViewWrapper style={{ paddingInline: 0, paddingBlock: 0 }}>
-        <MapCustom height={"100%"} />
+        {/* <MapCustom height={"100%"} /> */}
+        <View style={{ flex: 1 }}>
+          {loadList ? (
+            <MapView
+              initialRegion={defaultRegion}
+              style={{
+                width: "100%",
+                height: "100%",
+              }}
+            />
+          ) : (
+            <MapView
+              initialRegion={defaultRegion}
+              style={{
+                width: "100%",
+                height: "100%",
+              }}
+            >
+              {list?.map((item: any, index: number) => {
+                return (
+                  <Marker
+                    key={item?.id}
+                    coordinate={{
+                      latitude: item?.latitude,
+                      longitude: item?.longitude,
+                    }}
+                    title={item?.namePin}
+                    onPress={() => {
+                      setOpenDrawer(true);
+                      setSelected({
+                        id: item?.id,
+                        bidangBisnis:
+                          item?.Portofolio?.MasterBidangBisnis?.name,
+                        nomorTelepon: item?.Portofolio?.tlpn,
+                        alamatBisnis: item?.Portofolio?.alamatKantor,
+                        namePin: item?.namePin,
+                        imageId: item?.imageId,
+                        portofolioId: item?.Portofolio?.id,
+                        latitude: item?.latitude,
+                        longitude: item?.longitude,
+                      });
+                    }}
+                    // Gunakan gambar kustom jika tersedia
+                  >
+                    <View>
+                      <Image
+                        source={{
+                          uri: API_IMAGE.GET({
+                            fileId: item?.Portofolio?.logoId,
+                          }),
+                        }}
+                        style={{
+                          width: 30,
+                          height: 30,
+                          borderRadius: 100,
+                          borderWidth: 1,
+                        }}
+                      />
+                    </View>
+                  </Marker>
+                );
+              })}
+            </MapView>
+          )}
+        </View>
       </ViewWrapper>
+
+      <DrawerCustom
+        isVisible={openDrawer}
+        closeDrawer={() => setOpenDrawer(false)}
+        height={"auto"}
+      >
+        <DummyLandscapeImage height={200} imageId={selected.imageId} />
+        <Spacing />
+        <StackCustom gap={"xs"}>
+          <GridTwoView
+            spanLeft={2}
+            spanRight={10}
+            leftIcon={
+              <FontAwesome
+                name="building-o"
+                size={ICON_SIZE_SMALL}
+                color="white"
+              />
+            }
+            rightIcon={<TextCustom>{selected.namePin}</TextCustom>}
+          />
+
+          <GridTwoView
+            spanLeft={2}
+            spanRight={10}
+            leftIcon={
+              <Ionicons
+                name="list-outline"
+                size={ICON_SIZE_SMALL}
+                color="white"
+              />
+            }
+            rightIcon={<TextCustom>{selected.bidangBisnis}</TextCustom>}
+          />
+
+          <GridTwoView
+            spanLeft={2}
+            spanRight={10}
+            leftIcon={
+              <Ionicons
+                name="call-outline"
+                size={ICON_SIZE_SMALL}
+                color="white"
+              />
+            }
+            rightIcon={<TextCustom>+{selected.nomorTelepon}</TextCustom>}
+          />
+          <GridTwoView
+            spanLeft={2}
+            spanRight={10}
+            leftIcon={
+              <Ionicons
+                name="location-outline"
+                size={ICON_SIZE_SMALL}
+                color="white"
+              />
+            }
+            rightIcon={<TextCustom>{selected.alamatBisnis}</TextCustom>}
+          />
+
+          <Grid>
+            <Grid.Col span={6} style={{ paddingRight: 10 }}>
+              <ButtonCustom
+                onPress={() => {
+                  setOpenDrawer(false);
+                  router.push(`/portofolio/${selected.portofolioId}`);
+                }}
+              >
+                Detail
+              </ButtonCustom>
+            </Grid.Col>
+            <Grid.Col span={6} style={{ paddingLeft: 10 }}>
+              <ButtonCustom
+                onPress={() => {
+                  openInDeviceMaps({
+                    latitude: selected.latitude,
+                    longitude: selected.longitude,
+                    title: selected.namePin,
+                  });
+                }}
+              >
+                Buka Maps
+              </ButtonCustom>
+            </Grid.Col>
+          </Grid>
+        </StackCustom>
+      </DrawerCustom>
     </>
   );
 }

screens/Admin/App-Information/BusinessFieldSection.tsx

@@ -1,29 +1,57 @@
 import {
   ActionIcon,
+  BadgeCustom,
+  CenterCustom,
   Grid,
+  LoaderCustom,
   StackCustom,
-  TextCustom
+  TextCustom,
 } from "@/components";
-import { MainColor } from "@/constants/color-palet";
+import { AccentColor } from "@/constants/color-palet";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
-import dummyMasterBidangBisnis from "@/lib/dummy-data/master-bidang-bisnis";
+import { apiAdminMasterBusinessField } from "@/service/api-admin/api-master-admin";
 import { FontAwesome5 } from "@expo/vector-icons";
-import { router } from "expo-router";
+import { router, useFocusEffect } from "expo-router";
-import { useState } from "react";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 import { View } from "react-native";
-import { Divider, Switch } from "react-native-paper";
+import { Divider } from "react-native-paper";
 
 export default function AdminAppInformation_BusinessFieldSection() {
-  const [value, setValue] = useState(false);
+  const [listData, setListData] = useState<any[] | null>(null);
-  const [selectedBusinessField, setSelectedBusinessField] = useState<any>(null);
+  const [loadData, setLoadData] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      onLoadList();
+    }, [])
+  );
+
+  const onLoadList = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminMasterBusinessField();
+
+
+      if (response.success) {
+        setListData(response.data);
+      }
+    } catch (error) {
+      console.log("[ERROR LIST BUSINESS FIELD]", error);
+      setListData([]);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
   return (
     <>
-      <>
+      <StackCustom>
         <Grid>
-          <Grid.Col span={3} style={{ alignItems: "center" }}>
+          <Grid.Col span={2} style={{ alignItems: "center" }}>
             <TextCustom bold>Aksi</TextCustom>
           </Grid.Col>
-          <Grid.Col span={3} style={{ alignItems: "center" }}>
+          <Grid.Col span={4} style={{ alignItems: "center" }}>
             <TextCustom bold>Status</TextCustom>
           </Grid.Col>
           <Grid.Col span={6}>
@@ -33,51 +61,54 @@ export default function AdminAppInformation_BusinessFieldSection() {
 
         <Divider />
 
-
+        {loadData ? (
-        <StackCustom>
+          <LoaderCustom />
-          {dummyMasterBidangBisnis.map((e, i) => (
+        ) : _.isEmpty(listData) ? (
-            <View key={i}>
+          <TextCustom align="center">Tidak ada data</TextCustom>
-              <Grid>
+        ) : (
-                <Grid.Col span={3} style={{ alignItems: "center" }}>
+          <StackCustom>
-                  <ActionIcon
+            {listData?.map((item: any, index: number) => (
-                    icon={
+              <View key={index}>
-                      <FontAwesome5
+                <Grid>
-                        name="edit"
+                  <Grid.Col span={2} style={{ alignItems: "center" }}>
-                        size={ICON_SIZE_BUTTON}
+                    <ActionIcon
-                        color="black"
+                      icon={
-                      />
+                        <FontAwesome5
-                    }
+                          name="edit"
-                    onPress={() => {
+                          size={ICON_SIZE_BUTTON}
-                      router.push(`/admin/app-information/business-field/${i}`);
+                          color="black"
-                    }}
+                        />
-                  />
+                      }
-                </Grid.Col>
+                      onPress={() => {
-                <Grid.Col
+                        router.push(
-                  span={3}
+                          `/admin/app-information/business-field/${item.id}`
-                  style={{ alignItems: "center", justifyContent: "center" }}
+                        );
-                >
+                      }}
-                  <Switch
+                    />
-                    value={i === selectedBusinessField}
+                  </Grid.Col>
-                    onValueChange={() => {
+                  <Grid.Col
-                      setValue(!value);
+                    span={4}
-                      setSelectedBusinessField(i);
+                    style={{ alignItems: "center", justifyContent: "center" }}
-                    }}
+                  >
-                    theme={{
+                    <CenterCustom>
-                      colors: {
+                      <BadgeCustom
-                        primary: MainColor.yellow,
+                        color={
-                      },
+                          item.active ? AccentColor.blue : AccentColor.blackgray
-                    }}
+                        }
-                  />
+                      >
-                </Grid.Col>
+                        {item.active ? "Aktif" : "Tidak Aktif"}
-                <Grid.Col span={6} style={{ justifyContent: "center" }}>
+                      </BadgeCustom>
-                  <TextCustom>{e.name}</TextCustom>
+                    </CenterCustom>
-                </Grid.Col>
+                  </Grid.Col>
-              </Grid>
+                  <Grid.Col span={6} style={{ justifyContent: "center" }}>
-              <Divider />
+                    <TextCustom>{item.name}</TextCustom>
-            </View>
+                  </Grid.Col>
-          ))}
+                </Grid>
-        </StackCustom>
+              </View>
-      </>
+            ))}
+          </StackCustom>
+        )}
+      </StackCustom>
     </>
   );
 }

screens/Admin/App-Information/InformationBankSection.tsx

@@ -1,77 +1,119 @@
-import { ActionIcon, Grid, StackCustom, TextCustom } from "@/components";
+import {
-import { MainColor } from "@/constants/color-palet";
+  ActionIcon,
+  BadgeCustom,
+  CenterCustom,
+  Grid,
+  LoaderCustom,
+  StackCustom,
+  TextCustom,
+} from "@/components";
+import { AccentColor } from "@/constants/color-palet";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
-import { dummyMasterBank } from "@/lib/dummy-data/_master/bank";
+import { apiAdminMasterBank } from "@/service/api-admin/api-master-admin";
 import { FontAwesome5 } from "@expo/vector-icons";
-import { router } from "expo-router";
+import { router, useFocusEffect } from "expo-router";
-import { useState } from "react";
+import _ from "lodash";
+import { useCallback, useState } from "react";
 import { View } from "react-native";
-import { Divider, Switch } from "react-native-paper";
+import { Divider } from "react-native-paper";
 
 export default function AdminAppInformation_Bank() {
-  const [value, setValue] = useState(false);
+  const [listData, setListData] = useState<any | null>(null);
+  const [loadData, setLoadData] = useState(false);
+
+  useFocusEffect(
+    useCallback(() => {
+      loadMasterBank();
+    }, [])
+  );
+
+  const loadMasterBank = async () => {
+    try {
+      setLoadData(true);
+      const response = await apiAdminMasterBank();
+
+      setListData(response.data);
+    } catch (error) {
+      console.log("[ERROR LIST BANK]", error);
+      setListData([]);
+    } finally {
+      setLoadData(false);
+    }
+  };
+
   return (
     <>
-      <>
+      <StackCustom>
         <Grid>
-          <Grid.Col span={3} style={{ alignItems: "center" }}>
+          <Grid.Col span={3}>
-            <TextCustom bold>Aksi</TextCustom>
+            <TextCustom bold align="center">
+              Aksi
+            </TextCustom>
           </Grid.Col>
-          <Grid.Col span={3} style={{ alignItems: "center" }}>
+          <Grid.Col span={3}>
-            <TextCustom bold>Status</TextCustom>
+            <TextCustom bold align="center">
+              Status
+            </TextCustom>
           </Grid.Col>
           <Grid.Col span={6}>
-            <TextCustom bold>Nama Bank</TextCustom>
+            <TextCustom bold align="center">
+              Nama Bank
+            </TextCustom>
           </Grid.Col>
         </Grid>
 
         <Divider />
 
-        <StackCustom>
+        {loadData ? (
-          {dummyMasterBank.map((e, i) => (
+          <LoaderCustom />
-            <View key={i}>
+        ) : _.isEmpty(listData) ? (
-              <Grid>
+          <TextCustom align="center">Tidak ada data</TextCustom>
-                <Grid.Col span={3} style={{ alignItems: "center" }}>
+        ) : (
-                  <ActionIcon
+          <StackCustom>
-                    icon={
+            {listData?.map((item: any, index: number) => (
-                      <FontAwesome5
+              <View key={index}>
-                        name="edit"
+                <Grid>
-                        size={ICON_SIZE_BUTTON}
+                  <Grid.Col span={3} style={{ alignItems: "center" }}>
-                        color="black"
+                    <ActionIcon
-                      />
+                      icon={
-                    }
+                        <FontAwesome5
-                    onPress={() => {
+                          name="edit"
-                      router.push(
+                          size={ICON_SIZE_BUTTON}
-                        `/admin/app-information/information-bank/${i}`
+                          color="black"
-                      );
+                        />
-                    }}
+                      }
-                  />
+                      onPress={() => {
-                </Grid.Col>
+                        router.push(
-                <Grid.Col
+                          `/admin/app-information/information-bank/${item.id}`
-                  span={3}
+                        );
-                  style={{ alignItems: "center", justifyContent: "center" }}
+                      }}
-                >
+                    />
-                  <Switch
+                  </Grid.Col>
-                    value={value}
+                  <Grid.Col
-                    onValueChange={() => {
+                    span={3}
-                      setValue(!value);
+                    style={{ alignItems: "center", justifyContent: "center" }}
-                    }}
+                  >
-                    theme={{
+                    <CenterCustom>
-                      colors: {
+                      <BadgeCustom
-                        primary: MainColor.yellow,
+                        color={
-                      },
+                          item.isActive
-                    }}
+                            ? AccentColor.blue
-                  />
+                            : AccentColor.blackgray
-                </Grid.Col>
+                        }
-                <Grid.Col span={6} style={{ justifyContent: "center" }}>
+                      >
-                  <TextCustom>{e.code}</TextCustom>
+                        {item.isActive ? "Aktif" : "Tidak Aktif"}
-                </Grid.Col>
+                      </BadgeCustom>
-              </Grid>
+                    </CenterCustom>
-              <Divider />
+                  </Grid.Col>
-            </View>
+                  <Grid.Col span={6} style={{ justifyContent: "center" }}>
-          ))}
+                    <TextCustom align="center">{item.namaBank}</TextCustom>
-        </StackCustom>
+                  </Grid.Col>
-      </>
+                </Grid>
+              </View>
+            ))}
+          </StackCustom>
+        )}
+      </StackCustom>
     </>
   );
 }

screens/Admin/App-Information/StickerSection.tsx

@@ -10,69 +10,77 @@ import { Divider, Switch } from "react-native-paper";
 
 export default function AdminAppInformation_StickerSection() {
   const [value, setValue] = useState(false);
+
   return (
     <>
-      <Grid>
+      <TextCustom bold align="center">
-        <Grid.Col span={3} style={{ alignItems: "center" }}>
+        Cooming Soon, Next Update !!
-          <TextCustom bold>Aksi</TextCustom>
+      </TextCustom>
-        </Grid.Col>
-        <Grid.Col span={3} style={{ alignItems: "center" }}>
-          <TextCustom bold>Status</TextCustom>
-        </Grid.Col>
-        <Grid.Col span={6}>
-          <TextCustom bold align="center" >Stiker</TextCustom>
-        </Grid.Col>
-      </Grid>
-
-      <Divider />
-
-      <StackCustom>
-        {listSticker.map((e, i) => (
-          <View key={i}>
-            <Grid>
-              <Grid.Col
-                span={3}
-                style={{ alignItems: "center", justifyContent: "center" }}
-              >
-                <ActionIcon
-                  icon={
-                    <FontAwesome5
-                      name="edit"
-                      size={ICON_SIZE_BUTTON}
-                      color="black"
-                    />
-                  }
-                  onPress={() => {
-                    router.push(`/admin/app-information/sticker/${i}`);
-                  }}
-                />
-              </Grid.Col>
-              <Grid.Col
-                span={3}
-                style={{ alignItems: "center", justifyContent: "center" }}
-              >
-                <Switch
-                  value={value}
-                  onValueChange={() => {
-                    setValue(!value);
-                  }}
-                  theme={{
-                    colors: {
-                      primary: MainColor.yellow,
-                    },
-                  }}
-                />
-              </Grid.Col>
-              <Grid.Col span={6} style={{ justifyContent: "center", alignItems: "center" }}>
-                <Image source={e.path} style={{ width: 100, height: 100 }} />
-              </Grid.Col>
-            </Grid>
-            <Divider />
-          </View>
-        ))}
-      </StackCustom>
     </>
   );
+  // return (
+  //   <>
+  //     <Grid>
+  //       <Grid.Col span={3} style={{ alignItems: "center" }}>
+  //         <TextCustom bold>Aksi</TextCustom>
+  //       </Grid.Col>
+  //       <Grid.Col span={3} style={{ alignItems: "center" }}>
+  //         <TextCustom bold>Status</TextCustom>
+  //       </Grid.Col>
+  //       <Grid.Col span={6}>
+  //         <TextCustom bold align="center" >Stiker</TextCustom>
+  //       </Grid.Col>
+  //     </Grid>
+
+  //     <Divider />
+
+  //     <StackCustom>
+  //       {listSticker.map((e, i) => (
+  //         <View key={i}>
+  //           <Grid>
+  //             <Grid.Col
+  //               span={3}
+  //               style={{ alignItems: "center", justifyContent: "center" }}
+  //             >
+  //               <ActionIcon
+  //                 icon={
+  //                   <FontAwesome5
+  //                     name="edit"
+  //                     size={ICON_SIZE_BUTTON}
+  //                     color="black"
+  //                   />
+  //                 }
+  //                 onPress={() => {
+  //                   router.push(`/admin/app-information/sticker/${i}`);
+  //                 }}
+  //               />
+  //             </Grid.Col>
+  //             <Grid.Col
+  //               span={3}
+  //               style={{ alignItems: "center", justifyContent: "center" }}
+  //             >
+  //               <Switch
+  //                 value={value}
+  //                 onValueChange={() => {
+  //                   setValue(!value);
+  //                 }}
+  //                 theme={{
+  //                   colors: {
+  //                     primary: MainColor.yellow,
+  //                   },
+  //                 }}
+  //               />
+  //             </Grid.Col>
+  //             <Grid.Col span={6} style={{ justifyContent: "center", alignItems: "center" }}>
+  //               <Image source={e.path} style={{ width: 100, height: 100 }} />
+  //             </Grid.Col>
+  //           </Grid>
+  //           <Divider />
+  //         </View>
+  //       ))}
+  //     </StackCustom>
+  //   </>
+  // );
 }
 
 const listSticker = [

screens/Authentication/LoginView.tsx

@@ -93,15 +93,15 @@ export default function LoginView() {
     }
   }
 
-  if (token && !isUserActive) {
+  if (token && token !== "" && !isUserActive) {
     return <Redirect href={"/(application)/(user)/waiting-room"} />;
   }
 
-  if (token && !isAdmin) {
+  if (token && token !== "" && !isAdmin) {
     return <Redirect href={"/(application)/(user)/home"} />;
   }
 
-  if (token && isAdmin) {
+  if (token && token !== "" && isAdmin) {
     return <Redirect href={"/(application)/admin/dashboard"} />;
   }
 

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

@@ -0,0 +1,102 @@
+import { apiConfig } from "../api-config";
+
+// ================== START MASTER BANK ================== //
+export async function apiAdminMasterBank() {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/master/bank`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterBankById({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/master/bank/${id}`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterBankUpdate({
+  id,
+  data,
+}: {
+  id: string;
+  data: any;
+}) {
+  try {
+    const response = await apiConfig.put(`/mobile/admin/master/bank/${id}`, {
+      data: data,
+    });
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterBankCreate({ data }: { data: any }) {
+  try {
+    const response = await apiConfig.post(`/mobile/admin/master/bank`, {
+      data: data,
+    });
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+// ================== END MASTER BANK ================== //
+
+// ================== START BUSINNES FIELD ================== //
+
+export async function apiAdminMasterBusinessField() {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/master/business-field`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterBusinessFieldById({ id }: { id: string }) {
+  try {
+    const response = await apiConfig.get(`/mobile/admin/master/business-field/${id}`);
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+export async function apiAdminMasterBusinessFieldUpdate({
+  id,
+  data,
+}: {
+  id: string;
+  data: any;
+}) {
+  try {
+    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 }) {
+  try {
+    const response = await apiConfig.post(`/mobile/admin/master/business-field`, {
+      data: data,
+    });
+    return response.data;
+  } catch (error) {
+    throw error;
+  }
+}
+
+
+
+// ================== END BUSINNES FIELD ================== //

service/api-client/api-master.ts

@@ -127,6 +127,10 @@ export async function apiMasterInvestment({
   }
 }
 
+// ================== END MASTER INVESTMENT ================== //
+
+// ================== START MASTER BANK ================== //
+
 export async function apiMasterBank() {
   try {
     const response = await apiConfig.get(`/mobile/master/bank`);
@@ -136,6 +140,8 @@ export async function apiMasterBank() {
   }
 }
 
+// ================== END MASTER BANK ================== //
+
 export async function apiMasterDonation({
   category,
 }: {