I'm building a react app with next and I'd like to store some data to be accessed on another page. I followed this guide on the creating a useLocalStorage hook however I keep getting an error NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

I have this function:

function useLocalStorage(key, value) {
  const [storedValue, setStoredValue] = useState(() => {
    if(typeof window !== "undefined"){
      const item = window.localStorage.getItem(key)
      return item ? JSON.parse(item) : value;
    }
  })

  const setValue = (value) => {
    useEffect(()=>{
      const valueToStore = value instanceof Function ? value(storedValue) : value
      
      setStoredValue(valueToStore)
      
      if(typeof window !== "undefined"){
        window.localStorage.setItem(key, JSON.stringify(valueToStore))
      }
    },[])
  }

  return [storedValue, setValue]
}

and then

const [data, setData] = useLocalStorage("data", props)

with setData called from a button which goes to the next page

any help/criticism is greatly appreciated and if there is a simpler/better way to do this that would be amazing.

Thanks!