From f10044eac1997537bcdf7699f5b4284aac16f8e2 Mon Sep 17 00:00:00 2001 From: Peter Stone 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 --- cmd/dashboard/main.go | 1 + internal/handlers/handlers.go | 65 ++++++++++++++- internal/handlers/handlers_test.go | 86 ++++++++++++++++++++ web/templates/index.html | 78 ++++++------------ web/templates/partials/shopping-mode-items.html | 22 ++---- web/templates/partials/shopping-tab.html | 3 +- web/templates/shopping-mode.html | 100 ++++++++++++++++++------ 7 files changed, 261 insertions(+), 94 deletions(-) diff --git a/cmd/dashboard/main.go b/cmd/dashboard/main.go index f1428ed..077b5b4 100644 --- a/cmd/dashboard/main.go +++ b/cmd/dashboard/main.go @@ -231,6 +231,7 @@ func main() { // Shopping mode (focused single-store view) r.Get("/shopping/mode/{store}", h.HandleShoppingMode) r.Post("/shopping/mode/{store}/toggle", h.HandleShoppingModeToggle) + r.Post("/shopping/mode/{store}/complete", h.HandleShoppingModeComplete) // Settings r.Get("/settings", h.HandleSettingsPage) diff --git a/internal/handlers/handlers.go b/internal/handlers/handlers.go index c384c48..f0f2a19 100644 --- a/internal/handlers/handlers.go +++ b/internal/handlers/handlers.go @@ -1258,7 +1258,8 @@ func (h *Handler) HandleShoppingQuickAdd(w http.ResponseWriter, r *http.Request) return } if storeName == "" { - storeName = "Quick Add" + JSONError(w, http.StatusBadRequest, "Store is required", nil) + return } if err := h.store.SaveUserShoppingItem(name, storeName); err != nil { @@ -1380,10 +1381,12 @@ func (h *Handler) HandleShoppingMode(w http.ResponseWriter, r *http.Request) { StoreName string Items []models.UnifiedShoppingItem StoreNames []string + CSRFToken string }{ StoreName: storeName, Items: items, StoreNames: storeNames, + CSRFToken: auth.GetCSRFTokenFromContext(ctx), } HTMLResponse(w, h.templates, "shopping-mode.html", data) @@ -1450,6 +1453,64 @@ func (h *Handler) HandleShoppingModeToggle(w http.ResponseWriter, r *http.Reques }{storeName, items}) } +// HandleShoppingModeComplete removes an item from the shopping list +func (h *Handler) HandleShoppingModeComplete(w http.ResponseWriter, r *http.Request) { + storeName := chi.URLParam(r, "store") + if err := r.ParseForm(); err != nil { + JSONError(w, http.StatusBadRequest, "Failed to parse form", err) + return + } + + id := r.FormValue("id") + source := r.FormValue("source") + + // Complete (remove) the item + switch source { + case "user": + var userID int64 + if _, err := fmt.Sscanf(id, "user-%d", &userID); err != nil { + JSONError(w, http.StatusBadRequest, "Invalid user item ID", err) + return + } + if err := h.store.DeleteUserShoppingItem(userID); err != nil { + JSONError(w, http.StatusInternalServerError, "Failed to delete item", err) + return + } + case "trello", "plantoeat": + // Mark as checked (will be filtered out of view) + if err := h.store.SetShoppingItemChecked(source, id, true); err != nil { + JSONError(w, http.StatusInternalServerError, "Failed to complete item", err) + return + } + } + + // URL decode the store name + storeName, _ = url.QueryUnescape(storeName) + + // Return updated item list partial + ctx := r.Context() + allStores := h.aggregateShoppingLists(ctx) + + var items []models.UnifiedShoppingItem + for _, store := range allStores { + if strings.EqualFold(store.Name, storeName) { + for _, cat := range store.Categories { + items = append(items, cat.Items...) + } + } + } + + // Sort alphabetically (checked items already filtered in template) + sort.Slice(items, func(i, j int) bool { + return items[i].Name < items[j].Name + }) + + HTMLResponse(w, h.templates, "shopping-mode-items", struct { + StoreName string + Items []models.UnifiedShoppingItem + }{storeName, items}) +} + // aggregateShoppingLists combines Trello, PlanToEat, and user shopping items by store func (h *Handler) aggregateShoppingLists(ctx context.Context) []models.ShoppingStore { storeMap := make(map[string]map[string][]models.UnifiedShoppingItem) @@ -1535,7 +1596,7 @@ func (h *Handler) aggregateShoppingLists(ctx context.Context) []models.ShoppingS for _, item := range userItems { storeName := item.Store if storeName == "" { - storeName = "Quick Add" + continue // Skip items without a store } if storeMap[storeName] == nil { diff --git a/internal/handlers/handlers_test.go b/internal/handlers/handlers_test.go index 96cb911..cd56e32 100644 --- a/internal/handlers/handlers_test.go +++ b/internal/handlers/handlers_test.go @@ -3,6 +3,7 @@ package handlers import ( "context" "encoding/json" + "fmt" "html/template" "net/http" "net/http/httptest" @@ -11,6 +12,8 @@ import ( "testing" "time" + "github.com/go-chi/chi/v5" + "task-dashboard/internal/api" "task-dashboard/internal/config" "task-dashboard/internal/models" @@ -698,3 +701,86 @@ func TestHandleCompleteAtom_APIError(t *testing.T) { t.Errorf("Task should NOT be deleted from cache on API error, found %d tasks", len(cachedTasks)) } } + +// TestHandleShoppingModeComplete tests completing (removing) shopping items +func TestHandleShoppingModeComplete(t *testing.T) { + db, cleanup := setupTestDB(t) + defer cleanup() + + tmpl := loadTestTemplates(t) + cfg := &config.Config{TemplateDir: "web/templates"} + + h := &Handler{ + store: db, + templates: tmpl, + config: cfg, + } + + // Add a user shopping item + err := db.SaveUserShoppingItem("Test Item", "TestStore") + if err != nil { + t.Fatalf("Failed to save user shopping item: %v", err) + } + + // Get the item to find its ID + items, err := db.GetUserShoppingItems() + if err != nil { + t.Fatalf("Failed to get user shopping items: %v", err) + } + if len(items) != 1 { + t.Fatalf("Expected 1 item, got %d", len(items)) + } + + itemID := items[0].ID + + t.Run("complete user item deletes it", func(t *testing.T) { + req := httptest.NewRequest("POST", "/shopping/mode/TestStore/complete", nil) + req.Form = map[string][]string{ + "id": {fmt.Sprintf("user-%d", itemID)}, + "source": {"user"}, + } + + // Add chi URL params + rctx := chi.NewRouteContext() + rctx.URLParams.Add("store", "TestStore") + req = req.WithContext(context.WithValue(req.Context(), chi.RouteCtxKey, rctx)) + + w := httptest.NewRecorder() + h.HandleShoppingModeComplete(w, req) + + if w.Code != http.StatusOK { + t.Errorf("Expected status 200, got %d", w.Code) + } + + // Verify item was deleted + remainingItems, _ := db.GetUserShoppingItems() + if len(remainingItems) != 0 { + t.Errorf("Expected 0 items after completion, got %d", len(remainingItems)) + } + }) + + t.Run("complete external item marks it checked", func(t *testing.T) { + req := httptest.NewRequest("POST", "/shopping/mode/TestStore/complete", nil) + req.Form = map[string][]string{ + "id": {"trello-123"}, + "source": {"trello"}, + } + + rctx := chi.NewRouteContext() + rctx.URLParams.Add("store", "TestStore") + req = req.WithContext(context.WithValue(req.Context(), chi.RouteCtxKey, rctx)) + + w := httptest.NewRecorder() + h.HandleShoppingModeComplete(w, req) + + if w.Code != http.StatusOK { + t.Errorf("Expected status 200, got %d", w.Code) + } + + // Verify item is marked as checked + checks, _ := db.GetShoppingItemChecks("trello") + if !checks["trello-123"] { + t.Error("Expected trello item to be marked as checked") + } + }) +} diff --git a/web/templates/index.html b/web/templates/index.html index 5322ca6..7e9a38f 100644 --- a/web/templates/index.html +++ b/web/templates/index.html @@ -46,8 +46,7 @@
-
@@ -297,22 +285,6 @@ function closeTaskModal() { document.getElementById('task-edit-modal').classList.add('hidden'); } - // Details dropdown functions - function toggleDetailsDropdown(e) { - e.stopPropagation(); - var menu = document.getElementById('details-menu'); - menu.classList.toggle('hidden'); - } - function closeDetailsDropdown() { - document.getElementById('details-menu').classList.add('hidden'); - } - // Close dropdown when clicking outside - document.addEventListener('click', function(e) { - var dropdown = document.getElementById('details-dropdown'); - if (dropdown && !dropdown.contains(e.target)) { - closeDetailsDropdown(); - } - }); 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 @@
{{if .Items}} {{range .Items}} -
-
- {{if .Checked}} - - - - {{end}} -
+
- {{.Name}} - {{if .Quantity}} - {{.Quantity}} - {{end}} + {{.Name}}{{if .Quantity}} ({{.Quantity}}){{end}}
@@ -35,6 +26,7 @@
{{end}} + {{end}} {{else}}

No items

diff --git a/web/templates/partials/shopping-tab.html b/web/templates/partials/shopping-tab.html index e5fa3e6..0b22c15 100644 --- a/web/templates/partials/shopping-tab.html +++ b/web/templates/partials/shopping-tab.html @@ -33,8 +33,7 @@ - {{range .Stores}} {{end}} diff --git a/web/templates/shopping-mode.html b/web/templates/shopping-mode.html index 88d8561..b2f129a 100644 --- a/web/templates/shopping-mode.html +++ b/web/templates/shopping-mode.html @@ -14,20 +14,6 @@ margin: 0; padding: 0; } - .item-row { - transition: all 0.2s ease; - } - .item-row:active { - transform: scale(0.98); - background: rgba(255,255,255,0.15); - } - .item-checked { - opacity: 0.5; - } - .item-checked .item-name { - text-decoration: line-through; - color: rgba(255,255,255,0.4); - } .store-switcher { scrollbar-width: none; -ms-overflow-style: none; @@ -35,11 +21,62 @@ .store-switcher::-webkit-scrollbar { display: none; } + .flash-success { + background: rgba(34, 197, 94, 0.2); + border-radius: 8px; + } + @media print { + * { + text-shadow: none !important; + } + body { + background: white !important; + color: black !important; + font-size: 10px !important; + line-height: 1.2 !important; + } + .no-print { + display: none !important; + } + main { + padding: 0 !important; + } + #shopping-items > div { + display: grid !important; + grid-template-columns: 1fr 1fr !important; + gap: 0 12px !important; + } + #shopping-items > div > div { + background: none !important; + border: none !important; + border-radius: 0 !important; + padding: 1px 0 !important; + color: black !important; + gap: 3px !important; + } + #shopping-items span { + color: black !important; + font-size: 10px !important; + } + #shopping-items .item-qty { + font-size: 8px !important; + color: #666 !important; + } + #shopping-items .rounded-full { + width: 8px !important; + height: 8px !important; + border-width: 1px !important; + border-color: #888 !important; + } + #shopping-items .text-xs { + display: none !important; + } + } - + -
+
@@ -47,7 +84,11 @@

{{.StoreName}}

-
+
@@ -64,18 +105,22 @@ {{end}}
+ + +
{{template "shopping-mode-items" .}}
-
-
+ + class="flex gap-2 transition-all"> -
+
+ + -- cgit v1.2.3