[e6c2521] | 1 | import React from "react";
|
---|
| 2 | import { Container, Form, Button } from "react-bootstrap";
|
---|
| 3 | import { AiFillLock } from "react-icons/ai";
|
---|
| 4 | import useFormData from "../Hooks/useFormData";
|
---|
| 5 | import useLogin from "../Hooks/User/useLogin";
|
---|
| 6 | import { Link } from "react-router-dom";
|
---|
[0f5aa27] | 7 | import useCreate from "../Hooks/useCreate";
|
---|
| 8 | import {useAuth} from "../Context/AuthContext";
|
---|
[e6c2521] | 9 |
|
---|
[0f5aa27] | 10 | const LoginForm = (props) => {
|
---|
[e6c2521] | 11 | const { formData, onFormChange, onCheckBoxChange, setFormData } = useFormData(
|
---|
| 12 | {
|
---|
[0f5aa27] | 13 | username: "",
|
---|
[e6c2521] | 14 | password: "",
|
---|
| 15 | }
|
---|
| 16 | );
|
---|
| 17 |
|
---|
[0f5aa27] | 18 | const { createEntity } = useCreate();
|
---|
| 19 | const Auth = useAuth();
|
---|
[e6c2521] | 20 |
|
---|
| 21 | return (
|
---|
| 22 | <Container
|
---|
| 23 | className="rounded-5 m-5 my-auto mx-auto py-5 px-5"
|
---|
| 24 | style={{ backgroundColor: "#ffffff" }}
|
---|
| 25 | >
|
---|
| 26 | <Form>
|
---|
| 27 | <Form.Group className="mb-3" controlId="formBasicEmail">
|
---|
| 28 | <Form.Label>Е-адреса</Form.Label>
|
---|
| 29 | <Form.Control
|
---|
| 30 | type="email"
|
---|
| 31 | placeholder="Enter email"
|
---|
[0f5aa27] | 32 | name="username"
|
---|
[e6c2521] | 33 | onChange={onFormChange}
|
---|
| 34 | value={formData.email}
|
---|
| 35 | />
|
---|
| 36 | </Form.Group>
|
---|
| 37 |
|
---|
| 38 | <Form.Group className="mb-3" controlId="formBasicPassword">
|
---|
| 39 | <Form.Label>Лозинка</Form.Label>
|
---|
| 40 | <Form.Control
|
---|
| 41 | type="password"
|
---|
| 42 | placeholder="Password"
|
---|
| 43 | name="password"
|
---|
| 44 | onChange={onFormChange}
|
---|
| 45 | value={formData.password}
|
---|
| 46 | />
|
---|
| 47 | </Form.Group>
|
---|
[0f5aa27] | 48 | {/*<Form.Group className="mb-3" controlId="formBasicCheckbox">*/}
|
---|
| 49 | {/* <Form.Check type="checkbox" label="Check me out" />*/}
|
---|
| 50 | {/*</Form.Group>*/}
|
---|
| 51 | {/*<Link to={"/register"} style={{textDecoration: "none"}}>*/}
|
---|
| 52 | {/* <Form.Text className="text-muted" style={{color: "#159895!important"}} >*/}
|
---|
| 53 | {/* Регистритрај се*/}
|
---|
| 54 | {/* </Form.Text>*/}
|
---|
| 55 | {/*</Link>*/}
|
---|
[e6c2521] | 56 | <Form.Group className="my-1">
|
---|
| 57 | <Button
|
---|
| 58 | type="submit"
|
---|
| 59 | style={{ backgroundColor: "#159895" }}
|
---|
| 60 | size="md"
|
---|
| 61 | onClick={(e) => {
|
---|
| 62 | e.preventDefault();
|
---|
| 63 | console.log(formData);
|
---|
[0f5aa27] | 64 | createEntity(`/users/${Auth.getUser().userId}/connect`, formData, props.refresh)
|
---|
[e6c2521] | 65 | }}
|
---|
| 66 | >
|
---|
| 67 | <span className="ikona my-1">
|
---|
| 68 | <AiFillLock />
|
---|
| 69 | </span>
|
---|
[0f5aa27] | 70 | <span className="ikona mx-3">Поврзи</span>
|
---|
[e6c2521] | 71 | </Button>
|
---|
| 72 | </Form.Group>
|
---|
| 73 | </Form>
|
---|
| 74 | </Container>
|
---|
| 75 | );
|
---|
| 76 | };
|
---|
| 77 |
|
---|
| 78 | export default LoginForm;
|
---|