arthur/xtablo-source
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions 6

feat(17): add day-separator headers to planning event list

Browse source 
- PlanningShowDaySeparator in planning_forms.go — returns true when date
  changes between consecutive events
- PlanningDaySeparator templ: slate-50 header row with date label and
  data-day-separator attribute
- PlanningEventListItem: remove redundant DateLabel column (now in separator)
- Loop uses index to call PlanningShowDaySeparator before each event row

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Arthur Belleville 2026-05-17 13:03:30 +02:00
parent 3d5d9a05ea
commit 5624ca59ca
No known key found for this signature in database
2 changed files with 22 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
backend/templates/planning.templ
View file

@ -32,8 +32,11 @@ templ PlanningPage(user *auth.User, csrfToken string, activePath string, tablos
<p class="mt-2 text-base text-slate-600">Use the navigation controls to browse another 14-day window.</p>
</div>
} else {
<ul class="divide-y divide-slate-200 border-y border-slate-200" aria-label="Planning agenda">
for _, event := range agenda.Events {
<ul class="border-y border-slate-200" aria-label="Planning agenda">
for i, event := range agenda.Events {
if PlanningShowDaySeparator(agenda.Events, i) {
@PlanningDaySeparator(event.DateLabel)
}
@PlanningEventListItem(event)
}
</ul>
@ -42,12 +45,17 @@ templ PlanningPage(user *auth.User, csrfToken string, activePath string, tablos
}
}
templ PlanningDaySeparator(label string) {
<li class="bg-slate-50 px-4 py-2 text-sm font-semibold text-slate-600 border-t border-slate-200" data-day-separator="true">
{ label }
</li>
}
templ PlanningEventListItem(event PlanningEventRow) {
<li class="bg-white px-4 py-3 hover:bg-slate-50">
<li class="bg-white px-4 py-3 hover:bg-slate-50 border-t border-slate-200">
<a href={ templ.SafeURL(event.URL) } class="block focus:outline-none focus:ring-2 focus:ring-blue-600 focus:ring-offset-2" aria-label={ "Open event in tablo: " + event.Title }>
<div class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
<div class="flex min-w-0 flex-col gap-1 sm:flex-row sm:items-center sm:gap-3">
<span class="text-sm font-medium text-slate-700">{ event.DateLabel }</span>
<span class="text-sm font-medium text-slate-700">{ event.TimeRange }</span>
<span class="text-base font-semibold text-slate-900">{ event.Title }</span>
</div>

10
backend/templates/planning_forms.go
View file

@ -102,3 +102,13 @@ func PlanningRangeLabel(start time.Time, end time.Time) string {
func samePlanningDay(a time.Time, b time.Time) bool {
return a.Year() == b.Year() && a.Month() == b.Month() && a.Day() == b.Day()
}
// PlanningShowDaySeparator returns true when the event at index i belongs to a
// different day than the previous event — i.e. a date-group header should be
// rendered before it.
func PlanningShowDaySeparator(events []PlanningEventRow, index int) bool {
if index == 0 {
return true
}
return events[index].DateLabel != events[index-1].DateLabel
}