Add Login page
This commit is contained in:
parent
81dac095a2
commit
f034851a1f
1 changed files with 28 additions and 0 deletions
28
src/pages/Login.tsx
Normal file
28
src/pages/Login.tsx
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import { useAuth } from '../hooks/useAuth';
|
||||||
|
import { Button } from '../components/Button';
|
||||||
|
|
||||||
|
export const Login: React.FC = () => {
|
||||||
|
const [email, setEmail] = useState('');
|
||||||
|
const [password, setPassword] = useState('');
|
||||||
|
const { login, loading, error } = useAuth();
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
const handleSubmit = async (e: React.FormEvent) => {
|
||||||
|
e.preventDefault();
|
||||||
|
if (await login(email, password)) navigate('/');
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<main style={{ maxWidth: 400, margin: '80px auto', padding: '0 16px' }}>
|
||||||
|
<h1>Sign in</h1>
|
||||||
|
{error && <p style={{ color: 'var(--color-error)' }}>{error}</p>}
|
||||||
|
<form onSubmit={handleSubmit}>
|
||||||
|
<label>Email<input type="email" value={email} onChange={e => setEmail(e.target.value)} required /></label>
|
||||||
|
<label>Password<input type="password" value={password} onChange={e => setPassword(e.target.value)} required /></label>
|
||||||
|
<Button label="Sign in" onClick={() => {}} loading={loading} />
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
};
|
||||||
Loading…
Reference in a new issue