diff options
Diffstat (limited to 'packages')
5 files changed, 91 insertions, 54 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts index d33abffee..026a879df 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts @@ -95,7 +95,8 @@ export namespace State { currentExchange: ExchangeListItem; - chosenAmount: AmountJson; + amount: AmountFieldHandler; + withdrawalFee: AmountJson; toBeReceived: AmountJson; diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts index f592072ff..90ad65d6e 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts @@ -54,7 +54,7 @@ export function useComponentStateFromParams({ ? parseWithdrawExchangeUri(maybeTalerUri) : undefined; const exchangeByTalerUri = updatedExchangeByUser ?? uri?.exchangeBaseUrl; - + let ex: ExchangeFullDetails | undefined; if (exchangeByTalerUri) { await api.wallet.call(WalletApiOperation.AddExchange, { @@ -186,6 +186,7 @@ export function useComponentStateFromParams({ onSuccess, undefined, chosenAmount, + chosenAmount.currency, exchangeList, exchangeByTalerUri, setUpdatedExchangeByUser, @@ -234,9 +235,10 @@ export function useComponentStateFromURI({ talerWithdrawUri, status, transactionId: uriInfo.transactionId, + currency: uriInfo.info.currency, txInfo: txInfo, confirmTransferUrl, - amount: Amounts.parseOrThrow(amount), + amount: !amount ? undefined : Amounts.parseOrThrow(amount), thisExchange: defaultExchangeBaseUrl, exchanges: possibleExchanges, }; @@ -278,7 +280,7 @@ export function useComponentStateFromURI({ const uri = uriInfoHook.response.talerWithdrawUri; const txId = uriInfoHook.response.transactionId; - const chosenAmount = uriInfoHook.response.amount; + const infoAmount = uriInfoHook.response.amount; const defaultExchange = uriInfoHook.response.thisExchange; const exchangeList = uriInfoHook.response.exchanges; @@ -305,7 +307,10 @@ export function useComponentStateFromURI({ }; } - if (uriInfoHook.response.txInfo && uriInfoHook.response.status !== "pending") { + if ( + uriInfoHook.response.txInfo && + uriInfoHook.response.status !== "pending" + ) { const info = uriInfoHook.response.txInfo; return { status: "already-completed", @@ -323,7 +328,8 @@ export function useComponentStateFromURI({ cancel, onSuccess, uri, - chosenAmount, + infoAmount, + uriInfoHook.response.currency, exchangeList, defaultExchange, setUpdatedExchangeByUser, @@ -342,14 +348,15 @@ function exchangeSelectionState( cancel: () => Promise<void>, onSuccess: (txid: string) => Promise<void>, talerWithdrawUri: string | undefined, - chosenAmount: AmountJson, + infoAmount: AmountJson | undefined, + currency: string, exchangeList: ExchangeListItem[], exchangeSuggestedByTheBank: string | undefined, onExchangeUpdated: (ex: string) => void, ): RecursiveState<State> { const api = useBackendContext(); const selectedExchange = useSelectedExchange({ - currency: chosenAmount.currency, + currency: currency, defaultExchange: exchangeSuggestedByTheBank, list: exchangeList, }); @@ -363,11 +370,15 @@ function exchangeSelectionState( onExchangeUpdated(current); } }, [current]); + + const safeAmount = !infoAmount ? Amounts.zeroOfCurrency(currency) : infoAmount + const [choosenAmount, setChoosenAmount] = useState(safeAmount) if (selectedExchange.status !== "ready") { return selectedExchange; } + return useCallback((): | State.Success | State.LoadingUriError @@ -377,9 +388,7 @@ function exchangeSelectionState( const [ageRestricted, setAgeRestricted] = useState(0); const currentExchange = selectedExchange.selected; - const [selectedCurrency, setSelectedCurrency] = useState<string>( - chosenAmount.currency, - ); + const [selectedCurrency, setSelectedCurrency] = useState<string>(currency); /** * With the exchange and amount, ask the wallet the information * about the withdrawal @@ -389,7 +398,7 @@ function exchangeSelectionState( WalletApiOperation.GetWithdrawalDetailsForAmount, { exchangeBaseUrl: currentExchange.exchangeBaseUrl, - amount: Amounts.stringify(chosenAmount), + amount: Amounts.stringify(choosenAmount), restrictAge: ageRestricted, }, ); @@ -414,7 +423,7 @@ function exchangeSelectionState( const res = await doWithdraw( currentExchange.exchangeBaseUrl, !ageRestricted ? undefined : ageRestricted, - Amounts.stringify(chosenAmount), + Amounts.stringify(choosenAmount), ); if (res.confirmTransferUrl) { document.location.href = res.confirmTransferUrl; @@ -454,7 +463,7 @@ function exchangeSelectionState( const ageRestrictionOptions = amountHook.response.ageRestrictionOptions?.reduce( - (p, c) => ({ ...p, [c]: `under ${c}` }), + (p, c) => ({ ...p, [c]: i18n.str`under ${c}` }), {} as Record<string, string>, ); @@ -508,7 +517,12 @@ function exchangeSelectionState( }, conversionInfo, withdrawalFee, - chosenAmount, + amount: { + value: choosenAmount, + onInput: pushAlertOnError(async (v) => { + setChoosenAmount(v) + }) + }, talerWithdrawUri, ageRestriction, doWithdrawal: { diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/stories.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw/stories.tsx index 29f39054f..1bfafb231 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/stories.tsx @@ -43,10 +43,12 @@ const ageRestrictionSelectField = { export const TermsOfServiceNotYetLoaded = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "USD", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 10000000, + } }, doWithdrawal: { onClick: nullFunction }, currentExchange: { @@ -87,10 +89,12 @@ export const AlreadyConfirmed = tests.createExample(FinalStateOperation, { export const WithSomeFee = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "USD", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 10000000, + } }, doWithdrawal: { onClick: nullFunction }, currentExchange: { @@ -114,10 +118,12 @@ export const WithSomeFee = tests.createExample(SuccessView, { export const WithoutFee = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "USD", - value: 2, - fraction: 0, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 0, + } }, doWithdrawal: { onClick: nullFunction }, currentExchange: { @@ -141,10 +147,12 @@ export const WithoutFee = tests.createExample(SuccessView, { export const EditExchangeUntouched = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "USD", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 10000000, + } }, doWithdrawal: { onClick: nullFunction }, currentExchange: { @@ -168,10 +176,12 @@ export const EditExchangeUntouched = tests.createExample(SuccessView, { export const EditExchangeModified = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "USD", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 10000000, + } }, doWithdrawal: { onClick: nullFunction }, currentExchange: { @@ -196,10 +206,12 @@ export const WithAgeRestriction = tests.createExample(SuccessView, { error: undefined, status: "success", ageRestriction: ageRestrictionSelectField, - chosenAmount: { - currency: "USD", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "USD", + value: 2, + fraction: 10000000, + } }, doSelectExchange: {}, doWithdrawal: { onClick: nullFunction }, @@ -223,10 +235,12 @@ export const WithAgeRestriction = tests.createExample(SuccessView, { export const WithAlternateCurrenciesNETZBON = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "NETZBON", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "NETZBON", + value: 2, + fraction: 10000000, + } }, chooseCurrencies: ["NETZBON", "EUR"], selectedCurrency: "NETZBON", @@ -251,10 +265,12 @@ export const WithAlternateCurrenciesNETZBON = tests.createExample(SuccessView, { export const WithAlternateCurrenciesEURO = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "NETZBON", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "NETZBON", + value: 2, + fraction: 10000000, + } }, chooseCurrencies: ["NETZBON", "EUR"], selectedCurrency: "EUR", @@ -290,10 +306,12 @@ export const WithAlternateCurrenciesEURO = tests.createExample(SuccessView, { export const WithAlternateCurrenciesEURO11 = tests.createExample(SuccessView, { error: undefined, status: "success", - chosenAmount: { - currency: "NETZBON", - value: 2, - fraction: 10000000, + amount: { + value: { + currency: "NETZBON", + value: 2, + fraction: 10000000, + } }, chooseCurrencies: ["NETZBON", "EUR"], selectedCurrency: "EUR", diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts index 860cf1099..785fab996 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts @@ -115,6 +115,7 @@ describe("Withdraw CTA states", () => { info: { status: "pending", operationId: "123", + currency: "ARS", amount: "EUR:2" as AmountString, possibleExchanges: [], } @@ -156,6 +157,7 @@ describe("Withdraw CTA states", () => { info: { status: "pending", operationId: "123", + currency: "ARS", amount: "ARS:2" as AmountString, possibleExchanges: exchanges, defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl, @@ -198,7 +200,7 @@ describe("Withdraw CTA states", () => { expect(state.toBeReceived).deep.equal(Amounts.parseOrThrow("ARS:2")); expect(state.withdrawalFee).deep.equal(Amounts.parseOrThrow("ARS:0")); - expect(state.chosenAmount).deep.equal(Amounts.parseOrThrow("ARS:2")); + expect(state.amount.value).deep.equal(Amounts.parseOrThrow("ARS:2")); expect(state.doWithdrawal.onClick).not.undefined; }, @@ -229,6 +231,7 @@ describe("Withdraw CTA states", () => { { status: "pending", operationId: "123", + currency: "ARS", amount: "ARS:2" as AmountString, possibleExchanges: exchangeWithNewTos, defaultExchangeBaseUrl: exchangeWithNewTos[0].exchangeBaseUrl, @@ -259,6 +262,7 @@ describe("Withdraw CTA states", () => { { status: "pending", operationId: "123", + currency: "ARS", amount: "ARS:2" as AmountString, possibleExchanges: exchanges, defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl, @@ -282,7 +286,7 @@ describe("Withdraw CTA states", () => { expect(state.toBeReceived).deep.equal(Amounts.parseOrThrow("ARS:2")); expect(state.withdrawalFee).deep.equal(Amounts.parseOrThrow("ARS:0")); - expect(state.chosenAmount).deep.equal(Amounts.parseOrThrow("ARS:2")); + expect(state.amount.value).deep.equal(Amounts.parseOrThrow("ARS:2")); expect(state.doWithdrawal.onClick).not.undefined; }, diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx index cdddd9bbc..a4917446d 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx @@ -207,7 +207,7 @@ export function SuccessView(state: State.Success): VNode { conversion={state.conversionInfo?.amount} amount={getAmountWithFee( state.toBeReceived, - state.chosenAmount, + state.amount.value, "credit", )} /> |