Merge remote-tracking branch 'origin/WIP_Inscriptions' into develop

Front-End/src/components/Structure/Configuration/ClassesSection.js

@@ -1,13 +1,4 @@
-import {
-  Trash2,
-  Edit3,
-  Plus,
-  ZoomIn,
-  Users,
-  Check,
-  X,
-  Hand,
-} from 'lucide-react';
+import { Trash2, Edit3, ZoomIn, Users, Check, X, Hand } from 'lucide-react';
 import React, { useState, useEffect } from 'react';
 import Table from '@/components/Table';
 import Popup from '@/components/Popup';
@@ -21,6 +12,7 @@ import { HTML5Backend } from 'react-dnd-html5-backend';
 import { ESTABLISHMENT_ID } from '@/utils/Url';
 import logger from '@/utils/logger';
 import ClasseDetails from '@/components/ClasseDetails';
+import SectionHeader from '@/components/SectionHeader';
 
 const ItemTypes = {
   TEACHER: 'teacher',
@@ -553,19 +545,13 @@ const ClassesSection = ({
   return (
     <DndProvider backend={HTML5Backend}>
       <div className="space-y-4">
-        <div className="flex justify-between items-center">
-          <div className="flex items-center mb-4">
-            <Users className="w-6 h-6 text-emerald-500 mr-2" />
-            <h2 className="text-xl font-semibold">Classes</h2>
-          </div>
-          <button
-            type="button"
-            onClick={handleAddClass}
-            className="text-emerald-500 hover:text-emerald-700"
-          >
-            <Plus className="w-5 h-5" />
-          </button>
-        </div>
+        <SectionHeader
+          icon={Users}
+          title="Liste des classes"
+          description="Gérez les classes de votre école"
+          button={true}
+          onClick={handleAddClass}
+        />
         <Table
           data={newClass ? [newClass, ...classes] : classes}
           columns={columns}

Front-End/src/components/Structure/Configuration/SpecialitiesSection.js

@@ -1,4 +1,4 @@
-import { Plus, Trash2, Edit3, Check, X, BookOpen } from 'lucide-react';
+import { Trash2, Edit3, Check, X, BookOpen } from 'lucide-react';
 import { useState } from 'react';
 import Table from '@/components/Table';
 import Popup from '@/components/Popup';
@@ -6,7 +6,9 @@ import InputTextWithColorIcon from '@/components/InputTextWithColorIcon';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import SpecialityItem from '@/components/Structure/Configuration/SpecialityItem';
+import { useEstablishment } from '@/context/EstablishmentContext';
 import logger from '@/utils/logger';
+import SectionHeader from '@/components/SectionHeader';
 
 const SpecialitiesSection = ({
   specialities,
@@ -26,6 +28,8 @@ const SpecialitiesSection = ({
   const [removePopupMessage, setRemovePopupMessage] = useState('');
   const [removePopupOnConfirm, setRemovePopupOnConfirm] = useState(() => {});
 
+  const { selectedEstablishmentId } = useEstablishment();
+
   // Récupération des messages d'erreur
   const getError = (field) => {
     return localErrors?.[field]?.[0];
@@ -49,7 +53,13 @@ const SpecialitiesSection = ({
 
   const handleSaveNewSpeciality = () => {
     if (newSpeciality.name) {
-      handleCreate(newSpeciality)
+      // Ajouter l'ID de l'établissement à la nouvelle spécialité
+      const specialityData = {
+        ...newSpeciality,
+        establishment: selectedEstablishmentId, // Inclure l'ID de l'établissement
+      };
+
+      handleCreate(specialityData)
         .then((createdSpeciality) => {
           setSpecialities([createdSpeciality, ...specialities]);
           setNewSpeciality(null);
@@ -234,19 +244,13 @@ const SpecialitiesSection = ({
   return (
     <DndProvider backend={HTML5Backend}>
       <div className="space-y-4">
-        <div className="flex justify-between items-center">
-          <div className="flex items-center mb-4">
-            <BookOpen className="w-6 h-6 text-emerald-500 mr-2" />
-            <h2 className="text-xl font-semibold">Spécialités</h2>
-          </div>
-          <button
-            type="button"
-            onClick={handleAddSpeciality}
-            className="text-emerald-500 hover:text-emerald-700"
-          >
-            <Plus className="w-5 h-5" />
-          </button>
-        </div>
+        <SectionHeader
+          icon={BookOpen}
+          title="Liste des spécialités"
+          description="Gérez les spécialités de votre école"
+          button={true}
+          onClick={handleAddSpeciality}
+        />
         <Table
           data={newSpeciality ? [newSpeciality, ...specialities] : specialities}
           columns={columns}

Front-End/src/components/Structure/Configuration/StructureManagement.js

@@ -22,9 +22,9 @@ const StructureManagement = ({
   handleDelete,
 }) => {
   return (
-    <div className="max-w-8xl mx-auto p-4 mt-6 space-y-8">
+    <div className="w-full mx-auto mt-6">
       <ClassesProvider>
-        <div className="w-2/5 p-4 bg-white rounded-lg shadow-md">
+        <div className="mt-8 w-2/5">
           <SpecialitiesSection
             specialities={specialities}
             setSpecialities={setSpecialities}
@@ -48,7 +48,7 @@ const StructureManagement = ({
             }
           />
         </div>
-        <div className="w-4/5 p-4 bg-white rounded-lg shadow-md">
+        <div className="w-4/5 mt-12">
           <TeachersSection
             teachers={teachers}
             setTeachers={setTeachers}
@@ -70,7 +70,7 @@ const StructureManagement = ({
             }
           />
         </div>
-        <div className="w-full p-4 bg-white rounded-lg shadow-md">
+        <div className="w-full mt-12">
           <ClassesSection
             classes={classes}
             setClasses={setClasses}

Front-End/src/components/Structure/Configuration/TeachersSection.js

@@ -1,18 +1,8 @@
 import React, { useState, useEffect } from 'react';
-import {
-  Plus,
-  Edit3,
-  Trash2,
-  GraduationCap,
-  Check,
-  X,
-  Hand,
-  Search,
-} from 'lucide-react';
+import { Edit3, Trash2, GraduationCap, Check, X, Hand } from 'lucide-react';
 import Table from '@/components/Table';
 import Popup from '@/components/Popup';
 import ToggleSwitch from '@/components/ToggleSwitch';
-import { createProfile, updateProfile } from '@/app/actions/authAction';
 import { useCsrfToken } from '@/context/CsrfContext';
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
@@ -20,8 +10,8 @@ import InputText from '@/components/InputText';
 import SpecialityItem from '@/components/Structure/Configuration/SpecialityItem';
 import TeacherItem from './TeacherItem';
 import logger from '@/utils/logger';
-import { fetchProfiles } from '@/app/actions/authAction';
 import { useEstablishment } from '@/context/EstablishmentContext';
+import SectionHeader from '@/components/SectionHeader';
 
 const ItemTypes = {
   SPECIALITY: 'speciality',
@@ -578,19 +568,13 @@ const TeachersSection = ({
   return (
     <DndProvider backend={HTML5Backend}>
       <div className="space-y-4">
-        <div className="flex justify-between items-center">
-          <div className="flex items-center mb-4">
-            <GraduationCap className="w-6 h-6 text-emerald-500 mr-2" />
-            <h2 className="text-xl font-semibold">Enseignants</h2>
-          </div>
-          <button
-            type="button"
-            onClick={handleAddTeacher}
-            className="text-emerald-500 hover:text-emerald-700"
-          >
-            <Plus className="w-5 h-5" />
-          </button>
-        </div>
+        <SectionHeader
+          icon={GraduationCap}
+          title="Liste des enseignants.es"
+          description="Gérez les enseignants.es de votre école"
+          button={true}
+          onClick={handleAddTeacher}
+        />
         <Table
           data={newTeacher ? [newTeacher, ...teachers] : teachers}
           columns={columns}