#!/bin/bash

echo "🔧 CORRECTION ERREUR SYNTAXE JAVASCRIPT - Visual Workflow Builder"
echo "=================================================================="

# Aller dans le répertoire frontend
cd visual_workflow_builder/frontend

echo "📋 1. Vérification de l'environnement..."

# Vérifier Node.js et npm
if ! command -v node &> /dev/null; then
    echo "❌ Node.js n'est pas installé"
    exit 1
fi

if ! command -v npm &> /dev/null; then
    echo "❌ npm n'est pas installé"
    exit 1
fi

echo "✅ Node.js version: $(node --version)"
echo "✅ npm version: $(npm --version)"

echo ""
echo "📋 2. Nettoyage des caches et modules..."

# Arrêter le serveur de développement s'il tourne
echo "🛑 Arrêt du serveur de développement..."
pkill -f "react-scripts" || true
pkill -f "webpack" || true

# Nettoyer les caches
echo "🧹 Nettoyage des caches..."
rm -rf node_modules/.cache
rm -rf build
rm -rf .eslintcache

# Supprimer node_modules et package-lock.json
echo "🗑️ Suppression node_modules et package-lock.json..."
rm -rf node_modules
rm -f package-lock.json

echo ""
echo "📋 3. Vérification du package.json..."

# Vérifier que package.json existe et est valide
if [ ! -f "package.json" ]; then
    echo "❌ package.json manquant"
    exit 1
fi

# Vérifier la syntaxe JSON
if ! node -e "JSON.parse(require('fs').readFileSync('package.json', 'utf8'))"; then
    echo "❌ package.json invalide"
    exit 1
fi

echo "✅ package.json valide"

echo ""
echo "📋 4. Réinstallation des dépendances..."

# Réinstaller les dépendances
echo "📦 Installation des dépendances..."
npm install

if [ $? -ne 0 ]; then
    echo "❌ Erreur lors de l'installation des dépendances"
    exit 1
fi

echo "✅ Dépendances installées avec succès"

echo ""
echo "📋 5. Vérification des fichiers TypeScript..."

# Vérifier la compilation TypeScript
echo "🔍 Vérification TypeScript..."
npx tsc --noEmit

if [ $? -ne 0 ]; then
    echo "⚠️ Erreurs TypeScript détectées, mais on continue..."
else
    echo "✅ TypeScript OK"
fi

echo ""
echo "📋 6. Vérification des imports problématiques..."

# Rechercher des imports problématiques
echo "🔍 Recherche d'imports problématiques..."

# Vérifier les imports de React Flow
if grep -r "react-flow-renderer" src/ 2>/dev/null; then
    echo "⚠️ Imports react-flow-renderer détectés"
    echo "🔧 Mise à jour vers @xyflow/react..."
    
    # Remplacer les imports obsolètes
    find src/ -name "*.tsx" -o -name "*.ts" | xargs sed -i.bak 's/react-flow-renderer/@xyflow\/react/g'
    find src/ -name "*.tsx" -o -name "*.ts" | xargs sed -i.bak 's/from "react-flow-renderer"/from "@xyflow\/react"/g'
    
    # Nettoyer les fichiers de sauvegarde
    find src/ -name "*.bak" -delete
    
    echo "✅ Imports mis à jour"
fi

# Vérifier les imports Zustand
if grep -r "zustand.*esm" src/ 2>/dev/null; then
    echo "⚠️ Imports Zustand ESM détectés"
    echo "🔧 Correction des imports Zustand..."
    
    find src/ -name "*.tsx" -o -name "*.ts" | xargs sed -i.bak 's/zustand\/esm/zustand/g'
    find src/ -name "*.bak" -delete
    
    echo "✅ Imports Zustand corrigés"
fi

echo ""
echo "📋 7. Test de compilation..."

# Tester la compilation
echo "🔨 Test de compilation..."
npm run build

if [ $? -ne 0 ]; then
    echo "❌ Erreur de compilation détectée"
    echo ""
    echo "🔍 Analyse des erreurs de compilation..."
    
    # Essayer de compiler avec plus de détails
    echo "📋 Compilation avec détails d'erreur..."
    CI=false npm run build 2>&1 | tee build_errors.log
    
    echo ""
    echo "📄 Erreurs sauvegardées dans build_errors.log"
    echo "🔧 Actions recommandées:"
    echo "   1. Examiner build_errors.log"
    echo "   2. Corriger les erreurs TypeScript/JavaScript"
    echo "   3. Relancer ce script"
    
    exit 1
else
    echo "✅ Compilation réussie"
fi

echo ""
echo "📋 8. Démarrage du serveur de développement..."

# Démarrer le serveur de développement
echo "🚀 Démarrage du serveur de développement..."
echo "📍 URL: http://localhost:3000"
echo "⏹️ Pour arrêter: Ctrl+C"
echo ""

# Démarrer en arrière-plan pour permettre le test
npm start &
SERVER_PID=$!

# Attendre que le serveur démarre
echo "⏳ Attente du démarrage du serveur..."
sleep 10

# Vérifier que le serveur répond
if curl -s http://localhost:3000 > /dev/null; then
    echo "✅ Serveur de développement démarré avec succès"
    echo ""
    echo "🎯 CORRECTION TERMINÉE"
    echo "====================="
    echo "✅ Erreur de syntaxe JavaScript corrigée"
    echo "✅ Serveur de développement en cours d'exécution"
    echo "📍 Testez maintenant: http://localhost:3000"
    echo ""
    echo "🔍 Pour tester la documentation:"
    echo "   1. Ouvrez http://localhost:3000"
    echo "   2. Créez un élément de workflow"
    echo "   3. Cliquez dessus pour ouvrir les propriétés"
    echo "   4. Cliquez sur l'onglet Documentation"
    echo ""
    echo "📋 PID du serveur: $SERVER_PID"
    echo "🛑 Pour arrêter: kill $SERVER_PID"
    
else
    echo "❌ Le serveur ne répond pas"
    kill $SERVER_PID 2>/dev/null
    exit 1
fi