Checkpoint: Trois améliorations majeures pour la gestion des séquences :

✅ **1. Indicateur visuel de remplissage**
- Composant CapacityProgressBar avec barre de progression colorée
- Affichage "X / Y" avec pourcentage
- Couleurs automatiques : vert (<70%), orange (70-90%), rouge (>90%)
- Intégré dans la colonne capacité du tableau des séquences

✅ **2. Vue calendrier mensuel**
- Nouvelle page AdminCalendrier accessible depuis le menu
- Calendrier mensuel avec navigation (mois précédent/suivant, aujourd'hui)
- Affichage des séquences sur leurs dates respectives
- Dialog de détails au clic sur une séquence
- Vue complète avec toutes les informations (lieu, formateur, capacité, dates)

✅ **3. Système de rappels automatiques personnalisables**
- Tables rappels et rappelsEnvoyes créées
- Procédures tRPC complètes (list, create, update, delete)
- Page AdminRappels avec interface de gestion
- Configuration de rappels multiples (J-15, J-7, J-1, etc.)
- Templates d'emails personnalisables avec variables dynamiques
- Activation/désactivation des rappels
- Infrastructure prête pour l'envoi automatique (nécessite service de planification externe)

Ces améliorations facilitent grandement la planification et le suivi des formations.

.manus/db/db-query-1763564186793.json

@@ -0,0 +1,9 @@
+{
+  "query": "CREATE TABLE IF NOT EXISTS rappels (\n  id INT AUTO_INCREMENT PRIMARY KEY,\n  nom VARCHAR(255) NOT NULL,\n  joursAvant INT NOT NULL,\n  emailTemplate TEXT NOT NULL,\n  actif BOOLEAN DEFAULT TRUE NOT NULL,\n  createdAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL,\n  updatedAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP NOT NULL\n);\n\nCREATE TABLE IF NOT EXISTS rappelsEnvoyes (\n  id INT AUTO_INCREMENT PRIMARY KEY,\n  rappelId INT NOT NULL,\n  inscriptionId INT NOT NULL,\n  dateEnvoi TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL,\n  INDEX idx_rappel_inscription (rappelId, inscriptionId)\n);",
+  "command": "mysql --batch --raw --column-names --default-character-set=utf8mb4 --host gateway02.us-east-1.prod.aws.tidbcloud.com --port 4000 --user 4CrrYuB5tme73Qo.root --database 7PAT67UmWoxv8vwp8Bbcv6 --execute CREATE TABLE IF NOT EXISTS rappels (\n  id INT AUTO_INCREMENT PRIMARY KEY,\n  nom VARCHAR(255) NOT NULL,\n  joursAvant INT NOT NULL,\n  emailTemplate TEXT NOT NULL,\n  actif BOOLEAN DEFAULT TRUE NOT NULL,\n  createdAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL,\n  updatedAt TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP NOT NULL\n);\n\nCREATE TABLE IF NOT EXISTS rappelsEnvoyes (\n  id INT AUTO_INCREMENT PRIMARY KEY,\n  rappelId INT NOT NULL,\n  inscriptionId INT NOT NULL,\n  dateEnvoi TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL,\n  INDEX idx_rappel_inscription (rappelId, inscriptionId)\n);",
+  "rows": [],
+  "messages": [],
+  "stdout": "",
+  "stderr": "",
+  "execution_time_ms": 354
+}

client/src/App.tsx

@@ -9,11 +9,13 @@ import AdminRapportPublicCible from "./pages/AdminRapportPublicCible";
 import Admin from "./pages/Admin";
 import AdminFormations from "./pages/AdminFormations";
 import AdminSequences from "./pages/AdminSequences";
+import AdminCalendrier from "./pages/AdminCalendrier";
 import AdminApprenants from "./pages/AdminApprenants";
 import AdminSequenceInscrits from "./pages/AdminSequenceInscrits";
 import AdminUsers from "./pages/AdminUsers";
 import AdminEmailTemplates from "./pages/AdminEmailTemplates";
 import AdminEmailConfig from "./pages/AdminEmailConfig";
+import AdminRappels from "./pages/AdminRappels";
 import Inscription from "./pages/Inscription";
 
 function Router() {
@@ -25,11 +27,13 @@ function Router() {
       <Route path={"/admin"} component={Admin} />
       <Route path={"/admin/formations"} component={AdminFormations} />
       <Route path={"/admin/sequences"} component={AdminSequences} />
+      <Route path={"/admin/calendrier"} component={AdminCalendrier} />
       <Route path={"/admin/apprenants"} component={AdminApprenants} />
       <Route path={"/admin/sequences/:id/inscrits"} component={AdminSequenceInscrits} />
       <Route path={"/admin/users"} component={AdminUsers} />
       <Route path={"/admin/email-templates"} component={AdminEmailTemplates} />
       <Route path={"/admin/email-config"} component={AdminEmailConfig} />
+      <Route path={"/admin/rappels"} component={AdminRappels} />
       <Route path={"/404"} component={NotFound} />
       {/* Final fallback route */}
       <Route component={NotFound} />

client/src/components/CapacityProgressBar.tsx

@@ -0,0 +1,43 @@
+import { Progress } from "@/components/ui/progress";
+import { cn } from "@/lib/utils";
+
+interface CapacityProgressBarProps {
+  current: number;
+  max: number;
+  className?: string;
+}
+
+export function CapacityProgressBar({ current, max, className }: CapacityProgressBarProps) {
+  const percentage = max > 0 ? (current / max) * 100 : 0;
+  
+  // Définir la couleur en fonction du taux de remplissage
+  const getColorClass = () => {
+    if (percentage >= 90) return "bg-red-500";
+    if (percentage >= 70) return "bg-orange-500";
+    return "bg-green-500";
+  };
+  
+  const getTextColorClass = () => {
+    if (percentage >= 90) return "text-red-700";
+    if (percentage >= 70) return "text-orange-700";
+    return "text-green-700";
+  };
+
+  return (
+    <div className={cn("space-y-1", className)}>
+      <div className="flex items-center justify-between text-sm">
+        <span className={cn("font-medium", getTextColorClass())}>
+          {current} / {max}
+        </span>
+        <span className={cn("text-xs", getTextColorClass())}>
+          {Math.round(percentage)}%
+        </span>
+      </div>
+      <Progress 
+        value={percentage} 
+        className="h-2"
+        indicatorClassName={getColorClass()}
+      />
+    </div>
+  );
+}

client/src/components/DashboardLayout.tsx

@@ -21,7 +21,7 @@ import {
 } from "@/components/ui/sidebar";
 import { APP_LOGO, APP_TITLE, getLoginUrl } from "@/const";
 import { useIsMobile } from "@/hooks/useMobile";
-import { LayoutDashboard, LogOut, PanelLeft, Users, GraduationCap, Calendar, BarChart3, UserCog, Mail, Settings } from "lucide-react";
+import { LayoutDashboard, LogOut, PanelLeft, Users, GraduationCap, Calendar, CalendarDays, BarChart3, UserCog, Mail, Settings, Bell } from "lucide-react";
 import { CSSProperties, useEffect, useRef, useState } from "react";
 import { useLocation } from "wouter";
 import { DashboardLayoutSkeleton } from './DashboardLayoutSkeleton';
@@ -31,10 +31,12 @@ const menuItems = [
   { icon: LayoutDashboard, label: "Tableau de bord", path: "/admin" },
   { icon: GraduationCap, label: "Formations", path: "/admin/formations" },
   { icon: Calendar, label: "Séquences", path: "/admin/sequences" },
+  { icon: CalendarDays, label: "Calendrier", path: "/admin/calendrier" },
   { icon: Users, label: "Apprenants", path: "/admin/apprenants" },
   { icon: UserCog, label: "Utilisateurs", path: "/admin/users" },
   { icon: Mail, label: "Templates d'emails", path: "/admin/email-templates" },
   { icon: Settings, label: "Configuration SMTP", path: "/admin/email-config" },
+  { icon: Bell, label: "Rappels automatiques", path: "/admin/rappels" },
   { icon: BarChart3, label: "Rapport Public Cible", path: "/admin/rapport-public-cible" },
 ];
 

client/src/components/ui/progress.tsx

@@ -3,11 +3,16 @@ import * as ProgressPrimitive from "@radix-ui/react-progress";
 
 import { cn } from "@/lib/utils";
 
+interface ProgressProps extends React.ComponentProps<typeof ProgressPrimitive.Root> {
+  indicatorClassName?: string;
+}
+
 function Progress({
   className,
   value,
+  indicatorClassName,
   ...props
-}: React.ComponentProps<typeof ProgressPrimitive.Root>) {
+}: ProgressProps) {
   return (
     <ProgressPrimitive.Root
       data-slot="progress"
@@ -19,7 +24,7 @@ function Progress({
     >
       <ProgressPrimitive.Indicator
         data-slot="progress-indicator"
-        className="bg-primary h-full w-full flex-1 transition-all"
+        className={cn("bg-primary h-full w-full flex-1 transition-all", indicatorClassName)}
         style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
       />
     </ProgressPrimitive.Root>

client/src/pages/AdminCalendrier.tsx

@@ -0,0 +1,226 @@
+import { useState } from "react";
+import DashboardLayout from "@/components/DashboardLayout";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { trpc } from "@/lib/trpc";
+import { ChevronLeft, ChevronRight, Calendar as CalendarIcon } from "lucide-react";
+import { format, startOfMonth, endOfMonth, eachDayOfInterval, isSameMonth, isSameDay, addMonths, subMonths, startOfWeek, endOfWeek } from "date-fns";
+import { fr } from "date-fns/locale";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
+
+export default function AdminCalendrier() {
+  const [currentDate, setCurrentDate] = useState(new Date());
+  const [selectedSequence, setSelectedSequence] = useState<any>(null);
+  const [isDialogOpen, setIsDialogOpen] = useState(false);
+  
+  const { data: sequences = [], isLoading } = trpc.sequences.list.useQuery();
+  const { data: formations = [] } = trpc.formations.list.useQuery();
+
+  const getFormationName = (formationId: number) => {
+    const formation = formations.find(f => f.id === formationId);
+    return formation?.nom || "Formation inconnue";
+  };
+
+  // Générer les jours du calendrier (incluant les jours du mois précédent/suivant pour remplir la grille)
+  const monthStart = startOfMonth(currentDate);
+  const monthEnd = endOfMonth(currentDate);
+  const calendarStart = startOfWeek(monthStart, { weekStartsOn: 1 }); // Commence le lundi
+  const calendarEnd = endOfWeek(monthEnd, { weekStartsOn: 1 });
+  const calendarDays = eachDayOfInterval({ start: calendarStart, end: calendarEnd });
+
+  // Obtenir les séquences pour un jour donné
+  const getSequencesForDay = (day: Date) => {
+    return sequences.filter(sequence => {
+      return sequence.dates.some((date: any) => {
+        const dateDebut = new Date(date.dateDebut);
+        return isSameDay(dateDebut, day);
+      });
+    });
+  };
+
+  const handlePreviousMonth = () => {
+    setCurrentDate(subMonths(currentDate, 1));
+  };
+
+  const handleNextMonth = () => {
+    setCurrentDate(addMonths(currentDate, 1));
+  };
+
+  const handleToday = () => {
+    setCurrentDate(new Date());
+  };
+
+  const handleSequenceClick = (sequence: any) => {
+    setSelectedSequence(sequence);
+    setIsDialogOpen(true);
+  };
+
+  const getPublicCibleLabel = (publicCible: string) => {
+    switch (publicCible) {
+      case "directeur": return "Directeur";
+      case "chef_service": return "Chef de service";
+      case "tous": return "Tous";
+      case "autre": return "Autre";
+      default: return publicCible;
+    }
+  };
+
+  const getStatutBadge = (statut: string) => {
+    switch (statut) {
+      case "ouverte": return "bg-green-100 text-green-800";
+      case "bloquee": return "bg-orange-100 text-orange-800";
+      case "terminee": return "bg-gray-100 text-gray-800";
+      default: return "bg-gray-100 text-gray-800";
+    }
+  };
+
+  return (
+    <DashboardLayout>
+      <div className="space-y-6">
+        <div>
+          <h1 className="text-3xl font-bold tracking-tight">Calendrier des séquences</h1>
+          <p className="text-muted-foreground">
+            Vue mensuelle de toutes les séquences de formation planifiées
+          </p>
+        </div>
+
+        <Card>
+          <CardHeader>
+            <div className="flex items-center justify-between">
+              <div>
+                <CardTitle className="text-2xl">
+                  {format(currentDate, "MMMM yyyy", { locale: fr })}
+                </CardTitle>
+                <CardDescription>
+                  {sequences.length} séquence(s) au total
+                </CardDescription>
+              </div>
+              <div className="flex gap-2">
+                <Button variant="outline" size="sm" onClick={handleToday}>
+                  Aujourd'hui
+                </Button>
+                <Button variant="outline" size="icon" onClick={handlePreviousMonth}>
+                  <ChevronLeft className="h-4 w-4" />
+                </Button>
+                <Button variant="outline" size="icon" onClick={handleNextMonth}>
+                  <ChevronRight className="h-4 w-4" />
+                </Button>
+              </div>
+            </div>
+          </CardHeader>
+          <CardContent>
+            {isLoading ? (
+              <div className="text-center py-8 text-muted-foreground">Chargement...</div>
+            ) : (
+              <div className="border rounded-lg overflow-hidden">
+                {/* En-tête des jours de la semaine */}
+                <div className="grid grid-cols-7 bg-muted">
+                  {["Lun", "Mar", "Mer", "Jeu", "Ven", "Sam", "Dim"].map(day => (
+                    <div key={day} className="p-2 text-center text-sm font-medium">
+                      {day}
+                    </div>
+                  ))}
+                </div>
+
+                {/* Grille du calendrier */}
+                <div className="grid grid-cols-7 auto-rows-fr">
+                  {calendarDays.map((day, index) => {
+                    const daySequences = getSequencesForDay(day);
+                    const isCurrentMonth = isSameMonth(day, currentDate);
+                    const isToday = isSameDay(day, new Date());
+
+                    return (
+                      <div
+                        key={index}
+                        className={`min-h-[120px] border-t border-r p-2 ${
+                          !isCurrentMonth ? "bg-muted/30" : ""
+                        } ${isToday ? "bg-primary/5" : ""}`}
+                      >
+                        <div className={`text-sm font-medium mb-1 ${
+                          !isCurrentMonth ? "text-muted-foreground" : ""
+                        } ${isToday ? "text-primary font-bold" : ""}`}>
+                          {format(day, "d")}
+                        </div>
+                        <div className="space-y-1">
+                          {daySequences.map(sequence => (
+                            <button
+                              key={sequence.id}
+                              onClick={() => handleSequenceClick(sequence)}
+                              className="w-full text-left p-1 rounded text-xs bg-primary/10 hover:bg-primary/20 transition-colors"
+                            >
+                              <div className="font-medium truncate">{sequence.nom}</div>
+                              <div className="text-muted-foreground truncate">
+                                {getFormationName(sequence.formationId)}
+                              </div>
+                            </button>
+                          ))}
+                        </div>
+                      </div>
+                    );
+                  })}
+                </div>
+              </div>
+            )}
+          </CardContent>
+        </Card>
+
+        {/* Dialog de détails de la séquence */}
+        <Dialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
+          <DialogContent className="max-w-2xl">
+            <DialogHeader>
+              <DialogTitle>{selectedSequence?.nom}</DialogTitle>
+              <DialogDescription>
+                {selectedSequence && getFormationName(selectedSequence.formationId)}
+              </DialogDescription>
+            </DialogHeader>
+            {selectedSequence && (
+              <div className="space-y-4">
+                <div className="grid grid-cols-2 gap-4">
+                  <div>
+                    <p className="text-sm font-medium text-muted-foreground">Lieu</p>
+                    <p>{selectedSequence.lieu}</p>
+                  </div>
+                  <div>
+                    <p className="text-sm font-medium text-muted-foreground">Public cible</p>
+                    <p>{getPublicCibleLabel(selectedSequence.publicCible)}</p>
+                  </div>
+                  <div>
+                    <p className="text-sm font-medium text-muted-foreground">Formateur</p>
+                    <p>{selectedSequence.formateur || "-"}</p>
+                  </div>
+                  <div>
+                    <p className="text-sm font-medium text-muted-foreground">Capacité</p>
+                    <p>{selectedSequence.nbInscrits || 0} / {selectedSequence.capaciteMax}</p>
+                  </div>
+                  <div>
+                    <p className="text-sm font-medium text-muted-foreground">Statut</p>
+                    <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${getStatutBadge(selectedSequence.statut)}`}>
+                      {selectedSequence.statut}
+                    </span>
+                  </div>
+                </div>
+
+                <div>
+                  <p className="text-sm font-medium text-muted-foreground mb-2">Dates de formation</p>
+                  <div className="space-y-2">
+                    {selectedSequence.dates.map((date: any) => (
+                      <div key={date.id} className="p-2 bg-muted rounded">
+                        <p className="font-medium">Date {date.ordre}</p>
+                        <p className="text-sm">
+                          Du {format(new Date(date.dateDebut), "PPP 'à' HH:mm", { locale: fr })}
+                        </p>
+                        <p className="text-sm">
+                          au {format(new Date(date.dateFin), "PPP 'à' HH:mm", { locale: fr })}
+                        </p>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              </div>
+            )}
+          </DialogContent>
+        </Dialog>
+      </div>
+    </DashboardLayout>
+  );
+}

client/src/pages/AdminRappels.tsx

@@ -0,0 +1,318 @@
+import { useState } from "react";
+import DashboardLayout from "@/components/DashboardLayout";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
+import { Textarea } from "@/components/ui/textarea";
+import { Switch } from "@/components/ui/switch";
+import { trpc } from "@/lib/trpc";
+import { Plus, Pencil, Trash2, Bell, BellOff } from "lucide-react";
+import { toast } from "sonner";
+
+export default function AdminRappels() {
+  const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false);
+  const [isEditDialogOpen, setIsEditDialogOpen] = useState(false);
+  const [formData, setFormData] = useState({
+    nom: "",
+    joursAvant: 15,
+    emailTemplate: "",
+    actif: true,
+  });
+  const [editingId, setEditingId] = useState<number | null>(null);
+
+  const { data: rappels = [], isLoading, refetch } = trpc.rappels.list.useQuery();
+  const createMutation = trpc.rappels.create.useMutation();
+  const updateMutation = trpc.rappels.update.useMutation();
+  const deleteMutation = trpc.rappels.delete.useMutation();
+
+  const resetForm = () => {
+    setFormData({
+      nom: "",
+      joursAvant: 15,
+      emailTemplate: "",
+      actif: true,
+    });
+    setEditingId(null);
+  };
+
+  const handleCreate = async () => {
+    try {
+      await createMutation.mutateAsync(formData);
+      toast.success("Rappel créé avec succès");
+      setIsCreateDialogOpen(false);
+      resetForm();
+      refetch();
+    } catch (error: any) {
+      toast.error(error.message || "Erreur lors de la création du rappel");
+    }
+  };
+
+  const handleEdit = (rappel: any) => {
+    setFormData({
+      nom: rappel.nom,
+      joursAvant: rappel.joursAvant,
+      emailTemplate: rappel.emailTemplate,
+      actif: rappel.actif,
+    });
+    setEditingId(rappel.id);
+    setIsEditDialogOpen(true);
+  };
+
+  const handleUpdate = async () => {
+    if (!editingId) return;
+    
+    try {
+      await updateMutation.mutateAsync({ id: editingId, ...formData });
+      toast.success("Rappel mis à jour avec succès");
+      setIsEditDialogOpen(false);
+      resetForm();
+      refetch();
+    } catch (error: any) {
+      toast.error(error.message || "Erreur lors de la mise à jour du rappel");
+    }
+  };
+
+  const handleDelete = async (id: number) => {
+    if (!confirm("Êtes-vous sûr de vouloir supprimer ce rappel ?")) return;
+    
+    try {
+      await deleteMutation.mutateAsync({ id });
+      toast.success("Rappel supprimé avec succès");
+      refetch();
+    } catch (error: any) {
+      toast.error(error.message || "Erreur lors de la suppression du rappel");
+    }
+  };
+
+  const templateExemple = `Bonjour {{prenom}} {{nom}},
+
+Nous vous rappelons que votre formation "{{formationNom}}" - {{sequenceNom}} aura lieu dans {{joursAvant}} jours.
+
+📅 Date : {{dateDebut}}
+📍 Lieu : {{lieu}}
+👨‍🏫 Formateur : {{formateur}}
+
+Cordialement,
+L'équipe Formation Manager Itinova`;
+
+  return (
+    <DashboardLayout>
+      <div className="space-y-6">
+        <div className="flex items-center justify-between">
+          <div>
+            <h1 className="text-3xl font-bold tracking-tight">Rappels automatiques</h1>
+            <p className="text-muted-foreground">
+              Configurez les rappels envoyés automatiquement avant les formations
+            </p>
+          </div>
+          <Dialog open={isCreateDialogOpen} onOpenChange={setIsCreateDialogOpen}>
+            <DialogTrigger asChild>
+              <Button onClick={() => resetForm()}>
+                <Plus className="mr-2 h-4 w-4" />
+                Nouveau rappel
+              </Button>
+            </DialogTrigger>
+            <DialogContent className="max-w-2xl">
+              <DialogHeader>
+                <DialogTitle>Créer un rappel</DialogTitle>
+                <DialogDescription>
+                  Configurez un nouveau rappel automatique à envoyer avant les formations
+                </DialogDescription>
+              </DialogHeader>
+              <div className="space-y-4">
+                <div>
+                  <Label htmlFor="nom">Nom du rappel</Label>
+                  <Input
+                    id="nom"
+                    placeholder="Ex: Rappel J-15"
+                    value={formData.nom}
+                    onChange={(e) => setFormData({ ...formData, nom: e.target.value })}
+                  />
+                </div>
+                <div>
+                  <Label htmlFor="joursAvant">Jours avant la formation</Label>
+                  <Input
+                    id="joursAvant"
+                    type="number"
+                    min="1"
+                    placeholder="15"
+                    value={formData.joursAvant}
+                    onChange={(e) => setFormData({ ...formData, joursAvant: parseInt(e.target.value) || 0 })}
+                  />
+                  <p className="text-sm text-muted-foreground mt-1">
+                    Nombre de jours avant la première date de formation
+                  </p>
+                </div>
+                <div>
+                  <Label htmlFor="emailTemplate">Template d'email</Label>
+                  <Textarea
+                    id="emailTemplate"
+                    placeholder={templateExemple}
+                    value={formData.emailTemplate}
+                    onChange={(e) => setFormData({ ...formData, emailTemplate: e.target.value })}
+                    rows={10}
+                  />
+                  <p className="text-sm text-muted-foreground mt-1">
+                    Variables disponibles : {"{{"} prenom {"}}"}, {"{{"} nom {"}}"}, {"{{"} formationNom {"}}"}, {"{{"} sequenceNom {"}}"}, {"{{"} dateDebut {"}}"}, {"{{"} lieu {"}}"}, {"{{"} formateur {"}}"}, {"{{"} joursAvant {"}}"}
+                  </p>
+                </div>
+                <div className="flex items-center space-x-2">
+                  <Switch
+                    id="actif"
+                    checked={formData.actif}
+                    onCheckedChange={(checked) => setFormData({ ...formData, actif: checked })}
+                  />
+                  <Label htmlFor="actif">Activer ce rappel</Label>
+                </div>
+                <div className="flex justify-end gap-2">
+                  <Button variant="outline" onClick={() => setIsCreateDialogOpen(false)}>
+                    Annuler
+                  </Button>
+                  <Button onClick={handleCreate} disabled={createMutation.isPending}>
+                    {createMutation.isPending ? "Création..." : "Créer"}
+                  </Button>
+                </div>
+              </div>
+            </DialogContent>
+          </Dialog>
+        </div>
+
+        <Card>
+          <CardHeader>
+            <CardTitle>Liste des rappels</CardTitle>
+            <CardDescription>
+              Gérez les rappels automatiques envoyés aux apprenants avant les formations
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            {isLoading ? (
+              <div className="text-center py-8 text-muted-foreground">Chargement...</div>
+            ) : rappels.length === 0 ? (
+              <div className="text-center py-8 text-muted-foreground">
+                Aucun rappel configuré. Créez votre premier rappel pour commencer.
+              </div>
+            ) : (
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>Nom</TableHead>
+                    <TableHead>Jours avant</TableHead>
+                    <TableHead>Statut</TableHead>
+                    <TableHead className="text-right">Actions</TableHead>
+                  </TableRow>
+                </TableHeader>
+                <TableBody>
+                  {rappels.map((rappel) => (
+                    <TableRow key={rappel.id}>
+                      <TableCell className="font-medium">{rappel.nom}</TableCell>
+                      <TableCell>J-{rappel.joursAvant}</TableCell>
+                      <TableCell>
+                        {rappel.actif ? (
+                          <span className="inline-flex items-center gap-1 text-green-600">
+                            <Bell className="h-4 w-4" />
+                            Actif
+                          </span>
+                        ) : (
+                          <span className="inline-flex items-center gap-1 text-gray-500">
+                            <BellOff className="h-4 w-4" />
+                            Inactif
+                          </span>
+                        )}
+                      </TableCell>
+                      <TableCell className="text-right">
+                        <div className="flex justify-end gap-2">
+                          <Button
+                            variant="outline"
+                            size="sm"
+                            onClick={() => handleEdit(rappel)}
+                          >
+                            <Pencil className="h-4 w-4" />
+                          </Button>
+                          <Button
+                            variant="outline"
+                            size="sm"
+                            onClick={() => handleDelete(rappel.id)}
+                          >
+                            <Trash2 className="h-4 w-4" />
+                          </Button>
+                        </div>
+                      </TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            )}
+          </CardContent>
+        </Card>
+
+        {/* Dialog de modification */}
+        <Dialog open={isEditDialogOpen} onOpenChange={setIsEditDialogOpen}>
+          <DialogContent className="max-w-2xl">
+            <DialogHeader>
+              <DialogTitle>Modifier le rappel</DialogTitle>
+              <DialogDescription>
+                Modifiez les paramètres du rappel automatique
+              </DialogDescription>
+            </DialogHeader>
+            <div className="space-y-4">
+              <div>
+                <Label htmlFor="edit-nom">Nom du rappel</Label>
+                <Input
+                  id="edit-nom"
+                  placeholder="Ex: Rappel J-15"
+                  value={formData.nom}
+                  onChange={(e) => setFormData({ ...formData, nom: e.target.value })}
+                />
+              </div>
+              <div>
+                <Label htmlFor="edit-joursAvant">Jours avant la formation</Label>
+                <Input
+                  id="edit-joursAvant"
+                  type="number"
+                  min="1"
+                  placeholder="15"
+                  value={formData.joursAvant}
+                  onChange={(e) => setFormData({ ...formData, joursAvant: parseInt(e.target.value) || 0 })}
+                />
+                <p className="text-sm text-muted-foreground mt-1">
+                  Nombre de jours avant la première date de formation
+                </p>
+              </div>
+              <div>
+                <Label htmlFor="edit-emailTemplate">Template d'email</Label>
+                <Textarea
+                  id="edit-emailTemplate"
+                  value={formData.emailTemplate}
+                  onChange={(e) => setFormData({ ...formData, emailTemplate: e.target.value })}
+                  rows={10}
+                />
+                <p className="text-sm text-muted-foreground mt-1">
+                  Variables disponibles : {"{{"} prenom {"}}"}, {"{{"} nom {"}}"}, {"{{"} formationNom {"}}"}, {"{{"} sequenceNom {"}}"}, {"{{"} dateDebut {"}}"}, {"{{"} lieu {"}}"}, {"{{"} formateur {"}}"}, {"{{"} joursAvant {"}}"}
+                </p>
+              </div>
+              <div className="flex items-center space-x-2">
+                <Switch
+                  id="edit-actif"
+                  checked={formData.actif}
+                  onCheckedChange={(checked) => setFormData({ ...formData, actif: checked })}
+                />
+                <Label htmlFor="edit-actif">Activer ce rappel</Label>
+              </div>
+              <div className="flex justify-end gap-2">
+                <Button variant="outline" onClick={() => setIsEditDialogOpen(false)}>
+                  Annuler
+                </Button>
+                <Button onClick={handleUpdate} disabled={updateMutation.isPending}>
+                  {updateMutation.isPending ? "Mise à jour..." : "Mettre à jour"}
+                </Button>
+              </div>
+            </div>
+          </DialogContent>
+        </Dialog>
+      </div>
+    </DashboardLayout>
+  );
+}

client/src/pages/AdminSequences.tsx

@@ -1,6 +1,7 @@
 import { useState } from "react";
 import DashboardLayout from "@/components/DashboardLayout";
 import { FormateurCombobox } from "@/components/FormateurCombobox";
+import { CapacityProgressBar } from "@/components/CapacityProgressBar";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
@@ -664,7 +665,12 @@ export default function AdminSequences() {
                           </span>
                         </TableCell>
                         <TableCell className="max-w-xs truncate">{sequence.formateur || "-"}</TableCell>
-                        <TableCell>{sequence.nbInscrits || 0} / {sequence.capaciteMax}</TableCell>
+                        <TableCell>
+                          <CapacityProgressBar 
+                            current={sequence.nbInscrits || 0} 
+                            max={sequence.capaciteMax} 
+                          />
+                        </TableCell>
                         <TableCell>
                           <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${getStatutBadge(sequence.statut)}`}>
                             {sequence.statut}

drizzle/0018_breezy_thundra.sql

@@ -0,0 +1,18 @@
+CREATE TABLE `rappels` (
+	`id` int AUTO_INCREMENT NOT NULL,
+	`nom` varchar(255) NOT NULL,
+	`joursAvant` int NOT NULL,
+	`emailTemplate` text NOT NULL,
+	`actif` boolean NOT NULL DEFAULT true,
+	`createdAt` timestamp NOT NULL DEFAULT (now()),
+	`updatedAt` timestamp NOT NULL DEFAULT (now()) ON UPDATE CURRENT_TIMESTAMP,
+	CONSTRAINT `rappels_id` PRIMARY KEY(`id`)
+);
+--> statement-breakpoint
+CREATE TABLE `rappelsEnvoyes` (
+	`id` int AUTO_INCREMENT NOT NULL,
+	`rappelId` int NOT NULL,
+	`inscriptionId` int NOT NULL,
+	`dateEnvoi` timestamp NOT NULL DEFAULT (now()),
+	CONSTRAINT `rappelsEnvoyes_id` PRIMARY KEY(`id`)
+);

drizzle/meta/0018_snapshot.json

@@ -0,0 +1,958 @@
+{
+  "version": "5",
+  "dialect": "mysql",
+  "id": "634fe51e-8827-4f0f-b033-dcd01c3acb21",
+  "prevId": "d7d07602-ed71-4c09-b5d4-3ebd05e45303",
+  "tables": {
+    "apprenants": {
+      "name": "apprenants",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "nom": {
+          "name": "nom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "prenom": {
+          "name": "prenom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "email": {
+          "name": "email",
+          "type": "varchar(320)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "codeEtablissement": {
+          "name": "codeEtablissement",
+          "type": "varchar(50)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "fonction": {
+          "name": "fonction",
+          "type": "enum('directeur','chef_service','autre')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "apprenants_id": {
+          "name": "apprenants_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {
+        "apprenants_email_unique": {
+          "name": "apprenants_email_unique",
+          "columns": [
+            "email"
+          ]
+        }
+      },
+      "checkConstraint": {}
+    },
+    "datesFormation": {
+      "name": "datesFormation",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "sequenceId": {
+          "name": "sequenceId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "dateDebut": {
+          "name": "dateDebut",
+          "type": "datetime",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "dateFin": {
+          "name": "dateFin",
+          "type": "datetime",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "ordre": {
+          "name": "ordre",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "datesFormation_id": {
+          "name": "datesFormation_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "emailConfig": {
+      "name": "emailConfig",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "provider": {
+          "name": "provider",
+          "type": "varchar(50)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'resend'"
+        },
+        "apiKey": {
+          "name": "apiKey",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "fromEmail": {
+          "name": "fromEmail",
+          "type": "varchar(320)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "fromName": {
+          "name": "fromName",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'Formation Manager Itinova'"
+        },
+        "mode": {
+          "name": "mode",
+          "type": "enum('simulation','production')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'simulation'"
+        },
+        "domainVerified": {
+          "name": "domainVerified",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": false
+        },
+        "active": {
+          "name": "active",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "emailConfig_id": {
+          "name": "emailConfig_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "emailTemplates": {
+      "name": "emailTemplates",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "type": {
+          "name": "type",
+          "type": "varchar(50)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "name": {
+          "name": "name",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "logoUrl": {
+          "name": "logoUrl",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "primaryColor": {
+          "name": "primaryColor",
+          "type": "varchar(7)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'#2563eb'"
+        },
+        "headerBgColor": {
+          "name": "headerBgColor",
+          "type": "varchar(7)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'#2563eb'"
+        },
+        "headerTextColor": {
+          "name": "headerTextColor",
+          "type": "varchar(7)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'#ffffff'"
+        },
+        "headerTitle": {
+          "name": "headerTitle",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'Formation Manager Itinova'"
+        },
+        "footerText": {
+          "name": "footerText",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "active": {
+          "name": "active",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "emailTemplates_id": {
+          "name": "emailTemplates_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {
+        "emailTemplates_type_unique": {
+          "name": "emailTemplates_type_unique",
+          "columns": [
+            "type"
+          ]
+        }
+      },
+      "checkConstraint": {}
+    },
+    "formateurs": {
+      "name": "formateurs",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "nom": {
+          "name": "nom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "actif": {
+          "name": "actif",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "formateurs_id": {
+          "name": "formateurs_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {
+        "formateurs_nom_unique": {
+          "name": "formateurs_nom_unique",
+          "columns": [
+            "nom"
+          ]
+        }
+      },
+      "checkConstraint": {}
+    },
+    "formations": {
+      "name": "formations",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "nom": {
+          "name": "nom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "lienUnique": {
+          "name": "lienUnique",
+          "type": "varchar(100)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "actif": {
+          "name": "actif",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "formations_id": {
+          "name": "formations_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {
+        "formations_lienUnique_unique": {
+          "name": "formations_lienUnique_unique",
+          "columns": [
+            "lienUnique"
+          ]
+        }
+      },
+      "checkConstraint": {}
+    },
+    "inscriptions": {
+      "name": "inscriptions",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "apprenantId": {
+          "name": "apprenantId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "sequenceId": {
+          "name": "sequenceId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "statut": {
+          "name": "statut",
+          "type": "enum('confirmee','liste_attente','annulee')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "dateInscription": {
+          "name": "dateInscription",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "inscriptions_id": {
+          "name": "inscriptions_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "passwordResetTokens": {
+      "name": "passwordResetTokens",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "userId": {
+          "name": "userId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "token": {
+          "name": "token",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "expiresAt": {
+          "name": "expiresAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "used": {
+          "name": "used",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": false
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "passwordResetTokens_id": {
+          "name": "passwordResetTokens_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {
+        "passwordResetTokens_token_unique": {
+          "name": "passwordResetTokens_token_unique",
+          "columns": [
+            "token"
+          ]
+        }
+      },
+      "checkConstraint": {}
+    },
+    "rappels": {
+      "name": "rappels",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "nom": {
+          "name": "nom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "joursAvant": {
+          "name": "joursAvant",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "emailTemplate": {
+          "name": "emailTemplate",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "actif": {
+          "name": "actif",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "rappels_id": {
+          "name": "rappels_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "rappelsEnvoyes": {
+      "name": "rappelsEnvoyes",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "rappelId": {
+          "name": "rappelId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "inscriptionId": {
+          "name": "inscriptionId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "dateEnvoi": {
+          "name": "dateEnvoi",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "rappelsEnvoyes_id": {
+          "name": "rappelsEnvoyes_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "sequences": {
+      "name": "sequences",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "formationId": {
+          "name": "formationId",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "nom": {
+          "name": "nom",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "lieu": {
+          "name": "lieu",
+          "type": "varchar(500)",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "publicCible": {
+          "name": "publicCible",
+          "type": "enum('directeur','chef_service','tous','autre')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "formateur": {
+          "name": "formateur",
+          "type": "varchar(255)",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "capaciteMax": {
+          "name": "capaciteMax",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": 12
+        },
+        "dateBlocage": {
+          "name": "dateBlocage",
+          "type": "datetime",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "statut": {
+          "name": "statut",
+          "type": "enum('ouverte','bloquee','terminee')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'ouverte'"
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "sequences_id": {
+          "name": "sequences_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    },
+    "users": {
+      "name": "users",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "int",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": true
+        },
+        "openId": {
+          "name": "openId",
+          "type": "varchar(64)",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "email": {
+          "name": "email",
+          "type": "varchar(320)",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "loginMethod": {
+          "name": "loginMethod",
+          "type": "varchar(64)",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "role": {
+          "name": "role",
+          "type": "enum('user','admin')",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "'user'"
+        },
+        "isActive": {
+          "name": "isActive",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": true
+        },
+        "createdAt": {
+          "name": "createdAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        },
+        "updatedAt": {
+          "name": "updatedAt",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "onUpdate": true,
+          "default": "(now())"
+        },
+        "lastSignedIn": {
+          "name": "lastSignedIn",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false,
+          "default": "(now())"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "users_id": {
+          "name": "users_id",
+          "columns": [
+            "id"
+          ]
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraint": {}
+    }
+  },
+  "views": {},
+  "_meta": {
+    "schemas": {},
+    "tables": {},
+    "columns": {}
+  },
+  "internal": {
+    "tables": {},
+    "indexes": {}
+  }
+}

drizzle/meta/_journal.json

@@ -127,6 +127,13 @@
       "when": 1763563084443,
       "tag": "0017_dear_tana_nile",
       "breakpoints": true
+    },
+    {
+      "idx": 18,
+      "version": "5",
+      "when": 1763564375261,
+      "tag": "0018_breezy_thundra",
+      "breakpoints": true
     }
   ]
 }

drizzle/schema.ts

@@ -158,6 +158,41 @@ export const passwordResetTokens = mysqlTable("passwordResetTokens", {
 export type PasswordResetToken = typeof passwordResetTokens.$inferSelect;
 export type InsertPasswordResetToken = typeof passwordResetTokens.$inferInsert;
 
+/**
+ * Table des rappels automatiques
+ * Configure les rappels à envoyer avant les formations
+ */
+export const rappels = mysqlTable("rappels", {
+  id: int("id").autoincrement().primaryKey(),
+  /** Nom du rappel (ex: "Rappel J-15") */
+  nom: varchar("nom", { length: 255 }).notNull(),
+  /** Nombre de jours avant la formation (ex: 15 pour J-15) */
+  joursAvant: int("joursAvant").notNull(),
+  /** Template d'email à utiliser */
+  emailTemplate: text("emailTemplate").notNull(),
+  /** Actif ou non */
+  actif: boolean("actif").default(true).notNull(),
+  createdAt: timestamp("createdAt").defaultNow().notNull(),
+  updatedAt: timestamp("updatedAt").defaultNow().onUpdateNow().notNull(),
+});
+
+export type Rappel = typeof rappels.$inferSelect;
+export type InsertRappel = typeof rappels.$inferInsert;
+
+/**
+ * Table des envois de rappels
+ * Historique des rappels envoyés pour éviter les doublons
+ */
+export const rappelsEnvoyes = mysqlTable("rappelsEnvoyes", {
+  id: int("id").autoincrement().primaryKey(),
+  rappelId: int("rappelId").notNull(),
+  inscriptionId: int("inscriptionId").notNull(),
+  dateEnvoi: timestamp("dateEnvoi").defaultNow().notNull(),
+});
+
+export type RappelEnvoye = typeof rappelsEnvoyes.$inferSelect;
+export type InsertRappelEnvoye = typeof rappelsEnvoyes.$inferInsert;
+
 /**
  * Table des templates d'emails personnalisables
  */

server/db.ts

@@ -20,6 +20,7 @@ import {
   InsertFormation,
   InsertApprenant,
   InsertFormateur,
+  InsertRappel,
   Sequence,
   DateFormation,
   Apprenant,
@@ -693,3 +694,86 @@ export async function deleteFormateur(id: number) {
   
   await db.update(formateurs).set({ actif: false }).where(eq(formateurs.id, id));
 }
+
+// ===== RAPPELS =====
+
+/**
+ * Récupérer tous les rappels
+ */
+export async function getRappels() {
+  const db = await getDb();
+  if (!db) return [];
+  
+  const { rappels } = await import("../drizzle/schema");
+  const result = await db.select().from(rappels);
+  return result;
+}
+
+/**
+ * Créer un nouveau rappel
+ */
+export async function createRappel(data: InsertRappel) {
+  const db = await getDb();
+  if (!db) return null;
+  
+  const { rappels } = await import("../drizzle/schema");
+  const result = await db.insert(rappels).values(data);
+  return result;
+}
+
+/**
+ * Mettre à jour un rappel
+ */
+export async function updateRappel(id: number, data: Partial<InsertRappel>) {
+  const db = await getDb();
+  if (!db) return;
+  
+  const { rappels } = await import("../drizzle/schema");
+  await db.update(rappels).set({
+    ...data,
+    updatedAt: new Date(),
+  }).where(eq(rappels.id, id));
+}
+
+/**
+ * Supprimer un rappel
+ */
+export async function deleteRappel(id: number) {
+  const db = await getDb();
+  if (!db) return;
+  
+  const { rappels } = await import("../drizzle/schema");
+  await db.delete(rappels).where(eq(rappels.id, id));
+}
+
+/**
+ * Enregistrer l'envoi d'un rappel
+ */
+export async function enregistrerRappelEnvoye(rappelId: number, inscriptionId: number) {
+  const db = await getDb();
+  if (!db) return;
+  
+  const { rappelsEnvoyes } = await import("../drizzle/schema");
+  await db.insert(rappelsEnvoyes).values({
+    rappelId,
+    inscriptionId,
+  });
+}
+
+/**
+ * Vérifier si un rappel a déjà été envoyé
+ */
+export async function rappelDejaEnvoye(rappelId: number, inscriptionId: number) {
+  const db = await getDb();
+  if (!db) return false;
+  
+  const { rappelsEnvoyes } = await import("../drizzle/schema");
+  const result = await db.select().from(rappelsEnvoyes)
+    .where(and(
+      eq(rappelsEnvoyes.rappelId, rappelId),
+      eq(rappelsEnvoyes.inscriptionId, inscriptionId)
+    ))
+    .limit(1);
+  
+  return result.length > 0;
+}

server/routers.ts

@@ -690,6 +690,40 @@ export const appRouter = router({
     }),
   }),
 
+  // ===== RAPPELS =====
+  rappels: router({
+    list: adminProcedure.query(async () => {
+      return db.getRappels();
+    }),
+
+    create: adminProcedure.input(z.object({
+      nom: z.string().min(1),
+      joursAvant: z.number().min(1),
+      emailTemplate: z.string().min(1),
+      actif: z.boolean().default(true),
+    })).mutation(async ({ input }) => {
+      await db.createRappel(input);
+      return { success: true };
+    }),
+
+    update: adminProcedure.input(z.object({
+      id: z.number(),
+      nom: z.string().min(1).optional(),
+      joursAvant: z.number().min(1).optional(),
+      emailTemplate: z.string().min(1).optional(),
+      actif: z.boolean().optional(),
+    })).mutation(async ({ input }) => {
+      const { id, ...data } = input;
+      await db.updateRappel(id, data);
+      return { success: true };
+    }),
+
+    delete: adminProcedure.input(z.object({ id: z.number() })).mutation(async ({ input }) => {
+      await db.deleteRappel(input.id);
+      return { success: true };
+    }),
+  }),
+
   emailConfig: router({
     get: adminProcedure.query(async () => {
       return db.getActiveEmailConfig();

todo.md

@@ -280,3 +280,28 @@
 - [x] Permettre l'ajout rapide de nouveaux formateurs depuis le formulaire
 - [x] Ajouter le formateur dans les templates d'emails d'invitation
 - [x] Tester l'autocomplétion et l'affichage dans les emails
+
+## Améliorations de la gestion des séquences
+
+### 1. Indicateur visuel de remplissage
+- [x] Créer un composant ProgressBar avec couleurs (vert/orange/rouge)
+- [x] Intégrer la barre de progression dans la colonne capacité du tableau
+- [x] Définir les seuils de couleur (vert <70%, orange 70-90%, rouge >90%)
+
+### 2. Vue calendrier des séquences
+- [x] Créer la page AdminCalendrier.tsx
+- [x] Intégrer un composant calendrier mensuel
+- [x] Afficher les séquences sur les dates correspondantes
+- [x] Ajouter la navigation mois précédent/suivant
+- [x] Permettre le clic sur une séquence pour voir les détails
+- [x] Ajouter le lien dans le menu de navigation
+
+### 3. Rappels automatiques personnalisables
+- [x] Créer une table rappels dans la base de données
+- [x] Ajouter les procédures tRPC pour gérer les rappels
+- [x] Créer la page de configuration des rappels
+- [x] Permettre de définir plusieurs rappels (J-15, J-7, J-1)
+- [x] Associer un template d'email à chaque rappel
+- [x] Interface de gestion complète (création, modification, suppression)
+- [ ] Implémenter le système d'envoi automatique des rappels (nécessite service externe)
+- [ ] Ajouter un job/cron pour vérifier et envoyer les rappels (nécessite service externe)