From 5f249567847c37d72e88ca681525337117709668 Mon Sep 17 00:00:00 2001
From: Daniel McGee <134719124+mcgeeandme@users.noreply.github.com>
Date: Fri, 3 Jul 2026 21:29:05 -0400
Subject: [PATCH] Update Store.vue

---
 webapp/src/views/Store.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/webapp/src/views/Store.vue b/webapp/src/views/Store.vue
index d2f40cf..624b03b 100644
--- a/webapp/src/views/Store.vue
+++ b/webapp/src/views/Store.vue
@@ -24,12 +24,12 @@
         <!-- ── Shop tab ─────────────────────────────────────────────────────── -->
         <v-window-item value="shop" eager>
 
-          <p class="mt-4 mb-4 text-center text-medium-emphasis">
+          <p class="mb-6 text-center text-medium-emphasis">
             T-shirts, stickers, yard signs, and more — proceeds support the anti-surveillance movement.
           </p>
 
           <v-row justify="center" class="mb-6">
-            <v-col cols="12" sm="8" md="5" lg="4">
+            <v-col cols="12" md="6" lg="4">
               <v-select
                 v-model="collectionId"
                 :items="collectionSelectItems"
@@ -39,6 +39,7 @@
                 label="Browse by category"
                 variant="outlined"
                 prepend-inner-icon="mdi-tag-outline"
+                clearable
                 hide-details
               >
                 <template #item="{ props, item }">
@@ -562,6 +563,13 @@ watch(() => route.query, (query) => {
 });
 
 watch(collectionId, (id) => {
+  // The category select is clearable to match the Downloads filter's UX,
+  // but the Shopify embed always needs a valid collection id — clearing
+  // falls back to "All Products" rather than passing null through.
+  if (!id) {
+    collectionId.value = ALL_COLLECTION_ID;
+    return;
+  }
   if (window.ShopifyBuy?.UI) renderShopify(id);
 });