hola chicos alguien me puede ayudar con esto

Intento almacenar datos en localStorage. Todo funciona bien hasta que recargo la página. Después de recargar la página, localStorage es nulo.

 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> </>

Después de recargar la página, el resultado es: 'nada'. Alguien sabe cómo resolver esto?