Admin

App-Information
Add:
- screens/Admin/App-Information
- _ShareComponent/Admin
- app/(application)/admin/app-information

### No Issue

app/(application)/admin/_layout.tsx

@@ -23,6 +23,7 @@ export default function AdminLayout() {
     <>
       <Stack
         screenOptions={{
+          title: "HIPMI DASHBOARD",
           headerStyle: GStyles.headerStyle,
           headerTitleStyle: GStyles.headerTitleStyle,
           headerTitleAlign: "center",
@@ -47,44 +48,58 @@ export default function AdminLayout() {
           ),
         }}
       >
-        <Stack.Screen name="dashboard" options={{ title: "Main Dashboard" }} />
+        <Stack.Screen name="dashboard" 
+        // options={{ title: "Main Dashboard" }} 
+        />
         <Stack.Screen
           name="investment/index"
-          options={{ title: "Dashboard Investasi" }}
+          // options={{ title: "Dashboard Investasi" }}
         />
         <Stack.Screen
           name="investment/publish"
-          options={{ title: "Investasi Publish" }}
+          // options={{ title: "Investasi Publish" }}
         />
         <Stack.Screen
           name="investment/review"
-          options={{ title: "Investasi Review" }}
+          // options={{ title: "Investasi Review" }}
         />
         <Stack.Screen
           name="investment/reject"
-          options={{ title: "Investasi Reject" }}
+          // options={{ title: "Investasi Reject" }}
+        />
+        <Stack.Screen name="maps" 
+        // options={{ title: "Maps" }} 
+        />
+        <Stack.Screen name="app-information/index" 
+        // options={{ title: "Information" }} 
+        />
+        <Stack.Screen name="job/index" 
+        // options={{ title: "Dashboard Job" }} 
+        />
+        <Stack.Screen name="job/publish" 
+        // options={{ title: "Job Publish" }} 
+        />
+        <Stack.Screen name="job/review" 
+        // options={{ title: "Job Review" }} 
+        />
+        <Stack.Screen name="job/reject" 
+        // options={{ title: "Job Reject" }} 
         />
-        <Stack.Screen name="maps" options={{ title: "Maps" }} />
-        <Stack.Screen name="information" options={{ title: "Information" }} />
-        <Stack.Screen name="job/index" options={{ title: "Dashboard Job" }} />
-        <Stack.Screen name="job/publish" options={{ title: "Job Publish" }} />
-        <Stack.Screen name="job/review" options={{ title: "Job Review" }} />
-        <Stack.Screen name="job/reject" options={{ title: "Job Reject" }} />
         <Stack.Screen
           name="collaboration/index"
-          options={{ title: "Dashboard Collaboration" }}
+          // options={{ title: "Dashboard Collaboration" }}
         />
         <Stack.Screen
           name="collaboration/publish"
-          options={{ title: "Collaboration Publish" }}
+          // options={{ title: "Collaboration Publish" }}
         />
         <Stack.Screen
           name="collaboration/group"
-          options={{ title: "Collaboration Group" }}
+          // options={{ title: "Collaboration Group" }}
         />
         <Stack.Screen
           name="collaboration/reject"
-          options={{ title: "Collaboration Reject" }}
+          // options={{ title: "Collaboration Reject" }}
         />
       </Stack>
 

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

@@ -0,0 +1,62 @@
+import {
+  ScrollableCustom,
+  ViewWrapper
+} from "@/components";
+import AdminAppInformation_BusinessFieldSection from "@/screens/Admin/App-Information/BusinessFieldSection";
+import AdminAppInformation_Bank from "@/screens/Admin/App-Information/InformationBankSection";
+import AdminAppInformation_StickerSection from "@/screens/Admin/App-Information/StickerSection";
+import { useState } from "react";
+
+export default function AdminInformation() {
+  const [activeCategory, setActiveCategory] = useState<string | null>("bank");
+
+  const handlePress = (item: any) => {
+    setActiveCategory(item.value);
+    // tambahkan logika lain seperti filter dsb.
+  };
+
+  const scrollComponent = (
+    <ScrollableCustom
+      data={[
+        {
+          id: "1",
+          label: "Informasi Bank",
+          value: "bank",
+        },
+        {
+          id: "2",
+          label: "Bidang Bisnis",
+          value: "business",
+        },
+        {
+          id: "3",
+          label: "Stiker",
+          value: "sticker",
+        },
+      ]}
+      onButtonPress={handlePress}
+      activeId={activeCategory as any}
+    />
+  );
+
+  const renderContent = () => {
+    switch (activeCategory) {
+      case "bank":
+        return <AdminAppInformation_Bank />;
+      case "business":
+        return <AdminAppInformation_BusinessFieldSection />;
+      case "sticker":
+        return <AdminAppInformation_StickerSection />;
+      default:
+        return <AdminAppInformation_Bank />;
+    }
+  };
+
+  return (
+    <>
+      <ViewWrapper headerComponent={scrollComponent}>
+        {renderContent()}
+      </ViewWrapper>
+    </>
+  );
+}

app/(application)/admin/dashboard.tsx

@@ -1,11 +1,40 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+  StackCustom,
+  TextCustom,
+  ViewWrapper
+} from "@/components";
+import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
+import { MainColor } from "@/constants/color-palet";
+import { Ionicons } from "@expo/vector-icons";
 
 export default function AdminDashboard() {
   return (
     <>
       <ViewWrapper>
-        <TextCustom>Admin Dashboard</TextCustom>
+        <StackCustom>
+          <TextCustom bold size={30}>
+            Main Dashboard
+          </TextCustom>
+          {listData.map((item, i) => (
+            <AdminComp_BoxDashboard key={i} item={item} />
+          ))}
+        </StackCustom>
       </ViewWrapper>
     </>
   );
 }
+
+const listData = [
+  {
+    label: "User",
+    value: 4,
+    icon: <Ionicons name="people" size={30} color={MainColor.yellow} />,
+  },
+  {
+    label: "Portofolio",
+    value: 7,
+    icon: (
+      <Ionicons name="id-card-outline" size={30} color={MainColor.yellow} />
+    ),
+  },
+];

app/(application)/admin/information.tsx

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

app/(application)/admin/maps.tsx

@@ -1,10 +1,10 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import { MapCustom, ViewWrapper } from "@/components";
 
 export default function AdminMaps() {
   return (
     <>
       <ViewWrapper>
-        <TextCustom>Maps</TextCustom>
+        <MapCustom height={"100%"} />
       </ViewWrapper>
     </>
   );