From f431a0b7cc1b4a405650ea77f76b181c1493229b Mon Sep 17 00:00:00 2001 From: syoul Date: Tue, 9 Dec 2025 13:35:28 +0100 Subject: [PATCH] =?UTF-8?q?fix:=20approche=20HTML=20statique=20pour=20?= =?UTF-8?q?=C3=A9viter=20conflits=20React?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Nouvelle page team-static.html : page HTML pure sans React - team.tsx redirige simplement vers /team-static.html - Évite tous les conflits d'injection DOM dans React - team-static.html copié dans out/ lors du build - Contient tous les logs de débogage et visualisations équipe Cette approche contourne complètement les problèmes React/DOM --- Dockerfile.business | 117 ++------- public/team-static.html | 558 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 578 insertions(+), 97 deletions(-) create mode 100644 public/team-static.html diff --git a/Dockerfile.business b/Dockerfile.business index e133730..a702b95 100644 --- a/Dockerfile.business +++ b/Dockerfile.business @@ -101,106 +101,20 @@ RUN echo "📊 Comptage des fichiers .md dans .techradar/data/radar" && \ # La page Next.js pour le routing, le HTML statique pour garantir l'affichage RUN mkdir -p .techradar/src/pages && \ cat > .techradar/src/pages/team.tsx << 'EOF' -import { useEffect, useState } from 'react'; +import { useEffect } from 'react'; export default function TeamPage() { - const [content, setContent] = useState(''); - useEffect(() => { - // Charger le contenu de team.html directement - console.log('🔄 TEAM PAGE: Chargement direct du contenu team.html'); - - fetch('/team.html') - .then(response => { - console.log('📡 TEAM PAGE: Réponse team.html:', response.status); - if (!response.ok) throw new Error(`HTTP ${response.status}`); - return response.text(); - }) - .then(html => { - console.log('✅ TEAM PAGE: Contenu team.html chargé, injection dans DOM'); - setContent(html); - - // Injecter le HTML dans le document après un court délai - setTimeout(() => { - const tempDiv = document.createElement('div'); - tempDiv.innerHTML = html; - - // Extraire et exécuter les scripts - const scripts = tempDiv.querySelectorAll('script'); - scripts.forEach(script => { - if (script.src) { - // Script externe - charger dynamiquement - const newScript = document.createElement('script'); - newScript.src = script.src; - document.head.appendChild(newScript); - console.log('🔧 TEAM PAGE: Script externe chargé:', script.src); - } else { - // Script inline - exécuter directement - try { - eval(script.textContent); - console.log('▶️ TEAM PAGE: Script inline exécuté'); - } catch (error) { - console.error('❌ TEAM PAGE: Erreur script inline:', error); - } - } - }); - - // Injecter le CSS - const styles = tempDiv.querySelectorAll('style'); - styles.forEach(style => { - document.head.appendChild(style.cloneNode(true)); - }); - - // Injecter le contenu HTML (sans les scripts/styles déjà traités) - const bodyContent = tempDiv.querySelector('body'); - if (bodyContent) { - document.body.innerHTML = bodyContent.innerHTML; - console.log('✅ TEAM PAGE: Contenu HTML injecté'); - } - }, 100); - }) - .catch(error => { - console.error('❌ TEAM PAGE: Erreur chargement team.html:', error); - setContent(` -
-

Erreur de chargement

-

Impossible de charger les visualisations équipe.

-

Erreur: ${error.message}

-

Retour à l'accueil

-
- `); - }); + // Solution simple : rediriger vers une page HTML statique + // Cela évite tous les conflits React/DOM + console.log('🔄 TEAM PAGE: Redirection vers page HTML statique'); + if (typeof window !== 'undefined') { + window.location.href = '/team-static.html'; + } }, []); - // Pendant le chargement - if (!content) { - return ( -
-
- Chargement des visualisations équipe... -
-
- ); - } - - // Rendre le contenu chargé - return ( -
- ); + // Ne rien rendre - la redirection prend le relais immédiatement + return null; } EOF RUN echo "✅ Page team.tsx créée (version ultra-simplifiée)" && \ @@ -592,14 +506,23 @@ RUN if [ -d "out" ]; then \ fi && \ echo "🔍 VÉRIFICATION: team.html dans out/:" && \ ls -la out/team.html 2>/dev/null || echo "❌ team.html absent de out/" && \ + echo "🔍 VÉRIFICATION: team-static.html dans out/:" && \ + ls -la out/team-static.html 2>/dev/null || echo "❌ team-static.html absent de out/" && \ echo "" && \ echo "📁 Vérification finale dans out/:" && \ ls -la out/ | grep -E "(team\.html|team-visualization)" && echo "✅ Fichiers team présents dans out/" || echo "⚠️ Fichiers team non trouvés dans out/"; \ else \ echo "❌ Dossier out/ introuvable après build"; \ ls -la . | head -20; \ - fi && \ - echo "" && \ + fi && \ + if [ -f "public/team-static.html" ]; then \ + cp -v public/team-static.html out/team-static.html && echo "✅ team-static.html copié depuis public/ vers out/"; \ + elif [ -f "/app/public/team-static.html" ]; then \ + cp -v /app/public/team-static.html out/team-static.html && echo "✅ team-static.html copié depuis /app/public/ vers out/"; \ + else \ + echo "⚠️ team-static.html introuvable dans public/ ou /app/public/"; \ + fi && \ + echo "" && \ echo "📋 Vérification finale de Navigation.tsx après build:" && \ grep -qE 'href="/team' src/components/Navigation/Navigation.tsx && echo "✅ Lien Équipe toujours présent dans Navigation.tsx après build" || echo "❌ Lien Équipe absent de Navigation.tsx après build" && \ echo "" && \ diff --git a/public/team-static.html b/public/team-static.html new file mode 100644 index 0000000..542f8d3 --- /dev/null +++ b/public/team-static.html @@ -0,0 +1,558 @@ + + + + + + Équipe & Technologies - Laplank + + + + + + +
+
+
+ ← Retour au Radar +
+
+

👥 Équipe & Technologies

+

Visualisation des compétences et identification de l'équipe de genèse MVP

+
+ +
+ + + +
+ +
+

Graphe Réseau - Technologies et Compétences

+
+
+
+ Technologies Core +
+
+
+ Technologies Avancées +
+
+
+ Technologies Utilitaires +
+
+
+ Membres Équipe +
+
+
+
+ +
+

Matrice de Congestion - Technologies Core

+
+
+ +
+
+
Chargement des données...
+
+
+
+ + + +