From 6ddb2de84245ae3914c92b2b2eb7399e7f04500e Mon Sep 17 00:00:00 2001 From: Sebastian Date: Fri, 16 Sep 2022 14:29:35 -0300 Subject: pretty --- .../src/cta/Withdraw/index.ts | 29 +++-- .../src/cta/Withdraw/state.ts | 124 ++++++++++-------- .../src/cta/Withdraw/test.ts | 142 +++++++++++++-------- 3 files changed, 179 insertions(+), 116 deletions(-) (limited to 'packages/taler-wallet-webextension/src/cta/Withdraw') diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts index 7bd667268..d777489ab 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts @@ -20,12 +20,18 @@ import { HookError } from "../../hooks/useAsyncAsHook.js"; import { ButtonHandler, SelectFieldHandler } from "../../mui/handlers.js"; import { compose, StateViewMap } from "../../utils/index.js"; import * as wxApi from "../../wxApi.js"; +import { Props as TermsOfServiceSectionProps } from "../TermsOfServiceSection.js"; import { - Props as TermsOfServiceSectionProps -} from "../TermsOfServiceSection.js"; -import { useComponentStateFromParams, useComponentStateFromURI } from "./state.js"; -import { CompletedView, LoadingExchangeView, LoadingInfoView, LoadingUriView, SuccessView } from "./views.js"; - + useComponentStateFromParams, + useComponentStateFromURI, +} from "./state.js"; +import { + CompletedView, + LoadingExchangeView, + LoadingInfoView, + LoadingUriView, + SuccessView, +} from "./views.js"; export interface PropsFromURI { talerWithdrawUri: string | undefined; @@ -46,7 +52,6 @@ export type State = | State.Completed; export namespace State { - export interface Loading { status: "loading"; error: undefined; @@ -99,5 +104,13 @@ const viewMapping: StateViewMap = { success: SuccessView, }; -export const WithdrawPageFromURI = compose("WithdrawPageFromURI", (p: PropsFromURI) => useComponentStateFromURI(p, wxApi), viewMapping) -export const WithdrawPageFromParams = compose("WithdrawPageFromParams", (p: PropsFromParams) => useComponentStateFromParams(p, wxApi), viewMapping) +export const WithdrawPageFromURI = compose( + "WithdrawPageFromURI", + (p: PropsFromURI) => useComponentStateFromURI(p, wxApi), + viewMapping, +); +export const WithdrawPageFromParams = compose( + "WithdrawPageFromParams", + (p: PropsFromParams) => useComponentStateFromParams(p, wxApi), + viewMapping, +); diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts index 0d2e150e7..0b174d34c 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts @@ -14,7 +14,6 @@ GNU Taler; see the file COPYING. If not, see */ - import { Amounts, parsePaytoUri } from "@gnu-taler/taler-util"; import { TalerError } from "@gnu-taler/taler-wallet-core"; import { useState } from "preact/hooks"; @@ -27,7 +26,6 @@ export function useComponentStateFromParams( { amount, cancel }: PropsFromParams, api: typeof wxApi, ): State { - const [ageRestricted, setAgeRestricted] = useState(0); const exchangeHook = useAsyncAsHook(api.listExchanges); @@ -40,14 +38,20 @@ export function useComponentStateFromParams( const chosenAmount = Amounts.parseOrThrow(amount); // get the first exchange with the currency as the default one - const exchange = exchangeHookDep ? exchangeHookDep.exchanges.find(e => e.currency === chosenAmount.currency) : undefined + const exchange = exchangeHookDep + ? exchangeHookDep.exchanges.find( + (e) => e.currency === chosenAmount.currency, + ) + : undefined; /** * For the exchange selected, bring the status of the terms of service */ const terms = useAsyncAsHook(async () => { - if (!exchange) return undefined + if (!exchange) return undefined; - const exchangeTos = await api.getExchangeTos(exchange.exchangeBaseUrl, ["text/xml"]); + const exchangeTos = await api.getExchangeTos(exchange.exchangeBaseUrl, [ + "text/xml", + ]); const state = buildTermsOfServiceState(exchangeTos); @@ -59,7 +63,7 @@ export function useComponentStateFromParams( * about the withdrawal */ const amountHook = useAsyncAsHook(async () => { - if (!exchange) return undefined + if (!exchange) return undefined; const info = await api.getExchangeWithdrawalInfo({ exchangeBaseUrl: exchange.exchangeBaseUrl, @@ -71,9 +75,12 @@ export function useComponentStateFromParams( const withdrawAmount = { raw: Amounts.parseOrThrow(info.withdrawalAmountRaw), effective: Amounts.parseOrThrow(info.withdrawalAmountEffective), - } + }; - return { amount: withdrawAmount, ageRestrictionOptions: info.ageRestrictionOptions }; + return { + amount: withdrawAmount, + ageRestrictionOptions: info.ageRestrictionOptions, + }; }, [exchangeHookDep]); const [reviewing, setReviewing] = useState(false); @@ -85,7 +92,7 @@ export function useComponentStateFromParams( const [doingWithdraw, setDoingWithdraw] = useState(false); const [withdrawCompleted, setWithdrawCompleted] = useState(false); - if (!exchangeHook) return { status: "loading", error: undefined } + if (!exchangeHook) return { status: "loading", error: undefined }; if (exchangeHook.hasError) { return { status: "loading-uri", @@ -125,7 +132,7 @@ export function useComponentStateFromParams( } if (!amountHook) { - return { status: "loading", error: undefined } + return { status: "loading", error: undefined }; } if (amountHook.hasError) { return { @@ -149,8 +156,8 @@ export function useComponentStateFromParams( const { state: termsState } = (!terms ? undefined : terms.hasError - ? undefined - : terms.response) || { state: undefined }; + ? undefined + : terms.response) || { state: undefined }; async function onAccept(accepted: boolean): Promise { if (!termsState || !exchange) return; @@ -173,21 +180,25 @@ export function useComponentStateFromParams( termsState !== undefined && (termsState.status === "changed" || termsState.status === "new"); - const ageRestrictionOptions = amountHook.response. - ageRestrictionOptions?. - reduce((p, c) => ({ ...p, [c]: `under ${c}` }), {} as Record) + const ageRestrictionOptions = + amountHook.response.ageRestrictionOptions?.reduce( + (p, c) => ({ ...p, [c]: `under ${c}` }), + {} as Record, + ); - const ageRestrictionEnabled = ageRestrictionOptions !== undefined + const ageRestrictionEnabled = ageRestrictionOptions !== undefined; if (ageRestrictionEnabled) { ageRestrictionOptions["0"] = "Not restricted"; } //TODO: calculate based on exchange info - const ageRestriction = ageRestrictionEnabled ? { - list: ageRestrictionOptions, - value: String(ageRestricted), - onChange: async (v: string) => setAgeRestricted(parseInt(v, 10)), - } : undefined; + const ageRestriction = ageRestrictionEnabled + ? { + list: ageRestrictionOptions, + value: String(ageRestricted), + onChange: async (v: string) => setAgeRestricted(parseInt(v, 10)), + } + : undefined; return { status: "success", @@ -207,12 +218,12 @@ export function useComponentStateFromParams( tosProps: !termsState ? undefined : { - onAccept, - onReview: setReviewing, - reviewed: reviewed, - reviewing: reviewing, - terms: termsState, - }, + onAccept, + onReview: setReviewing, + reviewed: reviewed, + reviewing: reviewing, + terms: termsState, + }, mustAcceptFirst, cancel, }; @@ -233,7 +244,7 @@ export function useComponentStateFromURI( const uriInfo = await api.getWithdrawalDetailsForUri({ talerWithdrawUri, }); - const { amount, defaultExchangeBaseUrl } = uriInfo + const { amount, defaultExchangeBaseUrl } = uriInfo; return { amount, thisExchange: defaultExchangeBaseUrl }; }); @@ -245,14 +256,15 @@ export function useComponentStateFromURI( ? undefined : uriInfoHook.response; - /** * For the exchange selected, bring the status of the terms of service */ const terms = useAsyncAsHook(async () => { if (!uriHookDep?.thisExchange) return false; - const exchangeTos = await api.getExchangeTos(uriHookDep.thisExchange, ["text/xml"]); + const exchangeTos = await api.getExchangeTos(uriHookDep.thisExchange, [ + "text/xml", + ]); const state = buildTermsOfServiceState(exchangeTos); @@ -276,9 +288,12 @@ export function useComponentStateFromURI( const withdrawAmount = { raw: Amounts.parseOrThrow(info.withdrawalAmountRaw), effective: Amounts.parseOrThrow(info.withdrawalAmountEffective), - } + }; - return { amount: withdrawAmount, ageRestrictionOptions: info.ageRestrictionOptions }; + return { + amount: withdrawAmount, + ageRestrictionOptions: info.ageRestrictionOptions, + }; }, [uriHookDep]); const [reviewing, setReviewing] = useState(false); @@ -290,7 +305,7 @@ export function useComponentStateFromURI( const [doingWithdraw, setDoingWithdraw] = useState(false); const [withdrawCompleted, setWithdrawCompleted] = useState(false); - if (!uriInfoHook) return { status: "loading", error: undefined } + if (!uriInfoHook) return { status: "loading", error: undefined }; if (uriInfoHook.hasError) { return { status: "loading-uri", @@ -298,7 +313,7 @@ export function useComponentStateFromURI( }; } - const { amount, thisExchange } = uriInfoHook.response + const { amount, thisExchange } = uriInfoHook.response; const chosenAmount = Amounts.parseOrThrow(amount); @@ -339,7 +354,7 @@ export function useComponentStateFromURI( } if (!amountHook) { - return { status: "loading", error: undefined } + return { status: "loading", error: undefined }; } if (amountHook.hasError) { return { @@ -363,8 +378,8 @@ export function useComponentStateFromURI( const { state: termsState } = (!terms ? undefined : terms.hasError - ? undefined - : terms.response) || { state: undefined }; + ? undefined + : terms.response) || { state: undefined }; async function onAccept(accepted: boolean): Promise { if (!termsState || !thisExchange) return; @@ -387,21 +402,25 @@ export function useComponentStateFromURI( termsState !== undefined && (termsState.status === "changed" || termsState.status === "new"); - const ageRestrictionOptions = amountHook.response. - ageRestrictionOptions?. - reduce((p, c) => ({ ...p, [c]: `under ${c}` }), {} as Record) + const ageRestrictionOptions = + amountHook.response.ageRestrictionOptions?.reduce( + (p, c) => ({ ...p, [c]: `under ${c}` }), + {} as Record, + ); - const ageRestrictionEnabled = ageRestrictionOptions !== undefined + const ageRestrictionEnabled = ageRestrictionOptions !== undefined; if (ageRestrictionEnabled) { ageRestrictionOptions["0"] = "Not restricted"; } //TODO: calculate based on exchange info - const ageRestriction = ageRestrictionEnabled ? { - list: ageRestrictionOptions, - value: String(ageRestricted), - onChange: async (v: string) => setAgeRestricted(parseInt(v, 10)), - } : undefined; + const ageRestriction = ageRestrictionEnabled + ? { + list: ageRestrictionOptions, + value: String(ageRestricted), + onChange: async (v: string) => setAgeRestricted(parseInt(v, 10)), + } + : undefined; return { status: "success", @@ -422,14 +441,13 @@ export function useComponentStateFromURI( tosProps: !termsState ? undefined : { - onAccept, - onReview: setReviewing, - reviewed: reviewed, - reviewing: reviewing, - terms: termsState, - }, + onAccept, + onReview: setReviewing, + reviewed: reviewed, + reviewing: reviewing, + terms: termsState, + }, mustAcceptFirst, cancel, }; } - diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts index be580f6d0..3a49f2a71 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts @@ -62,13 +62,21 @@ describe("Withdraw CTA states", () => { it("should tell the user that the URI is missing", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentStateFromURI({ talerWithdrawUri: undefined, cancel: async () => { null } }, { - listExchanges: async () => ({ exchanges }), - getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ - amount: "ARS:2", - possibleExchanges: exchanges, - }), - } as any), + useComponentStateFromURI( + { + talerWithdrawUri: undefined, + cancel: async () => { + null; + }, + }, + { + listExchanges: async () => ({ exchanges }), + getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ + amount: "ARS:2", + possibleExchanges: exchanges, + }), + } as any, + ), ); { @@ -94,13 +102,21 @@ describe("Withdraw CTA states", () => { it("should tell the user that there is not known exchange", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentStateFromURI({ talerWithdrawUri: "taler-withdraw://", cancel: async () => { null } }, { - listExchanges: async () => ({ exchanges }), - getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ - amount: "EUR:2", - possibleExchanges: [], - }), - } as any), + useComponentStateFromURI( + { + talerWithdrawUri: "taler-withdraw://", + cancel: async () => { + null; + }, + }, + { + listExchanges: async () => ({ exchanges }), + getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ + amount: "EUR:2", + possibleExchanges: [], + }), + } as any, + ), ); { @@ -128,26 +144,34 @@ describe("Withdraw CTA states", () => { it("should be able to withdraw if tos are ok", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentStateFromURI({ talerWithdrawUri: "taler-withdraw://", cancel: async () => { null } }, { - listExchanges: async () => ({ exchanges }), - getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ - amount: "ARS:2", - possibleExchanges: exchanges, - defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl - }), - getExchangeWithdrawalInfo: - async (): Promise => - ({ - withdrawalAmountRaw: "ARS:2", - withdrawalAmountEffective: "ARS:2", - } as any), - getExchangeTos: async (): Promise => ({ - contentType: "text", - content: "just accept", - acceptedEtag: "v1", - currentEtag: "v1", - }), - } as any), + useComponentStateFromURI( + { + talerWithdrawUri: "taler-withdraw://", + cancel: async () => { + null; + }, + }, + { + listExchanges: async () => ({ exchanges }), + getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ + amount: "ARS:2", + possibleExchanges: exchanges, + defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl, + }), + getExchangeWithdrawalInfo: + async (): Promise => + ({ + withdrawalAmountRaw: "ARS:2", + withdrawalAmountEffective: "ARS:2", + } as any), + getExchangeTos: async (): Promise => ({ + contentType: "text", + content: "just accept", + acceptedEtag: "v1", + currentEtag: "v1", + }), + } as any, + ), ); { @@ -194,27 +218,35 @@ describe("Withdraw CTA states", () => { it("should be accept the tos before withdraw", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentStateFromURI({ talerWithdrawUri: "taler-withdraw://", cancel: async () => { null } }, { - listExchanges: async () => ({ exchanges }), - getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ - amount: "ARS:2", - possibleExchanges: exchanges, - defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl - }), - getExchangeWithdrawalInfo: - async (): Promise => - ({ - withdrawalAmountRaw: "ARS:2", - withdrawalAmountEffective: "ARS:2", - } as any), - getExchangeTos: async (): Promise => ({ - contentType: "text", - content: "just accept", - acceptedEtag: "v1", - currentEtag: "v2", - }), - setExchangeTosAccepted: async () => ({}), - } as any), + useComponentStateFromURI( + { + talerWithdrawUri: "taler-withdraw://", + cancel: async () => { + null; + }, + }, + { + listExchanges: async () => ({ exchanges }), + getWithdrawalDetailsForUri: async ({ talerWithdrawUri }: any) => ({ + amount: "ARS:2", + possibleExchanges: exchanges, + defaultExchangeBaseUrl: exchanges[0].exchangeBaseUrl, + }), + getExchangeWithdrawalInfo: + async (): Promise => + ({ + withdrawalAmountRaw: "ARS:2", + withdrawalAmountEffective: "ARS:2", + } as any), + getExchangeTos: async (): Promise => ({ + contentType: "text", + content: "just accept", + acceptedEtag: "v1", + currentEtag: "v2", + }), + setExchangeTosAccepted: async () => ({}), + } as any, + ), ); { -- cgit v1.2.3