add section to update user email in parameters modal

This commit is contained in:
2026-03-28 18:56:24 +01:00
parent d91b7a7d0f
commit 5d7adadf94
@@ -12,6 +12,7 @@ import { useNavigate } from "react-router";
import toggleEmailNotifications from "../../../../utils/users/toggleEmailNotifications";
import toggleWebNotifications from "../../../../utils/users/toggleWebNotifications";
import updateUserPassword from "../../../../utils/users/updateUserPassword";
import updateUserEmail from "../../../../utils/users/updateUserEmail";
interface TaskType {
@@ -59,6 +60,7 @@ export default function SettingsModal() {
const [currentPassword, setCurrentPassword] = useState<string>('');
const [newPassword, setNewPassword] = useState<string>('');
const [newPasswordConfirm, setNewPasswordConfirm] = useState<string>('');
const [email, setEmail] = useState<string>('');
const handleLogout = (): void => {
logout();
@@ -120,6 +122,16 @@ export default function SettingsModal() {
}
};
const handleEmailUpdate = async () => {
try {
await updateUserEmail(email);
setEmail('');
update();
} catch (err) {
console.error(err);
}
};
return (
<>
@@ -139,7 +151,7 @@ export default function SettingsModal() {
<div className={styles.content}>
<div className={`glassBorder ${styles.section}`}>
<h3>Modifier les informations du compte</h3>
<div className={styles.test}>
<div>
<h4>Changer de Prénom</h4>
<TextInput
value={name}
@@ -148,7 +160,7 @@ export default function SettingsModal() {
/>
</div>
<div className={styles.test}>
<div>
<h4>Changer de nom</h4>
<TextInput
value={lastname}
@@ -157,7 +169,7 @@ export default function SettingsModal() {
/>
</div>
<div className={styles.test}>
<div>
<h4>Changer de numéro de téléphone</h4>
<TextInput
value={phone}
@@ -174,18 +186,29 @@ export default function SettingsModal() {
</Button>
</div>
<div className={`glassBorder ${styles.section}`}>
<h3>Changer l'adresse email</h3>
<div>
<h4>Nouvelle adresse email</h4>
<TextInput value={email} onChange={e => setEmail(e.target.value)} type="email" />
</div>
<Button className={styles.submitBtn} onClick={handleEmailUpdate}>
Confirmer
</Button>
</div>
<div className={`glassBorder ${styles.section}`}>
<h3>Changer le mot de passe</h3>
<div className={styles.test}>
<div>
<h4>Mot de passe actuel</h4>
<TextInput value={currentPassword} onChange={e => setCurrentPassword(e.target.value)} type="password" />
</div>
<div className={styles.test}>
<div>
<h4>Nouveau mot de passe</h4>
<TextInput value={newPassword} onChange={e => setNewPassword(e.target.value)} type="password" />
</div>
<div className={styles.test}>
<div>
<h4>Confirmer le nouveau mot de passe</h4>
<TextInput value={newPasswordConfirm} onChange={e => setNewPasswordConfirm(e.target.value)} type="password" />
</div>
@@ -202,7 +225,7 @@ export default function SettingsModal() {
<div className={`glassBorder ${styles.section}`}>
<h3>Notifications</h3>
<div className={styles.test}>
<div>
<h4>Notifications par email</h4>
<input
type="checkbox"
@@ -211,7 +234,7 @@ export default function SettingsModal() {
/>
</div>
<div className={styles.test}>
<div>
<h4>Notifications sur le site</h4>
<input
type="checkbox"