zoriya/Chromacase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added scrollview for SettingsProfile

Browse Source
This commit is contained in:
Clément Le Bihan
2023-11-26 18:45:08 +01:00
parent 6a8fe074e0
commit 1fe7491bcd
1 changed files with 129 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/views/settings/SettingsProfile.tsx
+129 -122
View File
@@ -10,6 +10,7 @@ import { Google, PasswordCheck, SmsEdit, UserSquare, Verify } from 'iconsax-reac
import ChangeEmailForm from '../../components/forms/changeEmailForm'; import ChangeEmailForm from '../../components/forms/changeEmailForm';
import ChangePasswordForm from '../../components/forms/changePasswordForm'; import ChangePasswordForm from '../../components/forms/changePasswordForm';
import LogoutButtonCC from '../../components/UI/LogoutButtonCC'; import LogoutButtonCC from '../../components/UI/LogoutButtonCC';
import { ScrollView } from 'react-native';
const handleChangeEmail = async (newEmail: string): Promise<string> => { const handleChangeEmail = async (newEmail: string): Promise<string> => {
await API.updateUserEmail(newEmail); await API.updateUserEmail(newEmail);
@@ -32,132 +33,138 @@ const ProfileSettings = () => {
const user = userQuery.data; const user = userQuery.data;
return ( return (
<Column space={4} style={{ width: '100%' }}> <ScrollView>
<ElementList <Column space={4} style={{ width: '100%' }}>
elements={[ <ElementList
{ elements={[
icon: Google, {
type: 'text', icon: Google,
title: translate('settingsProfileTabGoogleSectionTitle'), type: 'text',
description: translate('settingsProfileTabGoogleSectionDescription'), title: translate('settingsProfileTabGoogleSectionTitle'),
data: { description: translate('settingsProfileTabGoogleSectionDescription'),
text: translate( data: {
user.googleID text: translate(
? 'settingsProfileTabGoogleSectionLinkedText' user.googleID
: 'settingsProfileTabGoogleSectionNotLinkedText' ? 'settingsProfileTabGoogleSectionLinkedText'
), : 'settingsProfileTabGoogleSectionNotLinkedText'
}, ),
},
{
icon: Verify,
type: 'text',
title: translate('settingsProfileTabVerifiedSectionTitle'),
description: translate('settingsProfileTabVerifiedSectionDescription'),
data: {
text: translate(
user.emailVerified
? 'settingsProfileTabVerifiedSectionVerifiedText'
: 'settingsProfileTabVerifiedSectionNotVerifiedText'
),
onPress: user.emailVerified
? undefined
: () =>
API.fetch({ route: '/auth/reverify', method: 'PUT' })
.then(() =>
Toast.show({
description: translate(
'settingsProfileTabVerifiedSectionVerificationToast'
),
})
)
.catch((e) => {
console.error(e);
Toast.show({
description: translate(
'settingsProfileTabVerifiedSectionVerificationToastError'
),
});
}),
},
},
{
icon: UserSquare,
type: 'text',
title: translate('settingsProfileTabAvatarSectionTitle'),
description: translate('settingsProfileTabAvatarSectionDescription'),
data: {
text: translate('settingsProfileTabAvatarSectionChangeItText'),
onPress: () => {
ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images,
aspect: [1, 1],
quality: 1,
base64: true,
}).then((result) => {
console.log(result);
const image = result.assets?.at(0);
if (!result.canceled && image) {
API.updateProfileAvatar(image)
.then(() => {
userQuery.refetch();
Toast.show({
description: translate(
'settingsProfileTabAvatarSectionUpdateToast'
),
});
})
.catch((e) => {
console.error(e);
Toast.show({
description: translate(
'settingsProfileTabAvatarSectionUpdateToastError'
),
});
});
}
});
}, },
}, },
}, {
{ icon: Verify,
icon: SmsEdit, type: 'text',
type: 'sectionDropdown', title: translate('settingsProfileTabVerifiedSectionTitle'),
title: translate('settingsProfileTabChangeEmailSectionTitle'), description: translate('settingsProfileTabVerifiedSectionDescription'),
description: translate('settingsProfileTabChangeEmailSectionDescription'), data: {
data: { text: translate(
value: true, user.emailVerified
section: [ ? 'settingsProfileTabVerifiedSectionVerifiedText'
<ChangeEmailForm : 'settingsProfileTabVerifiedSectionNotVerifiedText'
key={'ChangeEmailForm'} ),
onSubmit={(oldEmail, newEmail) => handleChangeEmail(newEmail)} onPress: user.emailVerified
/>, ? undefined
], : () =>
API.fetch({ route: '/auth/reverify', method: 'PUT' })
.then(() =>
Toast.show({
description: translate(
'settingsProfileTabVerifiedSectionVerificationToast'
),
})
)
.catch((e) => {
console.error(e);
Toast.show({
description: translate(
'settingsProfileTabVerifiedSectionVerificationToastError'
),
});
}),
},
}, },
}, {
{ icon: UserSquare,
icon: PasswordCheck, type: 'text',
type: 'sectionDropdown', title: translate('settingsProfileTabAvatarSectionTitle'),
title: translate('settingsProfileTabChangePasswordSectionTitle'), description: translate('settingsProfileTabAvatarSectionDescription'),
description: translate( data: {
'settingsProfileTabChangePasswordSectionDescription' text: translate('settingsProfileTabAvatarSectionChangeItText'),
), onPress: () => {
data: { ImagePicker.launchImageLibraryAsync({
value: true, mediaTypes: ImagePicker.MediaTypeOptions.Images,
section: [ aspect: [1, 1],
<ChangePasswordForm quality: 1,
key={'ChangePasswordForm'} base64: true,
onSubmit={(oldPassword, newPassword) => }).then((result) => {
handleChangePassword(oldPassword, newPassword) console.log(result);
} const image = result.assets?.at(0);
/>,
], if (!result.canceled && image) {
API.updateProfileAvatar(image)
.then(() => {
userQuery.refetch();
Toast.show({
description: translate(
'settingsProfileTabAvatarSectionUpdateToast'
),
});
})
.catch((e) => {
console.error(e);
Toast.show({
description: translate(
'settingsProfileTabAvatarSectionUpdateToastError'
),
});
});
}
});
},
},
}, },
}, {
]} icon: SmsEdit,
/> type: 'sectionDropdown',
<LogoutButtonCC isGuest={user.isGuest} buttonType={'filled'} /> title: translate('settingsProfileTabChangeEmailSectionTitle'),
</Column> description: translate(
'settingsProfileTabChangeEmailSectionDescription'
),
data: {
value: true,
section: [
<ChangeEmailForm
key={'ChangeEmailForm'}
onSubmit={(oldEmail, newEmail) =>
handleChangeEmail(newEmail)
}
/>,
],
},
},
{
icon: PasswordCheck,
type: 'sectionDropdown',
title: translate('settingsProfileTabChangePasswordSectionTitle'),
description: translate(
'settingsProfileTabChangePasswordSectionDescription'
),
data: {
value: true,
section: [
<ChangePasswordForm
key={'ChangePasswordForm'}
onSubmit={(oldPassword, newPassword) =>
handleChangePassword(oldPassword, newPassword)
}
/>,
],
},
},
]}
/>
<LogoutButtonCC isGuest={user.isGuest} buttonType={'filled'} />
</Column>
</ScrollView>
); );
}; };