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

@@ -76,6 +76,13 @@ export default function UserLayout() {
             ),
           }}
         />
+        <Stack.Screen
+          name="event/create"
+          options={{
+            title: "Tambah Event",
+            headerLeft: () => <BackButton />,
+          }}
+        />
 
         <Stack.Screen
           name="event/detail/[id]"

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

@@ -1,6 +1,7 @@
-import { MainColor } from "@/constants/color-palet";
+import { AccentColor, MainColor } from "@/constants/color-palet";
 import { FontAwesome5, Ionicons } from "@expo/vector-icons";
 import { Tabs } from "expo-router";
+import { Platform, View } from "react-native";
 
 export default function EventLayout() {
   return (
@@ -9,18 +10,20 @@ export default function EventLayout() {
         headerShown: false,
         tabBarActiveTintColor: MainColor.yellow,
         tabBarInactiveTintColor: MainColor.white_gray,
-        tabBarStyle: {
-          backgroundColor: MainColor.darkblue,
-        },
-        //   tabBarButton: HapticTab,
-        //   tabBarBackground: BlurTabBarBackground,
-        //   tabBarStyle: Platform.select({
-        //     ios: {
-        //       // Use a transparent background on iOS to show the blur effect
-        //       position: "absolute",
-        //     },
-        //     default: {},
-        //   }),
+        tabBarBackground: CustomTabBarBackground,
+        tabBarStyle: Platform.select({
+          ios: {
+            borderTopWidth: 0,
+            paddingTop: 5,
+            height: 65,
+          },
+          android: {
+            borderTopWidth: 0,
+            paddingTop: 5,
+            height: 115,
+          },
+          default: {},
+        }),
       }}
     >
       <Tabs.Screen
@@ -62,3 +65,16 @@ export default function EventLayout() {
     </Tabs>
   );
 }
+
+function CustomTabBarBackground() {
+  return (
+    <View
+      style={{
+        flex: 1,
+        backgroundColor: MainColor.darkblue,
+        borderTopWidth: 1,
+        borderTopColor: AccentColor.blue,
+      }}
+    />
+  );
+}

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

@@ -1,4 +1,5 @@
 import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
+import FloatingButton from "@/components/Button/FloatingButton";
 import { AccentColor, MainColor } from "@/constants/color-palet";
 import { GStyles } from "@/styles/global-styles";
 import { router } from "expo-router";
@@ -6,7 +7,11 @@ import { Text, TouchableHighlight, View } from "react-native";
 
 export default function Event() {
   return (
-    <ViewWrapper>
+    <ViewWrapper
+      floatingButton={
+        <FloatingButton onPress={() => router.push("/event/create")} />
+      }
+    >
       <TouchableHighlight onPress={() => router.push("/event/detail/1")}>
         <View
           style={{

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

@@ -0,0 +1,50 @@
+import {
+    BoxButtonOnFooter,
+    ButtonCustom,
+    SelectCustom,
+    StackCustom,
+    TextAreaCustom,
+    TextInputCustom,
+    ViewWrapper
+} from "@/components";
+import { masterTypeEvent } from "@/lib/dummy-data/event/master-type-event";
+
+export default function EventCreate() {
+  const buttonSubmit = (
+    <BoxButtonOnFooter>
+      <ButtonCustom title="Simpan" onPress={() => console.log("Simpan")} />
+    </BoxButtonOnFooter>
+  );
+  return (
+    <>
+      <ViewWrapper footerComponent={buttonSubmit}>
+        <StackCustom gap={"xs"}>
+          <TextInputCustom
+            label="Nama Event"
+            placeholder="Masukkan nama event"
+            required
+          />
+          <SelectCustom
+            label="Tipe Event"
+            placeholder="Pilih tipe event"
+            data={masterTypeEvent}
+            onChange={(value) => console.log(value)}
+          />
+          <TextInputCustom
+            label="Lokasi"
+            placeholder="Masukkan lokasi event"
+            required
+          />
+
+          <TextAreaCustom
+            label="Deskripsi"
+            placeholder="Masukkan deskripsi event"
+            required
+            showCount
+            maxLength={100}
+          />
+        </StackCustom>
+      </ViewWrapper>
+    </>
+  );
+}

components/TextArea/TextAreaCustom.tsx

@@ -1,11 +1,11 @@
 import { GStyles } from "@/styles/global-styles";
 import React, { useEffect, useState } from "react";
 import {
-    TextInput as RNTextInput,
-    StyleProp,
-    Text,
-    View,
-    ViewStyle,
+  TextInput as RNTextInput,
+  StyleProp,
+  Text,
+  View,
+  ViewStyle,
 } from "react-native";
 
 type IconType = React.ReactNode | string;
@@ -79,7 +79,7 @@ const TextAreaCustom: React.FC<TextAreaCustomProps> = ({
   };
 
   return (
-    <View style={GStyles.inputContainerArea}>
+    <View style={[GStyles.inputContainerArea]}>
       {label && (
         <Text style={GStyles.inputLabel}>
           {label}

lib/dummy-data/event/master-type-event.tsx

@@ -0,0 +1,8 @@
+export const masterTypeEvent = [
+  { label: "Seminar", value: "seminar" },
+  { label: "Workshop", value: "workshop" },
+  { label: "Lomba", value: "lomba" },
+  { label: "Pameran", value: "pameran" },
+  { label: "Kegiatan Sosial", value: "kegiatan_sosial" },
+  { label: "Musyawarah", value: "musyawarah" },
+];

screens/Authentication/LoginView.tsx

@@ -30,12 +30,13 @@ 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}`);
+    // router.replace("/(application)/(user)/event/(tabs)");
   }
 
   return (