From 752a4880e3bce3523ff5c5f1033d30a8a52cb709 Mon Sep 17 00:00:00 2001
From: Thad Miller <thad.miller@gmail.com>
Date: Sun, 1 Mar 2026 12:57:06 -0500
Subject: [PATCH] [feat] pokemon not found

---
 src/components/CardGrid.astro  |  1 +
 src/pages/partials/cards.astro | 24 ++++++++++++++----------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/components/CardGrid.astro b/src/components/CardGrid.astro
index 56c3bdd..a376269 100644
--- a/src/components/CardGrid.astro
+++ b/src/components/CardGrid.astro
@@ -17,6 +17,7 @@
     <div class="col-sm-12 col-md-9 mt-0">
         <div id="cardGrid" class="row g-xxl-3 g-2 row-cols-2 row-cols-lg-3 row-cols-xxl-4 row-cols-xxxl-5">
         </div>
+        <div id="notfound"></div>
     </div>
 </div>
 <div class="modal fade card-modal" id="cardModal" tabindex="-1" aria-labelledby="cardModalLabel" aria-hidden="true">
diff --git a/src/pages/partials/cards.astro b/src/pages/partials/cards.astro
index ce3ca06..ad8bb8a 100644
--- a/src/pages/partials/cards.astro
+++ b/src/pages/partials/cards.astro
@@ -5,7 +5,7 @@ import RarityIcon from '../../components/RarityIcon.astro';
 export const prerender = false;
 
 // all the facet fields we want to use for filtering
-const facetFields = {
+const facetFields:any = {
     "productLineName": "Product Line",
     "setName": "Set",
     "variant": "Variant",
@@ -90,7 +90,7 @@ const totalHits = cardResults?.found;
 
 // format price to 2 decimal places (or 0 if price >=100) and adds a $ sign, if the price is null it returns "–"
 const formatPrice = (condition:string, skus: any) => {
-    const sku = skus.find(price => price.condition === condition);
+    const sku:any = skus.find((price:any) => price.condition === condition);
     if (typeof sku === 'undefined' || typeof sku.marketPrice === 'undefined') return '—';
 
     const price = Number(sku.marketPrice) / 100.0;
@@ -113,18 +113,16 @@ const facetNames = (name:string) => {
     return facetFields[name] || name;
 }
 
-if (start === 0) {
-    var facets = searchResults.results.slice(1).map((result: any) => {
-        return result.facet_counts[0];
-    });
-}
+const facets = searchResults.results.slice(1).map((result: any) => {
+    return result.facet_counts[0];
+});
 
 ---
 {(start === 0) &&
 
     <div id="facetContainer" hx-swap-oob="true">
         <div class="bg-dark sticky-top p-2 d-flex justify-content-end align-items-center">
-            <button type="" form="" class="btn btn-secondary btn-sm me-2">Clear</button>
+            <button type="reset" form="" class="btn btn-secondary btn-sm me-2">Clear</button>
             <button type="submit" form="searchform" class="btn btn-secondary btn-sm">Apply Filters</button>
         </div>
         {facets.map((facet) => (
@@ -134,7 +132,7 @@ if (start === 0) {
                     <input class="facet-filter form-control col-auto me-3" type="text" id={`filter_${facet.field_name}`} placeholder="Search..." />
                 }
                 <div class="facet-list col-11 mt-2">
-                    {facet.counts.map((count) => (
+                    {facet.counts.map((count:any) => (
                         <div class="facet-item form-check" data-facet-value={count.value.toLowerCase()}>
                             <label class="form-check-label">
                                 <input type="checkbox" name={facet.field_name} value={count.value} checked={filterChecked(facet.field_name, count.value)} class="form-check-input" form="searchform" />
@@ -165,7 +163,13 @@ if (start === 0) {
     </script>
 }
 
-{pokemon.map((card) => (
+{pokemon.length === 0 && (
+    <div id="notfound" hx-swap-oob="true">
+        Pokemon not found
+    </div>
+)}
+
+{pokemon.map((card:any) => (
     <div class="col">
         <div class="inventory-button position-relative float-end shadow-filter text-center d-none">
             <div class="inventory-label pt-2">+/-</div>