Implement watch-event feature (017) with bookmark in RsvpBar
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>
This commit is contained in:
33
specs/017-watch-event/quickstart.md
Normal file
33
specs/017-watch-event/quickstart.md
Normal file
@@ -0,0 +1,33 @@
|
||||
# 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
|
||||
|
||||
1. **useEventStorage** — Add `saveWatch()` and `isStored()` (unit tests first)
|
||||
2. **EventCard** — Extend role type, add "Watching" badge with styling (unit tests first)
|
||||
3. **EventList** — Update `getRole()`, adjust delete flow for watchers (unit tests first)
|
||||
4. **EventDetailView** — Add bookmark icon with all states and shake animation
|
||||
5. **E2E tests** — Cover all 7 user stories from spec
|
||||
|
||||
## Key Design Decisions
|
||||
|
||||
- **No new StoredEvent fields** — watcher state is the absence of both `organizerToken` and `rsvpToken`
|
||||
- **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
|
||||
Reference in New Issue
Block a user