Users can edit and correct their profile information

GDPR Art. 16 grants data subjects the right to have inaccurate personal data corrected without undue delay. CCPA §1798.106 and LGPD Art. 18(III) impose equivalent correction rights. If users cannot edit their own profile — their name, email, phone number, or address — the application is non-compliant every time a user's information changes in the real world. Beyond compliance, read-only personal data erodes trust: users who realize they cannot correct a misspelled name or update a phone number have no path to resolution without contacting support, which scales poorly. Email change flows also have a direct security dimension: unverified email changes are an account takeover vector that must be closed.

Add a profile edit form to app/settings/profile/page.tsx. For email changes, require verification via a link to the new address before updating to prevent account takeover.

// app/settings/profile/page.tsx
'use client'
import { useState, type FormEvent } from 'react'

export default function ProfileSettingsPage({ user }: { user: { name: string } }) {
  const [name, setName] = useState(user.name)
  const [saving, setSaving] = useState(false)

  async function handleSubmit(e: FormEvent) {
    e.preventDefault()
    setSaving(true)
    await fetch('/api/user/profile', {
      method: 'PATCH',
      body: JSON.stringify({ name }),
      headers: { 'Content-Type': 'application/json' },
    })
    setSaving(false)
  }

  return (
    <form onSubmit={handleSubmit}>
      <label>
        Display Name
        <input value={name} onChange={e => setName(e.target.value)} />
      </label>
      <button type="submit" disabled={saving}>{saving ? 'Saving…' : 'Save changes'}</button>
    </form>
  )
}

For email changes, send a verification link to the new address via app/api/user/change-email/route.ts and only commit the update after the link is clicked. Do not update the email immediately on form submission.