"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import Link from "next/link";

const TryAgainPage = () => {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "My Feelings", id: "declaration" },
    { name: "Will You?", id: "proposal" },
  ];

  const footerColumns = [
    {
      title: "Quick Links",
      items: [
        { label: "Home", href: "/" },
        { label: "My Feelings", href: "/declaration" },
        { label: "The Question", href: "/proposal" },
      ],
    },
    {
      title: "My Heart",
      items: [
        { label: "Forever Yours", href: "#" },
        { label: "Always & Forever", href: "#" },
        { label: "With All My Love", href: "#" },
      ],
    },
    {
      title: "For You Sonam",
      items: [
        { label: "Made with Love ❤️", href: "#" },
        { label: "From Your Heart", href: "#" },
        { label: "Forever & Always", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="small"
      sizing="mediumLarge"
      background="noiseDiagonalGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="For Sonam ❤️"
          bottomLeftText="Made with Love"
          bottomRightText="Forever Yours"
        />
      </div>

      <div id="try-again" data-section="try-again">
        <ProductCardThree
          title="AM I REALLY THAT BAD?"
          description="I REALLY LIKE YOUU, PLEASEEE TRY ONCE IM NOT FORCING YOU BUT STILLL. I understand if you need more time. My feelings for you are real and true. Please don't close the door on what we could be. Take your time, but know that I'm here, waiting, hoping, and believing in us."
          products={[
            {
              id: "back",
              name: "Let Me Try Again",
              price: "My Heart",
              imageSrc: "http://img.b2bpic.net/free-photo/valentine-inscription-with-gift-boxes-table_23-2148009368.jpg",
              imageAlt: "Second chance",
              initialQuantity: 1,
            },
            {
              id: "think",
              name: "I Need Time",
              price: "To Think",
              imageSrc: "http://img.b2bpic.net/free-photo/valentine-inscription-with-gift-boxes-table_23-2148009368.jpg",
              imageAlt: "Think about it",
              initialQuantity: 1,
            },
          ]}
          gridVariant="two-columns-alternating-heights"
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={footerColumns}
          copyrightText="Made with all my love for you, Sonam. ❤️ Forever yours."
        />
      </div>
    </ThemeProvider>
  );
};

export default TryAgainPage;