{"size": 2595, "ext": "js", "max_stars_repo_path": "webapp/pages/signin/index.js", "max_stars_repo_name": "Aarshi-Sapient/shopping-cart-assignment", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "webapp/pages/signin/index.js", "max_issues_repo_name": "Aarshi-Sapient/shopping-cart-assignment", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "webapp/pages/signin/index.js", "max_forks_repo_name": "Aarshi-Sapient/shopping-cart-assignment", "max_forks_repo_forks_event_min_datetime": "2021-08-09T15:40:44.000Z", "max_forks_repo_forks_event_max_datetime": "2022-02-24T11:36:27.000Z"}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": 3, "avg_line_length": 36.5492957746, "max_line_length": 115, "alphanum_fraction": 0.4809248555}
import styles from "../../styles/SignUp.module.css"
import {useEffect, useState} from "react";
import {useRouter} from "next/router";
import Link from "next/link"
import {Form, Button, Input} from 'antd';
import FloatingLabel from "../../components/FloatingLabel";
import {useAuth} from "../../utils/AuthProvider";

const SignIn = (props) => {
    const [form] = Form.useForm();
    const auth = useAuth();
    const router = useRouter();
    const [formValues, setFormValues] = useState({})
    const [loading, setLoading] = useState(false)
    const [error, setError] = useState()
    const onChangeFormValue = (values) => {
        setFormValues({...formValues, ...values})
    }
    const onSubmit = async () => {
        setLoading(true)
        const { password, email} = formValues
        const data = {
            password,
            email
        }
        try {
           await auth.signIn(data)
            setLoading(false)
            router.back()
        } catch (e) {
            setError(e)
            setLoading(false)
        }
    }
    return (
        <div className={styles["signup-container"]}>
            <div>
                <b><h1>Login</h1></b>
                <h4>Get access to your Orders, Wishlist and Recommendations</h4>
                <div className={styles["sign-in-register"]}>
                    <h3>Don't have an account</h3>
                    <Link href={"signup"}>
                        <h3 style={{color: "blue", marginLeft: 10, cursor: "pointer"}}>Register</h3>
                    </Link>
                </div>
            </div>
            <div>
                <Form
                    form={form}
                    onValuesChange={onChangeFormValue}
                    layout={"vertical"}
                >
                    <Form.Item name={"email"} label={"Email"}>
                        <Input className={styles["default-input"]} />
                    </Form.Item>
                    <Form.Item name={"password"} label={"Password"}>
                        <Input className={styles["default-input"]} type={"password"}/>
                    </Form.Item>
                    <Form.Item>
                        <Button className={styles["signup-button"]} onClick={onSubmit} loading={loading}>
                            <p style={{color: "white", fontSize: "1vw", marginTop: 0, marginBottom: 0}}>Sign In</p>
                        </Button>
                    </Form.Item>
                    <p style={{color: "red"}}>{error}</p>
                </Form>
            </div>
        </div>
    )
}

export default SignIn