"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroCarouselLogo from "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
import FeatureCardNine from "@/components/sections/feature/FeatureCardNine";
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Clapperboard, Instagram, Linkedin, Twitter, Video } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="medium"
      background="none"
      cardStyle="solid"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          navItems={[
            { name: "Services", id: "services" },
            { name: "Portfolio", id: "portfolio" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" },
          ]}
          brandName="Post Productions"
          button={{ text: "Get Started", href: "#contact" }}
          animateOnLoad={true}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="POST PRODUCTIONS"
          description="Transform your vision into cinematic reality. Premium post-production services crafted for storytellers and creators who demand excellence."
          buttons={[
            { text: "Explore Services", href: "#services" },
            { text: "View Portfolio", href: "#portfolio" },
          ]}
          slides={[
            {
              imageSrc: "http://img.b2bpic.net/free-photo/filmmaker-refining-movie-footage_482257-121322.jpg",              imageAlt: "Post production studio setup"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/filmmaker-refining-movie-footage_482257-121322.jpg",              imageAlt: "Color grading workstation"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/african-american-freelancer-editing-background-video-his-home-office_482257-116610.jpg",              imageAlt: "Professional editing environment"},
          ]}
          autoplayDelay={5000}
          showDimOverlay={true}
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Elevating storytelling through" },
            {
              type: "image",              src: "http://img.b2bpic.net/free-photo/closeup-photo-turned-digital-midi-controller_400718-29.jpg",              alt: "Professional editing"},
            { type: "text", content: "meticulous post-production craft" },
          ]}
          buttons={[
            { text: "Learn Our Process", href: "#services" },
            { text: "Get In Touch", href: "#contact" },
          ]}
          buttonAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne
          title="Our Core Services"
          description="Comprehensive post-production solutions tailored to elevate your creative projects from concept to final delivery."
          tag="Services"
          tagIcon={Clapperboard}
          features={[
            {
              title: "Video Editing",              description:
                "Precision editing that transforms raw footage into compelling narratives with seamless transitions and pacing.",              imageSrc:
                "http://img.b2bpic.net/free-photo/closeup-photo-turned-digital-midi-controller_400718-29.jpg",              imageAlt: "Professional video editing interface"},
            {
              title: "Color Grading",              description:
                "Cinematic color correction and grading that sets the mood and enhances the visual storytelling of your project.",              imageSrc:
                "http://img.b2bpic.net/free-photo/color-swatch-cmyk-design-spectrum-sample-concept_53876-122370.jpg",              imageAlt: "Color grading workstation"},
            {
              title: "Sound Design",              description:
                "Immersive audio mixing and sound design that completes your visual narrative with professional-grade quality.",              imageSrc:
                "http://img.b2bpic.net/free-photo/mixer-producer-develops-audio-by-editing-recordings-integrating-sounds_482257-121986.jpg",              imageAlt: "Audio mixing studio"},
            {
              title: "Motion Graphics",              description:
                "Dynamic titles, animations, and graphics that bring your story to life with professional visual effects.",              imageSrc:
                "http://img.b2bpic.net/free-vector/flat-motiongraphics-landing-page-template_23-2148904016.jpg",              imageAlt: "Motion graphics animation"},
          ]}
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <FeatureCardNine
          title="Advanced Capabilities"
          description="Cutting-edge technology and creative expertise combine to deliver exceptional results for every project."
          tag="Portfolio"
          showStepNumbers={true}
          features={[
            {
              id: 1,
              title: "Visual Effects",              description:
                "Stunning VFX that seamlessly integrate with your footage, creating immersive and professional visual experiences.",              phoneOne: {
                imageSrc:
                  "http://img.b2bpic.net/free-photo/wonder-wheel-movement-lights-with-light-bulb_23-2148328100.jpg"},
              phoneTwo: {
                imageSrc:
                  "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269908.jpg"},
            },
            {
              id: 2,
              title: "Professional Animation",              description:
                "From character animation to complex motion graphics, we bring imaginative concepts to animated life with precision.",              phoneOne: {
                imageSrc:
                  "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269908.jpg"},
              phoneTwo: {
                imageSrc:
                  "http://img.b2bpic.net/free-photo/wonder-wheel-movement-lights-with-light-bulb_23-2148328100.jpg"},
            },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="service-showcase" data-section="service-showcase">
        <FeatureCardMedia
          title="Industry-Leading Services"
          description="We specialize in diverse media formats and genres, delivering excellence across every project type."
          tag="Specialties"
          features={[
            {
              id: "1",              title: "Documentary",              description:
                "Authentic storytelling through expert editing, color grading, and sound design that captures the essence of real-world narratives.",              tag: "Narrative",              imageSrc:
                "http://img.b2bpic.net/free-photo/man-filming-with-professional-camera_23-2149066356.jpg"},
            {
              id: "2",              title: "Commercial Production",              description:
                "High-impact advertising content crafted to engage audiences and drive results for your brand or product.",              tag: "Advertising",              imageSrc:
                "http://img.b2bpic.net/free-photo/professional-photographer-shooting-business-meeting-office_1268-21503.jpg"},
            {
              id: "3",              title: "Corporate Video",              description:
                "Professional corporate content that communicates your message with clarity, creativity, and sophistication.",              tag: "Business",              imageSrc:
                "http://img.b2bpic.net/free-photo/professional-photographer-shooting-business-meeting-office_1268-21503.jpg"},
            {
              id: "4",              title: "Music Video Production",              description:
                "Visually stunning music videos that perfectly complement and amplify the artist's creative vision.",              tag: "Music",              imageSrc:
                "http://img.b2bpic.net/free-photo/skilled-male-composer-producing-new-songs-his-mixing-console_482257-96160.jpg"},
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          carouselMode="buttons"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Creators Say"
          description="Hear from filmmakers, directors, and producers who trust us with their most important projects."
          tag="Testimonials"
          testimonials={[
            {
              id: "1",              name: "Marcus Johnson, Director",              date: "Date: 15 November 2024",              title: "Exceptional attention to detail and creative vision",              quote:
                "Working with Post Productions transformed our feature film. Their color grading work alone elevated the entire production. Every frame feels intentional and cinematic. They truly understand the art of storytelling.",              tag: "Feature Film",              avatarSrc:
                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/man-filming-with-professional-camera_23-2149066356.jpg"},
            {
              id: "2",              name: "Sarah Chen, Producer",              date: "Date: 08 November 2024",              title: "Professional excellence from start to finish",              quote:
                "Their team's professionalism and technical expertise are unmatched. We've worked on multiple projects together and they consistently deliver beyond expectations. The sound design work they did for our documentary was absolutely stunning.",              tag: "Documentary",              avatarSrc:
                "http://img.b2bpic.net/free-photo/smiling-photographer-grasps-film-slate_482257-122232.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/man-filming-with-professional-camera_23-2149066356.jpg"},
            {
              id: "3",              name: "Alex Rodriguez, Brand Manager",              date: "Date: 01 November 2024",              title: "Brought our brand vision to life beautifully",              quote:
                "Our commercial campaign exceeded all expectations thanks to Post Productions' expertise. They managed everything from editing to final color correction. The entire process was smooth and collaborative.",              tag: "Commercial",              avatarSrc:
                "http://img.b2bpic.net/free-photo/joyful-woman-black-jacket-liking-lip-posing-isolated-background-charming-lady-dark-suit-smiling-white-backdrop_197531-18516.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/professional-photographer-shooting-business-meeting-office_1268-21503.jpg"},
            {
              id: "4",              name: "David Kumar, Music Artist",              date: "Date: 25 October 2024",              title: "They captured my artistic vision perfectly",              quote:
                "The music video they created for my latest single is incredible. Every creative decision enhanced the song's message. Their team's understanding of visual aesthetics and music sync is exceptional.",              tag: "Music Video",              avatarSrc:
                "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-macho-male-dressed-suit-dark-grey-background_613910-9486.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/skilled-male-composer-producing-new-songs-his-mixing-console_482257-96160.jpg"},
            {
              id: "5",              name: "Jennifer Martinez, Creative Director",              date: "Date: 18 October 2024",              title: "True creative partners, not just service providers",              quote:
                "Post Productions goes beyond technical execution. They're invested in the creative vision. Their suggestions during the editing process genuinely improved our final product.",              tag: "Corporate Video",              avatarSrc:
                "http://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/professional-photographer-shooting-business-meeting-office_1268-21503.jpg"},
            {
              id: "6",              name: "Thomas Wright, Filmmaker",              date: "Date: 10 October 2024",              title: "Industry-level quality every single time",              quote:
                "When it comes to post-production, Post Productions is my go-to team. Their VFX work, color grading, and attention to detail sets them apart. They make the entire process stress-free.",              tag: "Feature Film",              avatarSrc:
                "http://img.b2bpic.net/free-photo/dark-blonde-bearded-man-crosses-his-hands-chest-posing-black-shirt_8353-1116.jpg",              imageSrc:
                "http://img.b2bpic.net/free-photo/man-filming-with-professional-camera_23-2149066356.jpg"},
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Start Your Project"
          description="Ready to elevate your production? Reach out to discuss your vision, timeline, and requirements. Our team is excited to collaborate with you on your next project."
          inputs={[
            {
              name: "projectName",              type: "text",              placeholder: "Project Name",              required: true,
            },
            {
              name: "email",              type: "email",              placeholder: "Email Address",              required: true,
            },
            {
              name: "phone",              type: "tel",              placeholder: "Phone Number",              required: true,
            },
            {
              name: "company",              type: "text",              placeholder: "Company or Studio Name",              required: false,
            },
          ]}
          textarea={{
            name: "message",            placeholder:
              "Tell us about your project, timeline, and any specific requirements you have in mind...",            rows: 6,
            required: true,
          }}
          useInvertedBackground={false}
          imageSrc=
            "http://img.b2bpic.net/free-photo/close-up-empty-corner-with-desks-startup-office-computer-modern-equipment-bookshelf-with-decor-business-space-workplace-with-technology-instruments-work_482257-32177.jpg"
          imageAlt="Professional post-production studio"
          mediaAnimation="slide-up"
          mediaPosition="right"
          buttonText="Send Inquiry"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Post Productions"
          copyrightText="© 2024 Post Productions. All rights reserved."
          socialLinks={[
            {
              icon: Instagram,
              href: "https://instagram.com",              ariaLabel: "Instagram"},
            {
              icon: Linkedin,
              href: "https://linkedin.com",              ariaLabel: "LinkedIn"},
            {
              icon: Twitter,
              href: "https://twitter.com",              ariaLabel: "Twitter"},
            {
              icon: Video,
              href: "https://vimeo.com",              ariaLabel: "Vimeo"},
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
