33 lines
1.0 KiB
TypeScript
33 lines
1.0 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import { useAuth } from '../auth/AuthContext';
|
|
import { useAuthForm } from '../hooks/useAuthForm';
|
|
import { AuthFormView, authFormFooter } from './AuthFormView';
|
|
|
|
export default function LoginPage() {
|
|
const { isAuthenticated, isCheckingAuth } = useAuth();
|
|
const navigate = useNavigate();
|
|
const { username, password, isLoading, registrationEnabled, setUsername, setPassword, submit } =
|
|
useAuthForm('login');
|
|
|
|
useEffect(() => {
|
|
if (!isCheckingAuth && isAuthenticated) {
|
|
navigate('/', { replace: true });
|
|
}
|
|
}, [isAuthenticated, isCheckingAuth, navigate]);
|
|
|
|
return (
|
|
<AuthFormView
|
|
username={username}
|
|
password={password}
|
|
isLoading={isLoading}
|
|
onUsernameChange={setUsername}
|
|
onPasswordChange={setPassword}
|
|
onSubmit={submit}
|
|
submitLabel="Login"
|
|
submittingLabel="Logging in..."
|
|
footer={authFormFooter({ to: '/register', text: 'Register here.' }, registrationEnabled)}
|
|
/>
|
|
);
|
|
}
|