chore: Initial Commit

feat: Gestion des inscriptions [#1]
feat(frontend): Création des vues pour le paramétrage de l'école [#2]
feat: Gestion du login [#6]
fix: Correction lors de la migration des modèle [#8]
feat: Révision du menu principal [#9]
feat: Ajout d'un footer [#10]
feat: Création des dockers compose pour les environnements de
développement et de production [#12]
doc(ci): Mise en place de Husky et d'un suivi de version automatique [#14]

Front-End/src/components/ScheduleNavigation.js

@@ -0,0 +1,170 @@
+import { useState } from 'react';
+import { usePlanning } from '@/context/PlanningContext';
+import { Plus, Edit2, Eye, EyeOff, Check, X } from 'lucide-react';
+
+export default function ScheduleNavigation() {
+  const { schedules, selectedSchedule, setSelectedSchedule, hiddenSchedules, toggleScheduleVisibility, addSchedule, updateSchedule } = usePlanning();
+  const [editingId, setEditingId] = useState(null);
+  const [editedName, setEditedName] = useState('');
+  const [editedColor, setEditedColor] = useState('');
+  const [isAddingNew, setIsAddingNew] = useState(false);
+  const [newSchedule, setNewSchedule] = useState({ name: '', color: '#10b981' });
+
+  const handleEdit = (schedule) => {
+    setEditingId(schedule.id);
+    setEditedName(schedule.name);
+    setEditedColor(schedule.color);
+  };
+
+  const handleSave = () => {
+    if (editingId) {
+      updateSchedule(editingId, {
+        ...schedules.find(s => s.id === editingId),
+        name: editedName,
+        color: editedColor
+      });
+      setEditingId(null);
+    }
+  };
+
+  const handleAddNew = () => {
+    if (newSchedule.name) {
+      addSchedule({
+        id: `schedule-${Date.now()}`,
+        ...newSchedule
+      });
+      setIsAddingNew(false);
+      setNewSchedule({ name: '', color: '#10b981' });
+    }
+  };
+
+  return (
+    <nav className="w-64 border-r p-4">
+      <div className="flex items-center justify-between mb-4">
+        <h2 className="font-semibold">Plannings</h2>
+        <button
+          onClick={() => setIsAddingNew(true)}
+          className="p-1 hover:bg-gray-100 rounded"
+        >
+          <Plus className="w-4 h-4" />
+        </button>
+      </div>
+
+      {isAddingNew && (
+        <div className="mb-4 p-2 border rounded">
+          <input
+            type="text"
+            value={newSchedule.name}
+            onChange={(e) => setNewSchedule(prev => ({ ...prev, name: e.target.value }))}
+            className="w-full p-1 mb-2 border rounded"
+            placeholder="Nom du planning"
+          />
+          <div className="flex gap-2 items-center mb-2">
+            <label className="text-sm">Couleur:</label>
+            <input
+              type="color"
+              value={newSchedule.color}
+              onChange={(e) => setNewSchedule(prev => ({ ...prev, color: e.target.value }))}
+              className="w-8 h-8"
+            />
+          </div>
+          <div className="flex justify-end gap-2">
+            <button
+              onClick={() => setIsAddingNew(false)}
+              className="p-1 hover:bg-gray-100 rounded"
+            >
+              <X className="w-4 h-4" />
+            </button>
+            <button
+              onClick={handleAddNew}
+              className="p-1 hover:bg-gray-100 rounded"
+            >
+              <Check className="w-4 h-4" />
+            </button>
+          </div>
+        </div>
+      )}
+
+      <ul className="space-y-2">
+        {schedules.map(schedule => (
+          <li
+            key={schedule.id}
+            className={`p-2 rounded ${
+              selectedSchedule === schedule.id ? 'bg-gray-100' : 'hover:bg-gray-50'
+            }`}
+          >
+            {editingId === schedule.id ? (
+              <div className="space-y-2">
+                <input
+                  type="text"
+                  value={editedName}
+                  onChange={(e) => setEditedName(e.target.value)}
+                  className="w-full p-1 border rounded"
+                />
+                <div className="flex gap-2 items-center">
+                  <label className="text-sm">Couleur:</label>
+                  <input
+                    type="color"
+                    value={editedColor}
+                    onChange={(e) => setEditedColor(e.target.value)}
+                    className="w-8 h-8"
+                  />
+                </div>
+                <div className="flex justify-end gap-2">
+                  <button
+                    onClick={() => setEditingId(null)}
+                    className="p-1 hover:bg-gray-100 rounded"
+                  >
+                    <X className="w-4 h-4" />
+                  </button>
+                  <button
+                    onClick={handleSave}
+                    className="p-1 hover:bg-gray-100 rounded"
+                  >
+                    <Check className="w-4 h-4" />
+                  </button>
+                </div>
+              </div>
+            ) : (
+              <div className="flex items-center justify-between">
+                <div
+                  className="flex items-center gap-2 flex-1 cursor-pointer"
+                  onClick={() => setSelectedSchedule(schedule.id)}
+                >
+                  <div
+                    className="w-3 h-3 rounded-full"
+                    style={{ backgroundColor: schedule.color }}
+                  />
+                  <span className={hiddenSchedules.includes(schedule.id) ? 'text-gray-400' : ''}>
+                    {schedule.name}
+                  </span>
+                </div>
+                <div className="flex gap-1">
+                  <button
+                    onClick={(e) => {
+                      e.stopPropagation(); // Empêcher la propagation du clic
+                      toggleScheduleVisibility(schedule.id);
+                    }}
+                    className="p-1 hover:bg-gray-100 rounded"
+                  >
+                    {hiddenSchedules.includes(schedule.id) ? (
+                      <EyeOff className="w-4 h-4" />
+                    ) : (
+                      <Eye className="w-4 h-4" />
+                    )}
+                  </button>
+                  <button
+                    onClick={() => handleEdit(schedule)}
+                    className="p-1 hover:bg-gray-100 rounded"
+                  >
+                    <Edit2 className="w-4 h-4" />
+                  </button>
+                </div>
+              </div>
+            )}
+          </li>
+        ))}
+      </ul>
+    </nav>
+  );
+}