Protected route

import React, {useContext, useEffect, useState} from 'react';
import {Route, Redirect} from 'react-router-dom';

import {UserContext} from "./contexts/UserContext";
import {useCookies} from "react-cookie";

function ProtectedRoute({component: Component, ...rest}) {
    const {user, set_user} = useContext(UserContext);
    const [cookies, setCookie] = useCookies();
    const [loading, set_loading] = useState(true);


    useEffect(() =>{
        if(cookies.token){
            set_user(cookies.token);
        }
        set_loading(false)
    }, []);

    return (
        <Route {...rest} render={
            (props) => {
                if(loading){
                    return null
                }else{
                    if(user){
                        return <Component {...props}/>
                    }else{
                        return <Redirect to={
                            {
                              pathname: '/login',
                              state: {
                                from: props.location
                              }
                            }
                        }/>
                    }
                }
            }
        }/>
    );
}

export default ProtectedRoute;