feat: settings page with notification preferences and sms consent

[kevinrutledge]

What needs to be built?

Replace the settings placeholder page with the full settings layout. The page displays a Notification Preferences card with email/SMS toggles and an SMS Consent card (only when SMS is enabled). Toggling a preference calls the update action and shows toast feedback.

Design reference

Figma link: https://www.figma.com/design/O8reTcdtMARvnTzCtlsvmp/Paso-Food-Co-Op?node-id=407-4433&p=f&t=wZjCheHOOyiYBbH4-0

Documentation

Existing patterns:

• src/app/(protected)/settings/page.tsx - current placeholder page
• src/actions/settings.ts - fetchUserPreferences(), updateUserPreferencesAction(), fetchSmsConsent(), revokeSmsConsentAction()
• src/actions/profile.ts - fetchProfile() for phone number

Component dependencies (must be merged first):

• src/components/settings/notification-preferences-card.tsx - toggle card
• src/components/settings/sms-consent-card.tsx - consent card

Official docs:

• Next.js Server Components

Technical notes

Replace src/app/(protected)/settings/page.tsx and create src/app/(protected)/settings/settings-content.tsx.

Server component (page.tsx):

• Fetch user preferences using fetchUserPreferences()
• Fetch SMS consent using fetchSmsConsent()
• Fetch profile for phone number using fetchProfile()
• Check SMS_ENABLED feature flag
• Pass data to SettingsContent

Client component (settings-content.tsx):

• "Settings" heading in Angkor font
• NotificationPreferencesCard with current toggle states
  • Toggle fires updateUserPreferencesAction and shows toast
  • SMS toggle only visible when SMS_ENABLED=true
• SmsConsentCard only rendered when SMS_ENABLED=true
  • Revoke fires revokeSmsConsentAction and shows toast
  • Phone number passed from profile data

Acceptance criteria

• Placeholder page replaced with settings layout
• "Settings" heading in Angkor font
• NotificationPreferencesCard renders with current preference values
• Toggling a preference calls updateUserPreferencesAction
• Toast shows on preference update success/error
• SmsConsentCard only renders when SMS_ENABLED=true
• Revoking consent calls revokeSmsConsentAction
• Toast shows on revoke success/error
• revalidatePath("/settings") called after mutations
• npm run build passes
• npm run lint passes