Ryth Azhur
27c30d7e50
allauth/ (44 files) is a django-allauth React UI — a separate concern from the Mizan protocol. Moved to legacy/ pending extraction into a standalone mizan-django-allauth package. Also moved to legacy/: - client/AuthContext.tsx — generic auth state from /me endpoint - client/RouterContext.tsx — framework-agnostic router adapter - client/routing.tsx — UserRoute/StaffRoute/AnonymousRoute guards - client/nextjs.tsx — Next.js router adapter for auth These are auth UI infrastructure, not Mizan protocol. The Mizan core only needs JWT for auth header selection (jwt/ stays — MizanProvider depends on useJWT() to decide between Bearer and session auth). Cleaned up re-exports in client/react.ts and vitest aliases. 33 React tests pass. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
80 lines
2.7 KiB
TypeScript
80 lines
2.7 KiB
TypeScript
'use client'
|
|
|
|
import { useStyles, cx } from '../../contexts/StylesContext'
|
|
import { ProfileSection } from './ProfileSection'
|
|
import { EmailsSection } from './EmailsSection'
|
|
import { PasswordSection } from './PasswordSection'
|
|
import { PasskeysSection } from './PasskeysSection'
|
|
import { ConnectionsSection } from './ConnectionsSection'
|
|
import { MFASection } from './MFASection'
|
|
import { SessionsSection } from './SessionsSection'
|
|
import { Button } from './SettingsComponents'
|
|
|
|
type SettingsSectionType = 'profile' | 'emails' | 'password' | 'passkeys' | 'connections' | 'mfa' | 'sessions'
|
|
|
|
interface AuthSettingsProps {
|
|
/** Title shown at the top of the settings page */
|
|
title?: string
|
|
/** Called when user clicks sign out */
|
|
onSignOut?: () => void
|
|
/** Which sections to show. Defaults to all. */
|
|
sections?: SettingsSectionType[]
|
|
/** URL to redirect back to after OAuth connect (for connections section) */
|
|
oauthRedirectUrl?: string
|
|
}
|
|
|
|
const DEFAULT_SECTIONS: SettingsSectionType[] = ['profile', 'emails', 'password', 'passkeys', 'connections', 'mfa', 'sessions']
|
|
|
|
/**
|
|
* AuthSettings renders a complete account settings page.
|
|
*
|
|
* It includes sections for:
|
|
* - Profile (display user info)
|
|
* - Email addresses (manage, verify, set primary)
|
|
* - Password change
|
|
* - Passkeys (add/remove passwordless login)
|
|
* - Connected accounts (OAuth providers)
|
|
* - Two-factor authentication (TOTP, recovery codes)
|
|
* - Active sessions (view/end sessions)
|
|
*
|
|
* @example
|
|
* ```tsx
|
|
* <AuthSettings
|
|
* onSignOut={() => router.push('/logout')}
|
|
* sections={['profile', 'password', 'mfa']} // Only show these sections
|
|
* />
|
|
* ```
|
|
*/
|
|
export function AuthSettings({
|
|
title = 'Account Settings',
|
|
onSignOut,
|
|
sections = DEFAULT_SECTIONS,
|
|
oauthRedirectUrl,
|
|
}: AuthSettingsProps) {
|
|
const styles = useStyles()
|
|
const sectionSet = new Set(sections)
|
|
|
|
return (
|
|
<div className={styles.settingsContainer}>
|
|
<h1 className={styles.settingsPageTitle}>{title}</h1>
|
|
|
|
{sectionSet.has('profile') && <ProfileSection />}
|
|
{sectionSet.has('emails') && <EmailsSection />}
|
|
{sectionSet.has('password') && <PasswordSection />}
|
|
{sectionSet.has('passkeys') && <PasskeysSection />}
|
|
{sectionSet.has('connections') && <ConnectionsSection redirectUrl={oauthRedirectUrl} />}
|
|
{sectionSet.has('mfa') && <MFASection />}
|
|
{sectionSet.has('sessions') && <SessionsSection />}
|
|
|
|
{/* Sign Out */}
|
|
{onSignOut && (
|
|
<section className={styles.settingsCard}>
|
|
<Button variant="danger" onClick={onSignOut}>
|
|
Sign Out
|
|
</Button>
|
|
</section>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|