wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: edit profile

Browse Source 
Deskripsi:
- update keyboard avoiding pada edit profile

No Issues
This commit is contained in:
amaliadwiy
2025-09-24 16:19:33 +08:00
parent 6cca0a3d08
commit 93c492ac71
1 changed files with 119 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

228
app/(application)/edit-profile.tsx
View File

@@ -10,11 +10,14 @@ import { apiEditProfile, apiGetProfile } from "@/lib/api";
import { setEntities } from "@/lib/entitiesSlice"; import { setEntities } from "@/lib/entitiesSlice";
import { useAuthSession } from "@/providers/AuthProvider"; import { useAuthSession } from "@/providers/AuthProvider";
import { MaterialCommunityIcons } from "@expo/vector-icons"; import { MaterialCommunityIcons } from "@expo/vector-icons";
import { useHeaderHeight } from "@react-navigation/elements";
import * as ImagePicker from "expo-image-picker"; import * as ImagePicker from "expo-image-picker";
import { router, Stack } from "expo-router"; import { router, Stack } from "expo-router";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { import {
Image, Image,
KeyboardAvoidingView,
Platform,
Pressable, Pressable,
SafeAreaView, SafeAreaView,
ScrollView, ScrollView,
@@ -37,6 +40,7 @@ type Props = {
}; };
export default function EditProfile() { export default function EditProfile() {
const headerHeight = useHeaderHeight()
const dispatch = useDispatch() const dispatch = useDispatch()
const entities = useSelector((state: any) => state.entities) const entities = useSelector((state: any) => state.entities)
const { token, decryptToken } = useAuthSession() const { token, decryptToken } = useAuthSession()
@@ -231,116 +235,122 @@ export default function EditProfile() {
), ),
}} }}
/> />
<ScrollView style={[Styles.h100]}> <KeyboardAvoidingView
<View style={[Styles.p15]}> style={[Styles.h100]}
<View style={{ justifyContent: "center", alignItems: "center" }}> behavior={Platform.OS === 'ios' ? 'padding' : undefined}
{ keyboardVerticalOffset={headerHeight}
selectedImage != undefined ? ( >
<Pressable onPress={pickImageAsync}> <ScrollView showsVerticalScrollIndicator={false}>
<Image <View style={[Styles.p15]}>
src={ <View style={{ justifyContent: "center", alignItems: "center" }}>
typeof selectedImage === "string" {
? selectedImage selectedImage != undefined ? (
: selectedImage.uri <Pressable onPress={pickImageAsync}>
} <Image
style={[Styles.userProfileBig]} src={
onError={() => { setErrorImg(true) }} typeof selectedImage === "string"
/> ? selectedImage
<View style={[Styles.absoluteIconPicker]}> : selectedImage.uri
<MaterialCommunityIcons name="image" color={'white'} size={15} /> }
</View> style={[Styles.userProfileBig]}
</Pressable> onError={() => { setErrorImg(true) }}
) : ( />
<Pressable onPress={pickImageAsync}> <View style={[Styles.absoluteIconPicker]}>
<Image <MaterialCommunityIcons name="image" color={'white'} size={15} />
source={errorImg ? require("../../assets/images/user.jpg") : { uri: `${ConstEnv.url_storage}/files/${data?.img}` }} </View>
style={[Styles.userProfileBig]} </Pressable>
onError={() => { setErrorImg(true) }} ) : (
/> <Pressable onPress={pickImageAsync}>
<View style={[Styles.absoluteIconPicker]}> <Image
<MaterialCommunityIcons name="image" color={'white'} size={15} /> source={errorImg ? require("../../assets/images/user.jpg") : { uri: `${ConstEnv.url_storage}/files/${data?.img}` }}
</View> style={[Styles.userProfileBig]}
</Pressable> onError={() => { setErrorImg(true) }}
) />
} <View style={[Styles.absoluteIconPicker]}>
<MaterialCommunityIcons name="image" color={'white'} size={15} />
</View>
</Pressable>
)
}
</View>
<SelectForm
label="Jabatan"
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
value={data?.nik}
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
value={data?.name}
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
value={data?.email}
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
value={data?.phone}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View> </View>
<SelectForm </ScrollView>
label="Jabatan" </KeyboardAvoidingView>
placeholder="Pilih Jabatan"
value={choosePosition.label}
required
onPress={() => {
setValChoose(choosePosition.val);
setValSelect("position");
setSelect(true);
}}
error={error.position}
errorText="Jabatan tidak boleh kosong"
/>
<InputForm
label="NIK"
type="numeric"
placeholder="NIK"
required
value={data?.nik}
error={error.nik}
errorText="NIK Harus 16 Karakter"
onChange={val => {
validationForm("nik", val)
}}
/>
<InputForm
label="Nama"
type="default"
placeholder="Nama"
required
value={data?.name}
error={error.name}
errorText="Nama tidak boleh kosong"
onChange={val => {
validationForm("name", val)
}}
/>
<InputForm
label="Email"
type="default"
placeholder="Email"
required
value={data?.email}
error={error.email}
errorText="Email tidak valid"
onChange={val => {
validationForm("email", val)
}}
/>
<InputForm
label="Nomor Telepon"
type="numeric"
placeholder="8XX-XXX-XXX"
required
itemLeft={<Text>+62</Text>}
value={data?.phone}
error={error.phone}
errorText="Nomor Telepon tidak valid"
onChange={val => {
validationForm("phone", val)
}}
/>
<SelectForm
label="Jenis Kelamin"
placeholder="Pilih Jenis Kelamin"
value={chooseGender.label}
required
onPress={() => {
setValChoose(chooseGender.val);
setValSelect("gender");
setSelect(true);
}}
error={error.gender}
errorText="Jenis Kelamin tidak boleh kosong"
/>
</View>
</ScrollView>
<ModalSelect <ModalSelect
category={valSelect} category={valSelect}