feat(calendar): recurrence UI — instance expansion, editing strategies, and picker #124

New issue

Closed

opened 2026-03-28 04:42:40 +00:00 by barrettruth · 1 comment

barrettruth commented

2026-03-28 04:42:40 +00:00

Problem

Delta's backend now supports full RFC 5545 recurrence (RRULE + EXDATE + RDATE + exception records), but the frontend has no UI for:

Setting recurrence rules on tasks
Expanding recurring tasks into visible calendar instances
Editing/deleting individual instances vs the whole series
Displaying recurrence indicators on events

Solution

Frontend changes needed to complete recurrence support:

Calendar Instance Expansion

In calendar-view.tsx, expand recurMode="scheduled" master tasks into virtual instances using expandInstances() from src/core/recurrence-expansion.ts
Virtual instances render as normal EventBlock components with a recurrence indicator
Merge expanded instances with standalone tasks in timedTasksByDate computation
Virtual instances get synthetic IDs; lazy-materialize into real exception rows on first interaction (click, drag, complete)

Edit Strategy Dialog

When user edits a recurring event instance (drag, resize, or field change in task panel), show a dialog: "This event" / "This and future events" / "All events"
Wire to editThisInstance, editThisAndFuture, editAllInstances from src/core/recurrence-editing.ts
Same dialog pattern for delete: "This event" / "This and future" / "All events"
Wire to deleteThisInstance, deleteThisAndFuture, deleteAllInstances

Recurrence Picker UI

Add recurrence controls to task panel (when editing a task with startAt)
Presets: Daily, Weekly, Monthly, Yearly, Custom
Custom mode: frequency selector + interval + end condition (never / after N / until date)
Advanced: day-of-week picker for weekly, day-of-month for monthly
Display current recurrence as human-readable text (e.g. "Every Monday and Wednesday")
rrule package has .toText() method for this

Event Block Indicators

Show a small recurrence icon (↻ or similar) on EventBlock for recurring instances
Distinguish master vs exception visually (optional, subtle)

Completion Behavior

Completing a virtual instance: materialize as exception with status=done
Completing from task panel when viewing an instance: same materialization
recurMode="completion" tasks continue existing spawn behavior (no change needed)

Month View

Expand recurring tasks in month grid's tasksByDate computation too
Show recurring task instances in month day cells

Dependencies

Backend: schema migration 0013, recurrence-expansion.ts, recurrence-editing.ts (must be merged first)

Not in scope

RDATE UI (backend supports it, but no UI needed yet)
Timezone TZID picker
iCalendar import/export

## Problem Delta's backend now supports full RFC 5545 recurrence (RRULE + EXDATE + RDATE + exception records), but the frontend has no UI for: - Setting recurrence rules on tasks - Expanding recurring tasks into visible calendar instances - Editing/deleting individual instances vs the whole series - Displaying recurrence indicators on events ## Solution Frontend changes needed to complete recurrence support: ### Calendar Instance Expansion - In `calendar-view.tsx`, expand `recurMode="scheduled"` master tasks into virtual instances using `expandInstances()` from `src/core/recurrence-expansion.ts` - Virtual instances render as normal `EventBlock` components with a recurrence indicator - Merge expanded instances with standalone tasks in `timedTasksByDate` computation - Virtual instances get synthetic IDs; lazy-materialize into real exception rows on first interaction (click, drag, complete) ### Edit Strategy Dialog - When user edits a recurring event instance (drag, resize, or field change in task panel), show a dialog: **"This event" / "This and future events" / "All events"** - Wire to `editThisInstance`, `editThisAndFuture`, `editAllInstances` from `src/core/recurrence-editing.ts` - Same dialog pattern for delete: **"This event" / "This and future" / "All events"** - Wire to `deleteThisInstance`, `deleteThisAndFuture`, `deleteAllInstances` ### Recurrence Picker UI - Add recurrence controls to task panel (when editing a task with `startAt`) - Presets: Daily, Weekly, Monthly, Yearly, Custom - Custom mode: frequency selector + interval + end condition (never / after N / until date) - Advanced: day-of-week picker for weekly, day-of-month for monthly - Display current recurrence as human-readable text (e.g. "Every Monday and Wednesday") - `rrule` package has `.toText()` method for this ### Event Block Indicators - Show a small recurrence icon (↻ or similar) on `EventBlock` for recurring instances - Distinguish master vs exception visually (optional, subtle) ### Completion Behavior - Completing a virtual instance: materialize as exception with `status=done` - Completing from task panel when viewing an instance: same materialization - `recurMode="completion"` tasks continue existing spawn behavior (no change needed) ### Month View - Expand recurring tasks in month grid's `tasksByDate` computation too - Show recurring task instances in month day cells ## Dependencies - Backend: schema migration `0013`, `recurrence-expansion.ts`, `recurrence-editing.ts` (must be merged first) ## Not in scope - RDATE UI (backend supports it, but no UI needed yet) - Timezone TZID picker - iCalendar import/export

barrettruth commented

2026-03-29 00:01:01 +00:00

Landed — recurrence UI, instance editing, deletion strategies