import React, { useState, useEffect, useMemo } from 'react';
import SpecialitiesSection from '@/components/Structure/Configuration/SpecialitiesSection';
import TeachersSection from '@/components/Structure/Configuration/TeachersSection';
import ClassesSection from '@/components/Structure/Configuration/ClassesSection';
import { ClassesProvider } from '@/context/ClassesContext';
import { SchoolYearFilterProvider, useSchoolYearFilter } from '@/context/SchoolYearFilterContext';
import SchoolYearFilter from '@/components/SchoolYearFilter';
import {
  BE_SCHOOL_SPECIALITIES_URL,
  BE_SCHOOL_TEACHERS_URL,
  BE_SCHOOL_SCHOOLCLASSES_URL,
} from '@/utils/Url';

const StructureManagementContent = ({
  specialities,
  setSpecialities,
  teachers,
  setTeachers,
  classes,
  setClasses,
  profiles,
  handleCreate,
  handleEdit,
  handleDelete,
}) => {
  const { activeYearFilter, setActiveYearFilter, filterByYear } = useSchoolYearFilter();

  // Les spécialités et enseignants ne sont plus historisés par année scolaire.
  const filteredSpecialities = specialities;
  const filteredTeachers = teachers;
  const filteredClasses = useMemo(() => filterByYear(classes), [classes, filterByYear]);

  return (
    <>
      {/* Spécialités + Enseignants : côte à côte sur desktop, empilés sur mobile */}
      <div className="mt-8 flex flex-col xl:flex-row gap-8">
        <div className="w-full xl:w-2/5">
          <SpecialitiesSection
            specialities={filteredSpecialities}
            allSpecialities={specialities}
            setSpecialities={setSpecialities}
            handleCreate={(newData) =>
              handleCreate(
                `${BE_SCHOOL_SPECIALITIES_URL}`,
                newData,
                setSpecialities
              )
            }
            handleEdit={(id, updatedData) =>
              handleEdit(
                `${BE_SCHOOL_SPECIALITIES_URL}`,
                id,
                updatedData,
                setSpecialities
              )
            }
            handleDelete={(id) =>
              handleDelete(`${BE_SCHOOL_SPECIALITIES_URL}`, id, setSpecialities)
            }
          />
        </div>
        <div className="w-full xl:flex-1">
          <TeachersSection
            teachers={filteredTeachers}
            allTeachers={teachers}
            setTeachers={setTeachers}
            specialities={filteredSpecialities}
            profiles={profiles}
            handleCreate={(newData) =>
              handleCreate(`${BE_SCHOOL_TEACHERS_URL}`, newData, setTeachers)
            }
            handleEdit={(id, updatedData) =>
              handleEdit(
                `${BE_SCHOOL_TEACHERS_URL}`,
                id,
                updatedData,
                setTeachers
              )
            }
            handleDelete={(id) =>
              handleDelete(`${BE_SCHOOL_TEACHERS_URL}`, id, setTeachers)
            }
          />
        </div>
      </div>
      <div className="w-full mt-8 xl:mt-12">
        <div className="mb-6">
          <SchoolYearFilter
            activeFilter={activeYearFilter}
            onFilterChange={setActiveYearFilter}
            showNextYear={true}
            showHistorical={true}
          />
        </div>
        <ClassesSection
          classes={filteredClasses}
          allClasses={classes}
          setClasses={setClasses}
          teachers={filteredTeachers}
          handleCreate={(newData) =>
            handleCreate(
              `${BE_SCHOOL_SCHOOLCLASSES_URL}`,
              newData,
              setClasses
            )
          }
          handleEdit={(id, updatedData) =>
            handleEdit(
              `${BE_SCHOOL_SCHOOLCLASSES_URL}`,
              id,
              updatedData,
              setClasses
            )
          }
          handleDelete={(id) =>
            handleDelete(`${BE_SCHOOL_SCHOOLCLASSES_URL}`, id, setClasses)
          }
        />
      </div>
    </>
  );
};

const StructureManagement = ({
  specialities,
  setSpecialities,
  teachers,
  setTeachers,
  classes,
  setClasses,
  profiles,
  handleCreate,
  handleEdit,
  handleDelete,
}) => {
  return (
    <div className="w-full">
      <SchoolYearFilterProvider>
        <ClassesProvider>
          <StructureManagementContent
            specialities={specialities}
            setSpecialities={setSpecialities}
            teachers={teachers}
            setTeachers={setTeachers}
            classes={classes}
            setClasses={setClasses}
            profiles={profiles}
            handleCreate={handleCreate}
            handleEdit={handleEdit}
            handleDelete={handleDelete}
          />
        </ClassesProvider>
      </SchoolYearFilterProvider>
    </div>
  );
};

export default StructureManagement;
