From 6f3cc03fa5d310acc04533566427d96c7c199376 Mon Sep 17 00:00:00 2001
From: Bagasbanuna02 <bagasbanuna02@gmail.com>
Date: Tue, 12 Aug 2025 17:32:07 +0800
Subject: [PATCH] Admin Donation Add: - (application)/admin/donation/

Component Admin
Add:
- _ShareComponent/GridView_3_3_6.tsx

### No Issue
---
 app/(application)/admin/_layout.tsx           |   7 ++
 .../admin/donation/[status]/status.tsx        |  76 ++++++++++++
 .../admin/donation/category-create.tsx        |  27 +++++
 .../admin/donation/category-update.tsx        |  35 ++++++
 app/(application)/admin/donation/category.tsx | 113 ++++++++++++++++++
 app/(application)/admin/donation/index.tsx    |  49 ++++++++
 components/_ShareComponent/GridView_3_3_6.tsx |  25 ++++
 screens/Admin/listPageAdmin.tsx               |  10 +-
 screens/Authentication/LoginView.tsx          |   4 +-
 9 files changed, 339 insertions(+), 7 deletions(-)
 create mode 100644 app/(application)/admin/donation/[status]/status.tsx
 create mode 100644 app/(application)/admin/donation/category-create.tsx
 create mode 100644 app/(application)/admin/donation/category-update.tsx
 create mode 100644 app/(application)/admin/donation/category.tsx
 create mode 100644 app/(application)/admin/donation/index.tsx
 create mode 100644 components/_ShareComponent/GridView_3_3_6.tsx

diff --git a/app/(application)/admin/_layout.tsx b/app/(application)/admin/_layout.tsx
index b1c8c50..94674c0 100644
--- a/app/(application)/admin/_layout.tsx
+++ b/app/(application)/admin/_layout.tsx
@@ -106,6 +106,13 @@ export default function AdminLayout() {
         {/* <Stack.Screen name="event/[id]/[status]/index" />
         <Stack.Screen name="event/[id]/reject-input"/> */}
         {/* ================== Event End ================== */}
+
+        {/* ================== Donasi Start ================== */}
+        {/* <Stack.Screen name="donation/index" /> */}
+        {/* <Stack.Screen name="donation/[status]/status" /> */}
+        {/* <Stack.Screen name="donation/[id]/[status]/index" />
+        <Stack.Screen name="donation/[id]/reject-input"/> */}
+        {/* ================== Donasi End ================== */}
       </Stack>
 
       <DrawerAdmin
diff --git a/app/(application)/admin/donation/[status]/status.tsx b/app/(application)/admin/donation/[status]/status.tsx
new file mode 100644
index 0000000..ebf9c43
--- /dev/null
+++ b/app/(application)/admin/donation/[status]/status.tsx
@@ -0,0 +1,76 @@
+import {
+    ActionIcon,
+    BaseBox,
+    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 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 _ from "lodash";
+import { Divider } from "react-native-paper";
+
+export default function AdminDonationStatus() {
+  const { status } = useLocalSearchParams();
+  const rightComponent = (
+    <SearchInput
+      containerStyle={{ width: "100%", marginBottom: 0 }}
+      placeholder="Cari"
+    />
+  );
+  return (
+    <>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Donasi" />}>
+        <AdminComp_BoxTitle
+          title={`${_.startCase(status as string)}`}
+          rightComponent={rightComponent}
+        />
+
+        <BaseBox>
+          <AdminTitleTable
+            title1="Aksi"
+            title2="Username"
+            title3="Judul Donasi"
+          />
+          <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/donation/${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>
+              }
+            />
+          ))}
+        </BaseBox>
+      </ViewWrapper>
+    </>
+  );
+}
diff --git a/app/(application)/admin/donation/category-create.tsx b/app/(application)/admin/donation/category-create.tsx
new file mode 100644
index 0000000..587ea69
--- /dev/null
+++ b/app/(application)/admin/donation/category-create.tsx
@@ -0,0 +1,27 @@
+import {
+  BoxButtonOnFooter,
+  ButtonCustom,
+  TextInputCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { useRouter } from "expo-router";
+
+export default function AdminDonationCategoryCreate() {
+  const router = useRouter();
+  const buttonSubmit = (
+    <BoxButtonOnFooter>
+      <ButtonCustom onPress={() => router.back()}>Simpan</ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title="Tambah Kategori" />}
+        footerComponent={buttonSubmit}
+      >
+        <TextInputCustom placeholder="Masukkan Kategori" />
+      </ViewWrapper>
+    </>
+  );
+}
diff --git a/app/(application)/admin/donation/category-update.tsx b/app/(application)/admin/donation/category-update.tsx
new file mode 100644
index 0000000..91c1241
--- /dev/null
+++ b/app/(application)/admin/donation/category-update.tsx
@@ -0,0 +1,35 @@
+import {
+  BoxButtonOnFooter,
+  ButtonCustom,
+  TextInputCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { useLocalSearchParams, useRouter } from "expo-router";
+import { useState } from "react";
+
+export default function AdminDonationCategoryUpdate() {
+  const { id } = useLocalSearchParams();
+  const [value, setValue] = useState(id);
+
+  const router = useRouter();
+  const buttonSubmit = (
+    <BoxButtonOnFooter>
+      <ButtonCustom onPress={() => router.back()}>Update</ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title="Ubah Kategori" />}
+        footerComponent={buttonSubmit}
+      >
+        <TextInputCustom
+          placeholder="Masukkan Kategori"
+          value={value as any}
+          onChangeText={setValue}
+        />
+      </ViewWrapper>
+    </>
+  );
+}
diff --git a/app/(application)/admin/donation/category.tsx b/app/(application)/admin/donation/category.tsx
new file mode 100644
index 0000000..20f7cf4
--- /dev/null
+++ b/app/(application)/admin/donation/category.tsx
@@ -0,0 +1,113 @@
+import {
+    ActionIcon,
+    BaseBox,
+    CenterCustom,
+    Spacing,
+    StackCustom,
+    TextCustom,
+    ViewWrapper,
+} from "@/components";
+import { IconEdit } from "@/components/_Icon";
+import AdminActionIconPlus from "@/components/_ShareComponent/Admin/ActionIconPlus";
+import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
+import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
+import { GridView_3_3_6 } from "@/components/_ShareComponent/GridView_3_3_6";
+import { MainColor } from "@/constants/color-palet";
+import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
+import { View } from "react-native";
+import { Divider, Switch } from "react-native-paper";
+import { router } from "expo-router";
+
+export default function AdminDonationCategory() {
+  return (
+    <>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Donasi" />}>
+        <AdminComp_BoxTitle
+          title="Kategori"
+          rightComponent={
+            <AdminActionIconPlus
+              onPress={() => {
+                router.push(`/admin/donation/category-create`);
+              }}
+            />
+          }
+        />
+
+        <BaseBox>
+          <GridView_3_3_6
+            component1={
+              <TextCustom bold align="center">
+                Aksi
+              </TextCustom>
+            }
+            component2={<TextCustom bold>Status</TextCustom>}
+            component3={<TextCustom bold>Kategori</TextCustom>}
+          />
+          <Divider />
+          <Spacing />
+
+          <StackCustom>
+            {listData.map((item, index) => (
+              <View key={index}>
+                <GridView_3_3_6
+                  component1={
+                    <CenterCustom>
+                      <ActionIcon
+                        icon={
+                          <IconEdit size={ICON_SIZE_BUTTON} color="black" />
+                        }
+                        onPress={() => {
+                            router.push(`/admin/donation/category-update?id=${index}`);
+                        }}
+                      />
+                    </CenterCustom>
+                  }
+                  component2={
+                    <Switch
+                      value={true}
+                      onValueChange={(item) => {
+                        console.log(item);
+                      }}
+                      color={MainColor.yellow}
+                      
+                    />
+                  }
+                  component3={<TextCustom bold>{item.label}</TextCustom>}
+                />
+                <Spacing height={10} />
+                <Divider />
+              </View>
+            ))}
+          </StackCustom>
+        </BaseBox>
+      </ViewWrapper>
+    </>
+  );
+}
+
+const listData = [
+  {
+    label: "Kegiatan Sosial",
+    value: "kegiatan_sosial",
+  },
+  {
+    label: "Pendidikan",
+    value: "pendidikan",
+  },
+  {
+    label: "Kesehatan",
+    value: "kesehatan",
+  },
+  {
+    label: "Kebudayaan",
+    value: "kebudayaan",
+  },
+  {
+    label: "Bencana Alami",
+    value: "bencana_alami",
+  },
+  {
+    label: "Lainnya",
+    value: "lainnya",
+  },
+];
diff --git a/app/(application)/admin/donation/index.tsx b/app/(application)/admin/donation/index.tsx
new file mode 100644
index 0000000..d63ec2c
--- /dev/null
+++ b/app/(application)/admin/donation/index.tsx
@@ -0,0 +1,49 @@
+import { Spacing, StackCustom, ViewWrapper } from "@/components";
+import {
+    IconList,
+    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 AdminDonation() {
+  return (
+    <>
+      <ViewWrapper>
+        <AdminTitlePage title="Donasi" />
+        <Spacing />
+        <StackCustom gap={"xs"}>
+          {listData.map((item, i) => (
+            <AdminComp_BoxDashboard key={i} item={item} />
+          ))}
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}
+
+const listData = [
+  {
+    label: "Publish",
+    value: 4,
+    icon: <IconPublish size={25} color={MainColor.green} />,
+  },
+  {
+    label: "Review",
+    value: 7,
+    icon: <IconReview size={25} color={MainColor.orange} />,
+  },
+  {
+    label: "Reject",
+    value: 5,
+    icon: <IconReject size={25} color={MainColor.red} />,
+  },
+  {
+    label: "Kategori",
+    value: 4,
+    icon: <IconList size={25} color={MainColor.white_gray} />,
+  },
+];
diff --git a/components/_ShareComponent/GridView_3_3_6.tsx b/components/_ShareComponent/GridView_3_3_6.tsx
new file mode 100644
index 0000000..3e7be13
--- /dev/null
+++ b/components/_ShareComponent/GridView_3_3_6.tsx
@@ -0,0 +1,25 @@
+import { Grid } from "@/components";
+
+export const GridView_3_3_6 = ({
+  component1,
+  component2,
+  component3,
+}: {
+  component1: React.ReactNode;
+  component2: React.ReactNode;
+  component3: React.ReactNode;
+}) => {
+  return (
+    <Grid>
+      <Grid.Col span={3} style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}>
+        {component1}
+      </Grid.Col>
+      <Grid.Col span={3} style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}>
+        {component2}
+      </Grid.Col>
+      <Grid.Col span={6} style={{ justifyContent: "center", paddingRight: 5, paddingLeft: 5 }}>
+        {component3}
+      </Grid.Col>
+    </Grid>
+  );
+};
diff --git a/screens/Admin/listPageAdmin.tsx b/screens/Admin/listPageAdmin.tsx
index 7fcbeef..e38da87 100644
--- a/screens/Admin/listPageAdmin.tsx
+++ b/screens/Admin/listPageAdmin.tsx
@@ -22,11 +22,11 @@ const adminListMenu: NavbarItem[] = [
     label: "Donasi",
     icon: "hand-right",
     links: [
-      { label: "Dashboard", link: "/admin/donasi" },
-      { label: "Publish", link: "/admin/donasi/publish" },
-      { label: "Review", link: "/admin/donasi/review" },
-      { label: "Reject", link: "/admin/donasi/reject" },
-      { label: "Kategori", link: "/admin/donasi/kategori" },
+      { label: "Dashboard", link: "/admin/donation" },
+      { label: "Publish", link: "/admin/donation/publish/status" },
+      { label: "Review", link: "/admin/donation/review/status" },
+      { label: "Reject", link: "/admin/donation/reject/status" },
+      { label: "Kategori", link: "/admin/donation/category" },
     ],
   },
   {
diff --git a/screens/Authentication/LoginView.tsx b/screens/Authentication/LoginView.tsx
index 1963e28..af685d5 100644
--- a/screens/Authentication/LoginView.tsx
+++ b/screens/Authentication/LoginView.tsx
@@ -84,9 +84,9 @@ export default function LoginView() {
 
         <Spacing />
 
-        <ButtonCustom onPress={() => router.navigate("/admin/event")}>
+        {/* <ButtonCustom onPress={() => router.navigate("/admin/donation")}>
           Admin ( Delete Soon )
-        </ButtonCustom>
+        </ButtonCustom> */}
       </View>
     </ViewWrapper>
   );