Merge: mostrar mensaje cuando el buscador no tiene resultados

Co-Authored-By: Claude Sonnet 5 <[email protected]> Claude-Session: https://claude.ai/code/session_01THZFwPzrwv6VAbuwmaf5vR
fix(ecommerce): mostrar mensaje cuando el buscador no tiene resultados
2026-09-11 13:08:53 +00:00 · 2026-09-11 13:08:50 +00:00
1 changed files with 12 additions and 0 deletions
@@ -87,6 +87,18 @@ export function PredictiveSearch() {
          Buscando…
        </div>
      )}
      {/* Encontrado probando en vivo con navegador real: sin este bloque,
          una busqueda de 2+ caracteres sin coincidencias no mostraba nada
          (ni "buscando" ni un mensaje) -- el usuario se quedaba sin ningun
          feedback de que su busqueda de verdad corrio. Se ofrece igual el
          boton de buscar en todo el catalogo porque esa busqueda completa
          puede usar criterios mas amplios que el autocompletado. */}
      {!loading && normalized.length >= 2 && matches.length === 0 && (
        <div className="absolute left-0 right-0 top-[calc(100%+10px)] z-50 rounded-2xl border border-slate-200 bg-white p-2 text-center shadow-2xl">
          <p className="p-3 text-sm text-slate-500">No encontramos resultados para “{query.trim()}”.</p>
          <button type="submit" className="w-full rounded-xl bg-ari-marino px-4 py-3 text-sm font-black text-white hover:brightness-110">Buscar “{query.trim()}” en todo el catálogo</button>
        </div>
      )}
      {matches.length > 0 && (
        <div className="absolute left-0 right-0 top-[calc(100%+10px)] z-50 overflow-hidden rounded-2xl border border-slate-200 bg-white p-2 shadow-2xl">
          {matches.map((product) => (