From f10044eac1997537bcdf7699f5b4284aac16f8e2 Mon Sep 17 00:00:00 2001
From: Peter Stone <thepeterstone@gmail.com>
Date: Sun, 1 Feb 2026 14:47:50 -1000
Subject: Improve shopping mode and flatten nav bar

Shopping mode:
- Click to complete items (deletes user items, hides external items)
- Add print button with compact two-column print layout
- Fix CSRF token for HTMX requests
- Fix input clearing with proper htmx:afterRequest handler
- Remove "Quick Add" store option, require valid store

Navigation:
- Replace dropdown menu with flat nav showing all tabs
- Remove unused dropdown JS

Tests:
- Add TestHandleShoppingModeComplete for user and external items

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 web/templates/partials/shopping-mode-items.html | 22 +++++++---------------
 1 file changed, 7 insertions(+), 15 deletions(-)

(limited to 'web/templates/partials/shopping-mode-items.html')

diff --git a/web/templates/partials/shopping-mode-items.html b/web/templates/partials/shopping-mode-items.html
index fdf0674..5dad772 100644
--- a/web/templates/partials/shopping-mode-items.html
+++ b/web/templates/partials/shopping-mode-items.html
@@ -2,28 +2,19 @@
 <div class="space-y-2">
     {{if .Items}}
     {{range .Items}}
-    <div class="item-row flex items-center gap-3 p-4 bg-white/5 rounded-xl border border-white/10 cursor-pointer {{if .Checked}}item-checked{{end}}"
-         hx-post="/shopping/mode/{{$.StoreName}}/toggle"
-         hx-vals='{"id":"{{.ID}}","source":"{{.Source}}","checked":{{if .Checked}}false{{else}}true{{end}}}'
+    {{if not .Checked}}
+    <div class="flex items-center gap-3 p-4 bg-white/5 rounded-xl border border-white/10 cursor-pointer"
+         hx-post="/shopping/mode/{{$.StoreName}}/complete"
+         hx-vals='{"id":"{{.ID}}","source":"{{.Source}}"}'
          hx-target="#shopping-items"
          hx-swap="innerHTML">
 
         <!-- Checkbox visual -->
-        <div class="w-6 h-6 rounded-full border-2 flex items-center justify-center flex-shrink-0
-                    {{if .Checked}}bg-green-500/30 border-green-500{{else}}border-white/30{{end}}">
-            {{if .Checked}}
-            <svg class="w-4 h-4 text-green-400" fill="currentColor" viewBox="0 0 20 20">
-                <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
-            </svg>
-            {{end}}
-        </div>
+        <div class="w-6 h-6 rounded-full border-2 border-white/30 flex items-center justify-center flex-shrink-0"></div>
 
         <!-- Item content -->
         <div class="flex-1 min-w-0">
-            <span class="item-name text-white block">{{.Name}}</span>
-            {{if .Quantity}}
-            <span class="text-sm text-white/50">{{.Quantity}}</span>
-            {{end}}
+            <span class="text-white">{{.Name}}</span>{{if .Quantity}} <span class="text-sm text-white/50 item-qty">({{.Quantity}})</span>{{end}}
         </div>
 
         <!-- Source badge -->
@@ -35,6 +26,7 @@
         </span>
     </div>
     {{end}}
+    {{end}}
     {{else}}
     <div class="text-center py-16 text-white/50">
         <p class="text-lg mb-2">No items</p>
-- 
cgit v1.2.3