diff options
author | Sebastian <sebasjm@gmail.com> | 2022-03-30 14:36:24 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-03-30 14:36:24 -0300 |
commit | 89435696f9a28316ab3dc5ef7c73776d092da89c (patch) | |
tree | 6ead695277e252796dbf29dc1c5ee0023be90e99 /packages/taler-wallet-webextension | |
parent | 8642f8edcd1aa8fe18c50d534f485debf1df01c9 (diff) | |
download | wallet-core-89435696f9a28316ab3dc5ef7c73776d092da89c.tar.xz |
useAsync use an optional deps for callback, most of the time it just need to be rendered once
Diffstat (limited to 'packages/taler-wallet-webextension')
-rw-r--r-- | packages/taler-wallet-webextension/src/cta/Withdraw.tsx | 40 | ||||
-rw-r--r-- | packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts | 18 |
2 files changed, 28 insertions, 30 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx index 64a0c2586..676c65d2d 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx @@ -247,9 +247,7 @@ export function WithdrawPageWithParsedURI({ const [reviewing, setReviewing] = useState<boolean>(false); const [reviewed, setReviewed] = useState<boolean>(false); - const knownExchangesHook = useAsyncAsHook( - useCallback(() => wxApi.listExchanges(), []), - ); + const knownExchangesHook = useAsyncAsHook(wxApi.listExchanges); const knownExchanges = useMemo( () => @@ -278,21 +276,19 @@ export function WithdrawPageWithParsedURI({ [customExchange, thisCurrencyExchanges, uriInfo.defaultExchangeBaseUrl], ); - const detailsHook = useAsyncAsHook( - useCallback(async () => { - if (!exchange) throw Error("no default exchange"); - const tos = await wxApi.getExchangeTos(exchange, ["text/xml"]); + const detailsHook = useAsyncAsHook(async () => { + if (!exchange) throw Error("no default exchange"); + const tos = await wxApi.getExchangeTos(exchange, ["text/xml"]); - const tosState = buildTermsOfServiceState(tos); + const tosState = buildTermsOfServiceState(tos); - const info = await wxApi.getExchangeWithdrawalInfo({ - exchangeBaseUrl: exchange, - amount: withdrawAmount, - tosAcceptedFormat: ["text/xml"], - }); - return { tos: tosState, info }; - }, [exchange, withdrawAmount]), - ); + const info = await wxApi.getExchangeWithdrawalInfo({ + exchangeBaseUrl: exchange, + amount: withdrawAmount, + tosAcceptedFormat: ["text/xml"], + }); + return { tos: tosState, info }; + }); if (!detailsHook) { return <Loading />; @@ -357,14 +353,10 @@ export function WithdrawPageWithParsedURI({ } export function WithdrawPage({ talerWithdrawUri }: Props): VNode { const { i18n } = useTranslationContext(); - const uriInfoHook = useAsyncAsHook( - useCallback( - () => - !talerWithdrawUri - ? Promise.reject(undefined) - : wxApi.getWithdrawalDetailsForUri({ talerWithdrawUri }), - [talerWithdrawUri], - ), + const uriInfoHook = useAsyncAsHook(() => + !talerWithdrawUri + ? Promise.reject(undefined) + : wxApi.getWithdrawalDetailsForUri({ talerWithdrawUri }), ); if (!talerWithdrawUri) { diff --git a/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts b/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts index 4e86c5ee5..b2d71874f 100644 --- a/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts +++ b/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts @@ -17,7 +17,7 @@ import { NotificationType, TalerErrorDetail } from "@gnu-taler/taler-util"; import { TalerError } from "@gnu-taler/taler-wallet-core"; -import { useEffect, useState } from "preact/hooks"; +import { useCallback, useEffect, useMemo, useState } from "preact/hooks"; import * as wxApi from "../wxApi.js"; interface HookOk<T> { @@ -41,16 +41,22 @@ export interface HookOperationalError { export type HookResponse<T> = HookOk<T> | HookError | undefined; -//"withdraw-group-finished" export function useAsyncAsHook<T>( fn: () => Promise<T>, updateOnNotification?: Array<NotificationType>, + deps?: any[], ): HookResponse<T> { + + const args = useMemo(() => ({ + fn, updateOnNotification + // eslint-disable-next-line react-hooks/exhaustive-deps + }), deps || []) const [result, setHookResponse] = useState<HookResponse<T>>(undefined); + useEffect(() => { async function doAsync(): Promise<void> { try { - const response = await fn(); + const response = await args.fn(); setHookResponse({ hasError: false, response }); } catch (e) { if (e instanceof TalerError) { @@ -69,11 +75,11 @@ export function useAsyncAsHook<T>( } } doAsync(); - if (updateOnNotification && updateOnNotification.length > 0) { - return wxApi.onUpdateNotification(updateOnNotification, () => { + if (args.updateOnNotification && args.updateOnNotification.length > 0) { + return wxApi.onUpdateNotification(args.updateOnNotification, () => { doAsync(); }); } - }, [fn, updateOnNotification]); + }, [args]); return result; } |