[feat] dashboard catalogs are real and clickable

src/pages/dashboard.astro

@@ -26,6 +26,18 @@ const totalQty = summary.totalQty || 0;
 const totalValue = summary.totalValue || 0;
 const totalGain = summary.totalGain || 0;
 
+// distinct catalog names for this user, for the sidebar catalog list
+const catalogRows = userId
+  ? await db
+      .selectDistinct({ name: inventory.catalogName })
+      .from(inventory)
+      .where(eq(inventory.userId, userId))
+  : [];
+const catalogs = catalogRows
+  .map(r => r.name)
+  .filter((n): n is string => !!n)
+  .sort((a, b) => a.localeCompare(b));
+
 ---
 
 <Layout title="Inventory Dashboard">
@@ -50,6 +62,10 @@ const totalGain = summary.totalGain || 0;
           data-catalog="all"
           role="button"
           style="cursor:pointer"
+          hx-post="/partials/inventory-cards"
+          hx-vals={JSON.stringify({ catalog: "all" })}
+          hx-target="#gridView"
+          hx-swap="innerHTML"
         >
           <span class="d-flex align-items-center gap-2">
             View all cards
@@ -57,12 +73,16 @@ const totalGain = summary.totalGain || 0;
           <span class="badge rounded-pill text-bg-secondary small ms-auto">{totalQty}</span>
         </li>
 
-        {["Case Cards", "Japanese Singles", "Bulk"].map((name) => (
+        {catalogs.map((name) => (
           <li
             class="ms-2 list-group-item list-group-item-action bg-transparent text-light border-0 rounded px-2 py-2 d-flex align-items-center gap-2"
             data-catalog={name}
             role="button"
             style="cursor:pointer"
+            hx-post="/partials/inventory-cards"
+            hx-vals={JSON.stringify({ catalog: name })}
+            hx-target="#gridView"
+            hx-swap="innerHTML"
           >
             {name}
           </li>
@@ -299,6 +319,18 @@ const totalGain = summary.totalGain || 0;
   </div> -->
 
 <script is:inline>
+(function () {
+  const catalogList = document.getElementById('catalogList');
+  if (catalogList) {
+    catalogList.addEventListener('click', (e) => {
+      const li = e.target.closest('li[data-catalog]');
+      if (!li) return;
+      catalogList.querySelectorAll('li[data-catalog]').forEach(el => el.classList.remove('active'));
+      li.classList.add('active');
+    });
+  }
+})();
+
 (function () {
   const modal = document.getElementById('inventoryModal');
   if (!modal) return;