Files
turnosxpress/openspec/changes/notification-preferences-ui/tasks.md
T

4.8 KiB

Tasks: Notification Preferences UI

Review Workload Forecast

Field Value
Estimated changed lines 1000-1200
400-line budget risk High
Chained PRs recommended Yes
Suggested split PR 1 → PR 2 → PR 3 → PR 4
Delivery strategy ask-on-risk
Chain strategy pending

Decision needed before apply: Yes Chained PRs recommended: Yes Chain strategy: pending 400-line budget risk: High

Suggested Work Units

Unit Goal Likely PR Focused test command Runtime harness Rollback boundary
1 Foundation: models, API service, store, validation PR 1 npm run typecheck N/A — types only Remove service, store, model files
2 Org policy page + navigation PR 2 Navigate to /admin/org/profile/[id]/notifications Org profile page loads, toggles render Remove org notifications page and layout
3 Client override page + navigation PR 3 Navigate to /admin/org/[oid]/client/[clientId]/notifications Client profile page loads, toggles render Remove client notifications page and layout
4 Client-facing page + tests PR 4 Navigate to /user/profile/notifications Landing profile page loads, toggles render Remove landing notifications page and tests

Phase 1: Foundation

  • 1.1 Create txclient/src/Models/NotificationPreferences.model.ts — TypeScript interfaces: NotificationChannel, QuietHours, ReminderRule, CompanyNotificationPolicy, ClientNotificationPreferences, ClientCompanyNotificationOverride, upsert params
  • 1.2 Create txclient/src/services/Notifications.Service.ts — 6 API functions using ApiRequest.post<T>(): getCompanyPolicy, upsertCompanyPolicy, getClientPreferences, upsertClientPreferences, getClientCompanyOverride, upsertClientCompanyOverride
  • 1.3 Create txclient/src/Store/NotificationPreferences.Store.ts — Zustand store with mode, form data, dirty flag; actions: setMode, updateFormData, resetForm
  • 1.4 Create txclient/src/Models/NotificationPreferences.validation.ts — Yup schemas: companyPolicySchema (channels min 1, timezone required, quietHours optional HH:mm, reminderRules max 5), clientPrefsSchema (preferredChannels, mutedChannels)

Phase 2: Org Policy Page

  • 2.1 Create txclient/src/app/admin/(organization-profile)/org/profile/[id]/notifications/layout.tsx — Saveable wrapper loading company policy on mount, dispatching NEED_SAVE/SAVE events
  • 2.2 Create txclient/src/app/admin/(organization-profile)/org/profile/[id]/notifications/page.tsx — Org policy form: channel toggles (3x Switch), quiet hours (2x input time), timezone Textbox, reminder rules dynamic list (max 5) with add/remove buttons
  • 2.3 Modify txclient/src/app/components/OrganizationHeader/OrganizationHeader.tsx — Add "Notificaciones" menu item linking to /admin/org/profile/[id]/notifications with NotificationsIcon

Phase 3: Client Override Page

  • 3.1 Create txclient/src/app/admin/(client-profile)/org/[oid]/client/[clientId]/notifications/layout.tsx — Saveable wrapper loading client company override on mount
  • 3.2 Create txclient/src/app/admin/(client-profile)/org/[oid]/client/[clientId]/notifications/page.tsx — Client override form: preferred channels (3x Switch), muted channels (3x Switch)
  • 3.3 Modify txclient/src/app/admin/(client-profile)/org/[oid]/client/[clientId]/layout.tsx — Add "Notificaciones" navigation link to client profile menu

Phase 4: Client-Facing Page

  • 4.1 Create txclient/src/app/user/profile/notifications-preferences/page.tsx — Client preferences form: preferred channels (3x Switch), muted channels (3x Switch); wrapped in Secure component for auth gate
  • 4.2 Modify txclient/src/app/user/profile/page.tsx — Add "Preferencias de notificación" navigation link to user profile menu

Phase 5: Testing

  • 5.1 Create txclient/src/Models/__tests__/NotificationPreferences.validation.test.ts — Test Yup schemas: valid inputs pass, invalid channels rejected, timezone required, quietHours format validated, reminderRules max 5 enforced (BLOCKED: no test runner in txclient)
  • 5.2 Create txclient/src/services/__tests__/Notifications.Service.test.ts — Mock ApiRequest.post, verify 6 functions call correct endpoints with correct params (BLOCKED: no test runner in txclient)
  • 5.3 Create txclient/src/Store/__tests__/NotificationPreferences.Store.test.ts — Test store actions: setMode, updateFormData, resetForm, dirty flag transitions (BLOCKED: no test runner in txclient)

Phase 6: Cleanup (if needed)

  • 6.1 Remove any temporary console.log statements added during development
  • 6.2 Verify all TypeScript types compile without errors
  • 6.3 Confirm navigation links work in all three contexts (org, client, landing)