chore(web): move hooks to hooks folder

web/src/utils/hooks/index.ts

@@ -0,0 +1,2 @@
+export * from './usePrompt'
+export * from './useStateWithCallback'

web/src/utils/hooks/usePrompt.ts

@@ -0,0 +1,36 @@
+import { useEffect, useCallback, useContext } from 'react'
+import { UNSAFE_NavigationContext as NavigationContext } from 'react-router-dom'
+import { History, Blocker, Transition } from 'history'
+
+const useBlocker = (blocker: Blocker, when = true) => {
+  const navigator = useContext(NavigationContext).navigator as History
+
+  useEffect(() => {
+    if (!when) return
+
+    const unblock = navigator.block((tx: Transition) => {
+      const autoUnblockingTx = {
+        ...tx,
+        retry() {
+          unblock()
+          tx.retry()
+        }
+      }
+
+      blocker(autoUnblockingTx)
+    })
+
+    return unblock
+  }, [navigator, blocker, when])
+}
+
+export const usePrompt = (message: string, when = true) => {
+  const blocker = useCallback(
+    (tx) => {
+      if (window.confirm(message)) tx.retry()
+    },
+    [message]
+  )
+
+  useBlocker(blocker, when)
+}