"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Images, Star, Sparkles } from "lucide-react";
import Link from "next/link";

export default function PortfolioPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="medium"
      background="circleGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Post Productionss"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Services", id: "/services" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Contact", id: "/contact" },
          ]}
          button={{ text: "Get in Touch", href: "/contact" }}
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <ProductCardOne
          products={[
            {
              id: "wedding-1",              name: "Wedding Ceremony",              price: "3 Days",              imageSrc: "http://img.b2bpic.net/free-photo/girlfriend-laughing_1157-65.jpg?_wi=3",              imageAlt: "Elegant wedding moment captured with emotional depth"},
            {
              id: "wedding-2",              name: "Reception Highlights",              price: "Evening Coverage",              imageSrc: "http://img.b2bpic.net/free-photo/bride-couple-waving-while-dacning-with-confetti_8353-12337.jpg?_wi=2",              imageAlt: "Joyful celebration captured in candid moments"},
            {
              id: "graduation-1",              name: "Graduation Day",              price: "Full Day",              imageSrc: "http://img.b2bpic.net/free-photo/different-nationalities-university-graduates_7502-9436.jpg?_wi=3",              imageAlt: "Achievement and pride captured in a portrait"},
            {
              id: "event-1",              name: "Corporate Event",              price: "Evening Event",              imageSrc: "http://img.b2bpic.net/free-photo/friends-celebrating-new-years-eve_53876-46899.jpg?_wi=2",              imageAlt: "Professional event photography with live energy"},
            {
              id: "balinese-1",              name: "Balinese Ceremony",              price: "Full Day",              imageSrc: "http://img.b2bpic.net/free-photo/nyepi-day-celebration-indonesia_23-2151325686.jpg?_wi=3",              imageAlt: "Traditional Balinese cultural ceremony with spiritual significance"},
            {
              id: "engagement-1",              name: "Engagement Session",              price: "2-3 Hours",              imageSrc: "http://img.b2bpic.net/free-photo/love-couple-pretty-woman-man-hats-outdoor_624325-3072.jpg?_wi=4",              imageAlt: "Intimate engagement session in scenic location"},
          ]}
          title="Our Portfolio"
          description="Explore a curated collection of our finest work across weddings, events, celebrations, and cultural moments. Each image tells a story of precision, artistry, and emotional depth."
          tag="Visual Storytelling"
          tagIcon={Images}
          tagAnimation="slide-up"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          testimonials={[
            {
              id: "1",              title: "Our Wedding Was Perfect, The Photos Are Perfection",              quote: "Post Productionss captured every emotion and detail of our wedding day. The photos are stunning, and we can relive the joy and love every time we look at them. Truly exceptional work!",              name: "Siti & Budi",              role: "Newlyweds",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=5",              imageAlt: "Happy couple testimonial"},
            {
              id: "2",              title: "Professional, Creative, and Deeply Caring",              quote: "Working with the Post Productionss team was a breeze. They understood our vision, managed the chaos of our event, and delivered photos that exceeded our expectations. Highly recommend!",              name: "Made Kurnia",              role: "Event Coordinator",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=6",              imageAlt: "Event coordinator testimonial"},
            {
              id: "3",              title: "Graduation Memories Preserved Forever",              quote: "The team captured the joy and pride of my graduation day beautifully. Every photo tells a story, and I'm so grateful to have these memories preserved with such artistry and professionalism.",              name: "Eka Putri",              role: "Recent Graduate",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=7",              imageAlt: "Graduate testimonial"},
          ]}
          title="Client Love & Trust"
          description="Hear directly from our clients about their experience working with Post Productionss and how we've preserved their precious memories."
          tag="Client Testimonials"
          tagIcon={Star}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready to Create Magic?"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          title="Let's Capture Your Moment"
          description="We'd love to hear about your vision and create something beautiful together. Reach out to discuss your project, ask questions, or book our services."
          buttons={[
            { text: "Contact Us Today", href: "/contact" },
            { text: "WhatsApp Us", href: "https://wa.me/6281234567890" },
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Post Productionss"
          copyrightText="© 2025 Post Productionss. All moments deserve to be preserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Wedding Photography", href: "/services" },
                { label: "Event Coverage", href: "/services" },
                { label: "Videography", href: "/services" },
                { label: "Engagement Sessions", href: "/services" },
              ],
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "/about" },
                { label: "Our Portfolio", href: "/portfolio" },
                { label: "Meet Our Team", href: "/team" },
                { label: "Testimonials", href: "/testimonials" },
              ],
            },
            {
              title: "Connect",              items: [
                { label: "Contact Us", href: "/contact" },
                { label: "Instagram", href: "https://instagram.com/postproductionss" },
                { label: "WhatsApp", href: "https://wa.me/6281234567890" },
                { label: "Email", href: "mailto:hello@postproductionss.com" },
              ],
            },
          ]}
        />
      </div>
    </ThemeProvider>
  );
}