ADR 0005 seccion 3 (patron Amazon), primer item de "Filtros facetados
en sidebar con breadcrumb de categoria":
- Breadcrumb (Inicio > raiz > hija) armado caminando parentId sobre la
jerarquia real de categorias (misma que ya consume el mega-menu de
navbar.tsx), no un dato nuevo -- CatalogClient ahora recibe el
arreglo `categories: Category[]` completo ademas del
`categoryGroups` ya existente
- Conteo por valor en cada filtro de la sidebar (Categoria/Marca/Edad),
ej. "Marca (12)": se calcula client-side sobre los productos que ya
pasan el resto de filtros activos, cada dimension excluyendose a si
misma (patron faceted-count estandar). Sin Meilisearch por ahora,
como preveia el ADR ("server-side simple por ahora")
Filtrado existente refactorizado a funciones matchesX() puras y
reutilizadas tanto por `filtered` como por los conteos, sin cambiar el
comportamiento de filtrado ya validado.
52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { CatalogClient } from "@/components/catalog/catalog-client";
|
|
import { getCategories, getProducts } from "@/lib/headless/client";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "Catálogo",
|
|
description: "Explora todos los productos de Ari Shopping.",
|
|
};
|
|
|
|
type CatalogPageProps = {
|
|
searchParams: Promise<Record<string, string | string[] | undefined>>;
|
|
};
|
|
|
|
function single(value: string | string[] | undefined): string {
|
|
return Array.isArray(value) ? value[0] ?? "" : value ?? "";
|
|
}
|
|
|
|
export default async function CatalogPage({ searchParams }: CatalogPageProps) {
|
|
const params = await searchParams;
|
|
const [products, categories] = await Promise.all([getProducts(), getCategories()]);
|
|
|
|
const category = single(params.category) || "Todos";
|
|
const collection = single(params.collection);
|
|
const query = single(params.q);
|
|
|
|
// Los links de navbar/tiles apuntan a categorias raiz (ej. "Mochilas y
|
|
// morrales"), pero ningun producto tiene esa categoria asignada
|
|
// directamente -- solo sus hijos ("Marvel", "Frozen", etc.). Este mapa
|
|
// expande cada raiz-con-hijos al nombre real de sus hijos para que el
|
|
// filtro siga funcionando por igualdad exacta de `product.category`.
|
|
const categoryGroups: Record<string, string[]> = {};
|
|
for (const node of categories) {
|
|
if (node.parentId) continue;
|
|
const children = categories.filter((child) => child.parentId === node.id);
|
|
if (children.length > 0) {
|
|
categoryGroups[node.name] = children.map((child) => child.name);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<CatalogClient
|
|
key={`${category}:${collection}:${query}`}
|
|
products={products}
|
|
categories={categories}
|
|
categoryGroups={categoryGroups}
|
|
initialCategory={category}
|
|
initialCollection={collection}
|
|
initialQuery={query}
|
|
/>
|
|
);
|
|
}
|