summaryrefslogtreecommitdiff
path: root/web/templates/partials/timeline-tab.html
diff options
context:
space:
mode:
authorPeter Stone <thepeterstone@gmail.com>2026-06-29 10:29:12 +0000
committerPeter Stone <thepeterstone@gmail.com>2026-06-29 10:29:12 +0000
commit8c55b9b10fecd45ac5acf3f13fc23d342a4aa53b (patch)
treed0e596f79980af79eed6e0e657d667e4758a9520 /web/templates/partials/timeline-tab.html
parentd826bf5e9561a8c66a2c52bb1c2a3835fc6de32c (diff)
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>
Diffstat (limited to 'web/templates/partials/timeline-tab.html')
-rw-r--r--web/templates/partials/timeline-tab.html79
1 files changed, 23 insertions, 56 deletions
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}}