"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroOverlay from "@/components/sections/hero/HeroOverlay";
import TextAbout from "@/components/sections/about/TextAbout";
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Coffee, Heart, Utensils, Sandwich } from "lucide-react";

const assetMap = new Map([
  ["hero-main", {"url": "http://img.b2bpic.net/free-photo/crop-mother-daughter-having-breakfast_23-2147788246.jpg", "alt": "cozy cafe interior with people enjoying brunch"}],
  ["avatar-1", {"url": "http://img.b2bpic.net/free-photo/glad-wet-guy-with-shining-perfect-smile-has-walk-rainy-weather-enjoys-favourite-track-earphones_273609-8617.jpg", "alt": "smiling customer short brown hair"}],
  ["avatar-2", {"url": "http://img.b2bpic.net/free-photo/expressive-redhead-bearded-man-with-hat_176420-32268.jpg", "alt": "friendly customer glasses approachable"}],
  ["avatar-3", {"url": "http://img.b2bpic.net/free-photo/girl-smiling-with-her-eyes-closed_23-2148260157.jpg", "alt": "happy young woman joyful smile"}],
  ["avatar-4", {"url": "http://img.b2bpic.net/free-photo/image-thoughtful-curly-guy-smiling-pleased-looking-intrigued-listening-something-interesting-standing-tshirt-white-background_176420-46962.jpg", "alt": "content man beard relaxed demeanor"}],
  ["feature-croissant", {"url": "http://img.b2bpic.net/free-photo/cinnamon-roll-with-fruits-arrangement_23-2148904724.jpg", "alt": "close-up golden flaky breakfast croissant"}],
  ["feature-frenchtoast", {"url": "http://img.b2bpic.net/free-photo/top-view-yummy-strawberry-pie-with-tea-pink_140725-78435.jpg", "alt": "stack gourmet French toast maple syrup"}],
  ["feature-eggsbenedict", {"url": "http://img.b2bpic.net/free-photo/potatoes-fried-grilled-with-vegetable-cabbage-carrot-salad_114579-898.jpg", "alt": "perfectly poached eggs Benedict hollandaise sauce"}],
  ["feature-chickensandwich", {"url": "http://img.b2bpic.net/free-photo/sandwiches_74190-3814.jpg", "alt": "hearty chicken sandwich artisanal bread"}],
  ["product-muffin", {"url": "http://img.b2bpic.net/free-photo/muffins-served-with-coffee_23-2147693700.jpg", "alt": "freshly baked blueberry muffin golden-brown top"}],
  ["product-sourdough", {"url": "http://img.b2bpic.net/free-photo/closeup-shot-freshly-baked-homemade-colombian-pastry-table_181624-29474.jpg", "alt": "rustic artisan sourdough bread loaf"}],
  ["product-chocolatecroissant", {"url": "http://img.b2bpic.net/free-photo/cup-coffee-with-cookie_114579-4247.jpg", "alt": "rich chocolate croissant flaky exterior"}],
  ["product-coffeebeans", {"url": "http://img.b2bpic.net/free-photo/coffee-beans-glass-jar-table_176474-620.jpg", "alt": "close-up freshly roasted Arabica coffee beans"}],
  ["product-tart", {"url": "http://img.b2bpic.net/free-photo/croquette-making-with-different-delicious-ingredients_23-2149173817.jpg", "alt": "beautiful strawberry tart glossy fresh strawberries"}],
  ["product-bananabread", {"url": "http://img.b2bpic.net/free-photo/jar-currant-jam-table-with-loaf-bread_114579-314.jpg", "alt": "slice moist homemade vegan banana bread walnuts"}],
  ["testimonial-1", {"url": "http://img.b2bpic.net/free-photo/woman-black-top-holding-cup-coffee-high-quality-photo_114579-52965.jpg", "alt": "smiling woman enjoying coffee cozy cafe"}],
  ["testimonial-2", {"url": "http://img.b2bpic.net/free-photo/adolescent-confidential-therapy-session-address-anxiety-low-self-esteem_482257-105928.jpg", "alt": "happy man laughing eating brunch lively restaurant"}],
  ["testimonial-3", {"url": "http://img.b2bpic.net/free-photo/young-office-woman-talking-someone-her-mobile-phone-while-looking-into-distance-with-happy-facial-expression_657921-368.jpg", "alt": "woman sipping tea thoughtful content charming cafe"}],
  ["testimonial-4", {"url": "http://img.b2bpic.net/free-photo/medium-shot-rich-woman-table_23-2149684353.jpg", "alt": "man with glasses content expression brunch plate"}],
  ["testimonial-5", {"url": "http://img.b2bpic.net/free-photo/smiling-portrait-female-baker-wearing-apron-looking-camera_23-2148189096.jpg", "alt": "young woman bright smile warmly lit bakery"}],
  ["testimonial-6", {"url": "http://img.b2bpic.net/free-photo/young-technician-holding-screwdriver-showing-thumb-up-grey-uniform-looking-satisfied_176474-35262.jpg", "alt": "professional man smiling meal upscale cafe"}],
  ["metric-years", {"url": "http://img.b2bpic.net/free-photo/man-holding-pocket-watch_23-2147992631.jpg", "alt": "vintage clock face calendar showing years"}],
  ["metric-reviews", {"url": "http://img.b2bpic.net/free-photo/close-up-food-lover-taking-pictures-meal_23-2149286416.jpg", "alt": "hand holding smartphone 5-star review food app"}],
  ["metric-homemade", {"url": "http://img.b2bpic.net/free-photo/top-view-female-cook-rolling-out-dough-with-flour-dark-surface_179666-44589.jpg", "alt": "chef's hands kneading dough floured wooden surface"}],
  ["contact-map", {"url": "http://img.b2bpic.net/free-photo/downtown-restaurant-shopfront_53876-75135.jpg", "alt": "exterior charming neighborhood bakery cafe"}]
]);

function getAsset(id: string) {
  const asset = assetMap.get(id);
  return asset || { url: "", alt: "" };
}

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="largeSizeMediumTitles"
      background="circleGradient"
      cardStyle="gradient-radial"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Auntie's Bakery & Cafe"
          navItems={[
            { name: "Home", id: "#home" },
            { name: "Our Story", id: "#about" },
            { name: "Menu", id: "#menu" },
            { name: "Testimonials", id: "#testimonials" },
            { name: "Contact", id: "#contact" },
          ]}
        />
      </div>

      <div id="home" data-section="home">
        <HeroOverlay
          title="Taste the Warmth of Homemade Goodness"
          description="At Auntie's Bakery & Cafe, every dish is crafted with love, bringing you classic comfort food, fresh pastries, and the coziest brunch experience."
          tag="Whittier's Favorite Spot"
          tagAnimation="slide-up"
          buttons={[
            { text: "View Our Menu", href: "#menu" },
            { text: "Order Online", href: "#" },
          ]}
          buttonAnimation="slide-up"
          avatars={[
            { src: getAsset("avatar-1").url, alt: getAsset("avatar-1").alt },
            { src: getAsset("avatar-2").url, alt: getAsset("avatar-2").alt },
            { src: getAsset("avatar-3").url, alt: getAsset("avatar-3").alt },
            { src: getAsset("avatar-4").url, alt: getAsset("avatar-4").alt },
          ]}
          avatarText="Over 600+ happy guests love us!"
          imageSrc={getAsset("hero-main").url}
          imageAlt={getAsset("hero-main").alt}
          showDimOverlay={false}
          showBlur={true}
          textPosition="bottom"
          ariaLabel="Hero section for Auntie's Bakery & Cafe"
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          title="Our Story: A Family Legacy of Flavor"
          content="Auntie's Bakery & Cafe began with a simple dream: to share heartwarming homemade recipes with our community. For years, we've been Whittier's go-to for freshly baked goods, savory brunches, and a welcoming atmosphere where everyone feels like family. Come create new memories with us!"
          useInvertedBackground={true}
          ariaLabel="About section telling the cafe's story"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentySix
          title="Signature Delights Await"
          description="Explore our daily specials and perennial favorites, from flaky croissants to hearty brunch plates, all made with the finest ingredients and a touch of Auntie's magic."
          features={[
            {
              title: "Breakfast Croissant",              description: "Fluffy eggs, cheese, and choice of bacon or sausage on a buttery croissant. A perfect start to your day.",              imageSrc: getAsset("feature-croissant").url,
              imageAlt: getAsset("feature-croissant").alt,
              buttonIcon: Coffee,
            },
            {
              title: "French Toast",              description: "Thick-cut brioche dipped in our secret batter, grilled to golden perfection, and dusted with powdered sugar.",              imageSrc: getAsset("feature-frenchtoast").url,
              imageAlt: getAsset("feature-frenchtoast").alt,
              buttonIcon: Heart,
            },
            {
              title: "Eggs Benedict",              description: "Poached eggs, Canadian bacon, and hollandaise sauce on a toasted English muffin. A brunch classic done right.",              imageSrc: getAsset("feature-eggsbenedict").url,
              imageAlt: getAsset("feature-eggsbenedict").alt,
              buttonIcon: Utensils,
            },
            {
              title: "Chicken Sandwich",              description: "Grilled chicken breast, fresh veggies, and special sauce on artisan bread. A savory lunch option.",              imageSrc: getAsset("feature-chickensandwich").url,
              imageAlt: getAsset("feature-chickensandwich").alt,
              buttonIcon: Sandwich,
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Features section showcasing signature dishes"
        />
      </div>

      <div id="menu" data-section="menu">
        <ProductCardThree
          title="Freshly Baked & Brewed"
          description="Indulge in our exquisite selection of pastries, coffees, and seasonal treats, baked fresh every morning."
          products={[
            {
              id: "muffin-1",              name: "Blueberry Muffin",              price: "$3.50",              imageSrc: getAsset("product-muffin").url,
              imageAlt: getAsset("product-muffin").alt,
            },
            {
              id: "sourdough-1",              name: "Artisan Sourdough Loaf",              price: "$7.00",              imageSrc: getAsset("product-sourdough").url,
              imageAlt: getAsset("product-sourdough").alt,
            },
            {
              id: "choco-croissant-1",              name: "Chocolate Croissant",              price: "$4.25",              imageSrc: getAsset("product-chocolatecroissant").url,
              imageAlt: getAsset("product-chocolatecroissant").alt,
            },
            {
              id: "coffee-beans-1",              name: "Espresso Roast Beans",              price: "$15.00",              imageSrc: getAsset("product-coffeebeans").url,
              imageAlt: getAsset("product-coffeebeans").alt,
            },
            {
              id: "strawberry-tart-1",              name: "Strawberry Tart",              price: "$6.50",              imageSrc: getAsset("product-tart").url,
              imageAlt: getAsset("product-tart").alt,
            },
            {
              id: "banana-bread-1",              name: "Vegan Banana Bread",              price: "$4.00",              imageSrc: getAsset("product-bananabread").url,
              imageAlt: getAsset("product-bananabread").alt,
            },
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          ariaLabel="Menu section with baked goods and coffee"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Guests Are Saying"
          description="Hear from our wonderful customers who make Auntie's their favorite spot for food and cheer."
          testimonials={[
            {
              id: "t1",              name: "Sarah J.",              handle: "@sarahj",              testimonial: "Delicious food, simple menu, nice atmosphere. Perfect for breakfast & brunch!",              rating: 5,
              imageSrc: getAsset("testimonial-1").url,
              imageAlt: getAsset("testimonial-1").alt,
            },
            {
              id: "t2",              name: "Michael C.",              handle: "@mikeeats",              testimonial: "The French toast is out of this world! Always packed on weekends, but worth the wait.",              rating: 5,
              imageSrc: getAsset("testimonial-2").url,
              imageAlt: getAsset("testimonial-2").alt,
            },
            {
              id: "t3",              name: "Emily R.",              handle: "@emilybrunch",              testimonial: "My favorite place for a cozy coffee and a pastry. Staff are always so friendly.",              rating: 5,
              imageSrc: getAsset("testimonial-3").url,
              imageAlt: getAsset("testimonial-3").alt,
            },
            {
              id: "t4",              name: "David K.",              handle: "@davidfoodie",              testimonial: "A true hidden gem in Whittier. The classic meal combo is a must-try.",              rating: 5,
              imageSrc: getAsset("testimonial-4").url,
              imageAlt: getAsset("testimonial-4").alt,
            },
            {
              id: "t5",              name: "Jessica L.",              handle: "@jesslovefood",              testimonial: "I love the vibe here. It feels like home. Their croissants are divine!",              rating: 5,
              imageSrc: getAsset("testimonial-5").url,
              imageAlt: getAsset("testimonial-5").alt,
            },
            {
              id: "t6",              name: "Chris P.",              handle: "@chrispEats",              testimonial: "Great portions and incredible flavor. Auntie's never disappoints for brunch.",              rating: 5,
              imageSrc: getAsset("testimonial-6").url,
              imageAlt: getAsset("testimonial-6").alt,
            },
          ]}
          showRating={true}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Testimonials section with customer reviews"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="Our Journey in Numbers"
          description="Proudly serving our community with passion and dedication."
          metrics={[
            {
              id: "m1",              value: "15+",              title: "Years Serving",              items: ["A cornerstone in Whittier", "Generations of happy customers"],
            },
            {
              id: "m2",              value: "600+",              title: "5-Star Reviews",              items: ["Beloved by the community", "Consistently high quality"],
            },
            {
              id: "m3",              value: "100%",              title: "Homemade Fresh",              items: ["Baked daily from scratch", "Finest local ingredients"],
            },
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={true}
          ariaLabel="Metrics section highlighting company achievements"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Common Questions"
          description="Find answers to frequently asked questions about our cafe and services."
          faqs={[
            {
              id: "q1",              title: "What are your opening hours?",              content: "We are open Wednesday to Monday from 8 AM to 3 PM. We are closed on Tuesdays."},
            {
              id: "q2",              title: "Do you take reservations?",              content: "Currently, we operate on a first-come, first-served basis. We recommend arriving early on weekends."},
            {
              id: "q3",              title: "Do you offer catering?",              content: "Yes, we offer catering for local events. Please contact us for more details and menu options."},
            {
              id: "q4",              title: "Are there vegan/gluten-free options?",              content: "We have a selection of vegan-friendly items and can accommodate some gluten-free requests. Please ask our staff."},
            {
              id: "q5",              title: "Is online ordering available?",              content: "Yes, you can order many of our menu items and baked goods for takeout directly from our website."},
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="FAQ section with frequently asked questions"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get In Touch"
          title="Visit Us or Say Hello!"
          description="We'd love to hear from you. Stop by for a meal, or reach out with any questions. Our team is always happy to help."
          background={{ variant: "plain" }}
          useInvertedBackground={true}
          imageSrc={getAsset("contact-map").url}
          imageAlt={getAsset("contact-map").alt}
          mediaAnimation="opacity"
          mediaPosition="right"
          inputPlaceholder="Your Email Address"
          buttonText="Send Message"
          termsText="By sending a message, you agree to our privacy policy and terms of service."
          ariaLabel="Contact section with a contact form and location image"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          logoText="Auntie's Bakery & Cafe"
          columns={[
            {
              title: "Explore",              items: [
                { label: "Our Story", href: "#about" },
                { label: "Menu", href: "#menu" },
                { label: "Reviews", href: "#testimonials" },
                { label: "FAQs", href: "#faq" },
              ],
            },
            {
              title: "Visit",              items: [
                { label: "Directions", href: "https://maps.app.goo.gl/FkXw62QyC4gJjK3K6" },
                { label: "Hours", href: "#contact" },
              ],
            },
            {
              title: "Connect",              items: [
                { label: "Instagram", href: "#" },
                { label: "Facebook", href: "#" },
                { label: "Contact Us", href: "#contact" },
              ],
            },
          ]}
          copyrightText="© 2024 Auntie's Bakery & Cafe. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}
