logs good, replacement good

app/components/hooks/useContextMenu.ts

@@ -1,6 +1,6 @@
-import { useState, useCallback, useEffect } from "react";
+import { useState, useCallback, useEffect, useMemo, useRef } from "react";
 import { EntityMapping } from "@/app/config/entityLabels";
-import { Word } from "./useTextParsing"; // AJOUTER cet import
+import { Word } from "./useTextParsing";
 
 interface ContextMenuState {
   visible: boolean;
@@ -12,7 +12,7 @@ interface ContextMenuState {
 
 interface UseContextMenuProps {
   entityMappings: EntityMapping[];
-  words: Word[]; // Maintenant le type Word est reconnu
+  words: Word[];
   onUpdateMapping: (
     originalValue: string,
     newLabel: string,
@@ -29,7 +29,7 @@ interface UseContextMenuProps {
 
 export const useContextMenu = ({
   entityMappings,
-  words, // Paramètre ajouté
+  words,
   onUpdateMapping,
   onRemoveMapping,
   getCurrentColor,
@@ -43,6 +43,10 @@ export const useContextMenu = ({
     wordIndices: [],
   });
 
+  // Référence pour tracker les mappings précédents
+  const previousMappingsRef = useRef<EntityMapping[]>([]);
+  const previousLabelsRef = useRef<string[]>([]);
+
   const closeContextMenu = useCallback(() => {
     setContextMenu((prev) => ({ ...prev, visible: false }));
   }, []);
@@ -54,15 +58,105 @@ export const useContextMenu = ({
     []
   );
 
-  const getExistingLabels = useCallback(() => {
+  // OPTIMISATION INTELLIGENTE: Ne log que les changements
+  const existingLabels = useMemo(() => {
     const uniqueLabels = new Set<string>();
-    entityMappings.forEach((mapping) => {
-      uniqueLabels.add(mapping.displayName || mapping.entity_type); // Utiliser displayName
+    const newMappings: EntityMapping[] = [];
+    const changedMappings: EntityMapping[] = [];
+    const removedMappings: EntityMapping[] = [];
+
+    // Détecter les changements
+    const previousMap = new Map(previousMappingsRef.current.map(m => [m.text, m]));
+    const currentMap = new Map(entityMappings.map(m => [m.text, m]));
+
+    // Nouveaux mappings
+    entityMappings.forEach(mapping => {
+      if (!previousMap.has(mapping.text)) {
+        newMappings.push(mapping);
+      } else {
+        const previous = previousMap.get(mapping.text)!;
+        if (JSON.stringify(previous) !== JSON.stringify(mapping)) {
+          changedMappings.push(mapping);
+        }
+      }
     });
-    return Array.from(uniqueLabels).sort();
+
+    // Mappings supprimés
+    previousMappingsRef.current.forEach(mapping => {
+      if (!currentMap.has(mapping.text)) {
+        removedMappings.push(mapping);
+      }
+    });
+
+    // Logger seulement les changements
+    if (newMappings.length > 0) {
+      console.log("🆕 Nouveaux mappings détectés:", newMappings.length);
+      newMappings.forEach(mapping => {
+        console.log("📋 Nouveau mapping:", {
+          text: mapping.text,
+          displayName: mapping.displayName,
+          entity_type: mapping.entity_type,
+        });
+      });
+    }
+
+    if (changedMappings.length > 0) {
+      console.log("🔄 Mappings modifiés:", changedMappings.length);
+      changedMappings.forEach(mapping => {
+        console.log("📝 Mapping modifié:", {
+          text: mapping.text,
+          displayName: mapping.displayName,
+          entity_type: mapping.entity_type,
+        });
+      });
+    }
+
+    if (removedMappings.length > 0) {
+      console.log("🗑️ Mappings supprimés:", removedMappings.length);
+      removedMappings.forEach(mapping => {
+        console.log("❌ Mapping supprimé:", {
+          text: mapping.text,
+          displayName: mapping.displayName,
+        });
+      });
+    }
+
+    // Traitement de tous les mappings pour les labels
+    entityMappings.forEach((mapping) => {
+      if (
+        mapping.displayName &&
+        typeof mapping.displayName === "string" &&
+        mapping.displayName.startsWith("[") &&
+        mapping.displayName.endsWith("]") &&
+        mapping.displayName.length > 2
+      ) {
+        uniqueLabels.add(mapping.displayName);
+      }
+    });
+
+    const result = Array.from(uniqueLabels).sort();
+    
+    // Logger seulement si les labels ont changé
+    const previousLabels = previousLabelsRef.current;
+    if (JSON.stringify(previousLabels) !== JSON.stringify(result)) {
+      console.log("🎯 Labels mis à jour:", {
+        ajoutés: result.filter(l => !previousLabels.includes(l)),
+        supprimés: previousLabels.filter(l => !result.includes(l)),
+        total: result.length
+      });
+    }
+
+    // Mettre à jour les références
+    previousMappingsRef.current = [...entityMappings];
+    previousLabelsRef.current = [...result];
+
+    return result;
   }, [entityMappings]);
 
-  // CORRECTION: Accepter displayName comme premier paramètre
+  const getExistingLabels = useCallback(() => {
+    return existingLabels;
+  }, [existingLabels]);
+
   const applyLabel = useCallback(
     (displayName: string, applyToAll?: boolean) => {
       if (!contextMenu.selectedText) return;
@@ -70,7 +164,6 @@ export const useContextMenu = ({
       const originalText = contextMenu.selectedText;
       const firstWordIndex = contextMenu.wordIndices[0];
 
-      // Calculer les vraies coordonnées start/end du mot cliqué
       const clickedWord = words[firstWordIndex];
       const wordStart = clickedWord?.start;
       const wordEnd = clickedWord?.end;
@@ -82,14 +175,21 @@ export const useContextMenu = ({
         existingMapping?.entity_type ||
         displayName.replace(/[\[\]]/g, "").toUpperCase();
 
+      console.log("🏷️ Application de label:", {
+        text: originalText,
+        label: displayName,
+        entityType,
+        applyToAll
+      });
+
       onUpdateMapping(
         originalText,
         displayName,
         entityType,
         applyToAll,
-        undefined, // customColor
-        wordStart, // vraies coordonnées start
-        wordEnd // vraies coordonnées end
+        undefined,
+        wordStart,
+        wordEnd
       );
 
       setSelectedWords(new Set());
@@ -97,7 +197,7 @@ export const useContextMenu = ({
     },
     [
       contextMenu,
-      words, // NOUVEAU
+      words,
       entityMappings,
       onUpdateMapping,
       closeContextMenu,
@@ -105,7 +205,6 @@ export const useContextMenu = ({
     ]
   );
 
-  // CORRECTION: Accepter applyToAll comme paramètre
   const applyColorDirectly = useCallback(
     (color: string, colorName: string, applyToAll?: boolean) => {
       if (!contextMenu.selectedText) return;
@@ -114,17 +213,18 @@ export const useContextMenu = ({
         (mapping) => mapping.text === contextMenu.selectedText
       );
 
-      console.log("useContextMenu - applyColorDirectly:", {
+      console.log("🎨 Application de couleur:", {
+        text: contextMenu.selectedText,
         color,
         colorName,
         applyToAll,
-        existingMapping,
+        existingMapping: !!existingMapping,
       });
 
       if (existingMapping) {
         onUpdateMapping(
           contextMenu.selectedText,
-          existingMapping.displayName || existingMapping.entity_type, // Utiliser displayName
+          existingMapping.displayName || existingMapping.entity_type,
           existingMapping.entity_type,
           applyToAll,
           color
@@ -144,20 +244,19 @@ export const useContextMenu = ({
     },
     [
       contextMenu.selectedText,
-      entityMappings, // Ajouter cette dépendance
+      entityMappings,
       onUpdateMapping,
       closeContextMenu,
       setSelectedWords,
     ]
   );
 
-  // CORRECTION: Accepter applyToAll comme paramètre
   const removeLabel = useCallback(
     (applyToAll?: boolean) => {
       if (!contextMenu.selectedText || !onRemoveMapping) return;
 
-      console.log("useContextMenu - removeLabel:", {
-        selectedText: contextMenu.selectedText,
+      console.log("🗑️ Suppression de label:", {
+        text: contextMenu.selectedText,
         applyToAll,
       });
 
@@ -173,7 +272,6 @@ export const useContextMenu = ({
     ]
   );
 
-  // Gestion des clics en dehors du menu
   useEffect(() => {
     const handleClickOutside = (event: MouseEvent) => {
       if (contextMenu.visible) {