diff --git a/src/features/admin/pages/ProfilePage.client.js b/src/features/admin/pages/ProfilePage.client.js index 948c73d..c508242 100644 --- a/src/features/admin/pages/ProfilePage.client.js +++ b/src/features/admin/pages/ProfilePage.client.js @@ -2,7 +2,7 @@ import { registerPage } from '../registry.js'; import { useState, useEffect, useRef } from 'react'; -import { Card, Input, Button, TabNav, UserAvatar } from '@zen/core/shared/components'; +import { Card, Input, Button, TabNav, UserAvatar, Modal } from '@zen/core/shared/components'; import { useToast } from '@zen/core/toast'; import AdminHeader from '../components/AdminHeader.js'; @@ -20,7 +20,7 @@ const ProfilePage = ({ user: initialUser }) => { const [uploadingImage, setUploadingImage] = useState(false); const [formData, setFormData] = useState({ name: initialUser?.name || '' }); - const [emailFormOpen, setEmailFormOpen] = useState(false); + const [emailModalOpen, setEmailModalOpen] = useState(false); const [emailFormData, setEmailFormData] = useState({ newEmail: '', password: '' }); const [emailLoading, setEmailLoading] = useState(false); const [pendingEmailMessage, setPendingEmailMessage] = useState(''); @@ -31,8 +31,7 @@ const ProfilePage = ({ user: initialUser }) => { const hasChanges = formData.name !== user?.name; - const handleEmailSubmit = async (e) => { - e.preventDefault(); + const handleEmailSubmit = async () => { if (!emailFormData.newEmail.trim()) { toast.error('Le nouveau courriel est requis'); return; @@ -53,7 +52,7 @@ const ProfilePage = ({ user: initialUser }) => { if (!response.ok || !data.success) throw new Error(data.error || data.message || 'Échec de la demande de changement de courriel'); toast.success(data.message); setPendingEmailMessage(data.message); - setEmailFormOpen(false); + setEmailModalOpen(false); setEmailFormData({ newEmail: '', password: '' }); } catch (error) { toast.error(error.message || 'Échec de la demande de changement de courriel'); @@ -188,48 +187,17 @@ const ProfilePage = ({ user: initialUser }) => { value={user?.email || ''} disabled readOnly + description={pendingEmailMessage || undefined} /> - {pendingEmailMessage ? ( -

{pendingEmailMessage}

- ) : ( + {!pendingEmailMessage && ( )} - {emailFormOpen && ( -
- setEmailFormData(prev => ({ ...prev, newEmail: value }))} - placeholder="nouvelle@adresse.com" - required - disabled={emailLoading} - /> - setEmailFormData(prev => ({ ...prev, password: value }))} - placeholder="Votre mot de passe" - required - disabled={emailLoading} - /> -
- - -
-
- )} { )} + + { setEmailModalOpen(false); setEmailFormData({ newEmail: '', password: '' }); }} + title="Modifier le courriel" + onSubmit={handleEmailSubmit} + submitLabel="Envoyer la confirmation" + loading={emailLoading} + size="sm" + > +
+ setEmailFormData(prev => ({ ...prev, newEmail: value }))} + placeholder="nouvelle@adresse.com" + required + disabled={emailLoading} + /> + setEmailFormData(prev => ({ ...prev, password: value }))} + placeholder="Votre mot de passe" + required + disabled={emailLoading} + /> +
+
); };