diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/popup')
4 files changed, 130 insertions, 63 deletions
diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx index 3ca5b3a02..f81929b21 100644 --- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx +++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx @@ -14,7 +14,7 @@ TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { Amounts, Balance } from "@gnu-taler/taler-util"; +import { Amounts, Balance, Translate } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { useState } from "preact/hooks"; import { BalanceTable } from "../components/BalanceTable"; @@ -47,7 +47,12 @@ export function BalancePage({ } if (state.hasError) { - return <LoadingError title="Could not load balance page" error={state} />; + return ( + <LoadingError + title={<Translate>Could not load balance page</Translate>} + error={state} + /> + ); } if (addingAction) { @@ -99,17 +104,19 @@ export function BalanceView({ </section> <footer style={{ justifyContent: "space-between" }}> <ButtonPrimary onClick={goToWalletManualWithdraw}> - Withdraw + <Translate>Withdraw</Translate> </ButtonPrimary> {currencyWithNonZeroAmount.length > 0 && ( <MultiActionButton - label={(s) => `Deposit ${s}`} + label={(s) => <Translate>Deposit {s}</Translate>} actions={currencyWithNonZeroAmount} onClick={(c) => goToWalletDeposit(c)} /> )} <JustInDevMode> - <ButtonBoxPrimary onClick={goToAddAction}>enter uri</ButtonBoxPrimary> + <ButtonBoxPrimary onClick={goToAddAction}> + <Translate>Enter URI</Translate> + </ButtonBoxPrimary> </JustInDevMode> </footer> </Fragment> diff --git a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx index 3326be8df..b3da48a93 100644 --- a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx +++ b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx @@ -20,6 +20,8 @@ import { CoinDumpJson, ExchangeListItem, NotificationType, + Translate, + i18n, } from "@gnu-taler/taler-util"; import { PendingTaskInfo } from "@gnu-taler/taler-wallet-core"; import { format } from "date-fns"; @@ -31,7 +33,6 @@ import { Time } from "../components/Time"; import { useAsyncAsHook } from "../hooks/useAsyncAsHook"; import { useDiagnostics } from "../hooks/useDiagnostics"; import * as wxApi from "../wxApi"; -import BalanceStories from "./Balance.stories"; export function DeveloperPage(): VNode { const [status, timedOut] = useDiagnostics(); @@ -149,10 +150,16 @@ export function View({ return ( <div> - <p>Debug tools:</p> - <button onClick={confirmReset}>reset</button> + <p> + <Translate>Debug tools</Translate>: + </p> + <button onClick={confirmReset}> + <Translate>reset</Translate> + </button> <br /> - <button onClick={() => fileRef?.current?.click()}>import database</button> + <button onClick={() => fileRef?.current?.click()}> + <Translate>import database</Translate> + </button> <input ref={fileRef} style={{ display: "none" }} @@ -171,31 +178,36 @@ export function View({ }} /> <br /> - <button onClick={onExportDatabase}>export database</button> + <button onClick={onExportDatabase}> + <Translate>export database</Translate> + </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,${toBase64( - downloadedDatabase.content, - )}`} - download={`taler-wallet-database-${format( - downloadedDatabase.time, - "yyyy/MM/dd_HH:mm", - )}.json`} - > - {" "} - click here{" "} - </a> - to download + <Translate> + 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`} + > + <Translate>click here</Translate> + </a> + to download + </Translate> </div> )} <br /> - <p>Coins:</p> + <p> + <Translate>Coins</Translate>: + </p> {Object.keys(money_by_exchange).map((ex) => { const allcoins = money_by_exchange[ex]; allcoins.sort((a, b) => { @@ -220,7 +232,9 @@ export function View({ <Diagnostics diagnostics={status} timedOut={timedOut} /> {operations && operations.length > 0 && ( <Fragment> - <p>Pending operations</p> + <p> + <Translate>Pending operations</Translate> + </p> <dl> {operations.reverse().map((o) => { return ( @@ -257,18 +271,30 @@ function ShowAllCoins({ <b>{ex}</b>: {total} {currencies[ex]} </p> <p> - <b>usable coins</b> + <b> + <Translate>usable coins</Translate> + </b> </p> {collapsedUnspent ? ( <div onClick={() => setCollapsedUnspent(false)}>click to show</div> ) : ( <table onClick={() => setCollapsedUnspent(true)}> <tr> - <td>id</td> - <td>denom</td> - <td>value</td> - <td>status</td> - <td>from refresh?</td> + <td> + <Translate>id</Translate> + </td> + <td> + <Translate>denom</Translate> + </td> + <td> + <Translate>value</Translate> + </td> + <td> + <Translate>status</Translate> + </td> + <td> + <Translate>from refresh?</Translate> + </td> </tr> {coins.usable.map((c) => { return ( @@ -283,17 +309,31 @@ function ShowAllCoins({ })} </table> )} - <p>spent coins</p> + <p> + <Translate>spent coins</Translate> + </p> {collapsedSpent ? ( - <div onClick={() => setCollapsedSpent(false)}>click to show</div> + <div onClick={() => setCollapsedSpent(false)}> + <Translate>click to show</Translate> + </div> ) : ( <table onClick={() => setCollapsedSpent(true)}> <tr> - <td>id</td> - <td>denom</td> - <td>value</td> - <td>status</td> - <td>refresh?</td> + <td> + <Translate>id</Translate> + </td> + <td> + <Translate>denom</Translate> + </td> + <td> + <Translate>value</Translate> + </td> + <td> + <Translate>status</Translate> + </td> + <td> + <Translate>from refresh?</Translate> + </td> </tr> {coins.spent.map((c) => { return ( @@ -335,8 +375,7 @@ function runIntegrationTest() {} export async function confirmReset(): Promise<void> { if ( confirm( - "Do you want to IRREVOCABLY DESTROY everything inside your" + - " wallet and LOSE ALL YOUR COINS?", + i18n.str`Do you want to IRREVOCABLY DESTROY everything inside your wallet and LOSE ALL YOUR COINS?`, ) ) { await wxApi.resetDb(); diff --git a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx index baff0aadf..6e2bf1e63 100644 --- a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx +++ b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx @@ -1,4 +1,4 @@ -import { i18n } from "@gnu-taler/taler-util"; +import { Translate } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; import { ButtonBoxWarning, WarningBox } from "../components/styled"; @@ -11,16 +11,16 @@ export function NoBalanceHelp({ <WarningBox> <p> <b> - <i18n.Translate>You have no balance to show.</i18n.Translate> + <Translate>You have no balance to show.</Translate> </b> <br /> - <i18n.Translate> + <Translate> To withdraw money you can start from your bank site or click the "withdraw" button to use a known exchange. - </i18n.Translate> + </Translate> </p> <ButtonBoxWarning onClick={() => goToWalletManualWithdraw()}> - Withdraw + <Translate>Withdraw</Translate> </ButtonBoxWarning> </WarningBox> ); diff --git a/packages/taler-wallet-webextension/src/popup/TalerActionFound.tsx b/packages/taler-wallet-webextension/src/popup/TalerActionFound.tsx index 5de457614..a69352c9f 100644 --- a/packages/taler-wallet-webextension/src/popup/TalerActionFound.tsx +++ b/packages/taler-wallet-webextension/src/popup/TalerActionFound.tsx @@ -19,7 +19,11 @@ * @author Sebastian Javier Marchano (sebasjm) */ -import { classifyTalerUri, TalerUriType } from "@gnu-taler/taler-util"; +import { + classifyTalerUri, + TalerUriType, + Translate, +} from "@gnu-taler/taler-util"; import { Fragment, h } from "preact"; import { ButtonPrimary, ButtonSuccess } from "../components/styled"; import { actionForTalerUri } from "../utils/index"; @@ -52,46 +56,56 @@ export function TalerActionFound({ url, onDismiss }: Props) { return ( <Fragment> <section> - <h1>Taler Action </h1> + <h1> + <Translate>Taler Action</Translate> + </h1> {uriType === TalerUriType.TalerPay && ( <div> - <p>This page has pay action.</p> + <p> + <Translate>This page has pay action.</Translate> + </p> <ButtonSuccess onClick={() => { navigateTo(actionForTalerUri(uriType, url)); }} > - Open pay page + <Translate>Open pay page</Translate> </ButtonSuccess> </div> )} {uriType === TalerUriType.TalerWithdraw && ( <div> - <p>This page has a withdrawal action.</p> + <p> + <Translate>This page has a withdrawal action.</Translate> + </p> <ButtonSuccess onClick={() => { navigateTo(actionForTalerUri(uriType, url)); }} > - Open withdraw page + <Translate>Open withdraw page</Translate> </ButtonSuccess> </div> )} {uriType === TalerUriType.TalerTip && ( <div> - <p>This page has a tip action.</p> + <p> + <Translate>This page has a tip action.</Translate> + </p> <ButtonSuccess onClick={() => { navigateTo(actionForTalerUri(uriType, url)); }} > - Open tip page + <Translate>Open tip page</Translate> </ButtonSuccess> </div> )} {uriType === TalerUriType.TalerNotifyReserve && ( <div> - <p>This page has a notify reserve action.</p> + <p> + <Translate>This page has a notify reserve action.</Translate> + </p> <ButtonSuccess onClick={() => { navigateTo(actionForTalerUri(uriType, url)); @@ -103,26 +117,33 @@ export function TalerActionFound({ url, onDismiss }: Props) { )} {uriType === TalerUriType.TalerRefund && ( <div> - <p>This page has a refund action.</p> + <p> + <Translate>This page has a refund action.</Translate> + </p> <ButtonSuccess onClick={() => { navigateTo(actionForTalerUri(uriType, url)); }} > - Open refund page + <Translate>Open refund page</Translate> </ButtonSuccess> </div> )} {uriType === TalerUriType.Unknown && ( <div> - <p>This page has a malformed taler uri.</p> + <p> + <Translate>This page has a malformed taler uri.</Translate> + </p> <p>{url}</p> </div> )} </section> <footer> <div /> - <ButtonPrimary onClick={() => onDismiss()}> Dismiss </ButtonPrimary> + <ButtonPrimary onClick={() => onDismiss()}> + {" "} + <Translate>Dismiss</Translate>{" "} + </ButtonPrimary> </footer> </Fragment> ); |