From 2fb1ed729fbd61d70b38a11903fb35eabb2bdca1 Mon Sep 17 00:00:00 2001
From: Peter Stone <thepeterstone@gmail.com>
Date: Tue, 13 Jan 2026 13:33:43 -1000
Subject: Fix tab state persistence with URL query parameters (Bug 002)

- Extract tab query param in HandleDashboard, default to "tasks"
- Wrap DashboardData with ActiveTab field for template access
- Update index.html with conditional tab-button-active class
- Add hx-push-url="?tab=..." to each tab button for URL persistence
- Update content div to load active tab from server state
- Update app.js to read currentTab from URL query parameters
- Add comprehensive tab_state_test.go test suite
- Tab selection now persists through page reloads
- All tests passing

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 web/templates/index.html | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

(limited to 'web/templates/index.html')

diff --git a/web/templates/index.html b/web/templates/index.html
index b545a6e..a1210d6 100644
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -26,34 +26,34 @@
         <div class="border-b border-gray-200 mb-8 no-print">
             <nav class="-mb-px flex space-x-8">
                 <button
-                    class="tab-button tab-button-active"
+                    class="tab-button {{if eq .ActiveTab "tasks"}}tab-button-active{{end}}"
                     hx-get="/tabs/tasks"
                     hx-target="#tab-content"
-                    hx-push-url="false"
+                    hx-push-url="?tab=tasks"
                     onclick="setActiveTab(this)">
                     ✓ Tasks
                 </button>
                 <button
-                    class="tab-button"
+                    class="tab-button {{if eq .ActiveTab "planning"}}tab-button-active{{end}}"
                     hx-get="/tabs/planning"
                     hx-target="#tab-content"
-                    hx-push-url="false"
+                    hx-push-url="?tab=planning"
                     onclick="setActiveTab(this)">
                     📋 Planning
                 </button>
                 <button
-                    class="tab-button"
+                    class="tab-button {{if eq .ActiveTab "notes"}}tab-button-active{{end}}"
                     hx-get="/tabs/notes"
                     hx-target="#tab-content"
-                    hx-push-url="false"
+                    hx-push-url="?tab=notes"
                     onclick="setActiveTab(this)">
                     📝 Notes
                 </button>
                 <button
-                    class="tab-button"
+                    class="tab-button {{if eq .ActiveTab "meals"}}tab-button-active{{end}}"
                     hx-get="/tabs/meals"
                     hx-target="#tab-content"
-                    hx-push-url="false"
+                    hx-push-url="?tab=meals"
                     onclick="setActiveTab(this)">
                     🍽️ Meals
                 </button>
@@ -62,7 +62,7 @@
 
         <!-- Tab Content -->
         <div id="tab-content"
-             hx-get="/tabs/tasks"
+             hx-get="/tabs/{{.ActiveTab}}"
              hx-trigger="load"
              hx-swap="innerHTML">
             <div class="text-center py-8">
-- 
cgit v1.2.3