"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Star } from 'lucide-react';

export default function ShopPage() {
  const products = [
    {
      id: "1",      brand: "Shine & Style",      name: "Premium Nail Polish Set",      price: "$29.99",      rating: 5,
      reviewCount: "2.4k",      imageSrc: "/nail-polish-set.jpg",      imageAlt: "Premium nail polish set",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    },
    {
      id: "2",      brand: "Shine & Style",      name: "Professional Nail File Kit",      price: "$19.99",      rating: 4,
      reviewCount: "1.8k",      imageSrc: "/nail-file-kit.jpg",      imageAlt: "Professional nail file kit",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    },
    {
      id: "3",      brand: "Shine & Style",      name: "Cuticle Care Treatment",      price: "$15.99",      rating: 5,
      reviewCount: "3.2k",      imageSrc: "/cuticle-treatment.jpg",      imageAlt: "Cuticle care treatment",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    },
    {
      id: "4",      brand: "Shine & Style",      name: "LED Nail Lamp",      price: "$89.99",      rating: 4,
      reviewCount: "956",      imageSrc: "/led-nail-lamp.jpg",      imageAlt: "LED nail lamp",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    },
    {
      id: "5",      brand: "Shine & Style",      name: "Nail Art Brush Set",      price: "$24.99",      rating: 5,
      reviewCount: "1.7k",      imageSrc: "/nail-art-brushes.jpg",      imageAlt: "Nail art brush set",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    },
    {
      id: "6",      brand: "Shine & Style",      name: "Base & Top Coat Duo",      price: "$18.99",      rating: 4,
      reviewCount: "2.1k",      imageSrc: "/base-top-coat.jpg",      imageAlt: "Base and top coat duo",      onProductClick: () => console.log('Product clicked'),
      onFavorite: () => console.log('Added to favorites')
    }
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="smallMedium"
      sizing="large"
      background="floatingGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <NavbarStyleCentered
        brandName="Shine & Style"
        navItems={[
          { name: "Home", id: "/" },
          { name: "Shop", id: "/shop" }
        ]}
        button={{
          text: "Book Now",          href: "/"
        }}
      />
      
      <main className="min-h-screen">
        <ProductCardTwo
          products={products}
          title="Our Premium Collection"
          description="Discover professional-grade nail care products and tools designed to help you achieve salon-quality results at home"
          tag="Best Sellers"
          tagIcon={Star}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          buttons={[
            {
              text: "View All Products",              href: "/shop"
            }
          ]}
        />
      </main>

      <FooterLogoEmphasis
        logoText="Shine & Style"
        columns={[
          {
            items: [
              { label: "Home", href: "/" },
              { label: "Shop", href: "/shop" }
            ]
          },
          {
            items: [
              { label: "Book Now", href: "/" }
            ]
          },
          {
            items: [
              { label: "Sydney, NSW" },
              { label: "Professional Nail Care" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}