feat: Création d'un profile selector [#37,#38]

Front-End/src/components/Sidebar.js

@@ -1,7 +1,7 @@
 'use client'
 import React, { useState, useEffect } from 'react';
 import { useRouter } from 'next/navigation';
-import { useEstablishment } from '@/context/EstablishmentContext';
+import ProfileSelector from '@/components/ProfileSelector';
 
 const SidebarItem = ({ icon: Icon, text, active, url, onClick }) => (
   <div
@@ -15,9 +15,9 @@ const SidebarItem = ({ icon: Icon, text, active, url, onClick }) => (
   </div>
 );
 
-function Sidebar({ establishments, currentPage, items, onCloseMobile, onEstablishmentChange }) {
+function Sidebar({ currentPage, items, onCloseMobile, onEstablishmentChange }) {
   const router = useRouter();
-  const { selectedEstablishmentId, setSelectedEstablishmentId, setProfileRole } = useEstablishment();
+
   const [selectedItem, setSelectedItem] = useState(currentPage);
 
   useEffect(() => {
@@ -32,31 +32,15 @@ function Sidebar({ establishments, currentPage, items, onCloseMobile, onEstablis
     }
   };
 
-  const handleEstablishmentChange = (e) => {
-    const establishmentId = parseInt(e.target.value, 10);
-    setSelectedEstablishmentId(establishmentId);
-    const role = establishments.find(est => est.id === establishmentId)?.role_type;
-    setProfileRole(role);
-    onEstablishmentChange(establishmentId);
-  };
-
   return (
-    <div className="w-64 bg-white border-r h-full border-gray-200 py-6 px-4">
-      <div className="flex items-center mb-8 px-2">
-        <select
-          value={selectedEstablishmentId || ''}
-          onChange={handleEstablishmentChange}
-          className="form-select block w-full mt-1"
-        >
-          {establishments.map(establishment => (
-            <option key={establishment.id} value={establishment.id}>
-              {establishment.name}
-            </option>
-          ))}
-        </select>
+    <div className="w-64 bg-white border-r h-full border-gray-200">
+      <div className="border-b border-gray-200 ">
+        <ProfileSelector
+          onEstablishmentChange={onEstablishmentChange}
+          className="border-none"
+        />
       </div>
-
-      <nav className="space-y-1">
+      <nav className="space-y-1 px-4 py-6">
         {items.map((item) => (
           <SidebarItem
             key={item.id}