nitrix
c450849e4d
Add client-side watch/bookmark functionality: users can save events to localStorage without RSVPing via a bookmark button next to the "I'm attending" CTA. Watched events appear in the event list with a "Watching" label. Bookmark is only visible for visitors (not attendees or organizers). Includes spec, plan, research, tasks, unit tests, and E2E tests. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1.5 KiB
1.5 KiB
Quickstart: Watch Event
Feature: 017-watch-event Date: 2026-03-12
What This Feature Does
Adds a bookmark icon to the event detail page that lets users save events locally without RSVPing. Saved events appear in the event list with a "Watching" label.
Files to Modify
| File | Change |
|---|---|
frontend/src/composables/useEventStorage.ts |
Add saveWatch() and isStored() methods |
frontend/src/views/EventDetailView.vue |
Add bookmark icon left of title, shake animation trigger |
frontend/src/components/EventList.vue |
Update getRole() to return 'watcher', skip confirmation for watchers |
frontend/src/components/EventCard.vue |
Add 'watcher' to role type, add badge styling |
Implementation Order
- useEventStorage — Add
saveWatch()andisStored()(unit tests first) - EventCard — Extend role type, add "Watching" badge with styling (unit tests first)
- EventList — Update
getRole(), adjust delete flow for watchers (unit tests first) - EventDetailView — Add bookmark icon with all states and shake animation
- E2E tests — Cover all 7 user stories from spec
Key Design Decisions
- No new StoredEvent fields — watcher state is the absence of both
organizerTokenandrsvpToken - No backend changes — entirely client-side
- Bookmark icon left of title — flex container, vertically centered
- Non-interactive for attendees/organizers — tapping shakes the relevant bottom action button
- No confirmation dialog for watcher deletion from event list