User Data Disappears Upon Page Reload

Hello my friend , I have a problem: why is it that when I log in with a user, the data appears already, it displays all the user information in the console, but after I reload, for example, the interface of the change request list, in the console, the user's data is not displayed as if it does not recognize the already logged-in user, the sidebar items disappear because they are displayed based on the user's role_id. this is the code in contextProvider :

/* eslint-disable no-unused-vars */
import { createContext , useContext , useState } from "react";

const StateContext = createContext({
    currentUser: {},
    userToken: null,
    setCurrentUser: () => {},
    setUserToken: () => {},
    changeRequests: () => {},
    setChangeRequests: () => {},
    toast: {
        message: null,
        show: false,
    },
    currentPage: 1,
    setCurrentPage : () => {},
    totalPages: 3,
    setTotalPages: () => {},
    
})

// eslint-disable-next-line react/prop-types
export const ContextProvider = ({children}) => {
    const [currentUser, setCurrentUser] = useState({});
    const [userToken,_setUserToken] = useState(localStorage.getItem('TOKEN') || '');
    const [changeRequests, setChangeRequests] = useState([]);
    const [toast, setToast] = useState({message: '', show: false});
    const [currentPage, setCurrentPage] = useState(1);
    const [totalPages, setTotalPages] = useState(1);
    
    

const setUserToken = (token) => {
    if (token) {
        localStorage.setItem('TOKEN', token)
    } else {
        localStorage.removeItem('TOKEN')
    }
    _setUserToken(token);

}

const showToast = (message) => {
    setToast({ message, show: true })
    setTimeout(() => {
      setToast({message: '', show: false})
    }, 5000)
}


    return (
        <StateContext.Provider value= {{
            currentUser,
            setCurrentUser,
            userToken,
            setUserToken,
            changeRequests,
            setChangeRequests,
            toast,
            showToast,
            currentPage,
            setCurrentPage,
            totalPages, 
            setTotalPages,
            
        }}>
            {children}
        </StateContext.Provider>
    )
};

// eslint-disable-next-line react-refresh/only-export-components, react-hooks/rules-of-hooks
export const useStateContext = () => useContext(StateContext);