refactor: Refactorisation du login et de admin/subscription

This commit is contained in:
Luc SORIGNET
2025-01-12 16:34:32 +01:00
parent 427b6c7588
commit 41aa9d55d3
14 changed files with 254 additions and 250 deletions

View File

@ -2,11 +2,10 @@
import React, { useState, useEffect } from 'react';
import { useSearchParams } from 'next/navigation';
import InscriptionFormShared from '@/components/Inscription/InscriptionFormShared';
import { FE_ADMIN_SUBSCRIPTIONS_URL,
BE_SUBSCRIPTION_STUDENT_URL,
BE_SUBSCRIPTION_REGISTERFORM_URL } from '@/utils/Url';
import { FE_ADMIN_SUBSCRIPTIONS_URL } from '@/utils/Url';
import useCsrfToken from '@/hooks/useCsrfToken';
import { mockStudent } from '@/data/mockStudent';
import { editRegisterForm, fetchRegisterForm } from '@/app/lib/subscriptionAction';
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
@ -24,22 +23,21 @@ export default function Page() {
setInitialData(mockStudent);
setIsLoading(false);
} else {
fetch(`${BE_SUBSCRIPTION_STUDENT_URL}/${studentId}`) // Utilisation de studentId au lieu de codeDI
.then(response => response.json())
fetchRegisterForm(studentId)
.then(data => {
console.log('Fetched data:', data); // Pour le débogage
const formattedData = {
id: data.id,
nom: data.nom,
prenom: data.prenom,
adresse: data.adresse,
dateNaissance: data.dateNaissance,
lieuNaissance: data.lieuNaissance,
codePostalNaissance: data.codePostalNaissance,
nationalite: data.nationalite,
medecinTraitant: data.medecinTraitant,
niveau: data.niveau,
responsables: data.responsables || []
last_name: data.last_name,
first_name: data.first_name,
address: data.address,
birth_date: data.birth_date,
birth_place: data.birth_place,
birth_postal_code: data.birth_postal_code,
nationality: data.nationality,
attending_physician: data.attending_physician,
level: data.level,
guardians: data.guardians || []
};
setInitialData(formattedData);
setIsLoading(false);
@ -58,18 +56,8 @@ export default function Page() {
}
try {
const response = await fetch(`${BE_SUBSCRIPTION_REGISTERFORM_URL}/${studentId}`, { // Utilisation de studentId
method: 'PUT',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': csrfToken
},
credentials: 'include',
body: JSON.stringify(data),
});
const result = await response.json();
const result = await editRegisterForm(studentId, data, csrfToken);
// Utilisation de studentId
console.log('Success:', result);
// Redirection après succès
window.location.href = FE_ADMIN_SUBSCRIPTIONS_URL;

View File

@ -21,7 +21,7 @@ import {
PENDING,
SUBSCRIBED,
ARCHIVED,
fetchRegisterForm,
fetchRegisterForms,
createRegisterForm,
sendRegisterForm,
archiveRegisterForm,
@ -159,13 +159,13 @@ const registerFormArchivedDataHandler = (data) => {
useEffect(() => {
const fetchDataAndSetState = () => {
if (!useFakeData) {
fetchRegisterForm(PENDING, currentPage, itemsPerPage, searchTerm)
fetchRegisterForms(PENDING, currentPage, itemsPerPage, searchTerm)
.then(registerFormPendingDataHandler)
.catch(requestErrorHandler)
fetchRegisterForm(SUBSCRIBED)
fetchRegisterForms(SUBSCRIBED)
.then(registerFormSubscribedDataHandler)
.catch(requestErrorHandler)
fetchRegisterForm(ARCHIVED)
fetchRegisterForms(ARCHIVED)
.then(registerFormArchivedDataHandler)
.catch(requestErrorHandler)
} else {
@ -184,7 +184,7 @@ const registerFormArchivedDataHandler = (data) => {
// Modifier le useEffect pour la recherche
useEffect(() => {
const timeoutId = setTimeout(() => {
fetchRegisterForm(PENDING, currentPage, itemsPerPage, searchTerm)
fetchRegisterForms(PENDING, currentPage, itemsPerPage, searchTerm)
.then(registerFormPendingDataHandler)
.catch(requestErrorHandler)
}, 500); // Debounce la recherche

View File

@ -5,7 +5,7 @@ import DropdownMenu from '@/components/DropdownMenu';
import { useRouter } from 'next/navigation'; // Ajout de l'importation
import { Bell, User, MessageSquare, LogOut, Settings, Home } from 'lucide-react'; // Ajout de l'importation de l'icône Home
import Logo from '@/components/Logo'; // Ajout de l'importation du composant Logo
import { FE_PARENTS_HOME_URL,FE_PARENTS_MESSAGERIE_URL,FE_PARENTS_SETTINGS_URL, BE_GESTIONINSCRIPTION_MESSAGES_URL } from '@/utils/Url'; // Ajout de l'importation de l'URL de la page d'accueil parent
import { FE_PARENTS_HOME_URL,FE_PARENTS_MESSAGERIE_URL,FE_PARENTS_SETTINGS_URL, BE_GESTIONMESSAGERIE_MESSAGES_URL } from '@/utils/Url'; // Ajout de l'importation de l'URL de la page d'accueil parent
import useLocalStorage from '@/hooks/useLocalStorage';
export default function Layout({
@ -19,7 +19,7 @@ export default function Layout({
useEffect(() => {
setUserId(userId);
fetch(`${BE_GESTIONINSCRIPTION_MESSAGES_URL}/${userId}`, {
fetch(`${BE_GESTIONMESSAGERIE_MESSAGES_URL}/${userId}`, {
headers: {
'Content-Type': 'application/json',
},

View File

@ -5,7 +5,8 @@ import Table from '@/components/Table';
import { Edit } from 'lucide-react';
import StatusLabel from '@/components/StatusLabel';
import useLocalStorage from '@/hooks/useLocalStorage';
import { BE_SUBSCRIPTION_CHILDRENS_URL , FE_PARENTS_EDIT_INSCRIPTION_URL } from '@/utils/Url';
import { FE_PARENTS_EDIT_INSCRIPTION_URL } from '@/utils/Url';
import { fetchChildren } from '@/app/lib/subscriptionAction';
export default function ParentHomePage() {
const [actions, setActions] = useState([]);
@ -17,34 +18,22 @@ export default function ParentHomePage() {
useEffect(() => {
if (!userId) return;
const fetchActions = async () => {
const response = await fetch('/api/actions');
const data = await response.json();
setActions(data);
};
const fetchEleves = async () => {
const response = await fetch(`${BE_SUBSCRIPTION_CHILDRENS_URL}/${userId}`);
const data = await response.json();
console.log(data);
setChildren(data);
};
fetchEleves();
fetchChildren(userId).then(data => {
setChildren(data);
});
}, [userId]);
function handleEdit(eleveId) {
// Logique pour éditer le dossier de l'élève
console.log(`Edit dossier for eleve id: ${eleveId}`);
console.log(`Edit dossier for student id: ${eleveId}`);
router.push(`${FE_PARENTS_EDIT_INSCRIPTION_URL}?id=${userId}&studentId=${eleveId}`);
}
const actionColumns = [
{ name: 'Action', transform: (row) => row.action },
];
const getShadowColor = (etat) => {
switch (etat) {
const getShadowColor = (status) => {
switch (status) {
case 1:
return 'shadow-blue-500'; // Couleur d'ombre plus visible
case 2:
@ -73,12 +62,12 @@ export default function ParentHomePage() {
<h2 className="text-xl font-semibold mb-4">Enfants</h2>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{children.map((child) => (
<div key={child.eleve.id} className={`border p-4 rounded shadow ${getShadowColor(child.etat)}`}>
<div key={child.student.id} className={`border p-4 rounded shadow ${getShadowColor(child.status)}`}>
<div className="flex justify-between items-center">
<h3 className="text-lg font-semibold">{child.eleve.nom} {child.eleve.prenom}</h3>
<Edit className="cursor-pointer" onClick={() => handleEdit(child.eleve.id)} />
<h3 className="text-lg font-semibold">{child.student.last_name} {child.student.first_name}</h3>
<Edit className="cursor-pointer" onClick={() => handleEdit(child.student.id)} />
</div>
<StatusLabel etat={child.etat } showDropdown={false}/>
<StatusLabel etat={child.status } showDropdown={false}/>
</div>
))}
</div>

View File

@ -8,9 +8,15 @@ import InputTextIcon from '@/components/InputTextIcon';
import Loader from '@/components/Loader'; // Importez le composant Loader
import Button from '@/components/Button'; // Importez le composant Button
import { User, KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
import { BE_AUTH_LOGIN_URL, FE_ADMIN_SUBSCRIPTIONS_EDIT_URL, FE_ADMIN_SUBSCRIPTIONS_URL, FE_PARENTS_HOME_URL, FE_USERS_NEW_PASSWORD_URL, FE_USERS_SUBSCRIBE_URL } from '@/utils/Url';
import {
FE_ADMIN_SUBSCRIPTIONS_EDIT_URL,
FE_ADMIN_SUBSCRIPTIONS_URL,
FE_PARENTS_HOME_URL,
FE_USERS_NEW_PASSWORD_URL } from '@/utils/Url';
import useLocalStorage from '@/hooks/useLocalStorage';
import useCsrfToken from '@/hooks/useCsrfToken';
import { login } from '@/app/lib/authAction';
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
export default function Page() {
@ -55,22 +61,11 @@ export default function Page() {
}
}
} else {
const request = new Request(
`${BE_AUTH_LOGIN_URL}`,
{
method:'POST',
headers: {
'Content-Type':'application/json',
'X-CSRFToken': csrfToken
},
body: JSON.stringify( {
email: formData.get('login'),
password: formData.get('password'),
}),
credentials: 'include',
}
);
fetch(request).then(response => response.json())
const data = {
email: formData.get('login'),
password: formData.get('password'),
}
login(data,csrfToken)
.then(data => {
console.log('Success:', data);
setUserFieldError("")

View File

@ -1,16 +1,17 @@
'use client'
import React, { useState, useEffect } from 'react';
import React, { useState } from 'react';
import DjangoCSRFToken from '@/components/DjangoCSRFToken'
import Logo from '@/components/Logo';
import { useSearchParams, useRouter } from 'next/navigation';
import { useSearchParams } 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 } from 'lucide-react'; // Importez directement les icônes nécessaires
import { BE_AUTH_NEW_PASSWORD_URL,FE_USERS_LOGIN_URL } from '@/utils/Url';
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
import useCsrfToken from '@/hooks/useCsrfToken';
import { sendNewPassword } from '@/app/lib/authAction';
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
@ -34,21 +35,8 @@ export default function Page() {
setPopupVisible(true);
}, 1000); // Simule un délai de traitement
} else {
const request = new Request(
`${BE_AUTH_NEW_PASSWORD_URL}`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-CSRFToken': csrfToken
},
credentials: 'include',
body: JSON.stringify({
email: formData.get('email')
}),
}
);
fetch(request).then(response => response.json())
const data = {email: formData.get('email')}
sendNewPassword(data, csrfToken)
.then(data => {
console.log('Success:', data);
setUserFieldError("");

View File

@ -9,9 +9,10 @@ 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 { BE_AUTH_RESET_PASSWORD_URL, FE_USERS_LOGIN_URL } from '@/utils/Url';
import { KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
import { KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
import useCsrfToken from '@/hooks/useCsrfToken';
import { getResetPassword, resetPassword } from '@/app/lib/authAction';
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
@ -34,12 +35,7 @@ export default function Page() {
setIsLoading(false);
}, 1000);
} else {
const url= `${BE_AUTH_RESET_PASSWORD_URL}/${uuid}`;
fetch(url, {
headers: {
'Content-Type': 'application/json',
},
}).then(response => response.json())
getResetPassword(uuid)
.then(data => {
console.log('Success:', data);
setIsLoading(true);
@ -65,22 +61,11 @@ export default function Page() {
setPopupVisible(true);
}, 1000);
} else {
const request = new Request(
`${BE_AUTH_RESET_PASSWORD_URL}/${uuid}`,
{
method:'POST',
headers: {
'Content-Type':'application/json',
'X-CSRFToken': csrfToken
},
credentials: 'include',
body: JSON.stringify( {
password1: formData.get('password1'),
password2: formData.get('password2'),
}),
}
);
fetch(request).then(response => response.json())
const data = {
password1: formData.get('password1'),
password2: formData.get('password2'),
}
resetPassword(uuid,data,csrfToken)
.then(data => {
console.log('Success:', data);
setPassword1FieldError("")

View File

@ -10,8 +10,9 @@ 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 { BE_AUTH_REGISTER_URL, FE_USERS_LOGIN_URL } from '@/utils/Url';
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
import useCsrfToken from '@/hooks/useCsrfToken';
import { subscribe } from '@/app/lib/authAction';
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
export default function Page() {
@ -21,7 +22,7 @@ export default function Page() {
const [userFieldError,setUserFieldError] = useState("")
const [password1FieldError,setPassword1FieldError] = useState("")
const [password2FieldError,setPassword2FieldError] = useState("")
const [isLoading, setIsLoading] = useState(true);
const [isLoading, setIsLoading] = useState(false);
const [popupVisible, setPopupVisible] = useState(false);
const [popupMessage, setPopupMessage] = useState("");
@ -30,6 +31,7 @@ export default function Page() {
useEffect(() => {
if (useFakeData) {
setIsLoading(true);
// Simuler une réponse réussie
const data = {
errorFields: {},
@ -40,33 +42,6 @@ export default function Page() {
setPassword2FieldError("")
setErrorMessage("")
setIsLoading(false);
} else {
const url= `${BE_AUTH_REGISTER_URL}`;
fetch(url, {
headers: {
'Content-Type': 'application/json',
},
}).then(response => response.json())
.then(data => {
console.log('Success:', data);
setUserFieldError("")
setPassword1FieldError("")
setPassword2FieldError("")
setErrorMessage("")
setIsLoading(true);
if(data.errorFields){
setUserFieldError(data.errorFields.email)
setPassword1FieldError(data.errorFields.password1)
setPassword2FieldError(data.errorFields.password2)
}
if(data.errorMessage){
setErrorMessage(data.errorMessage)
}
setIsLoading(false);
})
.catch(error => {
console.error('Error fetching data:', error);
});
}
}, []);
@ -74,7 +49,7 @@ export default function Page() {
return data.errorMessage === ""
}
function suscribe(formData) {
function subscribeFormSubmit(formData) {
if (useFakeData) {
// Simuler une réponse réussie
const data = {
@ -99,24 +74,12 @@ export default function Page() {
}
}
} else {
const request = new Request(
`${BE_AUTH_REGISTER_URL}`,
{
method:'POST',
headers: {
'Content-Type':'application/json',
'X-CSRFToken': csrfToken
},
credentials: 'include',
body: JSON.stringify( {
email: formData.get('login'),
password1: formData.get('password1'),
password2: formData.get('password2'),
}),
}
);
fetch(request).then(response => response.json())
.then(data => {
const data ={
email: formData.get('login'),
password1: formData.get('password1'),
password2: formData.get('password2'),
}
subscribe(data,csrfToken).then(data => {
console.log('Success:', data);
setUserFieldError("")
setPassword1FieldError("")
@ -153,7 +116,7 @@ export default function Page() {
<Logo className="h-150 w-150" />
</div>
<h1 className="text-2xl font-bold text-center mb-4">Nouveau profil</h1>
<form className="max-w-md mx-auto" onSubmit={(e) => { e.preventDefault(); suscribe(new FormData(e.target)); }}>
<form className="max-w-md mx-auto" onSubmit={(e) => { e.preventDefault(); subscribeFormSubmit(new FormData(e.target)); }}>
<DjangoCSRFToken csrfToken={csrfToken} />
<InputTextIcon name="login" type="text" IconItem={User} label="Identifiant" placeholder="Identifiant" errorMsg={userFieldError} className="w-full" />
<InputTextIcon name="password1" type="password" IconItem={KeySquare} label="Mot de passe" placeholder="Mot de passe" errorMsg={password1FieldError} className="w-full" />