HW/final_project/src/pages/LoginPage.jsx

import { useState } from 'react';
import {  Link } from 'react-router-dom';
import '../App.css';
import {history} from '../history'
import store from '../store';
import actionChatList from '../store/reducers/chat-reducer'

export const LoginPage = ({ onLogin, outLogin }) => {
    const [login, setLogin] = useState("");
    const [password, setPassword] = useState("");


    const Authorization = () => {
        if(localStorage.authToken){
            history.push('/chat')
        }
        onLogin(login, password);
        setLogin('');
        setPassword('');
        
    };

    const OutAuthorization = () => {
        outLogin();
    }

    return (
        <div className="formBlock">
            
                <h1>Вход</h1>
                <div className="mb-3">
                    <label htmlFor="exampleInputEmail1" className="form-label">Enter Login</label>
                    <input 
                        type="text"
                        value={login} 
                        onChange={(e) => setLogin(e.target.value)}
                        className="form-control" 
                        id="exampleInputEmail1" 
                        aria-describedby="emailHelp" />
                </div>
                <div className="mb-3">
                    <label htmlFor="exampleInputPassword1" className="form-label">Enter Password</label>
                    <input 
                        type="password"
                        value={password}
                        onChange={(e) => setPassword(e.target.value)} 
                        className="form-control" 
                        id="exampleInputPassword1" />
                </div>
                <div className="mb-3">
                    <button type="submit" className="btn btn-primary" onClick={Authorization}>Войти</button>
                </div>
                
                {/* <button onClick={OutAuthorization}>Log Out</button> */}
                <Link to="/registration">Зарегистрироваться</Link>

        </div>

    );
};