43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { createFileRoute, Link, useNavigate } from '@tanstack/react-router'
|
|
import { useQuery } from '@tanstack/react-query'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { LoginForm } from '@/features/auth/LoginForm'
|
|
import { fetchRegistrationStatus } from '@/features/auth/api'
|
|
import { useRequireGuest } from '@/features/auth/guards'
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/shared/ui/card'
|
|
|
|
export const Route = createFileRoute('/login')({ component: LoginPage })
|
|
|
|
function LoginPage() {
|
|
useRequireGuest()
|
|
const { t } = useTranslation()
|
|
const navigate = useNavigate()
|
|
|
|
const { data: registration } = useQuery({
|
|
queryKey: ['auth', 'registration'],
|
|
queryFn: fetchRegistrationStatus,
|
|
})
|
|
|
|
return (
|
|
<div className="mx-auto max-w-sm py-8">
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>{t('auth.loginTitle')}</CardTitle>
|
|
<CardDescription>{t('auth.loginSubtitle')}</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<LoginForm onSuccess={() => void navigate({ to: '/dashboard' })} />
|
|
{registration?.enabled && (
|
|
<p className="mt-4 text-center text-sm text-muted-foreground">
|
|
{t('auth.noAccount')}{' '}
|
|
<Link to="/register" className="text-primary hover:underline">
|
|
{t('nav.register')}
|
|
</Link>
|
|
</p>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
)
|
|
}
|