diff options
author | Sebastian <sebasjm@gmail.com> | 2022-08-10 11:50:46 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-08-10 11:50:46 -0300 |
commit | dce055d0d3fe2037d4c3018baa360b9082e37194 (patch) | |
tree | fd8daa463459b4daa78fe41bb5262d302d03ff7a /packages/taler-wallet-webextension/src/cta/Tip | |
parent | 7a600514c6d43bbaeba6b962533415e59fc46057 (diff) | |
download | wallet-core-dce055d0d3fe2037d4c3018baa360b9082e37194.tar.xz |
withdraw call to action
Diffstat (limited to 'packages/taler-wallet-webextension/src/cta/Tip')
5 files changed, 25 insertions, 28 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Tip/index.ts b/packages/taler-wallet-webextension/src/cta/Tip/index.ts index 24a7b1cff..b174d5160 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/index.ts @@ -30,6 +30,7 @@ import { AcceptedView, IgnoredView, LoadingUriView, ReadyView } from "./views.js export interface Props { talerTipUri?: string; + cancel: () => Promise<void>; } export type State = @@ -69,7 +70,7 @@ export namespace State { export interface Ready extends BaseInfo { status: "ready"; accept: ButtonHandler; - ignore: ButtonHandler; + cancel: () => Promise<void>; } } diff --git a/packages/taler-wallet-webextension/src/cta/Tip/state.ts b/packages/taler-wallet-webextension/src/cta/Tip/state.ts index e5511074e..f18911f65 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/state.ts @@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { talerTipUri }: Props, + { talerTipUri, cancel }: Props, api: typeof wxApi, ): State { const [tipIgnored, setTipIgnored] = useState(false); @@ -53,10 +53,6 @@ export function useComponentState( tipInfo.retry(); }; - const doIgnore = async (): Promise<void> => { - setTipIgnored(true); - }; - const baseInfo = { merchantBaseUrl: tip.merchantBaseUrl, exchangeBaseUrl: tip.exchangeBaseUrl, @@ -84,9 +80,7 @@ export function useComponentState( accept: { onClick: doAccept, }, - ignore: { - onClick: doIgnore, - }, + cancel, }; } diff --git a/packages/taler-wallet-webextension/src/cta/Tip/stories.tsx b/packages/taler-wallet-webextension/src/cta/Tip/stories.tsx index 8c72a8812..efb9424d1 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/Tip/stories.tsx @@ -42,5 +42,4 @@ export const Ready = createExample(ReadyView, { merchantBaseUrl: "http://merchant.url/", exchangeBaseUrl: "http://exchange.url/", accept: {}, - ignore: {}, }); diff --git a/packages/taler-wallet-webextension/src/cta/Tip/test.ts b/packages/taler-wallet-webextension/src/cta/Tip/test.ts index 1c7d363f4..363652e47 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/test.ts @@ -30,7 +30,7 @@ describe("Tip CTA states", () => { it("should tell the user that the URI is missing", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: undefined }, { + useComponentState({ talerTipUri: undefined, cancel: async () => { null } }, { prepareTip: async () => ({}), acceptTip: async () => ({}), } as any), @@ -62,7 +62,7 @@ describe("Tip CTA states", () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd" }, { + useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { prepareTip: async () => ({ accepted: tipAccepted, @@ -114,7 +114,7 @@ describe("Tip CTA states", () => { it("should be ignored after clicking the ignore button", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd" }, { + useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { prepareTip: async () => ({ exchangeBaseUrl: "exchange url", @@ -142,25 +142,25 @@ describe("Tip CTA states", () => { expect(state.amount).deep.eq(Amounts.parseOrThrow("EUR:1")); expect(state.merchantBaseUrl).eq("merchant url"); expect(state.exchangeBaseUrl).eq("exchange url"); - if (state.ignore.onClick === undefined) expect.fail(); + // if (state.ignore.onClick === undefined) expect.fail(); - state.ignore.onClick(); + // state.ignore.onClick(); } - await waitNextUpdate(); - { - const state = getLastResultOrThrow(); + // await waitNextUpdate(); + // { + // const state = getLastResultOrThrow(); - if (state.status !== "ignored") expect.fail(); - if (state.error) expect.fail(); - } + // if (state.status !== "ignored") expect.fail(); + // if (state.error) expect.fail(); + // } await assertNoPendingUpdate(); }); it("should render accepted if the tip has been used previously", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd" }, { + useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { prepareTip: async () => ({ accepted: true, diff --git a/packages/taler-wallet-webextension/src/cta/Tip/views.tsx b/packages/taler-wallet-webextension/src/cta/Tip/views.tsx index 442d41d28..2df55f8fd 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/Tip/views.tsx @@ -19,7 +19,7 @@ import { Amount } from "../../components/Amount.js"; import { LoadingError } from "../../components/LoadingError.js"; import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; -import { SubTitle, WalletAction } from "../../components/styled/index.js"; +import { Link, SubTitle, WalletAction } from "../../components/styled/index.js"; import { useTranslationContext } from "../../context/translation.js"; import { Button } from "../../mui/Button.js"; import { State } from "./index.js"; @@ -69,7 +69,6 @@ export function ReadyView(state: State.Ready): VNode { title={<i18n.Translate>Amount</i18n.Translate>} text={<Amount value={state.amount} />} kind="positive" - big /> <Part title={<i18n.Translate>Merchant URL</i18n.Translate>} @@ -88,12 +87,16 @@ export function ReadyView(state: State.Ready): VNode { color="success" onClick={state.accept.onClick} > - <i18n.Translate>Accept tip</i18n.Translate> - </Button> - <Button onClick={state.ignore.onClick}> - <i18n.Translate>Ignore</i18n.Translate> + <i18n.Translate> + Receive {<Amount value={state.amount} />} + </i18n.Translate> </Button> </section> + <section> + <Link upperCased onClick={state.cancel}> + <i18n.Translate>Cancel</i18n.Translate> + </Link> + </section> </WalletAction> ); } |