import React, { useState, useEffect } from 'react';
import { Header } from './components/Header';
import { Hero } from './components/Hero';
import { About } from './components/About';
import { Services } from './components/Services';
import { Experience } from './components/Experience';
import { Education } from './components/Education';
import { Skills } from './components/Skills';
import { Footer } from './components/Footer';

export type PageId = 'home' | 'about' | 'expertise' | 'journey' | 'credentials' | 'contact';

const App: React.FC = () => {
  const [currentPage, setCurrentPage] = useState<PageId>('home');
  const [scrolled, setScrolled] = useState(false);

  useEffect(() => {
    const handleScroll = () => {
      setScrolled(window.scrollY > 50);
    };
    window.addEventListener('scroll', handleScroll);

    // AI & SEO Structured Data - Highly Optimized for GEO/LLM
    const schemaData = {
      "@context": "https://schema.org",
      "@graph": [
        {
          "@type": "Person",
          "@id": "https://rkhurana.llmadvocates.com/#person",
          "name": "Ritik Khurana",
          "jobTitle": "Advocate, AI Litigator & Data Privacy Professional",
          "description": "Specialized Technology Advocate focused on Cyber Law, AI Governance, and DPDP Act compliance in Delhi and Gurugram.",
          "url": "https://rkhurana.llmadvocates.com",
          "sameAs": [
            "https://www.linkedin.com/in/rkkhurana/"
          ],
          "knowsAbout": ["Cyber Law", "Data Privacy", "DPDP Act", "AI Governance", "Intellectual Property Rights", "Digital Forensics"],
          "alumniOf": [
            {
              "@type": "CollegeOrUniversity",
              "name": "National Forensic Sciences University"
            },
            {
              "@type": "CollegeOrUniversity",
              "name": "Kurukshetra University"
            }
          ]
        },
        {
          "@type": "LegalService",
          "@id": "https://rkhurana.llmadvocates.com/#organization",
          "name": "Advocate Ritik Khurana",
          "logo": "https://rkhurana.llmadvocates.com/logo.png",
          "image": "https://rkhurana.llmadvocates.com/profile.jpg",
          "telephone": "+919306413093",
          "email": "rkhurana@llmadvocates.com",
          "url": "https://rkhurana.llmadvocates.com",
          "address": {
            "@type": "PostalAddress",
            "addressLocality": "Gurugram",
            "addressRegion": "Delhi NCR",
            "addressCountry": "IN"
          },
          "founder": { "@id": "https://rkhurana.llmadvocates.com/#person" },
          "areaServed": ["Delhi", "Gurugram", "Chandigarh", "India"],
          "hasOfferCatalog": {
            "@type": "OfferCatalog",
            "name": "Legal Services",
            "itemListElement": [
              {
                "@type": "ListItem",
                "item": {
                  "@type": "Service",
                  "name": "AI Governance & Ethics Advisory",
                  "description": "Expert legal frameworks for AI deployment and regulatory compliance."
                }
              },
              {
                "@type": "ListItem",
                "item": {
                  "@type": "Service",
                  "name": "DPDP Act Compliance Audit",
                  "description": "Comprehensive data protection audits under the Digital Personal Data Protection Act."
                }
              }
            ]
          }
        }
      ]
    };

    const script = document.createElement('script');
    script.type = 'application/ld+json';
    script.innerHTML = JSON.stringify(schemaData);
    document.head.appendChild(script);

    return () => {
      window.removeEventListener('scroll', handleScroll);
      if (document.head.contains(script)) {
        document.head.removeChild(script);
      }
    };
  }, []);

  const navigateTo = (page: PageId) => {
    setCurrentPage(page);
    window.scrollTo({ top: 0, behavior: 'smooth' });
  };

  const renderContent = () => {
    switch (currentPage) {
      case 'home':
        return (
          <>
            <Hero navigateTo={navigateTo} />
            <About />
            <section id="services" className="scroll-mt-24">
              <Services />
            </section>
            <section id="experience" className="bg-zinc-50 scroll-mt-24">
              <Experience />
            </section>
            <section id="academic" className="scroll-mt-24">
              <Education />
            </section>
            <section id="expertise" className="bg-zinc-950 text-white scroll-mt-24">
              <Skills />
            </section>
          </>
        );
      case 'about':
        return <div className="pt-20"><About /></div>;
      case 'expertise':
        return <div className="pt-20"><Services /></div>;
      case 'journey':
        return <div className="pt-20"><Experience /></div>;
      case 'credentials':
        return (
          <div className="pt-20">
            <Education />
            <section className="bg-zinc-950 text-white">
              <Skills />
            </section>
          </div>
        );
      case 'contact':
        return (
          <div className="pt-40 min-h-screen">
             <div className="container mx-auto px-6 md:px-12 mb-20">
               <h2 className="text-sm uppercase tracking-[0.4em] font-bold text-zinc-400 mb-8">Contact Information</h2>
               <h3 className="text-4xl md:text-7xl font-bold tracking-tighter mb-12">Let's discuss your <br/>legal challenges.</h3>
               <p className="text-xl md:text-2xl font-serif text-zinc-500 max-w-2xl">Available for strategic consulting, litigation support, and regulatory compliance audits across Delhi, Gurugram, and Chandigarh.</p>
             </div>
          </div>
        );
      default:
        return <Hero navigateTo={navigateTo} />;
    }
  };

  return (
    <div className="min-h-screen selection:bg-zinc-900 selection:text-white flex flex-col">
      <Header scrolled={scrolled} currentPage={currentPage} navigateTo={navigateTo} />
      <main className="flex-grow">
        {renderContent()}
      </main>
      <Footer navigateTo={navigateTo} />
    </div>
  );
};

export default App;