From 8eee38d55936c194637ecead302dde69ec0b9897 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Wed, 5 Apr 2023 12:06:24 -0300 Subject: [PATCH] fix #7791 --- .../src/components/CurrentAlerts.tsx | 2 +- .../src/context/alert.ts | 4 +- .../src/cta/InvoiceCreate/index.ts | 4 +- .../src/cta/Withdraw/index.ts | 4 +- .../src/cta/Withdraw/state.ts | 8 ++-- .../src/cta/Withdraw/test.ts | 2 +- .../src/hooks/useSelectedExchange.ts | 33 ++++++++------ .../src/wallet/ExchangeSelection/index.ts | 6 +-- .../src/wallet/ExchangeSelection/state.ts | 40 +++++++---------- .../src/wallet/ExchangeSelection/stories.tsx | 7 ++- .../src/wallet/ExchangeSelection/views.tsx | 43 +++++++++++-------- 11 files changed, 80 insertions(+), 73 deletions(-) diff --git a/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx b/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx index 47863d73e..0f12b8afa 100644 --- a/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx +++ b/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx @@ -122,7 +122,7 @@ export function AlertView({
{alert.description}
- {alert.type === "error" ? ( + {alert.type === "error" && alert.cause !== undefined ? ( ) : undefined}
diff --git a/packages/taler-wallet-webextension/src/context/alert.ts b/packages/taler-wallet-webextension/src/context/alert.ts index da37a2768..2b088abd3 100644 --- a/packages/taler-wallet-webextension/src/context/alert.ts +++ b/packages/taler-wallet-webextension/src/context/alert.ts @@ -40,8 +40,8 @@ export interface ErrorAlert { message: TranslatedString; description: TranslatedString | VNode; type: "error"; - context: object; - cause: any; + context: object | undefined; + cause: any | undefined; } type Type = { diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts index f39ab6794..b8aaed3f2 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts @@ -37,7 +37,7 @@ export type State = | State.LoadingUriError | State.Ready | SelectExchangeState.Selecting - | SelectExchangeState.NoExchange; + | SelectExchangeState.NoExchangeFound; export namespace State { export interface Loading { @@ -70,7 +70,7 @@ export namespace State { const viewMapping: StateViewMap = { loading: Loading, error: ErrorAlertView, - "no-exchange": NoExchangesView, + "no-exchange-found": NoExchangesView, "selecting-exchange": ExchangeSelectionPage, ready: ReadyView, }; diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts index 7dfc7c141..45c37ba5c 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts @@ -46,7 +46,7 @@ export interface PropsFromParams { export type State = | State.Loading | State.LoadingUriError - | SelectExchangeState.NoExchange + | SelectExchangeState.NoExchangeFound | SelectExchangeState.Selecting | State.Success; @@ -84,7 +84,7 @@ export namespace State { const viewMapping: StateViewMap = { loading: Loading, error: ErrorAlertView, - "no-exchange": NoExchangesView, + "no-exchange-found": NoExchangesView, "selecting-exchange": ExchangeSelectionPage, success: SuccessView, }; diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts index 9522c2bfb..4de026190 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts @@ -118,12 +118,12 @@ export function useComponentStateFromURI({ talerWithdrawUri, }, ); - const { amount, defaultExchangeBaseUrl } = uriInfo; + const { amount, defaultExchangeBaseUrl, possibleExchanges } = uriInfo; return { talerWithdrawUri, amount: Amounts.parseOrThrow(amount), thisExchange: defaultExchangeBaseUrl, - exchanges: uriInfo.possibleExchanges, + exchanges: possibleExchanges, }; }); @@ -191,12 +191,12 @@ function exchangeSelectionState( talerWithdrawUri: string | undefined, chosenAmount: AmountJson, exchangeList: ExchangeListItem[], - defaultExchange: string | undefined, + exchangeSuggestedByTheBank: string | undefined, ): RecursiveState { const api = useBackendContext(); const selectedExchange = useSelectedExchange({ currency: chosenAmount.currency, - defaultExchange, + defaultExchange: exchangeSuggestedByTheBank, list: exchangeList, }); diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts index 5a6200844..d90fc72ac 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts @@ -122,7 +122,7 @@ describe("Withdraw CTA states", () => { expect(status).equals("loading"); }, ({ status, error }) => { - expect(status).equals("no-exchange"); + expect(status).equals("no-exchange-found"); expect(error).undefined; }, ], diff --git a/packages/taler-wallet-webextension/src/hooks/useSelectedExchange.ts b/packages/taler-wallet-webextension/src/hooks/useSelectedExchange.ts index 6ceae2d47..6907a247d 100644 --- a/packages/taler-wallet-webextension/src/hooks/useSelectedExchange.ts +++ b/packages/taler-wallet-webextension/src/hooks/useSelectedExchange.ts @@ -19,13 +19,14 @@ import { useState } from "preact/hooks"; import { useAlertContext } from "../context/alert.js"; import { ButtonHandler } from "../mui/handlers.js"; -type State = State.Ready | State.NoExchange | State.Selecting; +type State = State.Ready | State.NoExchangeFound | State.Selecting; export namespace State { - export interface NoExchange { - status: "no-exchange"; + export interface NoExchangeFound { + status: "no-exchange-found"; error: undefined; - currency: string | undefined; + currency: string; + defaultExchange: string | undefined; } export interface Ready { status: "ready"; @@ -39,7 +40,7 @@ export namespace State { onCancel: () => Promise; list: ExchangeListItem[]; currency: string; - currentExchange: string; + initialValue: string; } } @@ -64,31 +65,35 @@ export function useSelectedExchange({ if (!list.length) { return { - status: "no-exchange", + status: "no-exchange-found", error: undefined, - currency: undefined, + currency, + defaultExchange, }; } - const listCurrency = list.filter((e) => e.currency === currency); - if (!listCurrency.length) { + const exchangesWithThisCurrency = list.filter((e) => e.currency === currency); + if (!exchangesWithThisCurrency.length) { // there should be at least one exchange for this currency return { - status: "no-exchange", + status: "no-exchange-found", error: undefined, currency, + defaultExchange, }; } if (isSelecting) { const currentExchange = - selectedExchange ?? defaultExchange ?? listCurrency[0].exchangeBaseUrl; + selectedExchange ?? + defaultExchange ?? + exchangesWithThisCurrency[0].exchangeBaseUrl; return { status: "selecting-exchange", error: undefined, - list: listCurrency, + list: exchangesWithThisCurrency, currency, - currentExchange: currentExchange, + initialValue: currentExchange, onSelection: async (exchangeBaseUrl: string) => { setIsSelecting(false); setSelectedExchange(exchangeBaseUrl); @@ -131,6 +136,6 @@ export function useSelectedExchange({ doSelect: { onClick: pushAlertOnError(async () => setIsSelecting(true)), }, - selected: listCurrency[0], + selected: exchangesWithThisCurrency[0], }; } diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts index 299c236c4..d711f1ecc 100644 --- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts +++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts @@ -38,7 +38,7 @@ import { export interface Props { list: ExchangeListItem[]; - currentExchange: string; + initialValue: string; onCancel: () => Promise; onSelection: (exchange: string) => Promise; } @@ -50,7 +50,7 @@ export type State = | State.Comparing | State.ShowingTos | State.ShowingPrivacy - | SelectExchangeState.NoExchange; + | SelectExchangeState.NoExchangeFound; export namespace State { export interface Loading { @@ -102,7 +102,7 @@ const viewMapping: StateViewMap = { loading: Loading, error: ErrorAlertView, comparing: ComparingView, - "no-exchange": NoExchangesView, + "no-exchange-found": NoExchangesView, "showing-tos": TosContentView, "showing-privacy": PrivacyContentView, ready: ReadyView, diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts index 7ad11e67c..ff3800ee8 100644 --- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts +++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts @@ -30,37 +30,37 @@ export function useComponentState({ onCancel, onSelection, list: exchanges, - currentExchange, + initialValue, }: Props): State { const api = useBackendContext(); const { pushAlertOnError } = useAlertContext(); const { i18n } = useTranslationContext(); - const initialValue = exchanges.findIndex( - (e) => e.exchangeBaseUrl === currentExchange, + const initialValueIdx = exchanges.findIndex( + (e) => e.exchangeBaseUrl === initialValue, ); - if (initialValue === -1) { + if (initialValueIdx === -1) { throw Error( - `wrong usage of ExchangeSelection component, currentExchange '${currentExchange}' is not in the list of exchanges`, + `wrong usage of ExchangeSelection component, currentExchange '${initialValue}' is not in the list of exchanges`, ); } - const [value, setValue] = useState(String(initialValue)); + const [value, setValue] = useState(String(initialValueIdx)); const selectedIdx = parseInt(value, 10); - const selectedExchange = - exchanges.length == 0 ? undefined : exchanges[selectedIdx]; + const selectedExchange = exchanges[selectedIdx]; - const comparingExchanges = selectedIdx !== initialValue; + const comparingExchanges = selectedIdx !== initialValueIdx; const initialExchange = comparingExchanges - ? exchanges[initialValue] + ? exchanges[initialValueIdx] : undefined; const hook = useAsyncAsHook(async () => { - const selected = !selectedExchange - ? undefined - : await api.wallet.call(WalletApiOperation.GetExchangeDetailedInfo, { - exchangeBaseUrl: selectedExchange.exchangeBaseUrl, - }); + const selected = await api.wallet.call( + WalletApiOperation.GetExchangeDetailedInfo, + { + exchangeBaseUrl: selectedExchange.exchangeBaseUrl, + }, + ); const original = !initialExchange ? undefined @@ -70,7 +70,7 @@ export function useComponentState({ return { exchanges, - selected: selected?.exchange, + selected: selected.exchange, original: original?.exchange, }; }, [selectedExchange, initialExchange]); @@ -98,14 +98,6 @@ export function useComponentState({ const { selected, original } = hook.response; - if (selectedExchange === undefined || !selected) { - return { - status: "no-exchange", - error: undefined, - currency: undefined, - }; - } - const exchangeMap = exchanges.reduce( (prev, cur, idx) => ({ ...prev, [String(idx)]: cur.exchangeBaseUrl }), {} as Record, diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/stories.tsx b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/stories.tsx index a65f85c6a..741875ad5 100644 --- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/stories.tsx +++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/stories.tsx @@ -20,12 +20,17 @@ */ import { tests } from "@gnu-taler/web-util/lib/index.browser"; -import { ComparingView, ReadyView } from "./views.js"; +import { ComparingView, ReadyView, NoExchangesView } from "./views.js"; export default { title: "select exchange", }; +export const NoExchangeFound = tests.createExample(NoExchangesView, { + currency: "USD", + defaultExchange: "https://exchange.taler.ar", +}); + export const Bitcoin1 = tests.createExample(ReadyView, { exchanges: { list: { "0": "https://exchange.taler.ar" }, diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx index fd5c0cfe3..242a8e823 100644 --- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx +++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx @@ -141,28 +141,33 @@ export function TosContentView({ } export function NoExchangesView({ + defaultExchange, currency, -}: SelectExchangeState.NoExchange): VNode { +}: SelectExchangeState.NoExchangeFound): VNode { const { i18n } = useTranslationContext(); - if (!currency) { - return ( - - ); - } return ( - + +

+ +

+ {defaultExchange && ( + + )} + ); }