refactor: Migrate Profile screens to NewWrapper_V2

- Replace ViewWrapper/NewWrapper with NewWrapper_V2 in all Profile screens
- Add enableKeyboardHandling to form screens (create, edit, detail-blocked)
- Wrap all TextInput/SelectCustom with View onStartShouldSetResponder
- Fix keyboard handling issues (footer lift, white area, input cutoff)
- Migrate 7 Profile screens: create, edit, index, detail-blocked, blocked-list, update-photo, update-background

Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>

app/(application)/(user)/profile/[id]/blocked-list.tsx

@@ -9,7 +9,7 @@ import {
 import ListEmptyComponent from "@/components/_ShareComponent/ListEmptyComponent";
 import ListLoaderFooterComponent from "@/components/_ShareComponent/ListLoaderFooterComponent";
 import ListSkeletonComponent from "@/components/_ShareComponent/ListSkeletonComponent";
-import NewWrapper from "@/components/_ShareComponent/NewWrapper";
+import { NewWrapper_V2 } from "@/components";
 import { MainColor } from "@/constants/color-palet";
 import { useAuth } from "@/hooks/use-auth";
 import { usePaginatedApi } from "@/hooks/use-paginated-api";
@@ -120,7 +120,7 @@ export default function ProfileBlockedList() {
 
   return (
     <>
-      <NewWrapper
+      <NewWrapper_V2
         // headerComponent={renderHeader()}
         listData={listData}
         renderItem={renderItem}

app/(application)/(user)/profile/[id]/detail-blocked.tsx

@@ -5,7 +5,7 @@ import {
   BoxButtonOnFooter,
   BoxWithHeaderSection,
   ButtonCustom,
-  NewWrapper,
+  NewWrapper_V2,
   StackCustom,
   TextCustom,
 } from "@/components";
@@ -46,7 +46,9 @@ export default function ProfileDetailBlocked() {
 
   return (
     <>
-      <NewWrapper
+      <NewWrapper_V2
+        enableKeyboardHandling
+        keyboardScrollOffset={100}
         footerComponent={
           <BoxButtonOnFooter>
             <ButtonCustom
@@ -86,7 +88,7 @@ export default function ProfileDetailBlocked() {
             </TextCustom>
           </StackCustom>
         </BoxWithHeaderSection>
-      </NewWrapper>
+      </NewWrapper_V2>
     </>
   );
 }

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

@@ -1,15 +1,16 @@
 import {
   ButtonCustom,
+  NewWrapper_V2,
   SelectCustom,
   StackCustom,
   TextInputCustom,
-  ViewWrapper,
 } from "@/components";
 import BoxButtonOnFooter from "@/components/Box/BoxButtonOnFooter";
 import { apiProfile, apiUpdateProfile } from "@/service/api-client/api-profile";
 import { IProfile } from "@/types/Type-Profile";
 import { router, useLocalSearchParams } from "expo-router";
 import { useEffect, useState } from "react";
+import { View } from "react-native";
 import Toast from "react-native-toast-message";
 
 export default function ProfileEdit() {
@@ -70,7 +71,9 @@ export default function ProfileEdit() {
   };
 
   return (
-    <ViewWrapper
+    <NewWrapper_V2
+      enableKeyboardHandling
+      keyboardScrollOffset={100}
       footerComponent={
         <BoxButtonOnFooter>
           <ButtonCustom isLoading={isLoading} onPress={handleUpdate}>
@@ -80,6 +83,7 @@ export default function ProfileEdit() {
       }
     >
       <StackCustom gap={"xs"}>
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             label="Nama"
             placeholder="Nama"
@@ -89,6 +93,8 @@ export default function ProfileEdit() {
             }}
             required
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             keyboardType="email-address"
             label="Email"
@@ -99,6 +105,8 @@ export default function ProfileEdit() {
             }}
             required
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             label="Alamat"
             placeholder="Alamat"
@@ -108,6 +116,8 @@ export default function ProfileEdit() {
             }}
             required
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <SelectCustom
             required
             label="Jenis Kelamin"
@@ -118,7 +128,8 @@ export default function ProfileEdit() {
               setData({ ...(data as any), jenisKelamin: value });
             }}
           />
+        </View>
       </StackCustom>
-    </ViewWrapper>
+    </NewWrapper_V2>
   );
 }

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

@@ -1,5 +1,5 @@
 /* eslint-disable react-hooks/exhaustive-deps */
-import { NewWrapper, StackCustom } from "@/components";
+import { NewWrapper_V2, StackCustom } from "@/components";
 import AppHeader from "@/components/_ShareComponent/AppHeader";
 import CustomSkeleton from "@/components/_ShareComponent/SkeletonCustom";
 import LeftButtonCustom from "@/components/Button/BackButton";
@@ -119,7 +119,7 @@ export default function Profile() {
         }}
       />
       {/* Main View */}
-      <NewWrapper
+      <NewWrapper_V2
         refreshControl={
           <RefreshControl
             refreshing={refreshing}
@@ -144,7 +144,7 @@ export default function Profile() {
             />
           </>
         )}
-      </NewWrapper>
+      </NewWrapper_V2>
 
       {/* Drawer Komponen Eksternal */}
       <DrawerCustom

app/(application)/(user)/profile/[id]/update-background.tsx

@@ -3,8 +3,8 @@ import {
   BoxButtonOnFooter,
   ButtonCenteredOnly,
   ButtonCustom,
+  NewWrapper_V2,
 } from "@/components";
-import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
 import API_STRORAGE from "@/constants/base-url-api-strorage";
 import DIRECTORY_ID from "@/constants/directory-id";
 import DUMMY_IMAGE from "@/constants/dummy-image-value";
@@ -127,7 +127,10 @@ export default function UpdateBackgroundProfile() {
   );
 
   return (
-    <ViewWrapper footerComponent={buttonFooter}>
+    <NewWrapper_V2
+      contentPaddingHorizontal={16}
+      footerComponent={buttonFooter}
+    >
       <BaseBox
         style={{ alignItems: "center", justifyContent: "center", height: 250 }}
       >
@@ -144,6 +147,6 @@ export default function UpdateBackgroundProfile() {
       >
         Update
       </ButtonCenteredOnly>
-    </ViewWrapper>
+    </NewWrapper_V2>
   );
 }

app/(application)/(user)/profile/[id]/update-photo.tsx

@@ -3,8 +3,8 @@ import {
   BoxButtonOnFooter,
   ButtonCenteredOnly,
   ButtonCustom,
+  NewWrapper_V2,
 } from "@/components";
-import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
 import API_STRORAGE from "@/constants/base-url-api-strorage";
 import DIRECTORY_ID from "@/constants/directory-id";
 import DUMMY_IMAGE from "@/constants/dummy-image-value";
@@ -125,7 +125,10 @@ export default function UpdatePhotoProfile() {
   );
 
   return (
-    <ViewWrapper footerComponent={buttonFooter}>
+    <NewWrapper_V2
+      contentPaddingHorizontal={16}
+      footerComponent={buttonFooter}
+    >
       <BaseBox
         style={{ alignItems: "center", justifyContent: "center", height: 250 }}
       >
@@ -143,6 +146,6 @@ export default function UpdatePhotoProfile() {
       >
         Upload
       </ButtonCenteredOnly>
-    </ViewWrapper>
+    </NewWrapper_V2>
   );
 }

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

@@ -2,11 +2,11 @@ import {
     BaseBox,
     ButtonCenteredOnly,
     ButtonCustom,
+    NewWrapper_V2,
     SelectCustom,
     Spacing,
     StackCustom,
     TextInputCustom,
-    ViewWrapper,
 } from "@/components";
 import BoxButtonOnFooter from "@/components/Box/BoxButtonOnFooter";
 import InformationBox from "@/components/Box/InformationBox";
@@ -155,7 +155,11 @@ export default function CreateProfile() {
   );
 
   return (
-    <ViewWrapper footerComponent={footerComponent}>
+    <NewWrapper_V2
+      enableKeyboardHandling
+      keyboardScrollOffset={100}
+      footerComponent={footerComponent}
+    >
       <StackCustom>
         <InformationBox text="Upload foto profile anda." />
         <View style={{ alignItems: "center" }}>
@@ -204,6 +208,7 @@ export default function CreateProfile() {
         </View>
 
         <Spacing />
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             required
             label="Nama"
@@ -211,6 +216,8 @@ export default function CreateProfile() {
             value={data.name}
             onChangeText={(text) => setData({ ...data, name: text })}
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             keyboardType="email-address"
             required
@@ -219,6 +226,8 @@ export default function CreateProfile() {
             value={data.email}
             onChangeText={(text) => setData({ ...data, email: text })}
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <TextInputCustom
             required
             label="Alamat"
@@ -226,6 +235,8 @@ export default function CreateProfile() {
             value={data.alamat}
             onChangeText={(text) => setData({ ...data, alamat: text })}
           />
+        </View>
+        <View onStartShouldSetResponder={() => true}>
           <SelectCustom
             label="Jenis Kelamin"
             placeholder="Pilih jenis kelamin"
@@ -239,8 +250,9 @@ export default function CreateProfile() {
               setData({ ...(data as any), jenisKelamin: value })
             }
           />
+        </View>
         <Spacing />
       </StackCustom>
-    </ViewWrapper>
+    </NewWrapper_V2>
   );
 }