Component

Icon:
- IconContribution
- IconHistory

Voting
Add:
- voting (tabs)
- (user)/_layout : penambahan layout voting

# No Issue

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

@@ -150,6 +150,38 @@ export default function UserLayout() {
 
         {/* ========== End Collaboration Section ========= */}
 
+        {/* ========== Voting Section ========= */}
+        <Stack.Screen
+          name="voting/create"
+          options={{
+            title: "Tambah Voting",
+            headerLeft: () => <BackButton />,
+          }}
+        />
+        <Stack.Screen
+          name="voting/(tabs)"
+          options={{
+            title: "Voting",
+            headerLeft: () => <BackButton path="/home" />,
+          }}
+        />
+        {/* <Stack.Screen
+          name="voting/[id]/index"
+          options={{
+            title: "Detail Voting",
+            headerLeft: () => <BackButton />,
+          }}
+        />
+        <Stack.Screen
+          name="voting/[id]/edit"
+          options={{
+            title: "Edit Voting",
+            headerLeft: () => <BackButton />,
+          }}
+        /> */}
+
+        {/* ========== End Voting Section ========= */}
+
         {/* ========== Job Section ========= */}
         <Stack.Screen
           name="job/create"

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

@@ -1,50 +1,43 @@
-import { IconHome, IconStatus } from "@/components/_Icon";
+import {
+  IconContribution,
+  IconHistory,
+  IconHome,
+  IconStatus,
+} from "@/components/_Icon";
 import { TabsStyles } from "@/styles/tabs-styles";
-import { FontAwesome5, Ionicons } from "@expo/vector-icons";
 import { Tabs } from "expo-router";
 
 export default function EventTabsLayout() {
   return (
-    <Tabs
+    <Tabs screenOptions={TabsStyles}>
-      screenOptions={TabsStyles}
-    >
       <Tabs.Screen
         name="index"
         options={{
           title: "Beranda",
-          tabBarIcon: ({ color }) => (
+          tabBarIcon: ({ color }) => <IconHome color={color} />,
-            <IconHome color={color}/>
-          ),
         }}
       />
       <Tabs.Screen
         name="status"
         options={{
           title: "Status",
-          tabBarIcon: ({ color }) => (
+          tabBarIcon: ({ color }) => <IconStatus color={color} />,
-            <IconStatus color={color}/>
-          ),
         }}
       />
       <Tabs.Screen
         name="contribution"
         options={{
           title: "Kontribusi",
-          tabBarIcon: ({ color }) => (
+          tabBarIcon: ({ color }) => <IconContribution color={color} />,
-            <Ionicons size={20} name="extension-puzzle" color={color} />
-          ),
         }}
       />
       <Tabs.Screen
         name="history"
         options={{
           title: "Riwayat",
-          tabBarIcon: ({ color }) => (
+          tabBarIcon: ({ color }) => <IconHistory color={color} />,
-            <FontAwesome5 size={20} name="history" color={color} />
-          ),
         }}
       />
     </Tabs>
   );
 }
-

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

@@ -0,0 +1,43 @@
+import {
+    IconContribution,
+    IconHistory,
+    IconHome,
+    IconStatus,
+} from "@/components/_Icon";
+import { TabsStyles } from "@/styles/tabs-styles";
+import { Tabs } from "expo-router";
+
+export default function VotingTabsLayout() {
+  return (
+    <Tabs screenOptions={TabsStyles}>
+      <Tabs.Screen
+        name="index"
+        options={{
+          title: "Beranda",
+          tabBarIcon: ({ color }) => <IconHome color={color} />,
+        }}
+      />
+      <Tabs.Screen
+        name="status"
+        options={{
+          title: "Status",
+          tabBarIcon: ({ color }) => <IconStatus color={color} />,
+        }}
+      />
+      <Tabs.Screen
+        name="contribution"
+        options={{
+          title: "Kontribusi",
+          tabBarIcon: ({ color }) => <IconContribution color={color} />,
+        }}
+      />
+      <Tabs.Screen
+        name="history"
+        options={{
+          title: "Riwayat",
+          tabBarIcon: ({ color }) => <IconHistory color={color} />,
+        }}
+      />
+    </Tabs>
+  );
+}

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

@@ -0,0 +1,9 @@
+import { TextCustom, ViewWrapper } from "@/components";
+
+export default function VotingContribution() {
+  return (
+    <ViewWrapper>
+      <TextCustom>Voting Contribution</TextCustom>
+    </ViewWrapper>
+  );
+}

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

@@ -0,0 +1,9 @@
+import { TextCustom, ViewWrapper } from "@/components";
+
+export default function VotingHistory() {
+  return (
+    <ViewWrapper>
+      <TextCustom>Voting History</TextCustom>
+    </ViewWrapper>
+  );
+}

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

@@ -0,0 +1,9 @@
+import { TextCustom, ViewWrapper } from "@/components";
+
+export default function VotingBeranda() {
+  return (
+    <ViewWrapper>
+      <TextCustom>Voting Beranda</TextCustom>
+    </ViewWrapper>
+  );
+}

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

@@ -0,0 +1,9 @@
+import { TextCustom, ViewWrapper } from "@/components";
+
+export default function VotingStatus() {
+  return (
+    <ViewWrapper>
+      <TextCustom>Voting Status</TextCustom>
+    </ViewWrapper>
+  );
+}

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

@@ -0,0 +1,9 @@
+import { TextInputCustom, ViewWrapper } from "@/components";
+
+export default function CreateVoting() {
+  return (
+    <ViewWrapper>
+      <TextInputCustom>Create Voting</TextInputCustom>
+    </ViewWrapper>
+  );
+}

components/_Icon/IconContribution.tsx

@@ -0,0 +1,14 @@
+import { ICON_SIZE_SMALL } from "@/constants/constans-value";
+import { Ionicons } from "@expo/vector-icons";
+
+export default function IconContribution({ color }: { color?: string }) {
+  return (
+    <>
+      <Ionicons
+        size={ICON_SIZE_SMALL}
+        name="extension-puzzle"
+        color={color || "white"}
+      />
+    </>
+  );
+}

components/_Icon/IconHistory.tsx

@@ -0,0 +1,9 @@
+import { FontAwesome5 } from "@expo/vector-icons";
+
+export default function IconHistory({ color }: { color?: string }) {
+  return (
+    <>
+      <FontAwesome5 size={20} name="history" color={color} />
+    </>
+  );
+}

components/_Icon/index.ts

@@ -1,5 +1,7 @@
+import IconContribution from "./IconContribution";
 import IconEdit from "./IconEdit";
+import IconHistory from "./IconHistory";
 import IconHome from "./IconHome";
 import IconStatus from "./IconStatus";
 
-export { IconEdit, IconHome, IconStatus };
+export { IconContribution, IconEdit, IconHistory, IconHome, IconStatus };

screens/Home/topFeatureSection.tsx

@@ -16,12 +16,17 @@ export default function Home_FeatureSection() {
         </TouchableOpacity>
         <TouchableOpacity
           style={stylesHome.gridItem}
-          onPress={() => router.push("/(application)/(user)/collaboration/(tabs)")}
+          onPress={() =>
+            router.push("/(application)/(user)/collaboration/(tabs)")
+          }
         >
           <Ionicons name="share" size={48} color="white" />
           <Text style={stylesHome.gridLabel}>Collaboration</Text>
         </TouchableOpacity>
-        <TouchableOpacity style={stylesHome.gridItem}>
+        <TouchableOpacity
+          style={stylesHome.gridItem}
+          onPress={() => router.push("/(application)/(user)/voting/(tabs)")}
+        >
           <Ionicons name="cube" size={48} color="white" />
           <Text style={stylesHome.gridLabel}>Voting</Text>
         </TouchableOpacity>