Hi guys can somebody help me with this?

I try to store data in localStorage. Everything works fine till I reload the page. After page reload localStorage is null.

function getValues(){
    const storedValues = localStorage.getItem('SET')
    if(!storedValues) return 'nothing';
    return JSON.parse(storedValues)

}

const [fruit,setFruit] = useState(getValues)


useEffect(()=>{
    localStorage.setItem('SET', JSON.stringify(fruit))
},[fruit])

return (
<>
        FRUIT: {fruit}
        <button onClick={() =>setFruit('APPLE')}>APPLE</button>
        <button onClick={() =>setFruit('BANANA')}>BANANA</button>
</>

After I reload page the output is: 'nothing'. Does anyone know how to solve this?