refactor: replace useAsyncTask

src/components/Modal/NewsletterSubscriptionModal/NewsletterSubscriptionModal.tsx

@@ -4,7 +4,6 @@ import classNames from 'classnames'
 import Label from 'decentraland-gatsby/dist/components/Form/Label'
 import Paragraph from 'decentraland-gatsby/dist/components/Text/Paragraph'
 import useAuthContext from 'decentraland-gatsby/dist/context/Auth/useAuthContext'
-import useAsyncTask from 'decentraland-gatsby/dist/hooks/useAsyncTask'
 import useFormatMessage from 'decentraland-gatsby/dist/hooks/useFormatMessage'
 import { Button } from 'decentraland-ui/dist/components/Button/Button'
 import { Close } from 'decentraland-ui/dist/components/Close/Close'
@@ -14,6 +13,7 @@ import { Modal, ModalProps } from 'decentraland-ui/dist/components/Modal/Modal'
 import isEmail from 'validator/lib/isEmail'
 
 import { Decentraland } from '../../../clients/Decentraland'
+import useAsyncTask from '../../../hooks/useAsyncTask'
 import { ANONYMOUS_USR_SUBSCRIPTION, NEWSLETTER_SUBSCRIPTION_KEY } from '../../Banner/Subscription/SubscriptionBanner'
 import CheckCloud from '../../Icon/CheckCloud'
 import '../ProposalModal.css'

src/hooks/useAsyncTask.ts

@@ -0,0 +1,72 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import { DependencyList, useCallback, useEffect, useState } from 'react'
+
+import useTrackContext from 'decentraland-gatsby/dist/context/Track/useTrackContext'
+
+import { ErrorClient } from '../clients/ErrorClient'
+
+type AsyncTaskState<A extends unknown[] = []> = {
+  loading: boolean
+  args: A | null
+}
+
+export default function useAsyncTask<A extends unknown[] = []>(
+  callback: (...args: A) => Promise<unknown>,
+  deps: DependencyList
+) {
+  const [{ loading, args }, setLoading] = useState<AsyncTaskState<A>>({
+    loading: false,
+    args: null,
+  })
+
+  const segment = useTrackContext()
+
+  useEffect(() => {
+    if (!loading) {
+      return
+    }
+
+    if (args === null) {
+      return
+    }
+
+    let cancelled = false
+    Promise.resolve()
+      .then(() => callback(...args))
+      .then(() => {
+        if (cancelled) {
+          return
+        }
+
+        setLoading({ loading: false, args: null })
+      })
+      .catch((err) => {
+        console.error(err)
+        const errorObj = {
+          ...err,
+          message: err.message,
+          stack: err.stack,
+        }
+        ErrorClient.report('error', errorObj)
+        segment('error', errorObj)
+        if (cancelled) {
+          return
+        }
+
+        setLoading({ loading: false, args: null })
+      })
+
+    return () => {
+      cancelled = true
+    }
+  }, [loading])
+
+  const callTask = useCallback(
+    (...args: A) => {
+      setLoading({ loading: true, args })
+    },
+    [loading, args, ...deps]
+  )
+
+  return [loading, callTask] as const
+}

src/pages/proposal.tsx

@@ -8,7 +8,6 @@ import { formatDescription } from 'decentraland-gatsby/dist/components/Head/util
 import NotFound from 'decentraland-gatsby/dist/components/Layout/NotFound'
 import Markdown from 'decentraland-gatsby/dist/components/Text/Markdown'
 import useAuthContext from 'decentraland-gatsby/dist/context/Auth/useAuthContext'
-import useAsyncTask from 'decentraland-gatsby/dist/hooks/useAsyncTask'
 import useFormatMessage from 'decentraland-gatsby/dist/hooks/useFormatMessage'
 import usePatchState from 'decentraland-gatsby/dist/hooks/usePatchState'
 import { navigate } from 'decentraland-gatsby/dist/plugins/intl'
@@ -53,6 +52,7 @@ import { SurveyEncoder } from '../entities/SurveyTopic/utils'
 import { isProposalStatusWithUpdates } from '../entities/Updates/utils'
 import { SelectedVoteChoice, Vote } from '../entities/Votes/types'
 import { DEFAULT_QUERY_STALE_TIME } from '../hooks/constants'
+import useAsyncTask from '../hooks/useAsyncTask'
 import useBudgetWithContestants from '../hooks/useBudgetWithContestants'
 import useIsDAOCommittee from '../hooks/useIsDAOCommittee'
 import useIsProposalCoAuthor from '../hooks/useIsProposalCoAuthor'