refactor: Affichage des notifications dans la partie "Users"

(login/new/reset)
This commit is contained in:
N3WT DE COMPET
2025-05-31 09:22:35 +02:00
parent 3a2455f918
commit e509625811
5 changed files with 49 additions and 88 deletions

View File

@ -6,12 +6,12 @@ import DjangoCSRFToken from '@/components/DjangoCSRFToken';
import Logo from '@/components/Logo';
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 Loader from '@/components/Loader';
import Button from '@/components/Button';
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
import { KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
import { KeySquare } from 'lucide-react';
import { useCsrfToken } from '@/context/CsrfContext';
import { getResetPassword, resetPassword } from '@/app/actions/authAction';
import { resetPassword } from '@/app/actions/authAction';
import logger from '@/utils/logger';
import { useNotification } from '@/context/NotificationContext';
@ -19,44 +19,20 @@ 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 router = useRouter();
const csrfToken = useCsrfToken();
useEffect(() => {
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);
})
.catch((error) => {
logger.error('Error fetching data:', error);
});
}, []);
function validate(formData) {
const data = {
password1: formData.get('password1'),
password2: formData.get('password2'),
};
setIsLoading(true);
resetPassword(uuid, data, csrfToken)
.then((data) => {
if (data.message !== '') {
setPassword1FieldError('');
setPassword2FieldError('');
setErrorMessage('');
logger.debug('Success:', data);
showNotification(
@ -66,34 +42,32 @@ export default function Page() {
);
router.push(`${FE_USERS_LOGIN_URL}`);
} else {
if (data.errorMessage) {
showNotification(
data.errorMessage,
'error',
'Erreur'
);
}
if (data.errorFields) {
showNotification(
data.errorMessage,
'error',
'Erreur'
);
} else if (data.errorFields) {
showNotification(
data.errorFields.password1,
'error',
'Erreur'
);
setPassword1FieldError(data.errorFields.password1);
setPassword2FieldError(data.errorFields.password2);
}
}
setIsLoading(false);
})
.catch((error) => {
logger.error('Error fetching data:', error);
error = error.errorMessage;
logger.debug(error);
setIsLoading(false);
});
}
if (isLoading === true) {
return <Loader />; // Affichez le composant Loader
return <Loader />;
} else {
return (
<>
@ -118,7 +92,6 @@ export default function Page() {
IconItem={KeySquare}
label="Mot de passe"
placeholder="Mot de passe"
errorMsg={password1FieldError}
className="w-full mb-5"
/>
<InputTextIcon
@ -127,10 +100,8 @@ export default function Page() {
IconItem={KeySquare}
label="Confirmation mot de passe"
placeholder="Confirmation mot de passe"
errorMsg={password2FieldError}
className="w-full"
/>
<label className="text-red-500">{errorMessage}</label>
<div className="form-group-submit mt-4">
<Button
text="Enregistrer"