From ce83e02f7b3e53ef2b859436432784d6eb69200d Mon Sep 17 00:00:00 2001 From: N3WT DE COMPET Date: Fri, 30 May 2025 16:15:28 +0200 Subject: [PATCH] refactor: Remplacement de quelques popup par les notifications --- Back-End/Auth/views.py | 4 +- Back-End/N3wtSchool/error.py | 2 +- .../subscriptions/createSubscription/page.js | 11 +- .../app/[locale]/admin/subscriptions/page.js | 53 ++++---- .../app/[locale]/users/password/new/page.js | 71 ++++------ .../app/[locale]/users/password/reset/page.js | 124 ++++++++---------- .../src/app/[locale]/users/subscribe/page.js | 33 ++--- 7 files changed, 137 insertions(+), 161 deletions(-) diff --git a/Back-End/Auth/views.py b/Back-End/Auth/views.py index 9594c74..76a58b0 100644 --- a/Back-End/Auth/views.py +++ b/Back-End/Auth/views.py @@ -487,7 +487,7 @@ class ResetPasswordView(APIView): } ) def post(self, request, code): - retourErreur = error.returnMessage[error.BAD_URL] + retourErreur = '' retour = '' newProfilConnection = JSONParser().parse(request) @@ -498,7 +498,7 @@ class ResetPasswordView(APIView): if profil: if datetime.strptime(util.convertToStr(util._now(), '%d-%m-%Y %H:%M'), '%d-%m-%Y %H:%M') > datetime.strptime(profil.datePeremption, '%d-%m-%Y %H:%M'): - retourErreur = error.returnMessage[error.EXPIRED_URL] % (_uuid) + retourErreur = error.returnMessage[error.EXPIRED_URL] elif validationOk: retour = error.returnMessage[error.PASSWORD_CHANGED] diff --git a/Back-End/N3wtSchool/error.py b/Back-End/N3wtSchool/error.py index 300a992..9ed28db 100644 --- a/Back-End/N3wtSchool/error.py +++ b/Back-End/N3wtSchool/error.py @@ -22,7 +22,7 @@ returnMessage = { DIFFERENT_PASWWORD: 'Les mots de passe ne correspondent pas', PROFIL_NOT_EXISTS: 'Aucun profil associé à cet utilisateur', MESSAGE_REINIT_PASSWORD: 'Un mail a été envoyé à l\'adresse \'%s\'', - EXPIRED_URL:'L\'URL a expiré. Effectuer à nouveau la demande de réinitialisation de mot de passe : http://localhost:3000/password/reset?uuid=%s', + EXPIRED_URL:'L\'URL a expiré. Effectuer à nouveau la demande de réinitialisation de mot de passe : http://localhost:3000/password/new', PASSWORD_CHANGED: 'Le mot de passe a été réinitialisé', WRONG_MAIL_FORMAT: 'L\'adresse mail est mal formatée', PROFIL_INACTIVE: 'Le profil n\'est pas actif', diff --git a/Front-End/src/app/[locale]/admin/subscriptions/createSubscription/page.js b/Front-End/src/app/[locale]/admin/subscriptions/createSubscription/page.js index 63735da..2510392 100644 --- a/Front-End/src/app/[locale]/admin/subscriptions/createSubscription/page.js +++ b/Front-End/src/app/[locale]/admin/subscriptions/createSubscription/page.js @@ -502,7 +502,11 @@ export default function CreateSubscriptionPage() { // Mode édition editRegisterForm(registerFormID, formData, csrfToken) .then((response) => { - logger.debug('Dossier mis à jour avec succès:', response); + showNotification( + "Dossier d'inscription mis à jour avec succès", + 'success', + 'Succès' + ); router.push(FE_ADMIN_SUBSCRIPTIONS_URL); }) .catch((error) => { @@ -613,6 +617,11 @@ export default function CreateSubscriptionPage() { Promise.all([...clonePromises, ...parentClonePromises]) .then(() => { // Redirection après succès + showNotification( + "Dossier d'inscription créé avec succès", + 'success', + 'Succès' + ); router.push(FE_ADMIN_SUBSCRIPTIONS_URL); }) .catch((error) => { diff --git a/Front-End/src/app/[locale]/admin/subscriptions/page.js b/Front-End/src/app/[locale]/admin/subscriptions/page.js index 5040221..ecc9a6b 100644 --- a/Front-End/src/app/[locale]/admin/subscriptions/page.js +++ b/Front-End/src/app/[locale]/admin/subscriptions/page.js @@ -52,6 +52,7 @@ import { HISTORICAL_FILTER, } from '@/utils/constants'; import AlertMessage from '@/components/AlertMessage'; +import { useNotification } from '@/context/NotificationContext'; export default function Page({ params: { locale } }) { const t = useTranslations('subscriptions'); @@ -91,8 +92,6 @@ export default function Page({ params: { locale } }) { const [isFilesModalOpen, setIsFilesModalOpen] = useState(false); const [selectedRegisterForm, setSelectedRegisterForm] = useState([]); - const [popupVisible, setPopupVisible] = useState(false); - const [popupMessage, setPopupMessage] = useState(''); const [confirmPopupVisible, setConfirmPopupVisible] = useState(false); const [confirmPopupMessage, setConfirmPopupMessage] = useState(''); const [confirmPopupOnConfirm, setConfirmPopupOnConfirm] = useState(() => {}); @@ -103,6 +102,7 @@ export default function Page({ params: { locale } }) { const csrfToken = useCsrfToken(); const router = useRouter(); const { selectedEstablishmentId } = useEstablishment(); + const { showNotification } = useNotification(); const openSepaUploadModal = (row) => { setSelectedRowForUpload(row); @@ -294,15 +294,21 @@ export default function Page({ params: { locale } }) { editRegisterForm(row.student.id, formData, csrfToken) .then((response) => { logger.debug('Mandat SEPA uploadé avec succès :', response); - setPopupMessage('Le mandat SEPA a été uploadé avec succès.'); - setPopupVisible(true); + showNotification( + 'Le mandat SEPA a été uploadé avec succès.', + 'success', + 'Succès' + ); setReloadFetch(true); closeSepaUploadModal(); }) .catch((error) => { logger.error("Erreur lors de l'upload du mandat SEPA :", error); - setPopupMessage("Erreur lors de l'upload du mandat SEPA."); - setPopupVisible(true); + showNotification( + "Erreur lors de l'upload du mandat SEPA.", + 'error', + 'Erreur' + ); }); }; @@ -321,21 +327,22 @@ export default function Page({ params: { locale } }) { archiveRegisterForm(id) .then((data) => { logger.debug('Success:', data); - setPopupMessage( - "Le dossier d'inscription a été correctement archivé" + showNotification( + "Le dossier d'inscription a été correctement archivé", + 'success', + 'Succès' ); - setPopupVisible(true); setRegistrationForms( registrationForms.filter((fiche) => fiche.id !== id) ); setReloadFetch(true); }) .catch((error) => { - logger.error('Error archiving data:', error); - setPopupMessage( - "Erreur lors de l'archivage du dossier d'inscription.\nContactez l'administrateur." + showNotification( + "Erreur lors de l'archivage du dossier d'inscription", + 'error', + 'Erreur' ); - setPopupVisible(true); }); setConfirmPopupVisible(false); }); @@ -350,16 +357,20 @@ export default function Page({ params: { locale } }) { sendRegisterForm(id) .then((data) => { logger.debug('Success:', data); - setPopupMessage("Le dossier d'inscription a été envoyé avec succès"); - setPopupVisible(true); + showNotification( + "Le dossier d'inscription a été envoyé avec succès", + 'success', + 'Succès' + ); setReloadFetch(true); }) .catch((error) => { logger.error('Error archiving data:', error); - setPopupMessage( - "Erreur lors de l'envoi du dossier d'inscription.\nContactez l'administrateur." + showNotification( + "Erreur lors de l'envoi du dossier d'inscription", + 'error', + 'Erreur' ); - setPopupVisible(true); }); setConfirmPopupVisible(false); }); @@ -836,12 +847,6 @@ export default function Page({ params: { locale } }) { ) : null} - setPopupVisible(false)} - uniqueConfirmButton={true} - /> { + const data = { email: formData.get('email') }; + sendNewPassword(data, csrfToken) + .then((data) => { + logger.debug('Success:', data); setUserFieldError(''); setErrorMessage(''); - setPopupMessage('Mot de passe réinitialisé avec succès !'); - setPopupConfirmAction(() => () => setPopupVisible(false)); - setPopupVisible(true); - }, 1000); // Simule un délai de traitement - } else { - const data = { email: formData.get('email') }; - sendNewPassword(data, csrfToken) - .then((data) => { - logger.debug('Success:', data); - setUserFieldError(''); - setErrorMessage(''); - if (data.errorMessage === '') { - setPopupMessage(data.message); - setPopupConfirmAction(() => () => setPopupVisible(false)); - setPopupVisible(true); - } else { - if (data.errorFields) { - setUserFieldError(data.errorFields.email); - } - if (data.errorMessage) { - setErrorMessage(data.errorMessage); - } + if (data.errorMessage === '') { + showNotification( + data.message, + 'success', + 'Succès' + ); + } else { + if (data.errorFields) { + setUserFieldError(data.errorFields.email); } - }) - .catch((error) => { - logger.error('Error fetching data:', error); - error = error.errorMessage; - logger.debug(error); - }); - } + if (data.errorMessage) { + showNotification( + data.errorMessage, + 'error', + 'Erreur' + ); + } + } + }) + .catch((error) => { + logger.error('Error fetching data:', error); + error = error.errorMessage; + logger.debug(error); + }); } if (isLoading === true) { @@ -112,12 +105,6 @@ export default function Page() { /> - setPopupVisible(false)} - /> ); } diff --git a/Front-End/src/app/[locale]/users/password/reset/page.js b/Front-End/src/app/[locale]/users/password/reset/page.js index d9cdec8..9ac0682 100644 --- a/Front-End/src/app/[locale]/users/password/reset/page.js +++ b/Front-End/src/app/[locale]/users/password/reset/page.js @@ -8,89 +8,83 @@ import { useSearchParams, useRouter } from 'next/navigation'; import InputTextIcon from '@/components/InputTextIcon'; import Loader from '@/components/Loader'; // Importez le composant Loader import Button from '@/components/Button'; // Importez le composant Button -import Popup from '@/components/Popup'; import { FE_USERS_LOGIN_URL } from '@/utils/Url'; import { KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires import { useCsrfToken } from '@/context/CsrfContext'; import { getResetPassword, resetPassword } from '@/app/actions/authAction'; import logger from '@/utils/logger'; - -const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true'; +import { useNotification } from '@/context/NotificationContext'; export default function Page() { const searchParams = useSearchParams(); + const { showNotification } = useNotification(); const uuid = searchParams.get('uuid'); const [errorMessage, setErrorMessage] = useState(''); const [password1FieldError, setPassword1FieldError] = useState(''); const [password2FieldError, setPassword2FieldError] = useState(''); const [isLoading, setIsLoading] = useState(false); - const [popupVisible, setPopupVisible] = useState(false); - const [popupMessage, setPopupMessage] = useState(''); const router = useRouter(); const csrfToken = useCsrfToken(); useEffect(() => { - if (useFakeData) { - setTimeout(() => { + getResetPassword(uuid) + .then((data) => { + logger.debug('Success:', data); + setIsLoading(true); + if (data.errorFields) { + setPassword1FieldError(data.errorFields.password1); + setPassword2FieldError(data.errorFields.password2); + } + if (data.errorMessage) { + setErrorMessage(data.errorMessage); + } setIsLoading(false); - }, 1000); - } else { - getResetPassword(uuid) - .then((data) => { + }) + .catch((error) => { + logger.error('Error fetching data:', error); + }); +}, []); + + function validate(formData) { + const data = { + password1: formData.get('password1'), + password2: formData.get('password2'), + }; + resetPassword(uuid, data, csrfToken) + .then((data) => { + if (data.errorMessage === '') { + setPassword1FieldError(''); + setPassword2FieldError(''); + setErrorMessage(''); + logger.debug('Success:', data); - setIsLoading(true); + showNotification( + data.message, + 'success', + 'Succès' + ); + router.push(`${FE_USERS_LOGIN_URL}`); + } else { + + if (data.errorMessage) { + showNotification( + data.errorMessage, + 'error', + 'Erreur' + ); + } if (data.errorFields) { setPassword1FieldError(data.errorFields.password1); setPassword2FieldError(data.errorFields.password2); } - if (data.errorMessage) { - setErrorMessage(data.errorMessage); - } - setIsLoading(false); - }) - .catch((error) => { - logger.error('Error fetching data:', error); - }); - } - }, []); - - function validate(formData) { - if (useFakeData) { - setTimeout(() => { - setPopupMessage('Mot de passe réinitialisé avec succès'); - setPopupVisible(true); - }, 1000); - } else { - const data = { - password1: formData.get('password1'), - password2: formData.get('password2'), - }; - resetPassword(uuid, data, csrfToken) - .then((data) => { - logger.debug('Success:', data); - setPassword1FieldError(''); - setPassword2FieldError(''); - setErrorMessage(''); - if (data.errorMessage === '') { - setPopupMessage(data.message); - setPopupVisible(true); - } else { - if (data.errorMessage) { - setErrorMessage(data.errorMessage); - } - if (data.errorFields) { - setPassword1FieldError(data.errorFields.password1); - setPassword2FieldError(data.errorFields.password2); - } - } - }) - .catch((error) => { - logger.error('Error fetching data:', error); - error = error.errorMessage; - logger.debug(error); - }); - } + } + }) + .catch((error) => { + logger.error('Error fetching data:', error); + error = error.errorMessage; + logger.debug(error); + }); } if (isLoading === true) { @@ -98,18 +92,6 @@ export default function Page() { } else { return ( <> - { - setPopupVisible(false); - router.push(`${FE_USERS_LOGIN_URL}`); - }} - onCancel={() => setPopupVisible(false)} - uniqueConfirmButton={true} - popupClassName="w-full max-w-xs sm:max-w-md" - />
diff --git a/Front-End/src/app/[locale]/users/subscribe/page.js b/Front-End/src/app/[locale]/users/subscribe/page.js index 7e16a09..f501f92 100644 --- a/Front-End/src/app/[locale]/users/subscribe/page.js +++ b/Front-End/src/app/[locale]/users/subscribe/page.js @@ -8,23 +8,22 @@ import { useSearchParams, useRouter } from 'next/navigation'; import InputTextIcon from '@/components/InputTextIcon'; import Loader from '@/components/Loader'; // Importez le composant Loader import Button from '@/components/Button'; // Importez le composant Button -import Popup from '@/components/Popup'; // Importez le composant Popup import { User, KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires import { FE_USERS_LOGIN_URL } from '@/utils/Url'; import { useCsrfToken } from '@/context/CsrfContext'; import { subscribe } from '@/app/actions/authAction'; import logger from '@/utils/logger'; +import { useNotification } from '@/context/NotificationContext'; export default function Page() { const searchParams = useSearchParams(); + const { showNotification } = useNotification(); const [errorMessage, setErrorMessage] = useState(''); const [userFieldError, setUserFieldError] = useState(''); const [password1FieldError, setPassword1FieldError] = useState(''); const [password2FieldError, setPassword2FieldError] = useState(''); const [isLoading, setIsLoading] = useState(false); - const [popupVisible, setPopupVisible] = useState(false); - const [popupMessage, setPopupMessage] = useState(''); const router = useRouter(); const csrfToken = useCsrfToken(); @@ -52,13 +51,19 @@ export default function Page() { setErrorMessage(''); if (isOK(data)) { setIsLoading(false); - setPopupMessage(data.message); - setPopupVisible(true); + showNotification( + data.message, + 'success', + 'Succès' + ); + router.push(`${FE_USERS_LOGIN_URL}`); } else { setIsLoading(false); - if (data.errorMessage) { - setErrorMessage(data.errorMessage); - } + showNotification( + data.errorMessage, + 'error', + 'Erreur' + ); if (data.errorFields) { setUserFieldError(data.errorFields.email); setPassword1FieldError(data.errorFields.password1); @@ -143,18 +148,6 @@ export default function Page() { />
- { - setPopupVisible(false); - router.push(`${FE_USERS_LOGIN_URL}`); - }} - onCancel={() => setPopupVisible(false)} - uniqueConfirmButton={true} - popupClassName="w-full max-w-xs sm:max-w-md" - /> ); }