veza/apps/web/src/utils/aggressiveVisualFix.ts

/**
 * FIX AGRESSIF POUR PROBLÈMES VISUELS
 * ⚠️ DÉSACTIVÉ : Ce script était une solution à un problème mal identifié.
 * Le vrai problème était le style de focus des inputs, maintenant corrigé.
 * 
 * Ce fichier est conservé pour référence mais n'est plus utilisé.
 * Le problème réel a été résolu dans :
 * - packages/design-system/src/components/Input/Input.tsx
 * - apps/web/src/styles/global-effects.css
 */

export function applyAggressiveVisualFix(): void {
  // DÉSACTIVÉ : Le problème réel a été corrigé à la source
  // Ce script n'est plus nécessaire
  if (typeof window === 'undefined') return;
  
  // Ne rien faire - le problème est résolu dans les styles
  return;

  // 1. Supprimer complètement body::after (scanlines)
  const removeBodyAfter = () => {
    let style = document.getElementById('aggressive-fix-body-after') as HTMLStyleElement | null;
    if (!style) {
      style = document.createElement('style');
      style.id = 'aggressive-fix-body-after';
      style.textContent = `
        body::after {
          display: none !important;
          content: none !important;
        }
      `;
      document.head.appendChild(style);
    }
  };
  
  // 1.5. Masquer complètement toutes les scrollbars
  const hideAllScrollbars = () => {
    let style = document.getElementById('aggressive-fix-scrollbar') as HTMLStyleElement | null;
    if (!style) {
      style = document.createElement('style');
      style.id = 'aggressive-fix-scrollbar';
      style.textContent = `
        /* Masquer toutes les scrollbars */
        ::-webkit-scrollbar {
          width: 0px !important;
          height: 0px !important;
          display: none !important;
        }
        ::-webkit-scrollbar-track {
          display: none !important;
        }
        ::-webkit-scrollbar-thumb {
          display: none !important;
        }
        * {
          scrollbar-width: none !important;
          scrollbar-color: transparent transparent !important;
        }
      `;
      document.head.appendChild(style);
    }
  };

  // 2. Supprimer toutes les bordures verticales
  const removeVerticalBorders = () => {
    const style = document.createElement('style');
    style.id = 'aggressive-fix-borders';
    style.textContent = `
      *:not(input):not(textarea):not(select):not(button):not([class*="input"]):not([class*="Input"]) {
        border-left: none !important;
        border-right: none !important;
      }
      *::before,
      *::after {
        border-left: none !important;
        border-right: none !important;
      }
      html, body {
        border-right: none !important;
        margin-right: 0 !important;
        padding-right: 0 !important;
        overflow-x: hidden !important;
      }
    `;
    document.head.appendChild(style);
  };

  // 3. Masquer tous les éléments suspects
  const hideSuspiciousElements = () => {
    const allElements = document.querySelectorAll('*');
    let hiddenCount = 0;

    allElements.forEach((el) => {
      const htmlEl = el as HTMLElement;
      const computed = window.getComputedStyle(htmlEl);
      const rect = htmlEl.getBoundingClientRect();
      
      // Masquer les éléments très étroits et hauts
      if (rect.width > 0 && rect.width < 10 && rect.height > window.innerHeight * 0.3) {
        htmlEl.style.setProperty('display', 'none', 'important');
        hiddenCount++;
        console.log(`[AggressiveFix] Masqué élément suspect: ${el.tagName}${el.id ? '#' + el.id : ''} (${rect.width}px x ${rect.height}px)`);
      }
      
      // Masquer les éléments sur le bord droit
      const isOnRightEdge = rect.right >= window.innerWidth - 10 && rect.right <= window.innerWidth + 10;
      if (isOnRightEdge && rect.width < 20 && rect.height > window.innerHeight * 0.2) {
        htmlEl.style.setProperty('display', 'none', 'important');
        hiddenCount++;
        console.log(`[AggressiveFix] Masqué élément sur bord droit: ${el.tagName}${el.id ? '#' + el.id : ''}`);
      }
    });

    if (hiddenCount > 0) {
      console.log(`[AggressiveFix] ${hiddenCount} éléments suspects masqués`);
    }
  };

  // 4. Supprimer tous les gradients verticaux
  const removeVerticalGradients = () => {
    const allElements = document.querySelectorAll('*');
    let fixedCount = 0;

    allElements.forEach((el) => {
      const htmlEl = el as HTMLElement;
      const computed = window.getComputedStyle(htmlEl);
      const bgImage = computed.backgroundImage || '';
      const inlineBg = htmlEl.style.backgroundImage || '';

      if ((bgImage.includes('90deg') || inlineBg.includes('90deg')) &&
          (bgImage.includes('linear-gradient') || bgImage.includes('repeating-linear-gradient'))) {
        htmlEl.style.setProperty('background-image', 'none', 'important');
        fixedCount++;
      }
    });

    if (fixedCount > 0) {
      console.log(`[AggressiveFix] ${fixedCount} gradients verticaux supprimés`);
    }
  };

  // 5. Observer les nouveaux éléments ajoutés
  const observeNewElements = () => {
    const observer = new MutationObserver((mutations) => {
      mutations.forEach((mutation) => {
        mutation.addedNodes.forEach((node) => {
          if (node.nodeType === Node.ELEMENT_NODE) {
            const element = node as HTMLElement;
            const computed = window.getComputedStyle(element);
            const rect = element.getBoundingClientRect();
            
            // Masquer immédiatement les nouveaux éléments suspects
            if (rect.width > 0 && rect.width < 10 && rect.height > window.innerHeight * 0.3) {
              element.style.setProperty('display', 'none', 'important');
            }
            
            // Supprimer les gradients verticaux
            const bgImage = computed.backgroundImage || '';
            if (bgImage.includes('90deg') && bgImage.includes('linear-gradient')) {
              element.style.setProperty('background-image', 'none', 'important');
            }
          }
        });
      });
    });

    observer.observe(document.body, {
      childList: true,
      subtree: true,
      attributes: true,
      attributeFilter: ['style', 'class'],
    });
  };

  // Appliquer tous les fixes
  removeBodyAfter();
  hideAllScrollbars();
  removeVerticalBorders();
  hideSuspiciousElements();
  removeVerticalGradients();
  observeNewElements();

  // Réappliquer périodiquement
  setInterval(() => {
    hideSuspiciousElements();
    removeVerticalGradients();
  }, 2000);

  console.log('[AggressiveFix] Fix agressif appliqué avec succès');
}

// DÉSACTIVÉ : Ne plus auto-exécuter
// Le problème réel a été corrigé dans les styles des composants Input