import React, { useState, useEffect } from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import './App.css';
import Header from './components/Header';
import Footer from './components/Footer';
import Home from './components/Home';
import About from './components/About';
import Platform from './components/Platform';
import Modules from './components/Modules';
import Technology from './components/Technology';
import Impact from './components/Impact';
import ForWho from './components/ForWho';
import Contact from './components/Contact';
import Login from './components/Login';

function App() {
  // Estado de autenticação
  const [isAuthenticated, setIsAuthenticated] = useState(false);
  const [isLoading, setIsLoading] = useState(true);

  // Verificar autenticação no localStorage ao carregar a aplicação
  useEffect(() => {
    const checkAuth = () => {
      const authStatus = localStorage.getItem('iasis_authenticated');
      if (authStatus === 'true') {
        setIsAuthenticated(true);
      }
      setIsLoading(false);
    };

    checkAuth();
  }, []);

  // Função para lidar com login bem-sucedido
  const handleLogin = (status) => {
    setIsAuthenticated(status);
  };

  // Função para lidar com logout
  const handleLogout = () => {
    localStorage.removeItem('iasis_authenticated');
    localStorage.removeItem('iasis_user');
    setIsAuthenticated(false);
  };

  // Mostrar loading enquanto verifica autenticação
  if (isLoading) {
    return (
      <div className="min-h-screen flex items-center justify-center bg-gray-50">
        <div className="text-center">
          <div className="w-16 h-16 bg-primary rounded-xl flex items-center justify-center mx-auto mb-4">
            <span className="text-white font-bold text-3xl">I</span>
          </div>
          <div className="text-lg font-medium text-gray-700">Carregando...</div>
        </div>
      </div>
    );
  }

  // Se não estiver autenticado, mostrar tela de login
  if (!isAuthenticated) {
    return <Login onLogin={handleLogin} />;
  }

  // Se estiver autenticado, mostrar aplicação principal
  return (
    <Router>
      <div className="min-h-screen bg-background">
        <Header onLogout={handleLogout} />
        <main>
          <Routes>
            <Route path="/" element={<Home />} />
            <Route path="/sobre" element={<About />} />
            <Route path="/plataforma" element={<Platform />} />
            <Route path="/modulos" element={<Modules />} />
            <Route path="/tecnologia" element={<Technology />} />
            <Route path="/impacto" element={<Impact />} />
            <Route path="/para-quem" element={<ForWho />} />
            <Route path="/contato" element={<Contact />} />
          </Routes>
        </main>
        <Footer />
      </div>
    </Router>
  );
}

export default App;

