"use client";

import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwenty from '@/components/sections/feature/FeatureCardTwenty';
import BlogCardEight from '@/components/sections/blog/BlogCardEight';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterSplit from '@/components/sections/footer/FooterSplit';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Archive, Users, Globe, BookOpen, Phone, Mail, MapPin } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="medium"
      sizing="largeSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="elevated-accent"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="WW2 Archive"
          navItems={[
            { name: "Timeline", id: "timeline" },
            { name: "Events", id: "events" },
            { name: "Documents", id: "documents" },
            { name: "Resources", id: "resources" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Explore Archive", href: "#events" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="WW2 ARCHIVE"
          description="Explore comprehensive historical documentation and resources about World War 2 for students and educators"
          buttons={[
            { text: "Start Learning", href: "#events" },
            { text: "Browse Documents", href: "#documents" }
          ]}
          slides={[
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487266615-27odfkpd.jpg",
              imageAlt: "Historical World War 2 military imagery"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487269149-4ncw3w8t.png",
              imageAlt: "Archival historical documents and records"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487271718-ya5yzkwi.jpg",
              imageAlt: "Vintage timeline and historical artifacts"
            }
          ]}
          autoplayDelay={4000}
          showDimOverlay={true}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Comprehensive Historical Documentation for Students and Researchers"
          useInvertedBackground="noInvert"
          metrics={[
            { icon: Archive, label: "Historical Documents", value: "10,000+" },
            { icon: Users, label: "Students Served", value: "50,000+" },
            { icon: Globe, label: "Countries Covered", value: "80+" },
            { icon: BookOpen, label: "Research Hours", value: "100,000+" }
          ]}
        />
      </div>

      <div id="events" data-section="events">
        <FeatureCardTwenty
          images={[
            {
              id: 1,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487274091-76zrr6b2.jpg",
              imageAlt: "Soldier in military uniform"
            },
            {
              id: 2,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487280337-eso2y77f.jpg",
              imageAlt: "Military bunker and fortification"
            },
            {
              id: 3,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487282499-9ewgegbu.png",
              imageAlt: "Wartime military equipment"
            },
            {
              id: 4,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487285287-jzpzkfjl.jpg",
              imageAlt: "Urban destruction during wartime"
            }
          ]}
          title="Explore Key Historical Events and Figures"
          description="Dive into detailed accounts of major WW2 events, military campaigns, and the people who shaped history. Our archive contains authenticated documents, photographs, and eyewitness accounts."
          buttons={[{ text: "View Timeline", href: "#timeline" }]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="resources" data-section="resources">
        <BlogCardEight
          title="Latest Research and Articles"
          description="Stay informed with curated articles, timelines, and research summaries covering major events and lesser-known stories from WW2"
          blogs={[
            {
              id: "1",
              category: "Timeline",
              title: "1939-1941: The War Begins",
              tags: ["timeline", "europe", "invasion"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487266615-27odfkpd.jpg",
              imageAlt: "WW2 beginning period"
            },
            {
              id: "2",
              category: "Pacific Theater",
              title: "The War in the Pacific: 1941-1945",
              tags: ["pacific", "japan", "military"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487274091-76zrr6b2.jpg",
              imageAlt: "Pacific theater operations"
            },
            {
              id: "3",
              category: "Home Front",
              title: "Life on the Home Front During WW2",
              tags: ["home", "civilians", "society"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487285287-jzpzkfjl.jpg",
              imageAlt: "Home front activities"
            },
            {
              id: "4",
              category: "Leadership",
              title: "Key Military Leaders of WW2",
              tags: ["leaders", "biography", "military"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487280337-eso2y77f.jpg",
              imageAlt: "Military leadership"
            },
            {
              id: "5",
              category: "Documents",
              title: "Primary Source Documents and Archives",
              tags: ["documents", "primary", "research"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487286890-uagpzg0x.jpg",
              imageAlt: "Historical documents"
            },
            {
              id: "6",
              category: "Aftermath",
              title: "Post-War Recovery and Impact",
              tags: ["aftermath", "recovery", "impact"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487271718-ya5yzkwi.jpg",
              imageAlt: "Post-war period"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="documents" data-section="documents">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Find answers to common questions about our archive, research methods, and how to use our resources effectively"
          faqs={[
            {
              id: "1",
              title: "How can I access the documents in the archive?",
              content: "Our archive is freely accessible to all students and educators. You can browse by timeline, country, or topic using our search and filter tools."
            },
            {
              id: "2",
              title: "What types of sources are included?",
              content: "We maintain a diverse collection including official military documents, photographs, personal accounts, correspondence, maps, and authenticated historical records from multiple countries."
            },
            {
              id: "3",
              title: "How is the information verified?",
              content: "All materials are carefully researched and cross-referenced with academic institutions and historical societies. Sources are cited and documented to academic standards."
            },
            {
              id: "4",
              title: "Can I use these materials for school projects?",
              content: "Yes. Materials may be used for educational purposes with proper attribution. We recommend citing the archive and the specific source document in your research."
            },
            {
              id: "5",
              title: "Are there primary sources available?",
              content: "Absolutely. We have extensive collections of primary sources including speeches, battle reports, personal letters, and official government documents from the era."
            }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487286890-uagpzg0x.jpg"
          imageAlt="Historical archive and documents"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          mediaPosition="right"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Stay Informed"
          title="Subscribe to Our Newsletter"
          description="Get updates on new archival additions, educational resources, and research insights delivered to your inbox"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766487288600-5v6rl5nh.jpg"
          imageAlt="Historical documentation and research"
          useInvertedBackground="noInvert"
          mediaPosition="right"
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe"
          termsText="We respect your privacy and will only send educational content related to historical research and archive updates."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSplit
          logoText="WW2 Archive"
          title="Preserving History for Future Generations of Students and Researchers"
          columns={[
            {
              title: "Resources",
              items: [
                { label: "Timeline", href: "#timeline" },
                { label: "Events", href: "#events" },
                { label: "Documents", href: "#documents" },
                { label: "Articles", href: "#resources" }
              ]
            },
            {
              title: "Archive",
              items: [
                { label: "Browse All", href: "#" },
                { label: "Search", href: "#" },
                { label: "Categories", href: "#" },
                { label: "Collections", href: "#" }
              ]
            },
            {
              title: "Educational",
              items: [
                { label: "For Teachers", href: "#" },
                { label: "For Students", href: "#" },
                { label: "Research Guide", href: "#" },
                { label: "Citation Guide", href: "#" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Terms of Service", href: "#" },
                { label: "Privacy Policy", href: "#" },
                { label: "Copyright", href: "#" },
                { label: "Contact Us", href: "#contact" }
              ]
            }
          ]}
          contactItems={[
            { icon: Mail, text: "archive@ww2history.org" },
            { icon: MapPin, text: "Educational History Foundation" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}