Fix:

- nama page > participant

Component
Fix:
- Base bos > clean code

# No Issue

app/(application)/(user)/collaboration/(tabs)/_layout.tsx

@@ -15,9 +15,9 @@ export default function CollaborationTabsLayout() {
         }}
       />
       <Tabs.Screen
-        name="participans"
+        name="participant"
         options={{
-          title: "Participans",
+          title: "Partisipan",
           tabBarIcon: ({ color }) => (
             <Ionicons size={20} name="people" color={color} />
           ),
@@ -26,7 +26,7 @@ export default function CollaborationTabsLayout() {
       <Tabs.Screen
         name="group"
         options={{
-          title: "Group",
+          title: "Grup",
           tabBarIcon: ({ color }) => (
             <Ionicons size={20} name="chatbox-ellipses" color={color} />
           ),

app/(application)/(user)/collaboration/(tabs)/group.tsx

@@ -1,10 +1,27 @@
-import { TextCustom } from "@/components";
+import { BaseBox, Grid, TextCustom } from "@/components";
 import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
+import { MainColor } from "@/constants/color-palet";
+import { Feather } from "@expo/vector-icons";
 
 export default function CollaborationGroup() {
   return (
-    <ViewWrapper>
-      <TextCustom>CollaborationGroup</TextCustom>
+    <ViewWrapper hideFooter>
+      {Array.from({ length: 10 }).map((_, index) => (
+        <BaseBox key={index} paddingBlock={5}>
+          <Grid>
+            <Grid.Col span={10}>
+              <TextCustom bold>Nama Grup</TextCustom>
+              <TextCustom size="small">2 Anggota</TextCustom>
+            </Grid.Col>
+            <Grid.Col
+              span={2}
+              style={{ alignItems: "flex-end", justifyContent: "center" }}
+            >
+              <Feather name="chevron-right" size={20} color={MainColor.white} />
+            </Grid.Col>
+          </Grid>
+        </BaseBox>
+      ))}
     </ViewWrapper>
   );
 }

app/(application)/(user)/collaboration/(tabs)/participans.tsx

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

app/(application)/(user)/collaboration/(tabs)/participant.tsx

@@ -0,0 +1,68 @@
+import { ButtonCustom, Spacing } from "@/components";
+import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
+import { AccentColor, MainColor } from "@/constants/color-palet";
+import Collaboration_BoxPublishSection from "@/screens/Collaboration/BoxPublishSection";
+import { useState } from "react";
+import { View } from "react-native";
+
+export default function CollaborationParticipans() {
+    const [activeCategory, setActiveCategory] = useState<string | null>(
+      "participant"
+    );
+
+    const handlePress = (item: any) => {
+        setActiveCategory(item);
+        // tambahkan logika lain seperti filter dsb.
+      };
+
+       const headerComponent = (
+          <View
+            style={{
+              flexDirection: "row",
+              alignItems: "center",
+              padding: 5,
+              backgroundColor: MainColor.soft_darkblue,
+              borderRadius: 50,
+              width: "100%",
+            }}
+          >
+            <ButtonCustom
+              backgroundColor={
+                activeCategory === "participant" ? MainColor.yellow : AccentColor.blue
+              }
+              textColor={activeCategory === "participant" ? MainColor.black : MainColor.white}
+              style={{ width: "49%" }}
+              onPress={() => handlePress("participant")}
+            >
+              Partisipasi Proyek
+            </ButtonCustom>
+            <Spacing width={"2%"} />
+            <ButtonCustom
+              backgroundColor={
+                activeCategory === "main" ? MainColor.yellow : AccentColor.blue
+              }
+              textColor={
+                activeCategory === "main" ? MainColor.black : MainColor.white
+              }
+              style={{ width: "49%" }}
+              onPress={() => handlePress("main")}
+            >
+             Proyek Saya
+            </ButtonCustom>
+          </View>
+        );
+      
+
+  return (
+    <ViewWrapper hideFooter headerComponent={headerComponent}>
+      {Array.from({ length: 10 }).map((_, index) => (
+        <Collaboration_BoxPublishSection
+          key={index.toString()}
+          id={index.toString()}
+          username={` ${activeCategory === "participant" ? "Partisipasi Proyek" : "Proyek Saya"}`}
+          href={`/collaboration/create` }
+        />
+      ))}
+    </ViewWrapper>
+  );
+}

app/(application)/(user)/collaboration/create.tsx

@@ -1,11 +1,53 @@
-import { TextCustom, ViewWrapper } from "@/components";
+import {
+    ButtonCustom,
+    SelectCustom,
+    StackCustom,
+    TextAreaCustom,
+    TextInputCustom,
+    ViewWrapper
+} from "@/components";
+import { router } from "expo-router";
 
 export default function CollaborationCreate() {
   return (
     <ViewWrapper>
-      <TextCustom bold size="xlarge">
-        Tambah Koleksi
-      </TextCustom>
+      <StackCustom gap={"xs"}>
+        <TextInputCustom label="Judul" placeholder="Masukan judul" required />
+        <TextInputCustom label="Lokasi" placeholder="Masukan lokasi" required />
+        <SelectCustom
+          label="Pilih Industri"
+          data={[
+            { label: "Industri 1", value: "industri-1" },
+            { label: "Industri 2", value: "industri-2" },
+            { label: "Industri 3", value: "industri-3" },
+          ]}
+          onChange={(value) => console.log(value)}
+        />
+
+        <TextAreaCustom
+          required
+          label="Tujuan Proyek"
+          placeholder="Masukan tujuan proyek"
+          showCount
+          maxLength={1000}
+        />
+
+        <TextAreaCustom
+          required
+          label="Keuntungan Proyek"
+          placeholder="Masukan keuntungan proyek"
+          showCount
+          maxLength={1000}
+        />
+
+        <ButtonCustom
+          title="Simpan"
+          onPress={() => {
+            console.log("Simpan proyek");
+            router.back();
+          }}
+        />
+      </StackCustom>
     </ViewWrapper>
   );
 }