diff options
author | Sebastian <sebasjm@gmail.com> | 2021-12-23 15:17:36 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-12-23 15:17:36 -0300 |
commit | 2e71117f59e0ae6106930e705ae6a54a9839281b (patch) | |
tree | a39856486a2801f56c65de245c871ce596f8ab16 /packages/taler-wallet-webextension/src/popup | |
parent | b8200de6f6c5ab9be3ff9f556c8acda013e574c3 (diff) | |
download | wallet-core-2e71117f59e0ae6106930e705ae6a54a9839281b.tar.xz |
deposit from wallet webex: wip
Diffstat (limited to 'packages/taler-wallet-webextension/src/popup')
-rw-r--r-- | packages/taler-wallet-webextension/src/popup/BalancePage.tsx | 24 | ||||
-rw-r--r-- | packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx | 68 |
2 files changed, 69 insertions, 23 deletions
diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx index 33164783d..40499b87c 100644 --- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx +++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx @@ -21,18 +21,21 @@ import { ButtonPrimary, ErrorBox } from "../components/styled/index"; import { HookResponse, useAsyncAsHook } from "../hooks/useAsyncAsHook"; import { PageLink } from "../renderHtml"; import * as wxApi from "../wxApi"; - +interface Props { + goToWalletDeposit: (currency: string) => void; + goToWalletManualWithdraw: () => void; +} export function BalancePage({ goToWalletManualWithdraw, -}: { - goToWalletManualWithdraw: () => void; -}): VNode { + goToWalletDeposit, +}: Props): VNode { const state = useAsyncAsHook(wxApi.getBalance); return ( <BalanceView balance={state} Linker={PageLink} goToWalletManualWithdraw={goToWalletManualWithdraw} + goToWalletDeposit={goToWalletDeposit} /> ); } @@ -40,12 +43,14 @@ export interface BalanceViewProps { balance: HookResponse<BalancesResponse>; Linker: typeof PageLink; goToWalletManualWithdraw: () => void; + goToWalletDeposit: (currency: string) => void; } export function BalanceView({ balance, Linker, goToWalletManualWithdraw, + goToWalletDeposit, }: BalanceViewProps): VNode { if (!balance) { return <div>Loading...</div>; @@ -71,7 +76,8 @@ export function BalanceView({ <Linker pageName="/welcome">help</Linker> getting started? </i18n.Translate> </p> - <footer style={{ justifyContent: "space-around" }}> + <footer style={{ justifyContent: "space-between" }}> + <div /> <ButtonPrimary onClick={goToWalletManualWithdraw}> Withdraw </ButtonPrimary> @@ -83,9 +89,13 @@ export function BalanceView({ return ( <Fragment> <section> - <BalanceTable balances={balance.response.balances} /> + <BalanceTable + balances={balance.response.balances} + goToWalletDeposit={goToWalletDeposit} + /> </section> - <footer style={{ justifyContent: "space-around" }}> + <footer style={{ justifyContent: "space-between" }}> + <div /> <ButtonPrimary onClick={goToWalletManualWithdraw}> Withdraw </ButtonPrimary> diff --git a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx index b32555248..b689004cc 100644 --- a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx +++ b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx @@ -43,14 +43,17 @@ export function DeveloperPage(): VNode { ? [] : operationsResponse.response.pendingOperations; - return <View status={status} - timedOut={timedOut} - operations={operations} - onDownloadDatabase={async () => { - const db = await wxApi.exportDB() - return JSON.stringify(db) - }} - />; + return ( + <View + status={status} + timedOut={timedOut} + operations={operations} + onDownloadDatabase={async () => { + const db = await wxApi.exportDB(); + return JSON.stringify(db); + }} + /> + ); } export interface Props { @@ -64,14 +67,21 @@ function hashObjectId(o: any): string { return JSON.stringify(o); } -export function View({ status, timedOut, operations, onDownloadDatabase }: Props): VNode { - const [downloadedDatabase, setDownloadedDatabase] = useState<{time: Date; content: string}|undefined>(undefined) +export function View({ + status, + timedOut, + operations, + onDownloadDatabase, +}: Props): VNode { + const [downloadedDatabase, setDownloadedDatabase] = useState< + { time: Date; content: string } | undefined + >(undefined); async function onExportDatabase(): Promise<void> { - const content = await onDownloadDatabase() + const content = await onDownloadDatabase(); setDownloadedDatabase({ time: new Date(), - content - }) + content, + }); } return ( <div> @@ -83,9 +93,27 @@ export function View({ status, timedOut, operations, onDownloadDatabase }: Props <button onClick={confirmReset}>reset</button> <br /> <button onClick={onExportDatabase}>export database</button> - {downloadedDatabase && <div> - Database exported at <Time timestamp={{t_ms: downloadedDatabase.time.getTime()}} format="yyyy/MM/dd HH:mm:ss" /> <a href={`data:text/plain;charset=utf-8;base64,${btoa(downloadedDatabase.content)}`} download={`taler-wallet-database-${format(downloadedDatabase.time, 'yyyy/MM/dd_HH:mm')}.json`}>click here</a> to download - </div>} + {downloadedDatabase && ( + <div> + Database exported at + <Time + timestamp={{ t_ms: downloadedDatabase.time.getTime() }} + format="yyyy/MM/dd HH:mm:ss" + /> + <a + href={`data:text/plain;charset=utf-8;base64,${toBase64( + downloadedDatabase.content, + )}`} + download={`taler-wallet-database-${format( + downloadedDatabase.time, + "yyyy/MM/dd_HH:mm", + )}.json`} + > + click here + </a> + to download + </div> + )} <br /> <Diagnostics diagnostics={status} timedOut={timedOut} /> {operations && operations.length > 0 && ( @@ -109,6 +137,14 @@ export function View({ status, timedOut, operations, onDownloadDatabase }: Props ); } +function toBase64(str: string): string { + return btoa( + encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function (match, p1) { + return String.fromCharCode(parseInt(p1, 16)); + }), + ); +} + export function reload(): void { try { // eslint-disable-next-line no-undef |