feature & fix

deskripsi:
- fix Text input
- feature Box footer & button center

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

@@ -8,7 +8,7 @@ export default function EventLayout() {
       screenOptions={{
         headerShown: false,
         tabBarActiveTintColor: MainColor.yellow,
-        tabBarInactiveTintColor: MainColor.white,
+        tabBarInactiveTintColor: MainColor.white_gray,
         tabBarStyle: {
           backgroundColor: MainColor.darkblue,
         },

app/(application)/(user)/portofolio/[id]/create.tsx

@@ -1,11 +1,170 @@
-import { TextCustom, ViewWrapper } from "@/components";
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import {
+  ButtonCustom,
+  Grid,
+  SelectCustom,
+  Spacing,
+  StackCustom,
+  TextAreaCustom,
+  TextCustom,
+  TextInputCustom,
+  ViewWrapper,
+} from "@/components";
+import BoxButtonOnFooter from "@/components/Box/BoxButtonOnFooter";
+import InformationBox from "@/components/Box/InformationBox";
+import ButtonCenteredOnly from "@/components/Button/ButtonCenteredOnly";
+import LandscapeFrameUploaded from "@/components/Image/LandscapeFrameUploaded";
+import { MainColor } from "@/constants/color-palet";
+import dummyMasterBidangBisnis from "@/lib/dummy-data/master-bidang-bisnis";
+import dummyMasterSubBidangBisnis from "@/lib/dummy-data/master-sub-bidang-bisnis";
+import { Ionicons } from "@expo/vector-icons";
 import { useLocalSearchParams } from "expo-router";
+import { useState } from "react";
+import { Text, TouchableOpacity, View } from "react-native";
+import PhoneInput, { ICountry } from "react-native-international-phone-number";
 
 export default function PortofolioCreate() {
-    const { id } = useLocalSearchParams();
-    return (
-        <ViewWrapper>
-            <TextCustom>Portofolio Create {id}</TextCustom>
-        </ViewWrapper> 
-    );
-}
+  const { id } = useLocalSearchParams();
+  const [selectedCountry, setSelectedCountry] = useState<null | ICountry>(null);
+  const [inputValue, setInputValue] = useState<string>("");
+  const [data, setData] = useState({
+    name: "",
+    bidang_usaha: "",
+    sub_bidang_usaha: "",
+    alamat: "",
+    nomor_telepon: "",
+    deskripsi: "",
+  });
+
+  function handleInputValue(phoneNumber: string) {
+    setInputValue(phoneNumber);
+  }
+
+  function handleSelectedCountry(country: ICountry) {
+    setSelectedCountry(country);
+  }
+
+  function handleSave() {
+    console.log("save");
+  }
+
+  const buttonSave = (
+    <BoxButtonOnFooter>
+      <ButtonCustom onPress={handleSave}>Selanjutnya</ButtonCustom>
+    </BoxButtonOnFooter>
+  );
+
+  return (
+    <ViewWrapper footerComponent={buttonSave}>
+      {/* <TextCustom>Portofolio Create {id}</TextCustom> */}
+      <StackCustom>
+        <InformationBox text="Lengkapi data bisnis anda." />
+        <TextInputCustom
+          required
+          label="Nama Bisnis"
+          placeholder="Masukkan nama bisnis"
+        />
+        <SelectCustom
+          label="Bidang Usaha"
+          required
+          data={dummyMasterBidangBisnis.map((item) => ({
+            label: item.name,
+            value: item.id,
+          }))}
+          value=""
+          onChange={(value) => console.log(value)}
+        />
+        <Grid>
+          <Grid.Col span={10}>
+            <SelectCustom
+              label="Sub Bidang Usaha"
+              required
+              data={dummyMasterSubBidangBisnis.map((item) => ({
+                label: item.name,
+                value: item.id,
+              }))}
+              value=""
+              onChange={(value) => console.log(value)}
+            />
+          </Grid.Col>
+          <Grid.Col
+            span={2}
+            style={{ alignItems: "center", justifyContent: "center" }}
+          >
+            <TouchableOpacity onPress={() => console.log("delete")}>
+              <Ionicons name="trash" size={24} color={MainColor.red} />
+            </TouchableOpacity>
+          </Grid.Col>
+        </Grid>
+        <ButtonCenteredOnly onPress={() => console.log("add")}>
+          Tambah Pilihan
+        </ButtonCenteredOnly>
+        <Spacing />
+        <TextInputCustom
+          required
+          label="Alamat Bisnis"
+          placeholder="Masukkan alamat bisnis"
+        />
+        <View>
+          <View style={{ flexDirection: "row", alignItems: "center" }}>
+            <TextCustom semiBold style={{ color: MainColor.white_gray }}>
+              Nomor Telepon
+            </TextCustom>
+            <Text style={{ color: "red" }}> *</Text>
+          </View>
+          <Spacing height={5} />
+          <PhoneInput
+            value={inputValue}
+            onChangePhoneNumber={handleInputValue}
+            selectedCountry={selectedCountry}
+            onChangeSelectedCountry={handleSelectedCountry}
+            defaultCountry="ID"
+            placeholder="xxx-xxx-xxx"
+          />
+        </View>
+        <Spacing />
+        <TextAreaCustom
+          label="Deskripsi Bisnis"
+          placeholder="Masukkan deskripsi bisnis"
+          value={data.deskripsi}
+          onChangeText={(value: any) => setData({ ...data, deskripsi: value })}
+          autosize
+          minRows={2}
+          maxRows={5}
+          required
+          showCount
+          maxLength={100}
+        />
+        <Spacing />
+        <InformationBox text="Upload logo bisnis anda untuk di tampilaka pada portofolio." />
+        <LandscapeFrameUploaded />
+        <ButtonCenteredOnly icon="upload" onPress={() => console.log("upload")}>
+          Upload
+        </ButtonCenteredOnly>
+        <Spacing height={40} />
+        <InformationBox text="Isi hanya pada sosial media yang anda miliki." />
+        <TextInputCustom
+          label="Tiktok"
+          placeholder="Masukkan username tiktok"
+        />
+        <TextInputCustom
+          label="Facebook"
+          placeholder="Masukkan username facebook"
+        />
+        <TextInputCustom
+          label="Instagram"
+          placeholder="Masukkan username instagram"
+        />
+        <TextInputCustom
+          label="Twitter"
+          placeholder="Masukkan username twitter"
+        />
+        <TextInputCustom
+          label="Youtube"
+          placeholder="Masukkan username youtube"
+        />
+        <Spacing />
+      </StackCustom>
+    </ViewWrapper>
+  );
+}

app/(application)/(user)/profile/[id]/create.tsx

@@ -7,10 +7,10 @@ import {
   TextInputCustom,
   ViewWrapper,
 } from "@/components";
+import BoxButtonOnFooter from "@/components/Box/BoxButtonOnFooter";
 import InformationBox from "@/components/Box/InformationBox";
 import ButtonUpload from "@/components/Button/ButtonUpload";
 import LandscapeFrameUploaded from "@/components/Image/LandscapeFrameUploaded";
-import { GStyles } from "@/styles/global-styles";
 import { router, useLocalSearchParams } from "expo-router";
 import { useState } from "react";
 import { View } from "react-native";
@@ -30,16 +30,14 @@ export default function CreateProfile() {
   };
 
   const footerComponent = (
-    <View style={GStyles.bottomBar}>
-      <View style={GStyles.bottomBarContainer}>
-        <ButtonCustom
-          onPress={handlerSave}
-          // disabled={!data.name || !data.email || !data.address || !data.gender}
-        >
-          Simpan
-        </ButtonCustom>
-      </View>
-    </View>
+    <BoxButtonOnFooter>
+      <ButtonCustom
+        onPress={handlerSave}
+        // disabled={!data.name || !data.email || !data.address || !data.gender}
+      >
+        Simpan
+      </ButtonCustom>
+    </BoxButtonOnFooter>
   );
 
   return (

app/(application)/(user)/profile/[id]/edit.tsx

@@ -6,6 +6,7 @@ import {
   TextInputCustom,
   ViewWrapper,
 } from "@/components";
+import BoxButtonOnFooter from "@/components/Box/BoxButtonOnFooter";
 import { router, useLocalSearchParams } from "expo-router";
 import { useState } from "react";
 import { StyleSheet } from "react-native";
@@ -44,15 +45,17 @@ export default function ProfileEdit() {
 
   return (
     <ViewWrapper
-      bottomBarComponent={
-        <ButtonCustom
-          disabled={
-            !data.nama || !data.email || !data.alamat || !data.selectedValue
-          }
-          onPress={handleSave}
-        >
-          Simpan
-        </ButtonCustom>
+      footerComponent={
+        <BoxButtonOnFooter>
+          <ButtonCustom
+            // disabled={
+            //   !data.nama || !data.email || !data.alamat || !data.selectedValue
+            // }
+            onPress={handleSave}
+          >
+            Simpan
+          </ButtonCustom>
+        </BoxButtonOnFooter>
       }
     >
       <StackCustom gap={"xs"}>