Admin Job:

Add:
- admin/job/[status]/
- dmin/job/[id]/

### No issue

app/(application)/(user)/voting/(tabs)/history.tsx

@@ -1,5 +1,5 @@
 import { ViewWrapper } from "@/components";
-import TabsTwoHeaderCustom from "@/components/_ShareComponent/TabsTwoHeaderCustom";
+import TabsTwoButtonCustom from "@/components/_ShareComponent/TabsTwoHeaderCustom";
 import Voting_BoxPublishSection from "@/screens/Voting/BoxPublishSection";
 import { useState } from "react";
 
@@ -15,7 +15,7 @@ export default function VotingHistory() {
     <ViewWrapper
       hideFooter
       headerComponent={
-        <TabsTwoHeaderCustom
+        <TabsTwoButtonCustom
           leftValue="all"
           rightValue="main"
           leftText="Semua Riwayat"

app/(application)/admin/_layout.tsx

@@ -48,59 +48,38 @@ export default function AdminLayout() {
           ),
         }}
       >
-        <Stack.Screen name="dashboard" 
+        <Stack.Screen name="dashboard" />
-        // options={{ title: "Main Dashboard" }} 
+        {/* ================== Investment Start ================== */}
-        />
+        <Stack.Screen name="investment/index" />
-        <Stack.Screen
+        <Stack.Screen name="investment/publish" />
-          name="investment/index"
+        <Stack.Screen name="investment/review" />
-          // options={{ title: "Dashboard Investasi" }}
+        <Stack.Screen name="investment/reject" />
-        />
+        {/* ================== Investment End ================== */}
-        <Stack.Screen
+
-          name="investment/publish"
+        {/* ================== Maps Start ================== */}
-          // options={{ title: "Investasi Publish" }}
+        <Stack.Screen name="maps" />
-        />
+        {/* ================== Maps End ================== */}
-        <Stack.Screen
+
-          name="investment/review"
+        {/* ================== App Information Start ================== */}
-          // options={{ title: "Investasi Review" }}
+        <Stack.Screen name="app-information/index" />
-        />
+        {/* ================== App Information End ================== */}
-        <Stack.Screen
+
-          name="investment/reject"
+        {/* ================== Job Start ================== */}
-          // options={{ title: "Investasi Reject" }}
+        <Stack.Screen name="job/index" />
-        />
+        <Stack.Screen name="job/publish" />
-        <Stack.Screen name="maps" 
+        <Stack.Screen name="job/review" />
-        // options={{ title: "Maps" }} 
+        <Stack.Screen name="job/reject" />
-        />
+        <Stack.Screen name="job/[status]/status" />
-        <Stack.Screen name="app-information/index" 
+        <Stack.Screen name="job/[id]/[status]/index" />
-        // options={{ title: "Information" }} 
+
-        />
+        {/* ================== Collaboration Start ================== */}
-        <Stack.Screen name="job/index" 
+        <Stack.Screen name="collaboration/index" />
-        // options={{ title: "Dashboard Job" }} 
+        <Stack.Screen name="collaboration/publish" />
-        />
+        <Stack.Screen name="collaboration/group" />
-        <Stack.Screen name="job/publish" 
+        <Stack.Screen name="collaboration/reject" />
-        // options={{ title: "Job Publish" }} 
+        <Stack.Screen name="collaboration/[id]/[status]"/>
-        />
+        <Stack.Screen name="collaboration/[id]/group"/>
-        <Stack.Screen name="job/review" 
+        {/* ================== Collaboration End ================== */}
-        // options={{ title: "Job Review" }} 
-        />
-        <Stack.Screen name="job/reject" 
-        // options={{ title: "Job Reject" }} 
-        />
-        <Stack.Screen
-          name="collaboration/index"
-          // options={{ title: "Dashboard Collaboration" }}
-        />
-        <Stack.Screen
-          name="collaboration/publish"
-          // options={{ title: "Collaboration Publish" }}
-        />
-        <Stack.Screen
-          name="collaboration/group"
-          // options={{ title: "Collaboration Group" }}
-        />
-        <Stack.Screen
-          name="collaboration/reject"
-          // options={{ title: "Collaboration Reject" }}
-        />
       </Stack>
 
       <DrawerAdmin

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

@@ -0,0 +1,89 @@
+import {
+  BaseBox,
+  BoxButtonOnFooter,
+  ButtonCustom,
+  Grid,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { MainColor } from "@/constants/color-palet";
+import { useLocalSearchParams } from "expo-router";
+
+export default function AdminCollaborationPublish() {
+  const { id, status } = useLocalSearchParams();
+  console.log("params:", id, status);
+  const bottomFooter = (
+    <BoxButtonOnFooter>
+      <ButtonCustom
+        backgroundColor={MainColor.red}
+        textColor="white"
+        onPress={() => {}}
+      >
+        Reject
+      </ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title={`Detail ${status}`} />}
+        footerComponent={bottomFooter}
+      >
+        <BaseBox>
+          <StackCustom>
+            {listData.map((item, i) => (
+              <Grid key={i}>
+                <Grid.Col
+                  span={4}
+                  style={{ justifyContent: "center", paddingRight: 10 }}
+                >
+                  <TextCustom bold>{item.label}</TextCustom>
+                </Grid.Col>
+                <Grid.Col span={8} style={{ justifyContent: "center" }}>
+                  <TextCustom>{item.value}</TextCustom>
+                </Grid.Col>
+              </Grid>
+            ))}
+          </StackCustom>
+        </BaseBox>
+      </ViewWrapper>
+    </>
+  );
+}
+
+const listData = [
+  {
+    label: "Username",
+    value: "Bagas Banuna",
+  },
+  {
+    label: "Judul Proyek",
+    value:
+      "Judul Proyek: Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+  },
+  {
+    label: "Industri",
+    value: "Kesehatan",
+  },
+  {
+    label: "Jumlah Partisipan ",
+    value: "0",
+  },
+  {
+    label: "Lokasi",
+    value: "Kuta Selatan, Bali",
+  },
+  {
+    label: "Tujuan Proyek",
+    value:
+      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+  },
+  {
+    label: "Keuntungan",
+    value:
+      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+  },
+];

app/(application)/admin/collaboration/[id]/group.tsx

@@ -0,0 +1,97 @@
+import {
+  BaseBox,
+  Grid,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { useLocalSearchParams } from "expo-router";
+
+export default function AdminCollaborationGroup() {
+  const { id } = useLocalSearchParams();
+  console.log("params:", id);
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={
+          <AdminBackButtonAntTitle title={`Detail Group ${id}`} />
+        }
+      >
+        <StackCustom gap={"xs"}>
+          <BaseBox>
+            <StackCustom>
+              {listData.map((item, i) => (
+                <Grid key={i}>
+                  <Grid.Col
+                    span={4}
+                    style={{ justifyContent: "center", paddingRight: 10 }}
+                  >
+                    <TextCustom bold>{item.label}</TextCustom>
+                  </Grid.Col>
+                  <Grid.Col span={8} style={{ justifyContent: "center" }}>
+                    <TextCustom>{item.value}</TextCustom>
+                  </Grid.Col>
+                </Grid>
+              ))}
+            </StackCustom>
+          </BaseBox>
+          <BaseBox>
+            <StackCustom>
+              <TextCustom align="center">Anggota</TextCustom>
+
+              {Array.from({ length: 10 }).map((_, i) => (
+                <Grid key={i}>
+                  <Grid.Col
+                    span={4}
+                    style={{ justifyContent: "center", paddingRight: 10 }}
+                  >
+                    <TextCustom bold>Username</TextCustom>
+                  </Grid.Col>
+                  <Grid.Col span={8} style={{ justifyContent: "center" }}>
+                    <TextCustom>
+                      Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                    </TextCustom>
+                  </Grid.Col>
+                </Grid>
+              ))}
+            </StackCustom>
+          </BaseBox>
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}
+
+const listData = [
+  {
+    label: "Admin Group",
+    value: "Bagas Banuna",
+  },
+  {
+    label: "Nama Group",
+    value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+  },
+  {
+    label: "Industri",
+    value: "Kesehatan",
+  },
+  {
+    label: "Jumlah Partisipan ",
+    value: "0",
+  },
+  {
+    label: "Lokasi",
+    value: "Kuta Selatan, Bali",
+  },
+  {
+    label: "Tujuan Proyek",
+    value:
+      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+  },
+  {
+    label: "Keuntungan",
+    value:
+      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
+  },
+];

app/(application)/admin/collaboration/group.tsx

@@ -1,10 +1,68 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+  ActionIcon,
+  BaseBox,
+  Spacing,
+  StackCustom,
+  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 { router } from "expo-router";
+import { Divider } from "react-native-paper";
 
 export default function AdminCollaborationGroup() {
   return (
     <>
-      <ViewWrapper>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
-        <TextCustom>Admin Collaboration Group</TextCustom>
+        <StackCustom gap={"xs"}>
+          <AdminComp_BoxTitle title="Group" />
+          <BaseBox>
+            <AdminTitleTable
+              title1="Aksi"
+              title2="Admin Group"
+              title3="Nama Group"
+            />
+            <Spacing height={10} />
+            <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/collaboration/${index}/group`);
+                    }}
+                  />
+                }
+                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>
+        </StackCustom>
       </ViewWrapper>
     </>
   );

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

@@ -1,11 +1,37 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import { StackCustom, ViewWrapper } from "@/components";
+import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
+import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
+import { MainColor } from "@/constants/color-palet";
+import { Entypo, FontAwesome } from "@expo/vector-icons";
 
 export default function AdminCollaboration() {
   return (
     <>
-      <ViewWrapper>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
-        <TextCustom>Admin Collaboration</TextCustom>
+        <StackCustom gap={"xs"}>
+          {listData.map((item, i) => (
+            <AdminComp_BoxDashboard key={i} item={item} />
+          ))}
+        </StackCustom>
       </ViewWrapper>
     </>
   );
 }
+
+const listData = [
+  {
+    label: "Publish",
+    value: 4,
+    icon: <Entypo name="publish" size={25} color={MainColor.green} />,
+  },
+  {
+    label: "Group",
+    value: 7,
+    icon: <FontAwesome name="group" size={25} color={MainColor.yellow} />,
+  },
+  {
+    label: "Reject",
+    value: 7,
+    icon: <FontAwesome name="warning" size={25} color={MainColor.red} />,
+  },
+];

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

@@ -1,11 +1,70 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+  ActionIcon,
+  BaseBox,
+  Spacing,
+  StackCustom,
+  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 { router } from "expo-router";
+import { Divider } from "react-native-paper";
 
 export default function AdminCollaborationPublish() {
   return (
     <>
-      <ViewWrapper>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
-        <TextCustom>Admin Collaboration Publish</TextCustom>
+        <StackCustom gap={"xs"}>
+          <AdminComp_BoxTitle title="Publish" />
+          <BaseBox>
+            <AdminTitleTable
+              title1="Aksi"
+              title2="Username"
+              title3="Judul Proyek"
+            />
+            <Spacing height={10} />
+            <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/collaboration/${index}/publish`);
+                    }}
+                  />
+                }
+                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>
+        </StackCustom>
       </ViewWrapper>
     </>
   );
 }
+

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

@@ -1,10 +1,68 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+  ActionIcon,
+  BaseBox,
+  Spacing,
+  StackCustom,
+  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 { router } from "expo-router";
+import { Divider } from "react-native-paper";
 
 export default function AdminCollaborationReject() {
   return (
     <>
-      <ViewWrapper>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
-        <TextCustom>Admin Collaboration Reject</TextCustom>
+        <StackCustom gap={"xs"}>
+          <AdminComp_BoxTitle title="Reject" />
+          <BaseBox>
+            <AdminTitleTable
+              title1="Aksi"
+              title2="Username"
+              title3="Judul Proyek"
+            />
+            <Spacing height={10} />
+            <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/collaboration/${index}/reject`);
+                    }}
+                  />
+                }
+                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>
+        </StackCustom>
       </ViewWrapper>
     </>
   );

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

@@ -0,0 +1,110 @@
+import {
+  BadgeCustom,
+  BaseBox,
+  ButtonCustom,
+  DummyLandscapeImage,
+  Grid,
+  StackCustom,
+  TextCustom,
+  ViewWrapper,
+} from "@/components";
+import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
+import { MainColor } from "@/constants/color-palet";
+import { useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+
+export default function AdminJobDetailStatus() {
+  const { id, status } = useLocalSearchParams();
+
+  const colorBadge = () => {
+    if (status === "publish") {
+      return MainColor.green;
+    } else if (status === "review") {
+      return MainColor.orange;
+    } else if (status === "reject") {
+      return MainColor.red;
+    }
+  };
+
+  const listData = [
+    {
+      label: "Username",
+      value: "Bagas Banuna",
+    },
+    {
+      label: "Judul",
+      value: `Judul Proyek: ${id}Lorem ipsum dolor sit amet consectetur adipisicing elit.`,
+    },
+    {
+      label: "Status",
+      value: (
+        <BadgeCustom color={colorBadge()}>
+          {_.startCase(status as string)}
+        </BadgeCustom>
+      ),
+    },
+    {
+      label: "Konten",
+      value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+    },
+    {
+      label: "Deskripsi",
+      value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
+    },
+    // {
+    //   label: "Poster",
+    //   value: (
+    //     <ButtonCustom
+    //       href={`/(application)/()/${id}`}
+    //     >
+    //       Lihat Poster
+    //     </ButtonCustom>
+    //   ),
+    // },
+  ];
+
+  return (
+    <>
+      <ViewWrapper
+        headerComponent={<AdminBackButtonAntTitle title={`Detail Data`} />}
+      >
+        <BaseBox>
+          <StackCustom>
+            {listData.map((item, i) => (
+              <Grid key={i}>
+                <Grid.Col
+                  span={4}
+                  style={{ justifyContent: "center", paddingRight: 10 }}
+                >
+                  <TextCustom bold>{item.label}</TextCustom>
+                </Grid.Col>
+                <Grid.Col span={8} style={{ justifyContent: "center" }}>
+                  <TextCustom>{item.value}</TextCustom>
+                </Grid.Col>
+              </Grid>
+            ))}
+
+            <TextCustom bold>Poster</TextCustom>
+
+            <DummyLandscapeImage />
+          </StackCustom>
+        </BaseBox>
+
+        {status === "review" && (
+          <Grid>
+            <Grid.Col span={6} style={{ paddingRight: 10 }}>
+              <ButtonCustom backgroundColor={MainColor.green} textColor="white">
+                Publish
+              </ButtonCustom>
+            </Grid.Col>
+            <Grid.Col span={6} style={{ paddingLeft: 10 }}>
+              <ButtonCustom backgroundColor={MainColor.red} textColor="white">
+                Reject
+              </ButtonCustom>
+            </Grid.Col>
+          </Grid>
+        )}
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/job/[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 { router, useLocalSearchParams } from "expo-router";
+import _ from "lodash";
+import { Divider } from "react-native-paper";
+
+export default function AdminJobStatus() {
+  const { status } = useLocalSearchParams();
+  const rightComponent = (
+    <SearchInput
+      containerStyle={{ width: "100%", marginBottom: 0 }}
+      placeholder="Cari"
+    />
+  );
+  return (
+    <>
+      <ViewWrapper headerComponent={<AdminTitlePage title="Job Vacancy" />}>
+        <AdminComp_BoxTitle
+          title={`${_.startCase(status as string)}`}
+          rightComponent={rightComponent}
+        />
+
+        <BaseBox>
+          <AdminTitleTable
+            title1="Aksi"
+            title2="Username"
+            title3="Judul Pekerjaan"
+          />
+          <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/job/${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>
+    </>
+  );
+}

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

@@ -1,11 +1,45 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import { Spacing, StackCustom, ViewWrapper } from "@/components";
+import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
+import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
+import { MainColor } from "@/constants/color-palet";
+import { Entypo, FontAwesome, FontAwesome6 } from "@expo/vector-icons";
 
 export default function AdminJob() {
   return (
     <>
       <ViewWrapper>
-        <TextCustom>Admin Job</TextCustom>
+        <AdminTitlePage title="Job Vacancy" />
+        <Spacing />
+        <StackCustom gap={"xs"}>
+          {listData.map((item, i) => (
+            <AdminComp_BoxDashboard key={i} item={item} />
+          ))}
+        </StackCustom>
       </ViewWrapper>
     </>
   );
 }
+
+const listData = [
+  {
+    label: "Publish",
+    value: 4,
+    icon: <Entypo name="publish" size={25} color={MainColor.green} />,
+  },
+  {
+    label: "Review",
+    value: 7,
+    icon: (
+      <FontAwesome6
+        name="person-circle-check"
+        size={25}
+        color={MainColor.orange}
+      />
+    ),
+  },
+  {
+    label: "Reject",
+    value: 5,
+    icon: <FontAwesome name="warning" size={25} color={MainColor.red} />,
+  },
+];

components/_Icon/IconArchive.tsx

@@ -2,11 +2,11 @@ import { MainColor } from "@/constants/color-palet";
 import { ICON_SIZE_SMALL } from "@/constants/constans-value";
 import { Ionicons } from "@expo/vector-icons";
 
-export default function IconArchive({ color }: { color?: string }) {
+export default function IconArchive({ color, size }: { color?: string; size?: number }) {
   return (
     <Ionicons
       name="archive"
-      size={ICON_SIZE_SMALL}
+      size={size || ICON_SIZE_SMALL}
       color={color || MainColor.white}
     />
   );

components/_ShareComponent/Admin/BoxDashboard.tsx

@@ -3,7 +3,7 @@ import CircleContainer from "@/components/Container/CircleContainer";
 import Grid from "@/components/Grid/GridCustom";
 import StackCustom from "@/components/Stack/StackCustom";
 import TextCustom from "@/components/Text/TextCustom";
-import { MainColor } from "@/constants/color-palet";
+import { AccentColor, MainColor } from "@/constants/color-palet";
 
 interface BoxDashboardProps {
   item: {
@@ -37,7 +37,7 @@ export default function AdminComp_BoxDashboard({ item }: BoxDashboardProps) {
             span={3}
             style={{ alignItems: "flex-start", justifyContent: "center" }}
           >
-            <CircleContainer icon={item.icon} />
+            <CircleContainer style={{ backgroundColor: MainColor.white, borderColor: AccentColor.blue }} icon={item.icon} />
           </Grid.Col>
         </Grid>
       </BaseBox>

components/_ShareComponent/Admin/TableTitle.tsx

@@ -0,0 +1,28 @@
+import Grid from "@/components/Grid/GridCustom";
+import TextCustom from "@/components/Text/TextCustom";
+
+export default function AdminTitleTable({
+  title1,
+  title2,
+  title3,
+}: {
+  title1: string;
+  title2: string;
+  title3: string;
+}) {
+  return (
+    <>
+      <Grid>
+        <Grid.Col span={3} style={{ alignItems: "center", justifyContent: "center" }}>
+          <TextCustom bold align="center">{title1}</TextCustom>
+        </Grid.Col>
+        <Grid.Col span={3} style={{ alignItems: "center", justifyContent: "center" }}>
+          <TextCustom bold align="center">{title2}</TextCustom>
+        </Grid.Col>
+        <Grid.Col span={6} style={{ alignItems: "center", justifyContent: "center" }}>
+          <TextCustom bold align="center">{title3}</TextCustom>
+        </Grid.Col>
+      </Grid>
+    </>
+  );
+}

components/_ShareComponent/Admin/TableValue.tsx

@@ -0,0 +1,56 @@
+import Grid from "@/components/Grid/GridCustom";
+import React from "react";
+import { View } from "react-native";
+import { Divider } from "react-native-paper";
+
+export default function AdminTableValue({
+  value1,
+  value2,
+  value3,
+}: {
+  value1: React.ReactNode;
+  value2: React.ReactNode;
+  value3: React.ReactNode;
+}) {
+  return (
+    <>
+      <View style={{ paddingVertical: 5 }}>
+        <Grid>
+          <Grid.Col
+            span={3}
+            style={{
+              alignItems: "center",
+              justifyContent: "center",
+              paddingLeft: 5,
+              paddingRight: 5,
+            }}
+          >
+            {value1}
+          </Grid.Col>
+          <Grid.Col
+            span={3}
+            style={{
+              alignItems: "center",
+              justifyContent: "center",
+              paddingLeft: 5,
+              paddingRight: 5,
+            }}
+          >
+            {value2}
+          </Grid.Col>
+          <Grid.Col
+            span={6}
+            style={{
+              justifyContent: "center",
+              paddingLeft: 5,
+              paddingRight: 5,
+            }}
+          >
+            {value3}
+          </Grid.Col>
+        </Grid>
+        <Divider />
+      </View>
+    </>
+  );
+}

components/_ShareComponent/Admin/TitlePage.tsx

@@ -0,0 +1,11 @@
+import TextCustom from "@/components/Text/TextCustom";
+
+export default function AdminTitlePage({ title }: { title: string }) {
+  return (
+    <>
+      <TextCustom bold size={30}>
+        {title}
+      </TextCustom>
+    </>
+  );
+}

components/_ShareComponent/SearchInput.tsx

@@ -17,7 +17,7 @@ export default function SearchInput({
   onPress,
   iconLeft,
   iconRight,
-  containerStyle = { marginBottom: 0 },
+  containerStyle,
   style,
   ...props
 }: SearchInputProps) {
@@ -32,7 +32,7 @@ export default function SearchInput({
       }
       placeholder={placeholder}
       borderRadius={50}
-      containerStyle={containerStyle}
+      containerStyle={[containerStyle, { marginBottom: 0 }]}
       {...props}
     />
   );

components/_ShareComponent/TabsTwoHeaderCustom.tsx

@@ -1,15 +1,16 @@
-import { MainColor, AccentColor } from "@/constants/color-palet";
+import { AccentColor, MainColor } from "@/constants/color-palet";
 import { View } from "react-native";
 import ButtonCustom from "../Button/ButtonCustom";
 import Spacing from "./Spacing";
 
-export default function TabsTwoHeaderCustom ({
+export default function TabsTwoButtonCustom ({
     leftValue,
     rightValue,
     leftText,
     rightText,
     activeCategory,
     handlePress,
+    hideBackground,
 }: {
     leftValue: string;
     rightValue: string;
@@ -17,6 +18,7 @@ export default function TabsTwoHeaderCustom ({
     rightText: string;
     activeCategory: string | null;
     handlePress: (item: string) => void;
+    hideBackground?: boolean;
 }) {
     return (
       <>
@@ -25,7 +27,7 @@ export default function TabsTwoHeaderCustom ({
             flexDirection: "row",
             alignItems: "center",
             padding: 5,
-            backgroundColor: MainColor.soft_darkblue,
+            backgroundColor: hideBackground ? "transparent" : MainColor.soft_darkblue,
             borderRadius: 50,
             width: "100%",
           }}

screens/Admin/listPageAdmin.tsx

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

screens/Authentication/LoginView.tsx

@@ -30,9 +30,9 @@ export default function LoginView() {
     const id = randomAlfabet + randomNumber + fixNumber;
     console.log("login user id :", id);
 
-    // router.navigate("/verification");
+    router.navigate("/verification");
     // router.navigate(`/(application)/(user)/profile/${id}`);
-    router.navigate("/(application)/(user)/home");
+    // router.navigate("/(application)/(user)/home");
     // router.navigate(`/(application)/profile/${id}/edit`);
     // router.navigate(`/(application)/(user)/portofolio/${id}`)
     // router.navigate(`/(application)/(image)/preview-image/${id}`);
@@ -84,9 +84,9 @@ export default function LoginView() {
 
         <Spacing />
 
-        <ButtonCustom onPress={() => router.navigate("/admin/user-access")}>
+        {/* <ButtonCustom onPress={() => router.navigate("/admin/job")}>
           Admin ( Delete Soon )
-        </ButtonCustom>
+        </ButtonCustom> */}
       </View>
     </ViewWrapper>
   );