import { Suspense } from "react";
import CatalogRouteBoundary from "@/components/catalog/CatalogRouteBoundary";

// Conserva aquí los imports actuales de tu página:
// import CatalogClient from "...";
// import { getProducts } from "...";

type CatalogPageProps = {
  searchParams: Promise<Record<string, string | string[] | undefined>>;
};

export default async function CatalogPage({
  searchParams,
}: CatalogPageProps) {
  const params = await searchParams;

  // Conserva aquí la carga de datos actual de tu proyecto.
  // const products = await getProducts();

  return (
    <Suspense fallback={null}>
      <CatalogRouteBoundary>
        {/*
          Sustituye este comentario por el contenido actual del catálogo.

          Ejemplo:
          <CatalogClient
            products={products}
            initialCategory={String(params.category ?? "")}
            initialCollection={String(params.collection ?? "")}
          />
        */}
        <pre style={{ display: "none" }}>
          {JSON.stringify(params)}
        </pre>
      </CatalogRouteBoundary>
    </Suspense>
  );
}