From 4581b4239d857d954dd341822a75ef95a4615635 Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Mon, 18 Aug 2025 10:03:24 +0000
Subject: [PATCH] Add helpful tips to explain icon functions for product stock
 status

Adds tooltips to the "Mark out of stock" and "Restore stock" icons on the DlcPage to clarify their functionality and distinguish between "expired" and "out of stock" states.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: f9197b9b-a5b3-4469-a27d-930a9e9ee736
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/f9197b9b-a5b3-4469-a27d-930a9e9ee736/i2gFnxm
---
 client/src/pages/DlcPage.tsx | 61 +++++++++++++++++++++++++-----------
 replit.md                    |  1 +
 2 files changed, 44 insertions(+), 18 deletions(-)

diff --git a/client/src/pages/DlcPage.tsx b/client/src/pages/DlcPage.tsx
index 1b4c493..5931a87 100644
--- a/client/src/pages/DlcPage.tsx
+++ b/client/src/pages/DlcPage.tsx
@@ -13,6 +13,7 @@ import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent,
 import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
 import { Textarea } from "@/components/ui/textarea";
 import { AlertTriangle, Plus, Eye, Edit, Trash2, CheckCircle, Package, Clock, AlertCircle, Filter, Download, FileText, PackageX, RotateCcw } from "lucide-react";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
@@ -856,28 +857,52 @@ export default function DlcPage() {
                             
                             {/* Bouton Stock épuisé - accessible à tous */}
                             {!product.stockEpuise && product.status !== "valides" && (
-                              <Button
-                                variant="outline"
-                                size="sm"
-                                onClick={() => handleMarkStockEpuise(product.id)}
-                                disabled={markStockEpuiseMutation.isPending}
-                                className="border-yellow-300 text-yellow-700 hover:bg-yellow-50"
-                              >
-                                <PackageX className="w-4 h-4" />
-                              </Button>
+                              <TooltipProvider>
+                                <Tooltip>
+                                  <TooltipTrigger asChild>
+                                    <Button
+                                      variant="outline"
+                                      size="sm"
+                                      onClick={() => handleMarkStockEpuise(product.id)}
+                                      disabled={markStockEpuiseMutation.isPending}
+                                      className="border-yellow-300 text-yellow-700 hover:bg-yellow-50"
+                                    >
+                                      <PackageX className="w-4 h-4" />
+                                    </Button>
+                                  </TooltipTrigger>
+                                  <TooltipContent>
+                                    <p>Marquer comme stock épuisé</p>
+                                    <p className="text-xs text-muted-foreground">
+                                      Indique que ce produit n'est plus en stock (différent de périmé)
+                                    </p>
+                                  </TooltipContent>
+                                </Tooltip>
+                              </TooltipProvider>
                             )}
                             
                             {/* Bouton Restaurer stock - réservé aux admins, directeurs et managers */}
                             {product.stockEpuise && (user?.role === 'admin' || user?.role === 'manager' || user?.role === 'directeur') && (
-                              <Button
-                                variant="outline"
-                                size="sm"
-                                onClick={() => handleRestoreStock(product.id)}
-                                disabled={restoreStockMutation.isPending}
-                                className="border-blue-300 text-blue-700 hover:bg-blue-50"
-                              >
-                                <RotateCcw className="w-4 h-4" />
-                              </Button>
+                              <TooltipProvider>
+                                <Tooltip>
+                                  <TooltipTrigger asChild>
+                                    <Button
+                                      variant="outline"
+                                      size="sm"
+                                      onClick={() => handleRestoreStock(product.id)}
+                                      disabled={restoreStockMutation.isPending}
+                                      className="border-blue-300 text-blue-700 hover:bg-blue-50"
+                                    >
+                                      <RotateCcw className="w-4 h-4" />
+                                    </Button>
+                                  </TooltipTrigger>
+                                  <TooltipContent>
+                                    <p>Restaurer le stock</p>
+                                    <p className="text-xs text-muted-foreground">
+                                      Marquer ce produit comme à nouveau disponible en stock
+                                    </p>
+                                  </TooltipContent>
+                                </Tooltip>
+                              </TooltipProvider>
                             )}
                             <Button
                               variant="destructive"
diff --git a/replit.md b/replit.md
index 559b684..2131ee0 100644
--- a/replit.md
+++ b/replit.md
@@ -37,6 +37,7 @@ The platform is built with a clear separation of concerns, utilizing a modern fu
 - **Task Management:** Système complet de gestion des tâches avec fonctionnalités temporelles avancées - tri intelligent (pending > priorité > date), dates d'échéance avec sélecteur calendrier, indicateurs visuels pour tâches en retard/urgentes, filtres par échéance (aujourd'hui, cette semaine, en retard, sans échéance), vue Kanban et liste, badges colorés pour statut temporel. Interface optimisée pour suivi prioritaire des tâches non validées. Correction critique de l'isolation des données : chaque magasin ne voit maintenant que ses propres tâches (Août 2025). **PRODUCTION FIX (Août 2025)** : Résolution du problème de rechargements multiples nécessaires pour l'administrateur - le cache des tâches s'invalide maintenant automatiquement lors du changement de magasin sélectionné.
 - **Information System (Announcements):** Système d'informations complet remplaçant la carte commandes clients dans le dashboard - gestion d'annonces avec niveaux de priorité (normal, important, urgent), contrôle d'accès basé sur les rôles (admin : CRUD complet, autres rôles : lecture seule), tri intelligent par priorité et date, filtrage par magasin pour administrateurs, interface moderne avec badges colorés et indicateurs visuels. **PRODUCTION FIX MAJEUR (Août 2025)** : Correction critique du problème d'affichage en production PostgreSQL - fix du filtrage pour inclure annonces globales + magasin sélectionné, correction des relations d'auteur avec username au lieu d'ID, design adapté pour correspondre exactement aux autres cartes du dashboard. **SUPPRESSION FIX (Août 2025)** : Correction du problème de suppression en production - ajout de la logique PostgreSQL manquante dans la route DELETE, les annonces peuvent maintenant être supprimées correctement en production.
 - **DLC Module Permissions:** Correction des permissions de validation DLC pour permettre aux admin, directeur et manager de valider les produits DLC. Ajout de logs de debug pour traçabilité des validations (Août 2025).
+- **DLC UX Enhancement:** Ajout de tooltips explicatifs sur les icônes stock épuisé (PackageX) et restauration (RotateCcw) pour clarifier la différence entre "périmé" et "stock épuisé" et améliorer l'expérience utilisateur (Août 2025).
 - **User and Permission Management:** Granular access controls ensuring that users (e.g., employees) have appropriate permissions for tasks like creating customer orders.
 - **Reporting:** Statistical reporting, including monthly summaries of deliveries based on `deliveredDate`.