Fase 3a ADR 0006 Etapa 2: buscador del navbar via Meilisearch

PredictiveSearch pasa de filtrar en memoria el arreglo completo de
productos (prop products, substring match) a un fetch debounced
(250ms, con AbortController) contra la nueva ruta /api/search --
mismo componente visual, solo cambia de donde salen los datos, tal
como pide el ADR 0006 seccion 5.

/api/search (nueva, server-side) es el puente same-origin: el
componente es cliente y no puede pegarle directo al provider
server-side (MEDUSA_BACKEND_URL es DNS interno del cluster, no
resuelve desde el navegador).

CatalogProvider gana un metodo OPCIONAL searchWithFacets? (no cambia
la firma de getProducts/searchProducts) -- mock.ts y shopify.ts
compilan sin tocarlos, siguen sin implementarlo. medusa.ts lo
implementa contra /store/search (Fase 2), reutilizando mapProduct()
ya que la ruta devuelve el mismo shape de producto que /store/products.
searchProducts tambien se repunta a /store/search, dejando de usar el
?q= + re-filtro client-side de fetchProducts/matchesFilters para busqueda
(que sigue sirviendo para navegacion sin busqueda, sin cambios).

Navbar deja de pasarle products a PredictiveSearch (ya no los necesita)
pero los sigue recibiendo el mismo -- collections todavia se deriva de
ahi.

Limpieza: borrado patches/frontend-medusa-env.yaml, confirmado
huerfano (ningun kustomization lo referencia; el patch que si esta
vivo es frontend/patches/deployment.yaml).

Validado: build completo de Docker (target builder) -- npm ci,
next build con typecheck, /api/search aparece en la tabla de rutas
generada. Cero errores nuevos (los warnings de ESLint son
preexistentes en catalog-client.tsx, no tocado en esta fase).

workloads/ecommerce/lib/headless/client.ts

@@ -26,3 +26,7 @@ export async function searchProducts(query: string, limit?: number) {
 export async function getCategories() {
   return provider().getCategories();
 }
+
+export async function searchWithFacets(filters?: ProductFilters) {
+  return provider().searchWithFacets?.(filters);
+}

workloads/ecommerce/lib/headless/providers/medusa.ts

@@ -1,6 +1,8 @@
 import type {
   CatalogProvider,
   Category,
+  FacetDistribution,
+  FacetedSearchResult,
   Product,
   ProductFilters,
   ProductVariant,
@@ -385,6 +387,56 @@ async function fetchCategories(): Promise<Category[]> {
     }));
 }
 
+type MedusaSearchResponse = {
+  products: MedusaProduct[];
+  facetDistribution?: FacetDistribution;
+  count?: number;
+};
+
+// Pega contra /store/search (ADR 0006 Etapa 2) en vez de /store/products
+// -- Meilisearch resuelve texto tolerante a errores de tipeo y facetas
+// reales, la ruta del backend re-hidrata precio/inventario vía
+// query.graph antes de responder, así que el shape de MedusaProduct es
+// exactamente el mismo que ya mapea mapProduct().
+async function fetchWithFacets(
+  filters?: ProductFilters,
+  limit = 24,
+): Promise<FacetedSearchResult> {
+  const params = new URLSearchParams({
+    limit: String(limit),
+    region_id: regionId(),
+  });
+
+  if (filters?.query) params.set("q", filters.query);
+  if (filters?.category && filters.category !== "Todos") {
+    params.set("category", filters.category);
+  }
+  if (filters?.collection) params.set("collection", filters.collection);
+  if (filters?.brand && filters.brand !== "Todas") {
+    params.set("brand", filters.brand);
+  }
+  if (filters?.ageRange && filters.ageRange !== "Todas") {
+    params.set("ageRange", filters.ageRange);
+  }
+  if (typeof filters?.minPrice === "number") {
+    params.set("minPrice", String(filters.minPrice));
+  }
+  if (typeof filters?.maxPrice === "number") {
+    params.set("maxPrice", String(filters.maxPrice));
+  }
+
+  const response = await medusaFetch<MedusaSearchResponse>(
+    "/store/search",
+    params,
+  );
+
+  return {
+    products: response.products.map(mapProduct),
+    facetDistribution: response.facetDistribution ?? {},
+    count: response.count ?? response.products.length,
+  };
+}
+
 export const medusaCatalogProvider: CatalogProvider = {
   async getProducts(filters) {
     return fetchProducts(filters);
@@ -416,6 +468,11 @@ export const medusaCatalogProvider: CatalogProvider = {
   },
 
   async searchProducts(query, limit = 8) {
-    return fetchProducts({ query }, limit);
+    const { products } = await fetchWithFacets({ query }, limit);
+    return products;
+  },
+
+  async searchWithFacets(filters) {
+    return fetchWithFacets(filters);
   },
 };

workloads/ecommerce/lib/headless/types.ts

@@ -47,9 +47,23 @@ export interface Category {
   parentId: string | null;
 }
 
+// facet -> valor -> cuantos productos del resultado filtrado tienen ese
+// valor (ej. { brand: { Marvel: 5, Disney: 10 } }).
+export type FacetDistribution = Record<string, Record<string, number>>;
+
+export interface FacetedSearchResult {
+  products: Product[];
+  facetDistribution: FacetDistribution;
+  count: number;
+}
+
 export interface CatalogProvider {
   getProducts(filters?: ProductFilters): Promise<Product[]>;
   getProductBySlug(slug: string): Promise<Product | null>;
   searchProducts(query: string, limit?: number): Promise<Product[]>;
   getCategories(): Promise<Category[]>;
+  // Opcional a propósito: mock.ts y shopify.ts no lo implementan y
+  // siguen compilando igual -- los llamadores caen de nuevo al
+  // filtrado/conteo 100% client-side que ya existe cuando no está.
+  searchWithFacets?(filters?: ProductFilters): Promise<FacetedSearchResult>;
 }