refactor: Refactorisation du login et de admin/subscription

2026-01-29 07:53:23 +00:00 · 2025-01-12 16:34:32 +01:00
parent 427b6c7588
commit 41aa9d55d3
14 changed files with 254 additions and 250 deletions
--- a/Front-End/src/app/[locale]/users/login/page.js
+++ b/Front-End/src/app/[locale]/users/login/page.js
@ -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("")
--- a/Front-End/src/app/[locale]/users/password/new/page.js
+++ b/Front-End/src/app/[locale]/users/password/new/page.js
@ -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("");
--- a/Front-End/src/app/[locale]/users/password/reset/page.js
+++ b/Front-End/src/app/[locale]/users/password/reset/page.js
@ -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("")
--- a/Front-End/src/app/[locale]/users/subscribe/page.js
+++ b/Front-End/src/app/[locale]/users/subscribe/page.js
@ -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" />