"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Heart } from "lucide-react";

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="smallMedium"
      sizing="largeSmall"
      background="aurora"
      cardStyle="gradient-radial"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="PawsHome Shelter"
          navItems={[
            { name: "About", id: "/about" },
            { name: "Adopt", id: "/adopt" },
            { name: "Donate", id: "/donate" },
            { name: "Contact", id: "/contact" }
          ]}
        />
      </div>

      <div id="about-mission" data-section="about-mission">
        <TestimonialAboutCard
          tag="Our Story"
          title="Founded in 2015, we've been dedicated to giving every animal a second chance at happiness"
          description="PawsHome Shelter"
          subdescription="Over 5,000 animals rescued and rehomed"
          icon={Heart}
          imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-spending-time-with-cute-rescue-dogs-shelter_23-2148682966.jpg"
          imageAlt="Shelter volunteers caring for animals"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="Our Impact"
          description="Stories from the families and pets whose lives we've touched"
          testimonials={[
            {
              id: "1",
              name: "Sarah Johnson",
              handle: "@sarahjohnson",
              testimonial: "The care and attention every animal receives here is incredible. The staff truly understands each pet's unique needs and personality.",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg"
            },
            {
              id: "2",
              name: "Dr. Michael Chen",
              handle: "@drchen",
              testimonial: "As a veterinarian, I'm impressed by PawsHome's commitment to animal health and welfare. They set the gold standard for shelters.",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-happy-family-their-dg-relaxing-by-window-home-looking-through-it_637285-2902.jpg"
            },
            {
              id: "3",
              name: "Lisa Martinez",
              handle: "@lisamartinez",
              testimonial: "Volunteering here has been life-changing. Seeing the transformation of rescue animals into happy, healthy pets is magical.",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-parents-their-daughters-enjoying-home-having-fun-with-their-dog_637285-2878.jpg"
            }
          ]}
          showRating={true}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="values" data-section="values">
        <TestimonialAboutCard
          tag="Our Values"
          title="Every animal deserves compassion, care, and a loving home"
          description="Community Partnership"
          subdescription="Working together to create a world where no pet is homeless"
          icon={Heart}
          imageSrc="https://img.b2bpic.net/free-photo/cute-stylish-family-spring-park_1157-23139.jpg"
          imageAlt="Community supporting animal welfare"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-spending-time-with-cute-rescue-dogs-shelter_23-2148682966.jpg"
          imageAlt="PawsHome Shelter volunteers caring for animals"
          logoText="PawsHome Shelter"
          copyrightText="© 2025 PawsHome Shelter. All rights reserved."
          columns={[
            {
              title: "Adopt",
              items: [
                { label: "Browse Pets", href: "/adopt" },
                { label: "About Us", href: "/about" },
                { label: "Success Stories", href: "/" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "Donate", href: "/donate" },
                { label: "Contact", href: "/contact" },
                { label: "Volunteer", href: "/contact" }
              ]
            },
            {
              title: "Contact",
              items: [
                { label: "info@pawshome.org", href: "mailto:info@pawshome.org" },
                { label: "(555) 123-4567", href: "tel:+15551234567" },
                { label: "Tue-Sun 10am-6pm", href: "" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}