import { useState } from 'react';
import PoissonApp from './components/poisson/PoissonApp';
import DangVanApp from './components/dangvan/DangVanApp';
import ThermiqueApp from './components/thermique/ThermiqueApp';
import './index.css';

export default function App() {
    const [currentApp, setCurrentApp] = useState(null); // null = home, 'poisson' = Poisson app
    
    // Page d'accueil avec sélection des applications
    if (!currentApp) {
        return (
            <div className="home-page">
                <header className="home-header">
                    <h1>SimSite</h1>
                    <p>Plateforme de Simulation Numérique</p>
                </header>
                
                <main className="app-selector">
                    <div className="app-card" onClick={() => setCurrentApp('poisson')}>
                        <div className="app-icon">∇²</div>
                        <h2>Équation de Poisson</h2>
                        <p>Résolution de -Δu = f avec conditions aux limites de Dirichlet et Neumann</p>
                        <ul>
                            <li>Visualisation 3D interactive du maillage</li>
                            <li>Distribution du champ de solution</li>
                            <li>Animation de l'évolution temporelle</li>
                            <li>Paramètres configurables</li>
                        </ul>
                        <span className="app-tag">FEniCSx</span>
                    </div>
                    
                    <div className="app-card" onClick={() => setCurrentApp('thermique')}>
                        <div className="app-icon">∂T/∂t</div>
                        <h2>Diffusion Thermique</h2>
                        <p>Simulation de transfert de chaleur transitoire</p>
                        <ul>
                            <li>Visualisation 3D interactive du maillage</li>
                            <li>Distribution du champ de température</li>
                            <li>Animation de l'évolution temporelle</li>
                            <li>Paramètres configurables</li>
                        </ul>
                        <span className="app-tag">FEniCSx</span>
                    </div>
                    
                    <div className="app-card" onClick={() => setCurrentApp('dangvan')}>
                        <div className="app-icon">σ</div>
                        <h2>Critère de Dang Van</h2>
                        <p>Analyse de fatigue multiaxiale</p>
                        <ul>
                            <li>Calcul du critère de Dang Van</li>
                            <li>Visualisation graphique du diagramme</li>
                            <li>Différents types de chargement</li>
                            <li>Exemples prédéfinis</li>
                        </ul>
                        <span className="app-tag">NumPy</span>
                    </div>
                </main>
                
                <footer className="home-footer">
                    <p>Powered by FEniCSx, Three.js & React</p>
                </footer>
            </div>
        );
    }
    
    // Application Poisson
    if (currentApp === 'poisson') {
        return <PoissonApp onBack={() => setCurrentApp(null)} />;
    }
    
    // Application Diffusion Thermique
    if (currentApp === 'thermique') {
        return <ThermiqueApp onBack={() => setCurrentApp(null)} />;
    }
    
    // Application Dang Van
    if (currentApp === 'dangvan') {
        return <DangVanApp onBack={() => setCurrentApp(null)} />;
    }
    
    return null;
}