Spec, research, data model, API contract, implementation plan, and task breakdown for the public event detail page. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
40 lines
1.8 KiB
Markdown
40 lines
1.8 KiB
Markdown
# Quickstart: View Event Landing Page (007)
|
|
|
|
## What this feature does
|
|
|
|
Adds a public event detail page at `/events/:token`. Guests open a shared link and see:
|
|
- Event title, date/time (with IANA timezone), description, location
|
|
- Count of confirmed attendees (no names)
|
|
- "Event has ended" state for expired events
|
|
- "Event not found" for invalid tokens
|
|
- Skeleton shimmer while loading
|
|
|
|
## Prerequisites
|
|
|
|
- US-1 (Create Event) is implemented — Event entity, JPA persistence, POST endpoint exist.
|
|
- No RSVP model yet — attendee count returns 0 until RSVP feature is built.
|
|
|
|
## Key changes
|
|
|
|
### Backend
|
|
|
|
1. **OpenAPI**: Add `GET /events/{token}` endpoint + `GetEventResponse` schema. Add `timezone` field to `CreateEventRequest`, `CreateEventResponse`, and `GetEventResponse`.
|
|
2. **Domain**: Add `timezone` (String) to `Event.java`.
|
|
3. **Persistence**: Add `timezone` column to `EventJpaEntity`, Liquibase migration.
|
|
4. **Use case**: New `GetEventUseCase` (inbound port) + implementation in `EventService`.
|
|
5. **Controller**: `EventController` implements `getEvent()` — maps to `GetEventResponse`, computes `expired` and `attendeeCount`.
|
|
|
|
### Frontend
|
|
|
|
1. **API types**: Regenerate `schema.d.ts` from updated OpenAPI spec.
|
|
2. **EventDetailView.vue**: New view component — fetches event by token, renders detail card.
|
|
3. **Router**: Replace `EventStubView` import at `/events/:token` with `EventDetailView`.
|
|
4. **States**: Loading (skeleton shimmer), loaded, expired, not-found, server-error (retry button).
|
|
5. **Create form**: Send `timezone` field (auto-detected via `Intl.DateTimeFormat`).
|
|
|
|
### Testing
|
|
|
|
- Backend: Unit tests for `GetEventUseCase`, controller tests for GET endpoint (200, 404).
|
|
- Frontend: Unit tests for EventDetailView (all states).
|
|
- E2E: Playwright tests with MSW mocks for all states (loaded, expired, not-found, error).
|