diff options
author | Sebastian <sebasjm@gmail.com> | 2022-01-20 13:12:28 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-01-24 09:46:20 -0300 |
commit | e38be8d8ec1bdf1c854a2391ae9f4641cb69a249 (patch) | |
tree | c814b2945fb6f5aebb60419c680ab12c8a3309f2 /packages/taler-wallet-webextension/src/cta | |
parent | e263907017958585c1eaf3c3284314fab5d36c85 (diff) | |
download | wallet-core-e38be8d8ec1bdf1c854a2391ae9f4641cb69a249.tar.gz wallet-core-e38be8d8ec1bdf1c854a2391ae9f4641cb69a249.tar.bz2 wallet-core-e38be8d8ec1bdf1c854a2391ae9f4641cb69a249.zip |
using loadingerror
Diffstat (limited to 'packages/taler-wallet-webextension/src/cta')
-rw-r--r-- | packages/taler-wallet-webextension/src/cta/Deposit.tsx | 4 | ||||
-rw-r--r-- | packages/taler-wallet-webextension/src/cta/Pay.tsx | 98 | ||||
-rw-r--r-- | packages/taler-wallet-webextension/src/cta/Withdraw.tsx | 33 |
3 files changed, 36 insertions, 99 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit.tsx b/packages/taler-wallet-webextension/src/cta/Deposit.tsx index 3696b0c2d..39ccdbac0 100644 --- a/packages/taler-wallet-webextension/src/cta/Deposit.tsx +++ b/packages/taler-wallet-webextension/src/cta/Deposit.tsx @@ -29,7 +29,6 @@ import { Amounts, amountToPretty, ConfirmPayResult, - ConfirmPayResultDone, ConfirmPayResultType, ContractTerms, i18n, @@ -174,11 +173,8 @@ export interface PaymentRequestViewProps { balance: AmountJson | undefined; } export function PaymentRequestView({ - uri, payStatus, payResult, - onClick, - balance, }: PaymentRequestViewProps): VNode { let totalFees: AmountJson = Amounts.getZero(payStatus.amountRaw); const contractTerms: ContractTerms = payStatus.contractTerms; diff --git a/packages/taler-wallet-webextension/src/cta/Pay.tsx b/packages/taler-wallet-webextension/src/cta/Pay.tsx index 6e73b5566..c0fcca169 100644 --- a/packages/taler-wallet-webextension/src/cta/Pay.tsx +++ b/packages/taler-wallet-webextension/src/cta/Pay.tsx @@ -40,14 +40,14 @@ import { } from "@gnu-taler/taler-util"; import { OperationFailedError } from "@gnu-taler/taler-wallet-core"; import { Fragment, h, VNode } from "preact"; -import { useEffect, useState } from "preact/hooks"; -import { ErrorTalerOperation } from "../components/ErrorTalerOperation"; +import { useState } from "preact/hooks"; +import { Loading } from "../components/Loading"; +import { LoadingError } from "../components/LoadingError"; import { LogoHeader } from "../components/LogoHeader"; import { Part } from "../components/Part"; import { QR } from "../components/QR"; import { ButtonSuccess, - ErrorBox, LinkSuccess, SmallLightText, SuccessBox, @@ -84,10 +84,8 @@ const doPayment = async ( export function PayPage({ talerPayUri, goToWalletManualWithdraw, + goBack, }: Props): VNode { - const [payStatus, setPayStatus] = useState<PreparePayResult | undefined>( - undefined, - ); const [payResult, setPayResult] = useState<ConfirmPayResult | undefined>( undefined, ); @@ -95,83 +93,33 @@ export function PayPage({ OperationFailedError | string | undefined >(undefined); - const balance = useAsyncAsHook(wxApi.getBalance, [ - NotificationType.CoinWithdrawn, - ]); - const balanceWithoutError = balance?.hasError - ? [] - : balance?.response.balances || []; + const hook = useAsyncAsHook(async () => { + if (!talerPayUri) throw Error("Missing pay uri"); + const payStatus = await wxApi.preparePay(talerPayUri); + const balance = await wxApi.getBalance(); + return { payStatus, balance }; + }, [NotificationType.CoinWithdrawn]); + + if (!hook) { + return <Loading />; + } + + if (hook.hasError) { + return <LoadingError title="Could not load pay status" error={hook} />; + } - const foundBalance = balanceWithoutError.find( + const foundBalance = hook.response.balance.balances.find( (b) => - payStatus && Amounts.parseOrThrow(b.available).currency === - Amounts.parseOrThrow(payStatus?.amountRaw).currency, + Amounts.parseOrThrow(hook.response.payStatus.amountRaw).currency, ); const foundAmount = foundBalance ? Amounts.parseOrThrow(foundBalance.available) : undefined; - // We use a string here so that dependency tracking for useEffect works properly - const foundAmountStr = foundAmount - ? Amounts.stringify(foundAmount) - : undefined; - - useEffect(() => { - if (!talerPayUri) return; - const doFetch = async (): Promise<void> => { - try { - const p = await wxApi.preparePay(talerPayUri); - setPayStatus(p); - } catch (e) { - console.log("Got error while trying to pay", e); - if (e instanceof OperationFailedError) { - setPayErrMsg(e); - } - if (e instanceof Error) { - setPayErrMsg(e.message); - } - } - }; - doFetch(); - }, [talerPayUri, foundAmountStr]); - - if (!talerPayUri) { - return <span>missing pay uri</span>; - } - - if (!payStatus) { - if (payErrMsg instanceof OperationFailedError) { - return ( - <WalletAction> - <LogoHeader /> - <h2>{i18n.str`Digital cash payment`}</h2> - <section> - <ErrorTalerOperation - title="Could not get the payment information for this order" - error={payErrMsg?.operationError} - /> - </section> - </WalletAction> - ); - } - if (payErrMsg) { - return ( - <WalletAction> - <LogoHeader /> - <h2>{i18n.str`Digital cash payment`}</h2> - <section> - <p>Could not get the payment information for this order</p> - <ErrorBox>{payErrMsg}</ErrorBox> - </section> - </WalletAction> - ); - } - return <span>Loading payment information ...</span>; - } const onClick = async (): Promise<void> => { try { - const res = await doPayment(payStatus); + const res = await doPayment(hook.response.payStatus); setPayResult(res); } catch (e) { console.error(e); @@ -183,8 +131,8 @@ export function PayPage({ return ( <PaymentRequestView - uri={talerPayUri} - payStatus={payStatus} + uri={talerPayUri!} + payStatus={hook.response.payStatus} payResult={payResult} onClick={onClick} goToWalletManualWithdraw={goToWalletManualWithdraw} diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx index 0a06bd577..a4ee640ca 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx @@ -30,6 +30,8 @@ import { } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { useState } from "preact/hooks"; +import { Loading } from "../components/Loading"; +import { LoadingError } from "../components/LoadingError"; import { LogoHeader } from "../components/LogoHeader"; import { Part } from "../components/Part"; import { SelectList } from "../components/SelectList"; @@ -237,19 +239,14 @@ export function WithdrawPageWithParsedURI({ }); if (!detailsHook) { - return ( - <span> - <i18n.Translate>Getting withdrawal details.</i18n.Translate> - </span> - ); + return <Loading />; } if (detailsHook.hasError) { return ( - <span> - <i18n.Translate> - Problems getting details: {detailsHook.message} - </i18n.Translate> - </span> + <LoadingError + title="Could not load the withdrawal details" + error={detailsHook} + /> ); } @@ -315,21 +312,17 @@ export function WithdrawPage({ talerWithdrawUri }: Props): VNode { ); } if (!uriInfoHook) { - return ( - <span> - <i18n.Translate>Loading...</i18n.Translate> - </span> - ); + return <Loading />; } if (uriInfoHook.hasError) { return ( - <span> - <i18n.Translate> - This URI is not valid anymore: {uriInfoHook.message} - </i18n.Translate> - </span> + <LoadingError + title="Could not get the info from the URI" + error={uriInfoHook} + /> ); } + return ( <WithdrawPageWithParsedURI uri={talerWithdrawUri} |