import { useEffect, useState, lazy, Suspense } from 'react';
import { BrowserRouter as Router, Routes, Route, useLocation } from 'react-router-dom';
import { gsap } from 'gsap';
import { ScrollTrigger } from 'gsap/ScrollTrigger';
import Navigation from './sections/Navigation';
import Footer from './sections/Footer';
import WhatsAppWidget from './components/WhatsAppWidget';
import CookieConsent from './components/CookieConsent';
import HomologationBanner from './components/HomologationBanner';

// Página inicial carrega direto (mais acessada)
import Home from './pages/Home';
import NotFound from './pages/NotFound';

// Todas as outras páginas com lazy loading para reduzir bundle inicial
const Sobre = lazy(() => import('./pages/Sobre'));
const Blog = lazy(() => import('./pages/Blog'));
const BlogPost = lazy(() => import('./pages/BlogPost'));
const Cases = lazy(() => import('./pages/Cases'));
const Contato = lazy(() => import('./pages/Contato'));
const Privacidade = lazy(() => import('./pages/Privacidade'));
const Termos = lazy(() => import('./pages/Termos'));

// Páginas de Serviços
const TiGerenciada = lazy(() => import('./pages/services/TiGerenciada'));
const CloudComputing = lazy(() => import('./pages/services/CloudComputing'));
const Seguranca = lazy(() => import('./pages/services/Seguranca'));
const Suporte = lazy(() => import('./pages/services/Suporte'));
const Redes = lazy(() => import('./pages/services/Redes'));
const Pabx = lazy(() => import('./pages/services/Pabx'));
const Backup = lazy(() => import('./pages/services/Backup'));
const Servidores = lazy(() => import('./pages/services/Servidores'));
const Consultoria = lazy(() => import('./pages/services/Consultoria'));
const Noc = lazy(() => import('./pages/services/Noc'));

// Páginas de Tecnologias (SEO)
const Tecnologias = lazy(() => import('./pages/Tecnologias'));
const WindowsServer = lazy(() => import('./pages/tech/WindowsServer'));
const Linux = lazy(() => import('./pages/tech/Linux'));
const PfSense = lazy(() => import('./pages/tech/PfSense'));
const Proxmox = lazy(() => import('./pages/tech/Proxmox'));
const Vmware = lazy(() => import('./pages/tech/Vmware'));
const Sharepoint = lazy(() => import('./pages/tech/Sharepoint'));
const Cisco = lazy(() => import('./pages/tech/Cisco'));

// Avaliador de Maturidade Tecnológica
const Avaliador = lazy(() => import('./pages/Avaliador'));
const Condominios = lazy(() => import('./pages/Condominios'));

// Landing Pages por Nicho
const Contabilidade = lazy(() => import('./pages/nichos/Contabilidade'));
const Advocacia = lazy(() => import('./pages/nichos/Advocacia'));
const Monitoramento = lazy(() => import('./pages/nichos/Monitoramento'));
const FirewallPfSense = lazy(() => import('./pages/nichos/FirewallPfSense'));
const BackupCorporativo = lazy(() => import('./pages/nichos/BackupCorporativo'));
const VoipEmpresarial = lazy(() => import('./pages/nichos/VoipEmpresarial'));

// SEO Local - Onde Atuamos
const OndeAtuamos = lazy(() => import('./pages/OndeAtuamos'));
const LocalGuarulhos = lazy(() => import('./pages/local-guarulhos'));
const LocalMogi = lazy(() => import('./pages/local-mogi-das-cruzes'));
const LocalIpiranga = lazy(() => import('./pages/local-ipiranga'));
const LocalVilaFormosa = lazy(() => import('./pages/local-vila-formosa'));
const LocalCerqueiraCesar = lazy(() => import('./pages/local-cerqueira-cesar'));
const LocalSantana = lazy(() => import('./pages/local-santana'));
const LocalBras = lazy(() => import('./pages/local-bras'));
const LocalRibeiraoPreto = lazy(() => import('./pages/local-ribeirao-preto'));

// Nichos adicionais
const NichoIndustria = lazy(() => import('./pages/nicho-industria'));
const NichoPortaria = lazy(() => import('./pages/nicho-portaria-remota'));
const NichoClinicas = lazy(() => import('./pages/nicho-clinicas'));
const NichoImobiliarias = lazy(() => import('./pages/nicho-imobiliarias'));
const NichoRecrutamento = lazy(() => import('./pages/nicho-recrutamento-selecao'));

// Avanzato Tools
const Ferramentas = lazy(() => import('./pages/ferramentas'));
const SpfChecker = lazy(() => import('./pages/ferramentas/SpfChecker'));
const DkimChecker = lazy(() => import('./pages/ferramentas/DkimChecker'));
const DmarcChecker = lazy(() => import('./pages/ferramentas/DmarcChecker'));
const MxLookup = lazy(() => import('./pages/ferramentas/MxLookup'));
const SslChecker = lazy(() => import('./pages/ferramentas/SslChecker'));
const EmailSecurityScore = lazy(() => import('./pages/ferramentas/EmailSecurityScore'));
const Microsoft365Analyzer = lazy(() => import('./pages/ferramentas/Microsoft365Analyzer'));

import './App.css';

gsap.registerPlugin(ScrollTrigger);

// Componente para scroll ao topo ao mudar de página
function ScrollToTop() {
  const { pathname } = useLocation();

  useEffect(() => {
    window.scrollTo(0, 0);
    // Refresh ScrollTrigger ao mudar de página
    ScrollTrigger.refresh();
  }, [pathname]);

  return null;
}

// Componente de Progress Bar
function ProgressBar() {
  const [scrollProgress, setScrollProgress] = useState(0);

  useEffect(() => {
    const handleScroll = () => {
      const scrollTop = window.scrollY;
      const docHeight = document.documentElement.scrollHeight - window.innerHeight;
      const progress = (scrollTop / docHeight) * 100;
      setScrollProgress(progress);
    };

    window.addEventListener('scroll', handleScroll, { passive: true });
    return () => window.removeEventListener('scroll', handleScroll);
  }, []);

  return (
    <div
      className="progress-bar"
      style={{ width: `${scrollProgress}%` }}
    />
  );
}

// Loading simples para lazy load
const PageLoader = () => (
  <div className="min-h-screen bg-[#0e0e0e] flex items-center justify-center">
    <div className="w-8 h-8 border-2 border-[#cbf400] border-t-transparent rounded-full animate-spin" />
  </div>
);

function App() {
  return (
    <Router>
      <ScrollToTop />
      <div className="relative bg-[#0e0e0e] min-h-screen">
        <ProgressBar />
        <Navigation />

        <main>
          <Suspense fallback={<PageLoader />}>
            <Routes>
              {/* Página Inicial - carrega direto */}
              <Route path="/" element={<Home />} />

              {/* Sobre */}
              <Route path="/sobre" element={<Sobre />} />

              {/* Serviços */}
              <Route path="/servicos/ti-gerenciada" element={<TiGerenciada />} />
              <Route path="/servicos/cloud-computing" element={<CloudComputing />} />
              <Route path="/servicos/seguranca" element={<Seguranca />} />
              <Route path="/servicos/suporte" element={<Suporte />} />
              <Route path="/servicos/redes" element={<Redes />} />
              <Route path="/servicos/pabx" element={<Pabx />} />
              <Route path="/servicos/backup" element={<Backup />} />
              <Route path="/servicos/servidores" element={<Servidores />} />
              <Route path="/servicos/consultoria" element={<Consultoria />} />
              <Route path="/servicos/noc" element={<Noc />} />

              {/* Blog */}
              <Route path="/blog" element={<Blog />} />
              <Route path="/blog/:slug" element={<BlogPost />} />

              {/* Cases */}
              <Route path="/cases" element={<Cases />} />

              {/* Tecnologias (SEO) */}
              <Route path="/tecnologias" element={<Tecnologias />} />
              <Route path="/suporte-windows-server" element={<WindowsServer />} />
              <Route path="/suporte-linux-empresas" element={<Linux />} />
              <Route path="/suporte-pfsense" element={<PfSense />} />
              <Route path="/suporte-proxmox" element={<Proxmox />} />
              <Route path="/suporte-vmware" element={<Vmware />} />
              <Route path="/suporte-sharepoint" element={<Sharepoint />} />
              <Route path="/suporte-redes-cisco" element={<Cisco />} />

              {/* Avaliador de Maturidade */}
              <Route path="/avaliacao" element={<Avaliador />} />

              {/* Tecnologia para Condomínios */}
              <Route path="/tecnologia-para-condominios" element={<Condominios />} />

              {/* Landing Pages por Nicho */}
              <Route path="/ti-para-contabilidades" element={<Contabilidade />} />
              <Route path="/ti-para-advocacias" element={<Advocacia />} />
              <Route path="/monitoramento-empresarial" element={<Monitoramento />} />
              <Route path="/firewall-pfsense-empresarial" element={<FirewallPfSense />} />
              <Route path="/backup-corporativo" element={<BackupCorporativo />} />
              <Route path="/voip-empresarial" element={<VoipEmpresarial />} />

              {/* SEO Local - Onde Atuamos */}
              <Route path="/onde-atuamos" element={<OndeAtuamos />} />
              <Route path="/suporte-ti-guarulhos" element={<LocalGuarulhos />} />
              <Route path="/suporte-ti-mogi-das-cruzes" element={<LocalMogi />} />
              <Route path="/suporte-ti-ipiranga" element={<LocalIpiranga />} />
              <Route path="/suporte-ti-vila-formosa" element={<LocalVilaFormosa />} />
              <Route path="/suporte-ti-cerqueira-cesar" element={<LocalCerqueiraCesar />} />
              <Route path="/suporte-ti-santana" element={<LocalSantana />} />
              <Route path="/suporte-ti-bras" element={<LocalBras />} />
              <Route path="/suporte-ti-ribeirao-preto" element={<LocalRibeiraoPreto />} />

              {/* Nichos adicionais */}
              <Route path="/suporte-ti-industria" element={<NichoIndustria />} />
              <Route path="/suporte-ti-portaria-remota" element={<NichoPortaria />} />
              <Route path="/suporte-ti-clinicas" element={<NichoClinicas />} />
              <Route path="/suporte-ti-imobiliarias" element={<NichoImobiliarias />} />
              <Route path="/suporte-ti-recrutamento-selecao" element={<NichoRecrutamento />} />

              {/* Contato */}
              <Route path="/contato" element={<Contato />} />

              {/* Páginas Legais */}
              <Route path="/privacidade" element={<Privacidade />} />
              <Route path="/termos" element={<Termos />} />

              {/* Avanzato Tools */}
              <Route path="/ferramentas" element={<Ferramentas />} />
              <Route path="/ferramentas/spf-checker" element={<SpfChecker />} />
              <Route path="/ferramentas/dkim-checker" element={<DkimChecker />} />
              <Route path="/ferramentas/dmarc-checker" element={<DmarcChecker />} />
              <Route path="/ferramentas/mx-lookup" element={<MxLookup />} />
              <Route path="/ferramentas/ssl-checker" element={<SslChecker />} />
              <Route path="/ferramentas/email-security-score" element={<EmailSecurityScore />} />
              <Route path="/ferramentas/microsoft-365-analyzer" element={<Microsoft365Analyzer />} />

              {/* 404 */}
              <Route path="*" element={<NotFound />} />
            </Routes>
          </Suspense>
        </main>

        <Footer />
        <WhatsAppWidget />
        <CookieConsent />
        <HomologationBanner />
      </div>
    </Router>
  );
}

export default App;
