import React, { useEffect, useState } from 'react';
import { fetchRegistrationFileGroups } from '@/app/actions/registerFileGroupAction';
import { useEstablishment } from '@/context/EstablishmentContext';

export default function RegistrationFileGroupList() {
  const [groups, setGroups] = useState([]);

  const { selectedEstablishmentId } = useEstablishment();

  useEffect(() => {
    fetchRegistrationFileGroups(selectedEstablishmentId).then((data) =>
      setGroups(data)
    );
  }, []);

  return (
    <div>
      <h2>Groupes de fichiers d&apos;inscription</h2>
      <ul>
        {groups.map((group) => (
          <li key={group.id}>{group.name}</li>
        ))}
      </ul>
    </div>
  );
}