Move allauth + auth UI to legacy/
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>
This commit is contained in:
127
legacy/allauth/components/AuthFormPage.tsx
Normal file
127
legacy/allauth/components/AuthFormPage.tsx
Normal file
@@ -0,0 +1,127 @@
|
||||
'use client'
|
||||
|
||||
import { useState, ReactNode } from 'react'
|
||||
import { useAllauthAPI } from '../contexts/APIContext'
|
||||
import { useStyles } from '../contexts/StylesContext'
|
||||
import useAuthForm, { AuthField } from './AuthForm'
|
||||
import { AuthResponse, AuthDetails } from '../api'
|
||||
|
||||
interface FieldConfig {
|
||||
name: string
|
||||
title: string
|
||||
type: string
|
||||
placeholder?: string
|
||||
}
|
||||
|
||||
interface FooterLink {
|
||||
href: string
|
||||
label: string
|
||||
}
|
||||
|
||||
interface AuthFormPageProps {
|
||||
title: string
|
||||
subtitle?: string
|
||||
fields: FieldConfig[]
|
||||
submitLabel?: string
|
||||
submittingLabel?: string
|
||||
submitFn: (api: ReturnType<typeof useAllauthAPI>, data: Record<string, string>) => Promise<AuthResponse>
|
||||
onResponse: (response: AuthResponse, authDetails: AuthDetails, data: Record<string, string>) => void
|
||||
footerLinks?: FooterLink[]
|
||||
preFields?: ReactNode
|
||||
postFields?: ReactNode
|
||||
error?: string | null
|
||||
}
|
||||
|
||||
export function AuthFormPage({
|
||||
title,
|
||||
subtitle,
|
||||
fields,
|
||||
submitLabel = 'Submit',
|
||||
submittingLabel = 'Submitting...',
|
||||
submitFn,
|
||||
onResponse,
|
||||
footerLinks,
|
||||
preFields,
|
||||
postFields,
|
||||
error: externalError,
|
||||
}: AuthFormPageProps) {
|
||||
const api = useAllauthAPI()
|
||||
const styles = useStyles()
|
||||
|
||||
const [data, setData] = useState<Record<string, string>>(() =>
|
||||
Object.fromEntries(fields.map(f => [f.name, '']))
|
||||
)
|
||||
|
||||
const authForm = useAuthForm(
|
||||
() => submitFn(api, data),
|
||||
(response, authDetails) => onResponse(response, authDetails, data)
|
||||
)
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
authForm.submit()
|
||||
}
|
||||
|
||||
const handleFieldChange = (fieldName: string) => (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setData(prev => ({ ...prev, [fieldName]: e.target.value }))
|
||||
}
|
||||
|
||||
const formErrors = authForm.errors.filter(err => !err.param || err.param === '__all__')
|
||||
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<div className={styles.card}>
|
||||
<h1 className={styles.title}>{title}</h1>
|
||||
{subtitle && <p className={styles.subtitle}>{subtitle}</p>}
|
||||
|
||||
{externalError && <p className={styles.error}>{externalError}</p>}
|
||||
{formErrors.length > 0 && (
|
||||
<div className={styles.error}>
|
||||
{formErrors.map((err, i) => (
|
||||
<p key={i}>{err.message}</p>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit} className={styles.form} suppressHydrationWarning>
|
||||
{preFields}
|
||||
|
||||
<div className={styles.fieldsContainer}>
|
||||
{fields.map(field => (
|
||||
<AuthField
|
||||
key={field.name}
|
||||
title={field.title}
|
||||
name={field.name}
|
||||
type={field.type}
|
||||
init={data[field.name]}
|
||||
onChange={handleFieldChange(field.name)}
|
||||
authErrors={authForm.errors}
|
||||
placeholder={field.placeholder}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{postFields}
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className={styles.submit}
|
||||
disabled={authForm.fetching}
|
||||
>
|
||||
{authForm.fetching ? submittingLabel : submitLabel}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{footerLinks && footerLinks.length > 0 && (
|
||||
<div className={styles.footer}>
|
||||
{footerLinks.map((link, i) => (
|
||||
<a key={i} href={link.href} className={styles.link}>
|
||||
{link.label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user