useState with localStorage

usePersistedState.js

import { useState, useEffect } from 'react';

function usePersistedState(key, initialState) {
    const [state, setState] = useState(() => {
      if(typeof window === 'undefined') return initialState;
      const storageValue = localStorage.getItem(key);
  
      if (storageValue) {
        return JSON.parse(storageValue);
      } else {
        return initialState;
      }
    });
  
    useEffect(() => {
      localStorage.setItem(key, JSON.stringify(state));
    }, [key, state]);
  
    return [state, setState];
  }
  
  export default usePersistedState;