From 8c55b9b10fecd45ac5acf3f13fc23d342a4aa53b Mon Sep 17 00:00:00 2001
From: Peter Stone <thepeterstone@gmail.com>
Date: Mon, 29 Jun 2026 10:29:12 +0000
Subject: fix: calendar/meals sync, tomorrow flat layout, /health endpoint

- Calendar: fall back to GOOGLE_CALENDAR_ID config when no source_configs
  synced yet (fixes blank calendar after fresh deploy)
- Meals: call fetchMeals in HandleTimeline so PlanToEat cache refreshes
  on every timeline load, not just during manual refresh
- Tomorrow section: replace calendar-grid with flat chronological list
  matching widget layout (time label | source bar | title)
- Add /health endpoint (no auth required) for deploy health checks

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 web/templates/partials/timeline-tab.html | 79 ++++++++++----------------------
 1 file changed, 23 insertions(+), 56 deletions(-)

(limited to 'web/templates/partials')

diff --git a/web/templates/partials/timeline-tab.html b/web/templates/partials/timeline-tab.html
index 8874440..e58f793 100644
--- a/web/templates/partials/timeline-tab.html
+++ b/web/templates/partials/timeline-tab.html
@@ -203,8 +203,7 @@
 
     </details>
 
-    <!-- Tomorrow Section (Calendar View) -->
-    <!-- TODO: mirror widget's tomorrow layout — flat event+task list ordered by time, no collapsible, inline time labels -->
+    <!-- Tomorrow Section (flat chronological list, mirroring widget layout) -->
     {{if .TomorrowItems}}
     <details class="group" open>
         <summary class="text-lg font-semibold mb-3 flex items-center gap-2 text-white/70 cursor-pointer hover:text-white/90 sticky top-0 bg-black/20 backdrop-blur-md py-2 z-10 rounded-lg px-2 list-none">
@@ -215,24 +214,37 @@
             </svg>
         </summary>
 
-        <!-- Overdue + All-Day + Untimed Items Section -->
-        <div class="mb-4 flex flex-wrap gap-1 p-2 bg-black/20 rounded-lg" id="tomorrow-untimed-section">
+        <!-- Flat chronological list: timed items first (sorted), then untimed -->
+        <div class="space-y-1 pl-1">
             {{range .TomorrowItems}}
-            {{if or .IsOverdue .IsAllDay}}
-            <div class="untimed-item source-{{.Source}} {{if .IsOverdue}}overdue{{end}} {{if .IsCompleted}}opacity-50{{end}}">
+            <div class="flex items-center gap-2 py-2 px-2 rounded-lg hover:bg-white/5 {{if .IsCompleted}}opacity-50{{end}}">
+                <!-- Time label (fixed width) -->
+                <span class="text-xs text-white/40 w-14 shrink-0 text-right">
+                    {{if and (not .IsAllDay) (or (ne .Time.Hour 0) (ne .Time.Minute 0))}}
+                    {{.Time.Format "3:04 PM"}}
+                    {{end}}
+                </span>
+                <!-- Source color bar -->
+                <div class="w-0.5 h-5 rounded-full shrink-0
+                    {{if eq .Source "calendar"}}bg-purple-400{{else if eq .Source "doot"}}bg-teal-400{{else if eq .Source "todoist"}}bg-red-400{{else if eq .Source "trello"}}bg-blue-400{{else if eq .Source "plantoeat"}}bg-green-400{{else if eq .Source "gtasks"}}bg-yellow-400{{else}}bg-white/30{{end}}">
+                </div>
+                <!-- Checkbox for tasks -->
                 {{if or (eq .Type "task") (eq .Type "card") (eq .Type "gtask")}}
                 <input type="checkbox"
                        {{if .IsCompleted}}checked{{end}}
                        hx-post="{{if .IsCompleted}}/uncomplete-atom{{else}}/complete-atom{{end}}"
                        hx-vals='{"id": "{{.ID}}", "source": "{{.Source}}"{{if .ListID}}, "listId": "{{.ListID}}"{{end}}}'
-                       hx-target="closest .untimed-item"
+                       hx-target="closest div.rounded-lg"
                        hx-swap="outerHTML"
-                       class="h-4 w-4 rounded bg-black/40 border-white/30 text-white/80 focus:ring-white/30 cursor-pointer flex-shrink-0">
+                       class="h-4 w-4 rounded bg-black/40 border-white/30 text-white/80 focus:ring-white/30 cursor-pointer shrink-0">
                 {{end}}
-                <span class="{{if .IsCompleted}}line-through text-white/50{{end}}">{{.Title}}</span>
-                {{if .IsOverdue}}<span class="overdue-badge">overdue</span>{{end}}
+                <!-- Title -->
+                <span class="flex-1 text-sm text-white/80 {{if .IsCompleted}}line-through text-white/40{{end}} truncate">
+                    {{.Title}}
+                    {{if .EndTime}}<span class="text-white/30 text-xs ml-1">– {{.EndTime.Format "3:04 PM"}}</span>{{end}}
+                </span>
                 {{if .URL}}
-                <a href="{{.URL}}" target="_blank" class="text-white/50 hover:text-white">
+                <a href="{{.URL}}" target="_blank" class="text-white/30 hover:text-white shrink-0">
                     <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
                     </svg>
@@ -240,52 +252,7 @@
                 {{end}}
             </div>
             {{end}}
-            {{end}}
         </div>
-
-        <!-- Calendar Grid (dynamic hours) -->
-        <div class="calendar-grid" id="tomorrow-calendar" data-start-hour="{{.TomorrowStartHour}}">
-            <!-- Hour rows -->
-            {{range .TomorrowHours}}
-            <div class="calendar-hour" data-hour="{{.}}">
-                <span class="calendar-hour-label">{{if eq . 0}}12am{{else if lt . 12}}{{.}}am{{else if eq . 12}}12pm{{else}}{{subtract . 12}}pm{{end}}</span>
-            </div>
-            {{end}}
-
-            <!-- Timed events positioned by JavaScript -->
-            {{range .TomorrowItems}}
-            {{if and (not .IsOverdue) (not .IsAllDay)}}
-            <div class="calendar-event source-{{.Source}} {{if .IsCompleted}}opacity-50{{end}}"
-                 data-hour="{{.Time.Hour}}"
-                 data-minute="{{.Time.Minute}}"
-                 data-end-hour="{{if .EndTime}}{{.EndTime.Hour}}{{else}}{{.Time.Hour}}{{end}}"
-                 data-end-minute="{{if .EndTime}}{{.EndTime.Minute}}{{else}}59{{end}}"
-                 data-id="{{.ID}}"
-                 data-source="{{.Source}}"
-                 data-completed="{{.IsCompleted}}"
-                 data-type="{{.Type}}"
-                 data-url="{{.URL}}"
-                 {{if .ListID}}data-list-id="{{.ListID}}"{{end}}
-                 style="display:none;">
-                <div class="flex items-center gap-2">
-                    {{if or (eq .Type "task") (eq .Type "card") (eq .Type "gtask")}}
-                    <input type="checkbox"
-                           {{if .IsCompleted}}checked{{end}}
-                           hx-post="{{if .IsCompleted}}/uncomplete-atom{{else}}/complete-atom{{end}}"
-                           hx-vals='{"id": "{{.ID}}", "source": "{{.Source}}"{{if .ListID}}, "listId": "{{.ListID}}"{{end}}}'
-                           hx-target="closest .calendar-event"
-                           hx-swap="outerHTML"
-                           onclick="event.stopPropagation();"
-                           class="h-4 w-4 rounded bg-black/40 border-white/30 text-white/80 focus:ring-white/30 cursor-pointer flex-shrink-0">
-                    {{end}}
-                    <span class="calendar-event-title {{if .IsCompleted}}line-through text-white/50{{end}}">{{.Title}}</span>
-                </div>
-                <div class="calendar-event-time">{{.Time.Format "3:04 PM"}}{{if .EndTime}} - {{.EndTime.Format "3:04 PM"}}{{end}}</div>
-            </div>
-            {{end}}
-            {{end}}
-        </div>
-
     </details>
     {{end}}
 
-- 
cgit v1.2.3