diff options
author | Sebastian <sebasjm@gmail.com> | 2022-09-09 12:22:26 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-09-09 12:22:57 -0300 |
commit | dda90b51f6fc6fca48a68bc53088e1ed3f018a21 (patch) | |
tree | 4b94b9496f19f25321923cafe241663b363258c2 /packages/taler-wallet-webextension/src/cta/Withdraw | |
parent | 9b2d6d766f0192923d337ab8c69a332ebdc20bf1 (diff) | |
download | wallet-core-dda90b51f6fc6fca48a68bc53088e1ed3f018a21.tar.xz |
find taler action in clipboard and withdraw with mobile
Diffstat (limited to 'packages/taler-wallet-webextension/src/cta/Withdraw')
3 files changed, 69 insertions, 27 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts index 7425dbd29..7bd667268 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts @@ -85,6 +85,7 @@ export namespace State { ageRestriction?: SelectFieldHandler; + talerWithdrawUri?: string; cancel: () => Promise<void>; }; } diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts index 015c9aaca..0d2e150e7 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts @@ -410,6 +410,7 @@ export function useComponentStateFromURI( toBeReceived, withdrawalFee, chosenAmount, + talerWithdrawUri, ageRestriction, doWithdrawal: { onClick: diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx index 850bd6e8f..440586343 100644 --- a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx @@ -23,6 +23,7 @@ import { SelectList } from "../../components/SelectList.js"; import { Input, Link, + LinkSuccess, SubTitle, SuccessBox, SvgIcon, @@ -35,6 +36,8 @@ import { TermsOfServiceSection } from "../TermsOfServiceSection.js"; import { State } from "./index.js"; import editIcon from "../../svg/edit_24px.svg"; import { Amount } from "../../components/Amount.js"; +import { QR } from "../../components/QR.js"; +import { useState } from "preact/hooks"; export function LoadingUriView({ error }: State.LoadingUriError): VNode { const { i18n } = useTranslationContext(); @@ -126,13 +129,13 @@ export function SuccessView(state: State.Success): VNode { }} > <i18n.Translate>Exchange</i18n.Translate> - <Link> + {/* <Link> <SvgIcon title="Edit" dangerouslySetInnerHTML={{ __html: editIcon }} color="black" /> - </Link> + </Link> */} </div> } text={<ExchangeDetails exchange={state.exchangeUrl} />} @@ -164,31 +167,36 @@ export function SuccessView(state: State.Success): VNode { </section> {state.tosProps && <TermsOfServiceSection {...state.tosProps} />} {state.tosProps ? ( - <section> - {(state.tosProps.terms.status === "accepted" || - (state.mustAcceptFirst && state.tosProps.reviewed)) && ( - <Button - variant="contained" - color="success" - disabled={!state.doWithdrawal.onClick} - onClick={state.doWithdrawal.onClick} - > - <i18n.Translate> - Withdraw <Amount value={state.toBeReceived} /> - </i18n.Translate> - </Button> - )} - {state.tosProps.terms.status === "notfound" && ( - <Button - variant="contained" - color="warning" - disabled={!state.doWithdrawal.onClick} - onClick={state.doWithdrawal.onClick} - > - <i18n.Translate>Withdraw anyway</i18n.Translate> - </Button> - )} - </section> + <Fragment> + <section> + {(state.tosProps.terms.status === "accepted" || + (state.mustAcceptFirst && state.tosProps.reviewed)) && ( + <Button + variant="contained" + color="success" + disabled={!state.doWithdrawal.onClick} + onClick={state.doWithdrawal.onClick} + > + <i18n.Translate> + Withdraw <Amount value={state.toBeReceived} /> + </i18n.Translate> + </Button> + )} + {state.tosProps.terms.status === "notfound" && ( + <Button + variant="contained" + color="warning" + disabled={!state.doWithdrawal.onClick} + onClick={state.doWithdrawal.onClick} + > + <i18n.Translate>Withdraw anyway</i18n.Translate> + </Button> + )} + </section> + {state.talerWithdrawUri ? ( + <WithdrawWithMobile talerWithdrawUri={state.talerWithdrawUri} /> + ) : undefined} + </Fragment> ) : ( <section> <i18n.Translate>Loading terms of service...</i18n.Translate> @@ -202,3 +210,35 @@ export function SuccessView(state: State.Success): VNode { </WalletAction> ); } + +function WithdrawWithMobile({ + talerWithdrawUri, +}: { + talerWithdrawUri: string; +}): VNode { + const { i18n } = useTranslationContext(); + const [showQR, setShowQR] = useState<boolean>(false); + + return ( + <section> + <LinkSuccess upperCased onClick={() => setShowQR((qr) => !qr)}> + {!showQR ? ( + <i18n.Translate>Withdraw to a mobile phone</i18n.Translate> + ) : ( + <i18n.Translate>Hide QR</i18n.Translate> + )} + </LinkSuccess> + {showQR && ( + <div> + <QR text={talerWithdrawUri} /> + <i18n.Translate> + Scan the QR code or + <a href={talerWithdrawUri}> + <i18n.Translate>click here</i18n.Translate> + </a> + </i18n.Translate> + </div> + )} + </section> + ); +} |