import { Metadata } from 'next';
import { getProducts, getBrands } from '@/content/products';
import { ProductsGrid } from '@/components/shop/ProductsGrid';
import { HeroSection } from '@/components/sections/HeroSection';

export const metadata: Metadata = {
  title: 'Sklep z klimatyzatorami | ThermCool',
  description: 'Klimatyzatory split i multisplit — Gree, Rotenso, Haier, Daikin, LG, Samsung i inne. Szeroki wybór, konkurencyjne ceny, profesjonalny montaż.',
  alternates: { canonical: '/sklep' },
};

interface Props {
  searchParams: Promise<{ search?: string; brand?: string }>;
}

export default async function ShopPage({ searchParams }: Props) {
  const params = await searchParams;
  const initialSearch = params.search || '';
  const initialBrand = params.brand || '';

  const products = getProducts();
  const brands = getBrands();
  const splitCount = products.filter(p => p.category === 'scienne').length;
  const multiCount = products.filter(p => p.category === 'multisplit').length;

  return (
    <main>
      <HeroSection
        eyebrow="Sklep ThermCool"
        title="Klimatyzatory split i multisplit"
        subtitle={`${splitCount} klimatyzatorów split i ${multiCount} jednostek multisplit. Gree, Rotenso, Haier, Daikin, LG, Samsung i inne marki. Z montażem lub bez.`}
        ctaText="Zapytaj o montaż"
        ctaLink="/kontakt"
        secondaryCtaText={undefined}
        secondaryCtaLink={undefined}
        backgroundImage="https://images.unsplash.com/photo-1621905251189-08b45d6a269e?w=1600&q=80"
      />
      <ProductsGrid 
        products={products} 
        brands={brands}
        initialSearch={initialSearch}
        initialBrand={initialBrand}
      />
    </main>
  );
}