From ffa6cd649443966a7dec2d909cdc1165fb5f22c9 Mon Sep 17 00:00:00 2001
From: T'JAMPENS QUENTIN p2406187 <pyramond69@gmail.com>
Date: Tue, 24 Feb 2026 14:47:36 +0100
Subject: [PATCH] Use Loading component

---
 src/pages/Volunteers/VolunteersPage.tsx | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/pages/Volunteers/VolunteersPage.tsx b/src/pages/Volunteers/VolunteersPage.tsx
index 869d6a5..ae43fbc 100644
--- a/src/pages/Volunteers/VolunteersPage.tsx
+++ b/src/pages/Volunteers/VolunteersPage.tsx
@@ -6,6 +6,7 @@ import ToolBar from "../../components/ToolBar/ToolBar";
 import filter from "../../utils/filter";
 import getUserById from "../../utils/users/getUserById";
 import User from "./interfaces/user.interface";
+import Loading from "../../components/ui/loading/loading";
 
 interface Filters {
     alphabetical: "asc" | "desc";
@@ -57,6 +58,7 @@ const VolunteerPage: React.FC = () => {
         fetchUsers();
     }, []);
 
+    if(loading) return <Loading />;
 
     return (
         <div className={styles.container}>
@@ -67,13 +69,9 @@ const VolunteerPage: React.FC = () => {
             />
 
             <div className={styles.usersList}>
-                {loading ? (
-                    <div className={styles.loading}>Chargement des bénévoles…</div>
-                ) : (
-                    filter(users, filters, "user").map((user: User) => (
+                {filter(users, filters, "user").map((user: User) => (
                         <VolunteerCard key={user.id} user={user} />
-                    ))
-                )}
+                ))}
             </div>
 
         </div>