T
TanStack•3w ago
exotic-emerald

How Best to Handle Query Param Side Effect

During development, I'd love to use a _restore query param to potentially delete the indexedDB backing the app. Curious if anyone has a better / more idiomatic way of doing the following? Ideally without hooks (as I intend to use this within an Effect Atom). 
useEffect(() => {
  const shouldRestore = dev && new URLSearchParams(location.search).get("_restore") !== null
  if (shouldRestore) {
    (async () => {
      const req = indexedDB.deleteDatabase("/my-db")
      const onDelete = () => {
        const qp = new URLSearchParams(location.search)
        qp.delete("_restore")
        history.replaceState(null, "", `${location.pathname}?${qp.toString()}`)
        location.reload()
      }
      req.onsuccess = () => onDelete()
      req.onerror = (_e) => onDelete()
      req.onblocked = (_e) => onDelete()
    })()
  }

}, [])
useEffect(() => {
  const shouldRestore = dev && new URLSearchParams(location.search).get("_restore") !== null
  if (shouldRestore) {
    (async () => {
      const req = indexedDB.deleteDatabase("/my-db")
      const onDelete = () => {
        const qp = new URLSearchParams(location.search)
        qp.delete("_restore")
        history.replaceState(null, "", `${location.pathname}?${qp.toString()}`)
        location.reload()
      }
      req.onsuccess = () => onDelete()
      req.onerror = (_e) => onDelete()
      req.onblocked = (_e) => onDelete()
    })()
  }

}, [])
0 Replies
No replies yetBe the first to reply to this messageJoin

Did you find this page helpful?