52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import React, { useState } from "react";
|
|
import { Button, Input } from "antd";
|
|
import useAuth from "../../useAuth";
|
|
import { useNavigate } from "react-router";
|
|
|
|
export const LogIn = () => {
|
|
const { login, loading, error } = useAuth();
|
|
const [email, setEmail] = useState("");
|
|
const [password, setPassword] = useState("");
|
|
const navigate = useNavigate();
|
|
console.log(error)
|
|
|
|
return (
|
|
<div className="Box Small">
|
|
<div className="Section">
|
|
<div className="Section">
|
|
<Input
|
|
placeholder="User"
|
|
onChange={(ev) => setEmail(ev.target.value)}
|
|
/>
|
|
<Input.Password
|
|
placeholder="Password"
|
|
onChange={(ev) => setPassword(ev.target.value)}
|
|
/>
|
|
<Button
|
|
style={{ width: "100%" }}
|
|
onClick={async () =>
|
|
login({ email, password })
|
|
}
|
|
loading={loading}
|
|
>
|
|
Log in
|
|
</Button>
|
|
<Button
|
|
style={{ width: "100%" }}
|
|
onClick={() =>
|
|
navigate("/signup")
|
|
}
|
|
>
|
|
Sign up
|
|
</Button>
|
|
{error ? (
|
|
<div className="Disconnected">{error?.message}</div>
|
|
) : (
|
|
<></>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|