Assets

Add:
- assets/images/logo.png
- assets/images/old-icon.png

### No Issue : Icon pada spalash android masih ada border shadow nya

app.json

@@ -4,7 +4,7 @@
     "slug": "hipmi-mobile",
     "version": "1.0.0",
     "orientation": "portrait",
-    "icon": "./assets/images/logo-hipmi.png",
+    "icon": "./assets/images/icon.png",
     "scheme": "hipmimobile",
     "userInterfaceStyle": "automatic",
     "newArchEnabled": true,

app/(application)/admin/_layout.tsx

@@ -51,9 +51,6 @@ export default function AdminLayout() {
         <Stack.Screen name="dashboard" />
         {/* ================== Investment Start ================== */}
         <Stack.Screen name="investment/index" />
-        <Stack.Screen name="investment/publish" />
-        <Stack.Screen name="investment/review" />
-        <Stack.Screen name="investment/reject" />
         {/* ================== Investment End ================== */}
 
         {/* ================== Maps Start ================== */}

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

@@ -0,0 +1,259 @@
+import {
+  ActionIcon,
+  AlertDefaultSystem,
+  BadgeCustom,
+  BaseBox,
+  ButtonCustom,
+  DrawerCustom,
+  DummyLandscapeImage,
+  MenuDrawerDynamicGrid,
+  ProgressCustom,
+  Spacing,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { IconDot, IconList } from "@/components/_Icon/IconComponent";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
+import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
+import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import { MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_BUTTON, TEXT_SIZE_LARGE } from "@/constants/constans-value";
+import AdminDonation_BoxOfDonationStory from "@/screens/Admin/Donation/BoxOfDonationStory";
+import { Ionicons } from "@expo/vector-icons";
+import { router, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import React from "react";
+import { View } from "react-native";
+
+export default function AdminDonationDetail() {
+  const { id, status } = useLocalSearchParams();
+  const [openDrawer, setOpenDrawer] = React.useState(false);
+
+  const colorBadge = () => {
+    if (status === "publish") {
+      return MainColor.green;
+    } else if (status === "review") {
+      return MainColor.orange;
+    } else if (status === "reject") {
+      return MainColor.red;
+    } else {
+      return MainColor.placeholder;
+    }
+  };
+
+  const listData = [
+    {
+      label: "Penggalang Dana",
+      value: `Bagas Banuna ${id}`,
+    },
+    {
+      label: "Judul",
+      value: `Donasi Lorem ipsum dolor sit amet, consectetur adipisicing elit.`,
+    },
+    {
+      label: "Status",
+      value: (
+        <BadgeCustom color={colorBadge()}>
+          {_.startCase(status as string)}
+        </BadgeCustom>
+      ),
+    },
+    {
+      label: "Durasi",
+      value: "30 Hari",
+    },
+    {
+      label: "Target Dana",
+      value: "Rp 10.000.000",
+    },
+    {
+      label: "Kategori",
+      value: "Kategori Donasi",
+    },
+    // {
+    //   label: "Total Donatur",
+    //   value: "-",
+    // },
+    // {
+    //   label: "Progress",
+    //   value: "0 %",
+    // },
+    // {
+    //   label: "Dana Terkumpul",
+    //   value: "Rp 0",
+    // },
+  ];
+
+  const listPencarianDana = [
+    {
+      label: "Total Dana Dicairkan",
+      value: "Rp 0",
+    },
+    {
+      label: "Sisa Dana",
+      value: "Rp 0",
+    },
+    {
+      label: "Akumulasi Pencairan",
+      value: "0 kali",
+    },
+    {
+      label: "Bank Tujuan",
+      value: "BNI",
+    },
+    {
+      label: "Nomor Rekening",
+      value: "123456789",
+    },
+  ];
+
+  const rightComponent = (
+    <ActionIcon
+      icon={<IconDot size={ICON_SIZE_BUTTON} />}
+      onPress={() => {
+        setOpenDrawer(true);
+      }}
+    />
+  );
+
+
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle
+            title={`Detail Data`}
+            rightComponent={status === "publish" && rightComponent}
+          />
+        }
+      >
+        {status === "publish" && (
+          <View>
+            <BaseBox>
+              <StackCustom>
+                <TextCustom bold align="center" size={TEXT_SIZE_LARGE}>
+                  Pencarian Dana
+                </TextCustom>
+
+                <StackCustom gap={5}>
+                  {listPencarianDana.map((item, i) => (
+                    <GridDetail_4_8
+                      key={i}
+                      label={<TextCustom bold>{item.label}</TextCustom>}
+                      value={<TextCustom>{item.value}</TextCustom>}
+                    />
+                  ))}
+                </StackCustom>
+                <ButtonCustom
+                  iconLeft={
+                    <Ionicons name="cash-outline" size={ICON_SIZE_BUTTON} />
+                  }
+                  onPress={() => {
+                    router.push(`/admin/donation/${id}/disbursement-of-funds`);
+                  }}
+                >
+                  Cairkan Dana
+                </ButtonCustom>
+              </StackCustom>
+            </BaseBox>
+
+            <BaseBox>
+              <ProgressCustom size="lg" />
+              <Spacing />
+              <StackCustom gap={"xs"}>
+                <GridDetail_4_8
+                  label={<TextCustom bold>Jumlah Donatur</TextCustom>}
+                  value={<TextCustom>0 orang</TextCustom>}
+                />
+                <GridDetail_4_8
+                  label={<TextCustom bold>Dana Terkumpul</TextCustom>}
+                  value={<TextCustom>Rp 0</TextCustom>}
+                />
+              </StackCustom>
+            </BaseBox>
+          </View>
+        )}
+
+        <BaseBox>
+          <StackCustom>
+            <DummyLandscapeImage />
+            {listData.map((item, i) => (
+              <GridDetail_4_8
+                key={i}
+                label={<TextCustom bold>{item.label}</TextCustom>}
+                value={<TextCustom>{item.value}</TextCustom>}
+              />
+            ))}
+          </StackCustom>
+        </BaseBox>
+
+        {status === "review" && (
+          <StackCustom>
+            <AdminDonation_BoxOfDonationStory />
+
+            <AdminButtonReview
+              onPublish={() => {
+                AlertDefaultSystem({
+                  title: "Publish",
+                  message: "Apakah anda yakin ingin mempublikasikan data ini?",
+                  textLeft: "Batal",
+                  textRight: "Ya",
+                  onPressLeft: () => {
+                    router.back();
+                  },
+                  onPressRight: () => {
+                    router.back();
+                  },
+                });
+              }}
+              onReject={() => {
+                router.push(`/admin/donation/${id}/reject-input`);
+              }}
+            />
+          </StackCustom>
+        )}
+
+        {status === "reject" && (
+          <StackCustom>
+            <AdminDonation_BoxOfDonationStory />
+
+            <AdminButtonReject
+              title="Tambah Catatan"
+              onReject={() => {
+                router.push(`/admin/donation/${id}/reject-input`);
+              }}
+            />
+          </StackCustom>
+        )}
+      </ViewWrapper>
+
+      <DrawerCustom
+        isVisible={openDrawer}
+        closeDrawer={() => setOpenDrawer(false)}
+        height={"auto"}
+      >
+        <MenuDrawerDynamicGrid
+          data={[
+            {
+              label: "Daftar Donatur",
+              icon: <IconList />,
+              path: `/admin/donation/${id}/list-of-donatur`,
+            },
+            {
+              label: "Daftar Pencarian Dana",
+              icon: <IconList />,
+              path: `/admin/donation/${id}/list-disbursement-of-funds`,
+            },
+          ]}
+          onPressItem={(item) => {
+            setOpenDrawer(false);
+            router.push(item.path as any);
+          }}
+        />
+      </DrawerCustom>
+    </>
+  );
+}

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

@@ -0,0 +1,80 @@
+import {
+  BadgeCustom,
+  BaseBox,
+  BoxButtonOnFooter,
+  ButtonCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import { MainColor } from "@/constants/color-palet";
+import dayjs from "dayjs";
+import { router, useLocalSearchParams } from "expo-router";
+
+export default function AdminDonasiTransactionDetail() {
+  const { id } = useLocalSearchParams();
+
+  const buttonAction = (
+    <BoxButtonOnFooter>
+      <ButtonCustom onPress={() => router.back()}>Terima</ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+
+  const listData = [
+    {
+      label: "Donatur",
+      value: "Bagas Banuna",
+    },
+    {
+      label: "Bank",
+      value: "BCA",
+    },
+    {
+      label: "Jumlah Donasi",
+      value: "Rp. 1.000.000",
+    },
+    {
+      label: "Status",
+      value: <BadgeCustom color={MainColor.green}>Berhasil</BadgeCustom>,
+    },
+    {
+      label: "Tanggal",
+      value: dayjs().format("DD-MM-YYYY HH:mm:ss"),
+    },
+    {
+      label: "Bukti Transfer",
+      value: (
+        <ButtonCustom
+          onPress={() =>
+            router.push(`/(application)/(image)/preview-image/${id}`)
+          }
+        >
+          Cek
+        </ButtonCustom>
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title="Detail Transaksi" />}
+        footerComponent={buttonAction}
+      >
+        <BaseBox>
+          <StackCustom>
+            {listData.map((item, index) => (
+              <GridDetail_4_8
+                key={index}
+                label={<TextCustom bold>{item.label}</TextCustom>}
+                value={<TextCustom>{item.value}</TextCustom>}
+              />
+            ))}
+          </StackCustom>
+        </BaseBox>
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/donation/[id]/detail-disbursement-of-funds.tsx

@@ -0,0 +1,62 @@
+import {
+  BaseBox,
+  ButtonCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import dayjs from "dayjs";
+import { router, useLocalSearchParams } from "expo-router";
+
+export default function AdminDonationDetailDisbursementOfFunds() {
+  const { id } = useLocalSearchParams();
+  const listData = [
+    {
+      label: "Nominal",
+      value: "Rp 1.000.000",
+    },
+    {
+      label: "Tanggal",
+      value: dayjs().format("DD-MM-YYYY HH:mm"),
+    },
+    {
+      label: "Judul",
+      value: `Judul Pencairan Dana ${id}`,
+    },
+    {
+      label: "Deskripsi",
+      value: `Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque velit eos facere a dicta nemo repellendus harum laboriosam quos, earum reprehenderit. Nisi sapiente, quo earum quis alias ullam temporibus quidem.`,
+    },
+  ];
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle title="Detail Pencairan Dana" />
+        }
+      >
+        <BaseBox>
+          <StackCustom>
+            {listData.map((item, index) => (
+              <GridDetail_4_8
+                key={index}
+                label={<TextCustom bold>{item.label}</TextCustom>}
+                value={<TextCustom>{item.value}</TextCustom>}
+              />
+            ))}
+          </StackCustom>
+        </BaseBox>
+
+        <ButtonCustom
+          onPress={() =>
+            router.push(`/(application)/(image)/preview-image/${id}`)
+          }
+        >
+          Cek Bukti Transaksi
+        </ButtonCustom>
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/donation/[id]/disbursement-of-funds.tsx

@@ -0,0 +1,85 @@
+import {
+  BaseBox,
+  BoxButtonOnFooter,
+  ButtonCenteredOnly,
+  ButtonCustom,
+  InformationBox,
+  Spacing,
+  StackCustom,
+  TextAreaCustom,
+  TextCustom,
+  TextInputCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { router, useLocalSearchParams } from "expo-router";
+
+export default function AdminDonationDisbursementOfFunds() {
+  const { id } = useLocalSearchParams();
+  const handleSubmit = (
+    <BoxButtonOnFooter>
+      <ButtonCustom
+        onPress={() => {
+          router.back();
+        }}
+      >
+        Simpan
+      </ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <ViewWrapper
+      headerComponent={<AdminBackButtonAntTitle title="Pencairan Dana" />}
+      footerComponent={handleSubmit}
+    >
+      <BaseBox>
+        <StackCustom gap="md">
+          <TextCustom align="center" bold size="large">
+            Dana Tersisa
+          </TextCustom>
+          <TextCustom align="center" bold size="large">
+            Rp 1.000.000
+          </TextCustom>
+        </StackCustom>
+      </BaseBox>
+
+      <BaseBox>
+        <TextCustom bold size="large" align="center">
+          Form Pencairan Dana
+        </TextCustom>
+        <Spacing />
+        <StackCustom gap={"xs"}>
+          <TextInputCustom
+            required
+            keyboardType="numeric"
+            label="Nominal"
+            placeholder="0"
+            iconLeft={"Rp"}
+          />
+
+          <TextInputCustom required label="Judul" placeholder="Masukan judul" />
+
+          <TextAreaCustom
+            required
+            label="Deskripsi"
+            placeholder="Masukan deskripsi"
+            showCount
+            maxLength={500}
+          />
+        </StackCustom>
+      </BaseBox>
+      <InformationBox text="Wajib menyertakan bukti transfer" />
+
+      <ButtonCenteredOnly
+        onPress={() => {
+          router.push(`/(application)/(image)/take-picture/${id}`);
+        }}
+        icon="upload"
+      >
+        Upload
+      </ButtonCenteredOnly>
+      <Spacing />
+    </ViewWrapper>
+  );
+}

app/(application)/admin/donation/[id]/list-disbursement-of-funds.tsx

@@ -0,0 +1,82 @@
+import {
+    ActionIcon,
+    CenterCustom,
+    Divider,
+    StackCustom,
+    TextCustom,
+    ViewWrapper
+} from "@/components";
+import { IconView } from "@/components/_Icon/IconComponent";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridViewCustomSpan } from "@/components/_ShareComponent/GridViewCustomSpan";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import dayjs from "dayjs";
+import { router, useLocalSearchParams } from "expo-router";
+import { View } from "react-native";
+
+export default function AdminDonasiListOfDisbursementOfFunds() {
+  const { id } = useLocalSearchParams();
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle title="Daftar Pencairan Dana" />
+        }
+      >
+        <GridViewCustomSpan
+          span1={3}
+          span2={5}
+          span3={4}
+          component1={
+            <TextCustom bold align="center">
+              Aksi
+            </TextCustom>
+          }
+          component2={
+            <TextCustom bold align="center">
+              Tanggal
+            </TextCustom>
+          }
+          component3={
+            <TextCustom bold align="center">
+              Nominal
+            </TextCustom>
+          }
+        />
+        <Divider />
+        <StackCustom>
+          {Array.from({ length: 10 }).map((_, index) => (
+            <View key={index}>
+              <GridViewCustomSpan
+                span1={3}
+                span2={5}
+                span3={4}
+                component1={
+                  <CenterCustom>
+                    <ActionIcon
+                      icon={<IconView size={ICON_SIZE_BUTTON} color="black" />}
+                      onPress={() => {
+                        router.push(
+                          `/admin/donation/${id}/detail-disbursement-of-funds`
+                        );
+                      }}
+                    />
+                  </CenterCustom>
+                }
+                component2={
+                  <TextCustom bold align="center" truncate>
+                    {dayjs()
+                      .add(index + 1, "day")
+                      .format("DD-MM-YYYY HH:mm")}
+                  </TextCustom>
+                }
+                component3={<TextCustom>Rp. 1.000.000</TextCustom>}
+              />
+              <Divider />
+            </View>
+          ))}
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/donation/[id]/list-of-donatur.tsx

@@ -0,0 +1,101 @@
+import {
+  ActionIcon,
+  BadgeCustom,
+  CenterCustom,
+  SelectCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { IconView } from "@/components/_Icon/IconComponent";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridViewCustomSpan } from "@/components/_ShareComponent/GridViewCustomSpan";
+import { MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { dummyMasterStatusTransaction } from "@/lib/dummy-data/_master/status-transaction";
+import { router, useLocalSearchParams } from "expo-router";
+import React from "react";
+import { View } from "react-native";
+import { Divider } from "react-native-paper";
+
+export default function AdminDonasiListOfDonatur() {
+  const { id } = useLocalSearchParams();
+  const searchComponent = (
+    <View style={{ flexDirection: "row", gap: 5 }}>
+      <SelectCustom
+        placeholder="Pilih status transaksi"
+        data={dummyMasterStatusTransaction}
+        onChange={(value) => console.log(value)}
+        styleContainer={{ width: "100%", marginBottom: 0 }}
+      />
+    </View>
+  );
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle newComponent={searchComponent} />
+        }
+      >
+        <GridViewCustomSpan
+          span1={3}
+          span2={5}
+          span3={4}
+          component1={
+            <TextCustom bold align="center">
+              Aksi
+            </TextCustom>
+          }
+          component2={
+            <TextCustom bold align="center">
+              Donatur
+            </TextCustom>
+          }
+          component3={
+            <TextCustom bold align="center">
+              Status
+            </TextCustom>
+          }
+        />
+        <Divider />
+        <StackCustom>
+          {Array.from({ length: 10 }).map((_, index) => (
+            <View key={index}>
+              <GridViewCustomSpan
+                span1={3}
+                span2={5}
+                span3={4}
+                component1={
+                  <CenterCustom>
+                    <ActionIcon
+                      icon={<IconView size={ICON_SIZE_BUTTON} color="black" />}
+                      onPress={() => {
+                        router.push(
+                          `/admin/donation/${id}/berhasil/transaction-detail`
+                        );
+                      }}
+                    />
+                  </CenterCustom>
+                }
+                component2={
+                  <TextCustom bold align="center" truncate>
+                    Bagas Banuna
+                  </TextCustom>
+                }
+                component3={
+                  <BadgeCustom
+                    style={{ alignSelf: "center" }}
+                    color={MainColor.green}
+                  >
+                    Berhasil
+                  </BadgeCustom>
+                }
+              />
+              <Divider />
+            </View>
+          ))}
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}

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

@@ -0,0 +1,55 @@
+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 AdminDonationRejectInput() {
+  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/donation/reject/status`);
+            },
+          })
+        }
+      />
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        footerComponent={buttonSubmit}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Donasi" />}
+      >
+        <TextAreaCustom
+          value={value}
+          onChangeText={setValue}
+          placeholder="Masukan alasan"
+          required
+          showCount
+          maxLength={1000}
+        />
+      </ViewWrapper>
+    </>
+  );
+}

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

@@ -1,18 +1,16 @@
 import {
     ActionIcon,
-    BaseBox,
     SearchInput,
     Spacing,
     TextCustom,
-    ViewWrapper,
+    ViewWrapper
 } from "@/components";
 import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
 import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
 import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
-import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
 import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
 import { Octicons } from "@expo/vector-icons";
-import { useLocalSearchParams } from "expo-router";
+import { router, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
 import { Divider } from "react-native-paper";
 
@@ -26,50 +24,46 @@ export default function AdminDonationStatus() {
   );
   return (
     <>
-      <ViewWrapper headerComponent={<AdminTitlePage title="Donasi" />}>
+      <ViewWrapper
-        <AdminComp_BoxTitle
+        headerComponent={
-          title={`${_.startCase(status as string)}`}
+          <AdminComp_BoxTitle
-          rightComponent={rightComponent}
+            title={`Donasi ${_.startCase(status as string)}`}
-        />
+            rightComponent={rightComponent}
-
-        <BaseBox>
-          <AdminTitleTable
-            title1="Aksi"
-            title2="Username"
-            title3="Judul Donasi"
           />
-          <Spacing />
+        }
-          <Divider />
+      >
+        <AdminTitleTable
+          title1="Aksi"
+          title2="Username"
+          title3="Judul Donasi"
+        />
+        <Spacing />
+        <Divider />
 
-          {Array.from({ length: 10 }).map((_, index) => (
+        {Array.from({ length: 10 }).map((_, index) => (
-            <AdminTableValue
+          <AdminTableValue
-              key={index}
+            key={index}
-              value1={
+            value1={
-                <ActionIcon
+              <ActionIcon
-                  icon={
+                icon={
-                    <Octicons
+                  <Octicons name="eye" size={ICON_SIZE_BUTTON} color="black" />
-                      name="eye"
+                }
-                      size={ICON_SIZE_BUTTON}
+                onPress={() => {
-                      color="black"
+                  router.push(`/admin/donation/${index}/${status}`);
-                    />
+                }}
-                  }
+              />
-                  onPress={() => {
+            }
-                    // router.push(`/admin/donation/${index}/${status}`);
+            value2={<TextCustom truncate={1}>Username username</TextCustom>}
-                  }}
+            value3={
-                />
+              <TextCustom truncate={2}>
-              }
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
-              value2={<TextCustom truncate={1}>Username username</TextCustom>}
+                Blanditiis asperiores quidem deleniti architecto eaque et
-              value3={
+                nostrum, ad consequuntur eveniet quisquam quae voluptatum
-                <TextCustom truncate={2}>
+                ducimus! Dolorem nobis modi officia debitis, beatae mollitia.
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
+              </TextCustom>
-                  Blanditiis asperiores quidem deleniti architecto eaque et
+            }
-                  nostrum, ad consequuntur eveniet quisquam quae voluptatum
+          />
-                  ducimus! Dolorem nobis modi officia debitis, beatae mollitia.
+        ))}
-                </TextCustom>
-              }
-            />
-          ))}
-        </BaseBox>
       </ViewWrapper>
     </>
   );

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

@@ -39,7 +39,7 @@ export default function AdminEventRejectInput() {
     <>
       <ViewWrapper
         footerComponent={buttonSubmit}
-        headerComponent={<AdminBackButtonAntTitle title="Masukan Alasan" />}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Event" />}
       >
         <TextAreaCustom
           value={value}

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

@@ -0,0 +1,244 @@
+import {
+  ActionIcon,
+  AlertDefaultSystem,
+  BadgeCustom,
+  BaseBox,
+  ButtonCustom,
+  DrawerCustom,
+  DummyLandscapeImage,
+  MenuDrawerDynamicGrid,
+  ProgressCustom,
+  Spacing,
+  StackCustom,
+  TextCustom,
+  ViewWrapper
+} from "@/components";
+import { IconProspectus } from "@/components/_Icon";
+import { IconDot, IconList } from "@/components/_Icon/IconComponent";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
+import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
+import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import { MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { router, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import React from "react";
+
+export default function AdminInvestmentDetail() {
+  const { id, status } = useLocalSearchParams();
+  const [openDrawer, setOpenDrawer] = React.useState(false);
+
+  const colorBadge = () => {
+    if (status === "publish") {
+      return MainColor.green;
+    } else if (status === "review") {
+      return MainColor.orange;
+    } else if (status === "reject") {
+      return MainColor.red;
+    } else {
+      return MainColor.placeholder;
+    }
+  };
+
+  const listData = [
+    {
+      label: "Username",
+      value: `Bagas Banuna ${id}`,
+    },
+    {
+      label: "Judul",
+      value: `Donasi Lorem ipsum dolor sit amet, consectetur adipisicing elit.`,
+    },
+    {
+      label: "Status",
+      value: (
+        <BadgeCustom color={colorBadge()}>
+          {_.startCase(status as string)}
+        </BadgeCustom>
+      ),
+    },
+    {
+      label: "Dana Dibutuhkan",
+      value: "Rp 10.000.000",
+    },
+    {
+      label: "Harga Perlembar",
+      value: "Rp 2500",
+    },
+    {
+      label: "Total Lembar",
+      value: "2490 lembar",
+    },
+    {
+      label: "ROI",
+      value: "4 %",
+    },
+    {
+      label: "Pembagian Deviden",
+      value: "3 bulan",
+    },
+    {
+      label: "Jadwal Pembagian",
+      value: "Selamanya",
+    },
+    {
+      label: "Pencarian Investor",
+      value: "30 Hari",
+    },
+  ];
+
+  const rightComponent = (
+    <ActionIcon
+      icon={<IconDot size={ICON_SIZE_BUTTON} />}
+      onPress={() => {
+        setOpenDrawer(true);
+      }}
+    />
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle
+            title={`Detail Data`}
+            rightComponent={status === "publish" && rightComponent}
+          />
+        }
+      >
+        {status === "publish" && (
+          <BaseBox>
+            <ProgressCustom size="lg" />
+            <Spacing />
+            <StackCustom gap={"xs"}>
+              <GridDetail_4_8
+                label={<TextCustom bold>Sisa Saham</TextCustom>}
+                value={<TextCustom>2490 lembar</TextCustom>}
+              />
+              <GridDetail_4_8
+                label={<TextCustom bold>Validasi Transaksi</TextCustom>}
+                value={<TextCustom>4 Transaksi</TextCustom>}
+              />
+            </StackCustom>
+          </BaseBox>
+        )}
+
+        <BaseBox>
+          <StackCustom>
+            <DummyLandscapeImage />
+            {listData.map((item, i) => (
+              <GridDetail_4_8
+                key={i}
+                label={<TextCustom bold>{item.label}</TextCustom>}
+                value={<TextCustom>{item.value}</TextCustom>}
+              />
+            ))}
+          </StackCustom>
+        </BaseBox>
+
+        <BaseBox>
+          <StackCustom>
+            <GridDetail_4_8
+              label={<TextCustom bold>File Prospektus</TextCustom>}
+              value={
+                <ButtonCustom
+                  iconLeft={
+                    <IconProspectus
+                      size={ICON_SIZE_BUTTON}
+                      color={MainColor.darkblue}
+                    />
+                  }
+                  onPress={() => {
+                    router.push(`/(application)/(file)/${id}`);
+                  }}
+                >
+                  Preview
+                </ButtonCustom>
+              }
+            />
+            <GridDetail_4_8
+              label={<TextCustom bold>File Dokumen</TextCustom>}
+              value={
+                <StackCustom>
+                  {Array.from({ length: 5 }).map((_, i) => (
+                    <ButtonCustom
+                      key={i}
+                      iconLeft={
+                        <IconProspectus
+                          size={ICON_SIZE_BUTTON}
+                          color={MainColor.darkblue}
+                        />
+                      }
+                      onPress={() => {
+                        router.push(`/(application)/(file)/${id}`);
+                      }}
+                    >
+                      Dokumen {i + 1}
+                    </ButtonCustom>
+                  ))}
+                </StackCustom>
+              }
+            />
+          </StackCustom>
+        </BaseBox>
+
+        {status === "review" && (
+          <AdminButtonReview
+            onPublish={() => {
+              AlertDefaultSystem({
+                title: "Publish",
+                message: "Apakah anda yakin ingin mempublikasikan data ini?",
+                textLeft: "Batal",
+                textRight: "Ya",
+                onPressLeft: () => {
+                  router.back();
+                },
+                onPressRight: () => {
+                  router.back();
+                },
+              });
+            }}
+            onReject={() => {
+              router.push(`/admin/investment/${id}/reject-input`);
+            }}
+          />
+        )}
+
+        {status === "reject" && (
+          <AdminButtonReject
+            title="Tambah Catatan"
+            onReject={() => {
+              router.push(`/admin/investment/${id}/reject-input`);
+            }}
+          />
+        )}
+      </ViewWrapper>
+
+      <DrawerCustom
+        isVisible={openDrawer}
+        closeDrawer={() => setOpenDrawer(false)}
+        height={"auto"}
+      >
+        <MenuDrawerDynamicGrid
+          data={[
+            {
+              label: "Daftar Investor",
+              icon: <IconList />,
+              path: `/admin/investment/${id}/list-of-investor`,
+            },
+            // {
+            //   label: "Daftar Pencarian Dana",
+            //   icon: <IconList />,
+            //   path: `/admin/donation/${id}/list-disbursement-of-funds`,
+            // },
+          ]}
+          onPressItem={(item) => {
+            setOpenDrawer(false);
+            router.push(item.path as any);
+          }}
+        />
+      </DrawerCustom>
+    </>
+  );
+}

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

@@ -0,0 +1,80 @@
+import {
+  BadgeCustom,
+  BaseBox,
+  BoxButtonOnFooter,
+  ButtonCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
+import { MainColor } from "@/constants/color-palet";
+import dayjs from "dayjs";
+import { router, useLocalSearchParams } from "expo-router";
+
+export default function AdminInvestmentTransactionDetail() {
+  const { id } = useLocalSearchParams();
+
+  const buttonAction = (
+    <BoxButtonOnFooter>
+      <ButtonCustom onPress={() => router.back()}>Terima</ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+
+  const listData = [
+    {
+      label: "Investor",
+      value: "Bagas Banuna",
+    },
+    {
+      label: "Bank",
+      value: "BCA",
+    },
+    {
+      label: "Jumlah Investasi",
+      value: "Rp. 1.000.000",
+    },
+    {
+      label: "Status",
+      value: <BadgeCustom color={MainColor.green}>Berhasil</BadgeCustom>,
+    },
+    {
+      label: "Tanggal",
+      value: dayjs().format("DD-MM-YYYY HH:mm:ss"),
+    },
+    {
+      label: "Bukti Transfer",
+      value: (
+        <ButtonCustom
+          onPress={() =>
+            router.push(`/(application)/(image)/preview-image/${id}`)
+          }
+        >
+          Cek
+        </ButtonCustom>
+      ),
+    },
+  ];
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title="Detail Transaksi Investor" />}
+        footerComponent={buttonAction}
+      >
+        <BaseBox>
+          <StackCustom>
+            {listData.map((item, index) => (
+              <GridDetail_4_8
+                key={index}
+                label={<TextCustom bold>{item.label}</TextCustom>}
+                value={<TextCustom>{item.value}</TextCustom>}
+              />
+            ))}
+          </StackCustom>
+        </BaseBox>
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/investment/[id]/list-of-investor.tsx

@@ -0,0 +1,107 @@
+import {
+  ActionIcon,
+  BadgeCustom,
+  CenterCustom,
+  SelectCustom,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import { IconView } from "@/components/_Icon/IconComponent";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { GridViewCustomSpan } from "@/components/_ShareComponent/GridViewCustomSpan";
+import { MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { dummyMasterStatusTransaction } from "@/lib/dummy-data/_master/status-transaction";
+import { router, useLocalSearchParams } from "expo-router";
+import React from "react";
+import { View } from "react-native";
+import { Divider } from "react-native-paper";
+
+export default function AdminInvestmentListOfInvestor() {
+  const { id } = useLocalSearchParams();
+  const searchComponent = (
+    <View style={{ flexDirection: "row", gap: 5 }}>
+      <SelectCustom
+        placeholder="Pilih status transaksi"
+        data={dummyMasterStatusTransaction}
+        onChange={(value) => console.log(value)}
+        styleContainer={{ width: "100%", marginBottom: 0 }}
+      />
+    </View>
+  );
+
+  const headerComponent = (
+    <StackCustom gap={"xs"}>
+      <AdminBackButtonAntTitle title="Daftar Investor" />
+      {searchComponent}
+    </StackCustom>
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={headerComponent}
+      >
+        <GridViewCustomSpan
+          span1={3}
+          span2={5}
+          span3={4}
+          component1={
+            <TextCustom bold align="center">
+              Aksi
+            </TextCustom>
+          }
+          component2={
+            <TextCustom bold align="center">
+              Investor
+            </TextCustom>
+          }
+          component3={
+            <TextCustom bold align="center">
+              Status
+            </TextCustom>
+          }
+        />
+        <Divider />
+        <StackCustom>
+          {Array.from({ length: 10 }).map((_, index) => (
+            <View key={index}>
+              <GridViewCustomSpan
+                span1={3}
+                span2={5}
+                span3={4}
+                component1={
+                  <CenterCustom>
+                    <ActionIcon
+                      icon={<IconView size={ICON_SIZE_BUTTON} color="black" />}
+                      onPress={() => {
+                        router.push(
+                          `/admin/investment/${id}/berhasil/transaction-detail`
+                        );
+                      }}
+                    />
+                  </CenterCustom>
+                }
+                component2={
+                  <TextCustom bold align="center" truncate>
+                    Bagas Banuna
+                  </TextCustom>
+                }
+                component3={
+                  <BadgeCustom
+                    style={{ alignSelf: "center" }}
+                    color={MainColor.green}
+                  >
+                    Berhasil
+                  </BadgeCustom>
+                }
+              />
+              <Divider />
+            </View>
+          ))}
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}

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

@@ -0,0 +1,55 @@
+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 AdminInvestmentRejectInput() {
+  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/investment/reject/status`);
+            },
+          })
+        }
+      />
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        footerComponent={buttonSubmit}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Investasi" />}
+      >
+        <TextAreaCustom
+          value={value}
+          onChangeText={setValue}
+          placeholder="Masukan alasan"
+          required
+          showCount
+          maxLength={1000}
+        />
+      </ViewWrapper>
+    </>
+  );
+}

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

@@ -0,0 +1,70 @@
+import {
+    ActionIcon,
+    SearchInput,
+    Spacing,
+    TextCustom,
+    ViewWrapper
+} from "@/components";
+import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
+import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
+import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { Octicons } from "@expo/vector-icons";
+import { router, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import { Divider } from "react-native-paper";
+
+export default function AdminInvestmentStatus() {
+  const { status } = useLocalSearchParams();
+  const rightComponent = (
+    <SearchInput
+      containerStyle={{ width: "100%", marginBottom: 0 }}
+      placeholder="Cari"
+    />
+  );
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminComp_BoxTitle
+            title={`Investasi ${_.startCase(status as string)}`}
+            rightComponent={rightComponent}
+          />
+        }
+      >
+        <AdminTitleTable
+          title1="Aksi"
+          title2="Username"
+          title3="Judul Investasi"
+        />
+        <Spacing />
+        <Divider />
+
+        {Array.from({ length: 10 }).map((_, index) => (
+          <AdminTableValue
+            key={index}
+            value1={
+              <ActionIcon
+                icon={
+                  <Octicons name="eye" size={ICON_SIZE_BUTTON} color="black" />
+                }
+                onPress={() => {
+                  router.push(`/admin/investment/${index}/${status}`);
+                }}
+              />
+            }
+            value2={<TextCustom truncate={1}>Username username</TextCustom>}
+            value3={
+              <TextCustom truncate={2}>
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Blanditiis asperiores quidem deleniti architecto eaque et
+                nostrum, ad consequuntur eveniet quisquam quae voluptatum
+                ducimus! Dolorem nobis modi officia debitis, beatae mollitia.
+              </TextCustom>
+            }
+          />
+        ))}
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/investment/index.tsx

@@ -1,11 +1,43 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import { Spacing, StackCustom, ViewWrapper } from "@/components";
+import {
+  IconPublish,
+  IconReject,
+  IconReview,
+} from "@/components/_Icon/IconComponent";
+import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
+import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
+import { MainColor } from "@/constants/color-palet";
 
 export default function AdminInvestment() {
   return (
     <>
       <ViewWrapper>
-        <TextCustom>Admin Investment</TextCustom>
+        <AdminTitlePage title="Investasi" />
+        <Spacing />
+        <StackCustom gap={"xs"}>
+          {listData.map((item, i) => (
+            <AdminComp_BoxDashboard key={i} item={item} />
+          ))}
+        </StackCustom>
       </ViewWrapper>
     </>
   );
 }
+
+const listData = [
+  {
+    label: "Publish",
+    value: 3,
+    icon: <IconPublish size={25} color={MainColor.green} />,
+  },
+  {
+    label: "Review",
+    value: 5,
+    icon: <IconReview size={25} color={MainColor.orange} />,
+  },
+  {
+    label: "Reject",
+    value: 8,
+    icon: <IconReject size={25} color={MainColor.red} />,
+  },
+];

app/(application)/admin/investment/publish.tsx

@@ -1,11 +0,0 @@
-import { TextCustom, ViewWrapper } from "@/components";
-
-export default function AdminInvestmentPublish() {
-  return (
-    <>
-      <ViewWrapper>
-        <TextCustom>Admin Investment Publish</TextCustom>
-      </ViewWrapper>
-    </>
-  );
-}

app/(application)/admin/investment/reject.tsx

@@ -1,11 +0,0 @@
-import { TextCustom, ViewWrapper } from "@/components";
-
-export default function AdminInvestmentReject() {
-  return (
-    <>
-      <ViewWrapper>
-        <TextCustom>Admin Investment Reject</TextCustom>
-      </ViewWrapper>
-    </>
-  );
-}

app/(application)/admin/investment/review.tsx

@@ -1,11 +0,0 @@
-import { TextCustom, ViewWrapper } from "@/components";
-
-export default function AdminInvestmentReview() {
-  return (
-    <>
-      <ViewWrapper>
-        <TextCustom>Admin Investment Review</TextCustom>
-      </ViewWrapper>
-    </>
-  );
-}

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

@@ -39,7 +39,7 @@ export default function AdminJobRejectInput() {
     <>
       <ViewWrapper
         footerComponent={buttonSubmit}
-        headerComponent={<AdminBackButtonAntTitle title="Masukan Alasan" />}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Job" />}
       >
         <TextAreaCustom
           value={value}

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

@@ -39,7 +39,7 @@ export default function AdminVotingRejectInput() {
     <>
       <ViewWrapper
         footerComponent={buttonSubmit}
-        headerComponent={<AdminBackButtonAntTitle title="Masukan Alasan" />}
+        headerComponent={<AdminBackButtonAntTitle title="Penolakan Voting" />}
       >
         <TextAreaCustom
           value={value}

bun.lock

@@ -19,6 +19,7 @@
         "expo-camera": "~16.1.10",
         "expo-clipboard": "~7.1.5",
         "expo-constants": "~17.1.7",
+        "expo-dev-client": "~5.2.4",
         "expo-document-picker": "~13.1.6",
         "expo-file-system": "~18.1.11",
         "expo-font": "~13.3.2",
@@ -864,6 +865,14 @@
 
     "expo-constants": ["expo-constants@17.1.7", "", { "dependencies": { "@expo/config": "~11.0.12", "@expo/env": "~1.0.7" }, "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-byBjGsJ6T6FrLlhOBxw4EaiMXrZEn/MlUYIj/JAd+FS7ll5X/S4qVRbIimSJtdW47hXMq0zxPfJX6njtA56hHA=="],
 
+    "expo-dev-client": ["expo-dev-client@5.2.4", "", { "dependencies": { "expo-dev-launcher": "5.1.16", "expo-dev-menu": "6.1.14", "expo-dev-menu-interface": "1.10.0", "expo-manifests": "~0.16.6", "expo-updates-interface": "~1.1.0" }, "peerDependencies": { "expo": "*" } }, "sha512-s/N/nK5LPo0QZJpV4aPijxyrzV4O49S3dN8D2fljqrX2WwFZzWwFO6dX1elPbTmddxumdcpczsdUPY+Ms8g43g=="],
+
+    "expo-dev-launcher": ["expo-dev-launcher@5.1.16", "", { "dependencies": { "ajv": "8.11.0", "expo-dev-menu": "6.1.14", "expo-manifests": "~0.16.6", "resolve-from": "^5.0.0" }, "peerDependencies": { "expo": "*" } }, "sha512-tbCske9pvbozaEblyxoyo/97D6od9Ma4yAuyUnXtRET1CKAPKYS+c4fiZ+I3B4qtpZwN3JNFUjG3oateN0y6Hg=="],
+
+    "expo-dev-menu": ["expo-dev-menu@6.1.14", "", { "dependencies": { "expo-dev-menu-interface": "1.10.0" }, "peerDependencies": { "expo": "*" } }, "sha512-yonNMg2GHJZtuisVowdl1iQjZfYP85r1D1IO+ar9D9zlrBPBJhq2XEju52jd1rDmDkmDuEhBSbPNhzIcsBNiPg=="],
+
+    "expo-dev-menu-interface": ["expo-dev-menu-interface@1.10.0", "", { "peerDependencies": { "expo": "*" } }, "sha512-NxtM/qot5Rh2cY333iOE87dDg1S8CibW+Wu4WdLua3UMjy81pXYzAGCZGNOeY7k9GpNFqDPNDXWyBSlk9r2pBg=="],
+
     "expo-document-picker": ["expo-document-picker@13.1.6", "", { "peerDependencies": { "expo": "*" } }, "sha512-8FTQPDOkyCvFN/i4xyqzH7ELW4AsB6B3XBZQjn1FEdqpozo6rpNJRr7sWFU/93WrLgA9FJEKpKbyr6XxczK6BA=="],
 
     "expo-file-system": ["expo-file-system@18.1.11", "", { "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-HJw/m0nVOKeqeRjPjGdvm+zBi5/NxcdPf8M8P3G2JFvH5Z8vBWqVDic2O58jnT1OFEy0XXzoH9UqFu7cHg9DTQ=="],
@@ -878,10 +887,14 @@
 
     "expo-image-picker": ["expo-image-picker@16.1.4", "", { "dependencies": { "expo-image-loader": "~5.1.0" }, "peerDependencies": { "expo": "*" } }, "sha512-bTmmxtw1AohUT+HxEBn2vYwdeOrj1CLpMXKjvi9FKSoSbpcarT4xxI0z7YyGwDGHbrJqyyic3I9TTdP2J2b4YA=="],
 
+    "expo-json-utils": ["expo-json-utils@0.15.0", "", {}, "sha512-duRT6oGl80IDzH2LD2yEFWNwGIC2WkozsB6HF3cDYNoNNdUvFk6uN3YiwsTsqVM/D0z6LEAQ01/SlYvN+Fw0JQ=="],
+
     "expo-keep-awake": ["expo-keep-awake@14.1.4", "", { "peerDependencies": { "expo": "*", "react": "*" } }, "sha512-wU9qOnosy4+U4z/o4h8W9PjPvcFMfZXrlUoKTMBW7F4pLqhkkP/5G4EviPZixv4XWFMjn1ExQ5rV6BX8GwJsWA=="],
 
     "expo-linking": ["expo-linking@7.1.7", "", { "dependencies": { "expo-constants": "~17.1.7", "invariant": "^2.2.4" }, "peerDependencies": { "react": "*", "react-native": "*" } }, "sha512-ZJaH1RIch2G/M3hx2QJdlrKbYFUTOjVVW4g39hfxrE5bPX9xhZUYXqxqQtzMNl1ylAevw9JkgEfWbBWddbZ3UA=="],
 
+    "expo-manifests": ["expo-manifests@0.16.6", "", { "dependencies": { "@expo/config": "~11.0.12", "expo-json-utils": "~0.15.0" }, "peerDependencies": { "expo": "*" } }, "sha512-1A+do6/mLUWF9xd3uCrlXr9QFDbjbfqAYmUy8UDLOjof1lMrOhyeC4Yi6WexA/A8dhZEpIxSMCKfn7G4aHAh4w=="],
+
     "expo-modules-autolinking": ["expo-modules-autolinking@2.1.13", "", { "dependencies": { "@expo/spawn-async": "^1.7.2", "chalk": "^4.1.0", "commander": "^7.2.0", "find-up": "^5.0.0", "glob": "^10.4.2", "require-from-string": "^2.0.2", "resolve-from": "^5.0.0" }, "bin": { "expo-modules-autolinking": "bin/expo-modules-autolinking.js" } }, "sha512-+SaiYkdP3LXOFm/26CHMHBof9Xq/0MHNDzL/K0OwPgHLhZ6wpDWIDYWRHNueWYtGpAeLw2XAhR0HX4FNtU09qw=="],
 
     "expo-modules-core": ["expo-modules-core@2.4.2", "", { "dependencies": { "invariant": "^2.2.4" } }, "sha512-RCb0wniYCJkxwpXrkiBA/WiNGxzYsEpL0sB50gTnS/zEfX3DImS2npc4lfZ3hPZo1UF9YC6OSI9Do+iacV0NUg=="],
@@ -896,6 +909,8 @@
 
     "expo-system-ui": ["expo-system-ui@5.0.10", "", { "dependencies": { "@react-native/normalize-colors": "0.79.5", "debug": "^4.3.2" }, "peerDependencies": { "expo": "*", "react-native": "*", "react-native-web": "*" }, "optionalPeers": ["react-native-web"] }, "sha512-BTXbSyJr80yuN6VO4XQKZj7BjesZQLHgOYZ0bWyf4VB19GFZq7ZnZOEc/eoKk1B3eIocOMKUfNCrg/Wn8Kfcuw=="],
 
+    "expo-updates-interface": ["expo-updates-interface@1.1.0", "", { "peerDependencies": { "expo": "*" } }, "sha512-DeB+fRe0hUDPZhpJ4X4bFMAItatFBUPjw/TVSbJsaf3Exeami+2qbbJhWkcTMoYHOB73nOIcaYcWXYJnCJXO0w=="],
+
     "expo-web-browser": ["expo-web-browser@14.2.0", "", { "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-6S51d8pVlDRDsgGAp8BPpwnxtyKiMWEFdezNz+5jVIyT+ctReW42uxnjRgtsdn5sXaqzhaX+Tzk/CWaKCyC0hw=="],
 
     "exponential-backoff": ["exponential-backoff@3.1.2", "", {}, "sha512-8QxYTVXUkuy7fIIoitQkPwGonB8F3Zj8eEO8Sqg9Zv/bkI7RJAzowee4gr81Hak/dUTpA2Z7VfQgoijjPNlUZA=="],
@@ -1906,6 +1921,8 @@
 
     "eslint-plugin-import/debug": ["debug@3.2.7", "", { "dependencies": { "ms": "^2.1.1" } }, "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ=="],
 
+    "expo-dev-launcher/ajv": ["ajv@8.11.0", "", { "dependencies": { "fast-deep-equal": "^3.1.1", "json-schema-traverse": "^1.0.0", "require-from-string": "^2.0.2", "uri-js": "^4.2.2" } }, "sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg=="],
+
     "expo-modules-autolinking/commander": ["commander@7.2.0", "", {}, "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw=="],
 
     "expo-modules-autolinking/glob": ["glob@10.4.5", "", { "dependencies": { "foreground-child": "^3.1.0", "jackspeak": "^3.1.2", "minimatch": "^9.0.4", "minipass": "^7.1.2", "package-json-from-dist": "^1.0.0", "path-scurry": "^1.11.1" }, "bin": "dist/esm/bin.mjs" }, "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg=="],
@@ -2072,6 +2089,8 @@
 
     "cosmiconfig/js-yaml/argparse": ["argparse@1.0.10", "", { "dependencies": { "sprintf-js": "~1.0.2" } }, "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg=="],
 
+    "expo-dev-launcher/ajv/json-schema-traverse": ["json-schema-traverse@1.0.0", "", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="],
+
     "expo-modules-autolinking/glob/minimatch": ["minimatch@9.0.5", "", { "dependencies": { "brace-expansion": "^2.0.1" } }, "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow=="],
 
     "finalhandler/debug/ms": ["ms@2.0.0", "", {}, "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="],

components/Select/SelectCustom.tsx

@@ -5,9 +5,11 @@ import {
   FlatList,
   Modal,
   Pressable,
+  StyleProp,
   Text,
   TouchableOpacity,
   View,
+  ViewStyle,
 } from "react-native";
 
 type SelectItem = {
@@ -24,6 +26,7 @@ type SelectProps = {
   disabled?: boolean; // <-- tambahkan prop disabled
   onChange: (value: string | number) => void;
   borderRadius?: number;
+  styleContainer?: StyleProp<ViewStyle>;
 };
 
 const SelectCustom: React.FC<SelectProps> = ({
@@ -35,6 +38,7 @@ const SelectCustom: React.FC<SelectProps> = ({
   disabled = false, // <-- default false
   onChange,
   borderRadius = 8,
+  styleContainer,
 }) => {
   const [modalVisible, setModalVisible] = useState(false);
 
@@ -43,7 +47,7 @@ const SelectCustom: React.FC<SelectProps> = ({
   const hasError = required && value === null; // <-- check if empty and required
 
   return (
-    <View style={GStyles.inputContainerArea}>
+    <View style={[GStyles.inputContainerArea, styleContainer]}>
       {label && (
         <Text style={GStyles.inputLabel}>
           {label}
@@ -52,7 +56,7 @@ const SelectCustom: React.FC<SelectProps> = ({
       )}
       <Pressable
         style={[
-          { borderRadius },
+          { borderRadius, },
           hasError ? GStyles.inputErrorBorder : null,
           GStyles.inputContainerInput,
           disabled && GStyles.disabledBox,

components/_ShareComponent/Admin/BackButtonAntTitle.tsx

@@ -5,28 +5,37 @@ import AdminBackButton from "./BackButton";
 export default function AdminBackButtonAntTitle({
   title,
   rightComponent,
+  newComponent,
 }: {
-  title: string;
+  title?: string;
   rightComponent?: React.ReactNode;
+  newComponent?: React.ReactNode;
 }) {
   return (
     <>
       <Grid>
-        <Grid.Col span={2}>
+        <Grid.Col span={2} style={{ justifyContent: "center" }}>
           <AdminBackButton />
-          </Grid.Col>
+        </Grid.Col>
-          <Grid.Col
+        <Grid.Col
-            span={8}
+          span={newComponent ? 10 : 8}
-            style={{ alignItems: "center", justifyContent: "center" }}
+          style={{ alignItems: "center", justifyContent: "center" }}
-          >
+        >
+          {newComponent ? (
+            newComponent
+          ) : (
             <TextCustom bold size={"large"} align="center">
               {title}
             </TextCustom>
-          </Grid.Col>
+          )}
-          <Grid.Col span={2} style={{ alignItems: "flex-end" }}>
+        </Grid.Col>
-            {rightComponent}
+        <Grid.Col
-          </Grid.Col>
+          span={newComponent ? 0 : 2}
-        </Grid>
+          style={{ alignItems: "flex-end" }}
-      </>
+        >
-    );
+          {rightComponent}
-}
+        </Grid.Col>
+      </Grid>
+    </>
+  );
+}

components/_ShareComponent/GridViewCustomSpan.tsx

@@ -0,0 +1,40 @@
+import { Grid } from "@/components";
+
+export const GridViewCustomSpan = ({
+  span1,
+  span2,
+  span3,
+  component1,
+  component2,
+  component3,
+}: {
+  span1: number;
+  span2: number;
+  span3: number;
+  component1: React.ReactNode;
+  component2: React.ReactNode;
+  component3: React.ReactNode;
+}) => {
+  return (
+    <Grid>
+      <Grid.Col
+        span={span1 || 4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component1}
+      </Grid.Col>
+      <Grid.Col
+        span={span2 || 4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component2}
+      </Grid.Col>
+      <Grid.Col
+        span={span3 || 4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component3}
+      </Grid.Col>
+    </Grid>
+  );
+};

components/_ShareComponent/GridView_4_4_4.tsx

@@ -0,0 +1,34 @@
+import { Grid } from "@/components";
+
+export const GridView_4_4_4 = ({
+  component1,
+  component2,
+  component3,
+}: {
+  component1: React.ReactNode;
+  component2: React.ReactNode;
+  component3: React.ReactNode;
+}) => {
+  return (
+    <Grid>
+      <Grid.Col
+        span={4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component1}
+      </Grid.Col>
+      <Grid.Col
+        span={4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component2}
+      </Grid.Col>
+      <Grid.Col
+        span={4}
+        style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}
+      >
+        {component3}
+      </Grid.Col>
+    </Grid>
+  );
+};

package.json

@@ -26,6 +26,7 @@
     "expo-camera": "~16.1.10",
     "expo-clipboard": "~7.1.5",
     "expo-constants": "~17.1.7",
+    "expo-dev-client": "~5.2.4",
     "expo-document-picker": "~13.1.6",
     "expo-file-system": "~18.1.11",
     "expo-font": "~13.3.2",

screens/Admin/Donation/BoxOfDonationStory.tsx

@@ -0,0 +1,34 @@
+import {
+  BaseBox,
+  TextCustom,
+  Spacing,
+  StackCustom,
+  DummyLandscapeImage,
+} from "@/components";
+
+export default function AdminDonation_BoxOfDonationStory() {
+  return (
+    <>
+      <BaseBox>
+        <TextCustom bold>Cerita Penggalang Dana</TextCustom>
+        <Spacing />
+
+        <StackCustom>
+          <TextCustom>
+            Lorem ipsum dolor sit, amet consectetur adipisicing elit. Rem magni
+            perspiciatis eius ipsam provident, impedit, fugiat aliquid nobis
+            pariatur asperiores fuga quidem temporibus labore, molestias
+            perferendis optio ipsum. Praesentium, tempore?
+          </TextCustom>
+          <DummyLandscapeImage />
+          <TextCustom>
+            Lorem ipsum dolor sit, amet consectetur adipisicing elit. Rem magni
+            perspiciatis eius ipsam provident, impedit, fugiat aliquid nobis
+            pariatur asperiores fuga quidem temporibus labore, molestias
+            perferendis optio ipsum. Praesentium, tempore?
+          </TextCustom>
+        </StackCustom>
+      </BaseBox>
+    </>
+  );
+}

screens/Admin/listPageAdmin.tsx

@@ -13,9 +13,9 @@ const adminListMenu: NavbarItem[] = [
     icon: "wallet",
     links: [
       { label: "Dashboard", link: "/admin/investment" },
-      { label: "Publish", link: "/admin/investment/publish" },
+      { label: "Publish", link: "/admin/investment/publish/status" },
-      { label: "Review", link: "/admin/investment/review" },
+      { label: "Review", link: "/admin/investment/review/status" },
-      { label: "Reject", link: "/admin/investment/reject" },
+      { label: "Reject", link: "/admin/investment/reject/status" },
     ],
   },
   {

screens/Authentication/LoginView.tsx

@@ -31,15 +31,7 @@ export default function LoginView() {
     console.log("login user id :", id);
 
     router.navigate("/verification");
-    // router.navigate(`/(application)/(user)/profile/${id}`);
-    // router.navigate("/(application)/(user)/home");
-    // router.navigate(`/(application)/profile/${id}/edit`);
-    // router.navigate(`/(application)/(user)/portofolio/${id}`)
-    // router.navigate(`/(application)/(image)/preview-image/${id}`);
-    // router.replace("/(application)/(user)/event/(tabs)");
     // router.replace("/(application)/coba");
-    // router.navigate("/investment/(tabs)")1
-    // router.navigate("/crowdfunding")
     // router.navigate("/admin/dashboard")
   }
 
@@ -84,7 +76,7 @@ export default function LoginView() {
 
         <Spacing />
 
-        {/* <ButtonCustom onPress={() => router.navigate("/admin/donation")}>
+        {/* <ButtonCustom onPress={() => router.navigate("/admin/investment")}>
           Admin ( Delete Soon )
         </ButtonCustom> */}
       </View>

tsconfig.json

@@ -11,7 +11,6 @@
   "include": [
     "**/*.ts",
     "**/*.tsx",
-    ".expo/types/**/*.ts",
+    "app/(application)/admin/app-information/business-field/[id]"
-    "expo-env.d.ts"
+  ]
-, "app/(application)/admin/app-information/business-field/[id]"    ]
 }