{"size": 1531, "ext": "js", "max_stars_repo_path": "src/Components/Login.js", "max_stars_repo_name": "waasiq/facebook-clone-react", "max_stars_repo_stars_event_min_datetime": "2022-01-26T02:02:09.000Z", "max_stars_repo_stars_event_max_datetime": "2022-01-26T10:17:33.000Z", "max_issues_repo_path": "src/Components/Login.js", "max_issues_repo_name": "waasiq/facebook-clone-react", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/Components/Login.js", "max_forks_repo_name": "waasiq/facebook-clone-react", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 32.5744680851, "max_line_length": 102, "alphanum_fraction": 0.504898759}
import React from 'react'
import { Button } from '@mui/material'
import '../css/Login.css'

//!Import from other components 
import {auth, provider , signInWithPopup} from '../Firebase.js';
import { useStateValue } from '../Context/StateProvider.js';
import { actionTypes } from '../Context/reducer.js';

function Login() {
    const [state, dispatch ] = useStateValue();

    const signIn = () => {
        signInWithPopup(auth, provider)
            .then((result) => {                
                dispatch({
                    type: actionTypes.SET_USER,
                    user:result.user
                })
                // redux action? --> dispatch({ type: SET_USER, user });
            })
            .catch((error) => {
                const errorCode = error.code;
                const errorMessage = error.message;
                const email = error.email;
                // If required console log this
            });
    };

    return (
        <div className = 'login'>
            <div className="login_inner">
                <div className="login_left">
                    <img src="https://static.xx.fbcdn.net/rsrc.php/y8/r/dF5SId3UHWd.svg" alt="logo" />
                    <h1>Connect with friends and the world around you on Facebook.</h1>
                </div>

                <div className="login_right">
                    <Button onClick= { signIn } variant="contained">Log In</Button>
                </div>  
            </div>           
        </div>
    )
}

export default Login
