diff --git a/.planning/REQUIREMENTS.md b/.planning/REQUIREMENTS.md index 10a129c..5b0e108 100644 --- a/.planning/REQUIREMENTS.md +++ b/.planning/REQUIREMENTS.md @@ -1,111 +1,101 @@ -# Requirements: Xtablo v2.0 Collaboration, Planning, and Social Sign-in +# Requirements: Xtablo v3.0 Design System & Visual Polish -**Defined:** 2026-05-15 -**Core Value:** A user can sign in and run the Tablos workflow - organize work, attach files, discuss, and plan scheduled events - without a JS framework or managed chat provider. +**Defined:** 2026-05-16 +**Core Value:** A user can sign in and run the Tablos workflow — organize work, attach files, discuss, and plan scheduled events — without a JS framework or managed chat provider. -## v2.0 Requirements +## v3.0 Requirements -Requirements for milestone v2.0. Each requirement must map to exactly one roadmap phase. +Requirements for milestone v3.0. Each maps to exactly one roadmap phase. -### Authentication +### Design System -- [x] **AUTH-08**: User can start a Google sign-in flow from the login/signup page -- [x] **AUTH-09**: Google callback validates state, exchanges the authorization code, verifies the ID token, and creates or links a local Xtablo user -- [x] **AUTH-10**: Apple sign-in is disabled and hidden from the login/signup page -- [x] **AUTH-11**: Direct Apple sign-in routes are unavailable while Apple sign-in is disabled -- [x] **AUTH-12**: Social sign-in issues the same server-managed Xtablo session cookie used by email/password login -- [x] **AUTH-13**: Existing email/password login, signup, logout, CSRF, and rate limiting continue to work after social sign-in is added +- [ ] **DS-01**: CSS design tokens (colors, spacing, typography, shadows, gradients) are defined in `backend/internal/web/ui/base.css` matching the go-backend token vocabulary +- [ ] **DS-02**: Button component with primary, secondary, ghost, and danger variants +- [ ] **DS-03**: Input, Textarea, and Select form field components replace inline raw HTML in all templates +- [ ] **DS-04**: Card component is used across tablo list, detail, and content views +- [ ] **DS-05**: Badge component supports semantic tones (primary, warning, success, danger) +- [ ] **DS-06**: Modal component is available for create/edit dialogs +- [ ] **DS-07**: Empty-state component is available for zero-data views +- [ ] **DS-08**: Table component is available for list views (files, events) +- [ ] **DS-09**: Icon-button component replaces inline icon-button patterns across templates -### Chat +### Auth Views -- [x] **CHAT-01**: Each tablo has a discussion view where authenticated authorized users can see persisted message history -- [x] **CHAT-02**: User can post a text message to a tablo discussion with validation and CSRF protection -- [x] **CHAT-03**: Messages are stored in Postgres with tablo, author, body, created timestamp, and deletion/edit metadata -- [x] **CHAT-04**: Open tablo discussion views receive new messages in real time without a manual refresh -- [x] **CHAT-05**: Real-time delivery uses Xtablo-owned infrastructure only; no managed chat or realtime provider is introduced -- [x] **CHAT-06**: Message rendering escapes user content and enforces a server-side maximum body length +- [ ] **AUTH-UI-01**: Login page matches the JS app's auth-card layout (gradient background, centered card, brand logo, status banner) +- [ ] **AUTH-UI-02**: Signup page matches the same visual treatment as login +- [ ] **AUTH-UI-03**: Google sign-in button uses the Material Design button style -### Etapes +### Dashboard & Tablos -- [ ] **ETAPE-01**: User can create an etape inside a tablo with a title and optional description -- [ ] **ETAPE-02**: User can edit, delete, and reorder etapes inside a tablo -- [ ] **ETAPE-03**: User can assign a task to zero or one etape -- [ ] **ETAPE-04**: Deleting an etape unassigns its tasks by default rather than deleting the tasks -- [ ] **ETAPE-05**: The task UI can show or filter tasks by etape while preserving existing kanban status and ordering behavior -- [ ] **ETAPE-06**: The data model prevents nested etapes; an etape cannot have a parent etape +- [ ] **DASH-01**: Sidebar uses the go-backend sidebar design (brand section, nav items with icons, tablo list, user/account footer) +- [ ] **DASH-02**: Tablo list uses project-card layout with color accents, creation date, and action controls +- [ ] **DASH-03**: Dashboard empty state uses the empty-state component -### Events +### Tablo Detail -- [x] **EVENT-01**: User can create a scheduled event attached to a tablo with title, start time, optional end time, optional description, and optional location -- [x] **EVENT-02**: User can edit and delete tablo events -- [x] **EVENT-03**: Tablo detail page includes an events view listing that tablo's scheduled events -- [x] **EVENT-04**: Event validation requires an end time to be empty or after the start time -- [x] **EVENT-05**: Event authorization follows tablo access rules so users cannot read or mutate events for inaccessible tablos +- [ ] **DETAIL-01**: Tablo detail header area matches the project-card-top design +- [ ] **DETAIL-02**: Task kanban board uses the tasks-section design (section header, task rows, add control) +- [ ] **DETAIL-03**: Etapes section is visually consistent with the task section +- [ ] **DETAIL-04**: Files section uses the table component -### Planning +### Chat & Planning -- [x] **PLAN-01**: Each authenticated user can open an individual planning page -- [x] **PLAN-02**: Planning page lists the user's scheduled events across tablos in chronological order -- [x] **PLAN-03**: Planning page links each event back to its tablo context -- [x] **PLAN-04**: Planning page supports a functional empty state and date navigation/filtering suitable for the first working version +- [ ] **CHAT-UI-01**: Discussion view uses consistent card/surface design with message bubbles distinguishing own vs. others +- [ ] **PLAN-UI-01**: Planning page uses the overview-section layout for event aggregation ## Future Requirements -Deferred beyond v2.0. +### Responsive / Mobile -### Chat +- **RESP-01**: Sidebar collapses on small screens (hamburger or bottom-nav pattern) +- **RESP-02**: Kanban board scrolls horizontally on mobile +- **RESP-03**: Auth pages adapt gracefully to narrow viewports -- **CHAT-FUT-01**: Typing indicators -- **CHAT-FUT-02**: Read receipts -- **CHAT-FUT-03**: Message reactions -- **CHAT-FUT-04**: Threads or replies -- **CHAT-FUT-05**: File previews in chat messages +### Dark Mode -### Planning - -- **PLAN-FUT-01**: Recurring events -- **PLAN-FUT-02**: Reminder notifications -- **PLAN-FUT-03**: ICS import/export -- **PLAN-FUT-04**: External calendar sync - -### Etapes - -- **ETAPE-FUT-01**: Etape progress rollups -- **ETAPE-FUT-02**: Etape templates -- **ETAPE-FUT-03**: Etape dependencies +- **DARK-01**: All CSS tokens have dark-mode counterparts via `prefers-color-scheme` or a class toggle ## Out of Scope | Feature | Reason | |---------|--------| -| Managed chat/realtime providers | User explicitly does not want third-party chat | -| Managed auth platforms | Google is an identity provider only; Xtablo owns users and sessions. Apple sign-in is disabled for now. | -| WebSocket-first chat protocol | SSE receive + HTMX POST send is the recommended v2 path unless plan-phase proves WebSockets are needed | -| Nested etapes or arbitrary task hierarchy | User requested one parent per task and no parent-of-parent | -| Notes / rich documents | Not part of the requested v2 feature set | -| Billing / Stripe | Still deferred until product loop is validated | -| Public booking widget | Separate product surface, not part of this milestone | -| Client portal | Separate product surface, not part of this milestone | -| Admin tooling | Separate product surface, not part of this milestone | -| Mobile / Expo app | Web rewrite remains the current product surface | +| New pages or features | v3.0 is purely visual — no new routes or data models | +| Billing / Stripe | Deferred from v1.0, still out of scope | +| Client portal / Admin | Deferred from v1.0, still out of scope | +| Mobile app | Out of scope for this rewrite milestone | +| Dark mode | Future requirement — tokens will be structured to enable it, not implement it | ## Traceability -Populated during roadmap creation. - | Requirement | Phase | Status | |-------------|-------|--------| -| AUTH-08..13 | Phase 8 | Complete | -| ETAPE-01..06 | Phase 9 | Pending | -| EVENT-01..05 | Phase 10 | Complete | -| PLAN-01..04 | Phase 11 | Pending | -| CHAT-01..06 | Phase 12 | Complete | +| DS-01 | Phase 13 | Pending | +| DS-02 | Phase 13 | Pending | +| DS-03 | Phase 13 | Pending | +| DS-04 | Phase 13 | Pending | +| DS-05 | Phase 13 | Pending | +| DS-06 | Phase 13 | Pending | +| DS-07 | Phase 13 | Pending | +| DS-08 | Phase 13 | Pending | +| DS-09 | Phase 13 | Pending | +| AUTH-UI-01 | Phase 14 | Pending | +| AUTH-UI-02 | Phase 14 | Pending | +| AUTH-UI-03 | Phase 14 | Pending | +| DASH-01 | Phase 15 | Pending | +| DASH-02 | Phase 15 | Pending | +| DASH-03 | Phase 15 | Pending | +| DETAIL-01 | Phase 16 | Pending | +| DETAIL-02 | Phase 16 | Pending | +| DETAIL-03 | Phase 16 | Pending | +| DETAIL-04 | Phase 16 | Pending | +| CHAT-UI-01 | Phase 17 | Pending | +| PLAN-UI-01 | Phase 17 | Pending | **Coverage:** -- v2.0 requirements: 27 total -- Mapped to phases: 27 -- Unmapped: 0 +- v3.0 requirements: 21 total +- Mapped to phases: 21 +- Unmapped: 0 ✓ --- -*Requirements defined: 2026-05-15* -*Last updated: 2026-05-15 after Phase 8 execution complete* +*Requirements defined: 2026-05-16* +*Last updated: 2026-05-16 after initial definition*