Fix: uncaught error in GeoblockingProvider

src/components/common/GeoblockingProvider/index.tsx

@@ -1,27 +1,19 @@
 import { AppRoutes } from '@/config/routes'
-import { createContext, type ReactElement, type ReactNode, useEffect, useState } from 'react'
+import useAsync from '@/hooks/useAsync'
+import { createContext, type ReactElement, type ReactNode } from 'react'
 
 export const GeoblockingContext = createContext<boolean | null>(null)
 
+const checkBlocked = async () => {
+  const res = await fetch(AppRoutes.swap, { method: 'HEAD' })
+  return res.status === 403
+}
+
 /**
  * Endpoint returns a 403 if the requesting user is from one of the OFAC sanctioned countries
  */
 const GeoblockingProvider = ({ children }: { children: ReactNode }): ReactElement => {
-  const [isBlockedCountry, setIsBlockedCountry] = useState<boolean | null>(null)
-
-  useEffect(() => {
-    const fetchSwaps = async () => {
-      await fetch(AppRoutes.swap, { method: 'HEAD' }).then((res) => {
-        if (res.status === 403) {
-          setIsBlockedCountry(true)
-        } else {
-          setIsBlockedCountry(false)
-        }
-      })
-    }
-
-    fetchSwaps()
-  }, [])
+  const [isBlockedCountry = null] = useAsync(checkBlocked, [])
 
   return <GeoblockingContext.Provider value={isBlockedCountry}>{children}</GeoblockingContext.Provider>
 }