4. 3 Hoàn thiện nốt localStorage.setItem, localStorage.getItem (ok)

C:\Users\Administrator\Desktop\start\src\pages\Login\index.tsx

import React, { useState } from 'react';
import { connect } from 'react-redux';
import { useHistory } from 'react-router-dom';
import { PATH } from './../../constants/paths';
import { login } from './../../middlewares/thunks';
function Login(props: any) {
	const { login, loading } = props;
	const history = useHistory();
	const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
  const [error, setError] = useState('');
  const handleUsername = (event: React.ChangeEvent < HTMLInputElement > ) => {
    setUsername(event.target.value)
  }
  const handlePassword = (event: React.ChangeEvent < HTMLInputElement > ) => {
    setPassword(event.target.value)
  }
	const submit = async (event: React.FormEvent < HTMLFormElement > ) => {
    event.preventDefault();
    const payload = { username, password };
    login(payload)
    .then(res => {
      history.push({ pathname: PATH.HOME })
    })
    .catch(err => {
      setError(err.payload.message)
    })
  }
	return (
		<div className="container">
			<form id="login" className="border p-2 rounded" onSubmit={submit}>
				<h2 className="text-center text-primary">Login</h2>
				<p className="text-center text-secondary">Lorem ipsum dolor sit amet.</p>
			  <div className="form-group">
			    <input type="text" placeholder="Username" className="form-control" onChange={handleUsername}/>
			  </div>
			  <div className="form-group">
			    <input type="password" placeholder="Password" className="form-control" onChange={handlePassword}/>
			  </div>
			  <div className="form-group text-center">
			    <button type="submit" className="btn btn-primary btn-md">Login</button>
			  </div>
			</form>
		</div>
	)
}
const mapStateToProps = (state: any) => ({
  loading: false
});
const mapDispatchToProps = {
  login
}
export default connect(mapStateToProps, mapDispatchToProps)(Login);