diff options
author | Sebastian <sebasjm@gmail.com> | 2022-02-23 15:18:37 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-02-24 12:50:51 -0300 |
commit | 41850c9f14baa5330919c6dabf161b1aaeda7376 (patch) | |
tree | 678125e50206ca3f51a6051257a94644044f456a /packages/taler-wallet-webextension/src/components | |
parent | 7647d077e7d9a5581e3ce919da936bc5d22a4df2 (diff) | |
download | wallet-core-41850c9f14baa5330919c6dabf161b1aaeda7376.tar.xz |
add i18n where was missing
Diffstat (limited to 'packages/taler-wallet-webextension/src/components')
14 files changed, 77 insertions, 41 deletions
diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx index 71365e089..205413007 100644 --- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx +++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { PaytoUri } from "@gnu-taler/taler-util"; +import { PaytoUri, Translate } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { useEffect, useState } from "preact/hooks"; import { CopiedIcon, CopyIcon } from "../svg"; @@ -34,23 +34,23 @@ export function BankDetailsByPaytoType({ amount, }: BankDetailsProps): VNode { const firstPart = !payto ? undefined : !payto.isKnown ? ( - <Row name="Account" value={payto.targetPath} /> + <Row name={<Translate>Account</Translate>} value={payto.targetPath} /> ) : payto.targetType === "x-taler-bank" ? ( <Fragment> - <Row name="Bank host" value={payto.host} /> - <Row name="Bank account" value={payto.account} /> + <Row name={<Translate>Bank host</Translate>} value={payto.host} /> + <Row name={<Translate>Bank account</Translate>} value={payto.account} /> </Fragment> ) : payto.targetType === "iban" ? ( - <Row name="IBAN" value={payto.iban} /> + <Row name={<Translate>IBAN</Translate>} value={payto.iban} /> ) : undefined; return ( <div style={{ textAlign: "left" }}> <p>Bank transfer details</p> <table> {firstPart} - <Row name="Exchange" value={exchangeBaseUrl} /> - <Row name="Chosen amount" value={amount} /> - <Row name="Subject" value={subject} literal /> + <Row name={<Translate>Exchange</Translate>} value={exchangeBaseUrl} /> + <Row name={<Translate>Chosen amount</Translate>} value={amount} /> + <Row name={<Translate>Subject</Translate>} value={subject} literal /> </table> </div> ); @@ -61,7 +61,7 @@ function Row({ value, literal, }: { - name: string; + name: VNode; value: string; literal?: boolean; }): VNode { diff --git a/packages/taler-wallet-webextension/src/components/Checkbox.tsx b/packages/taler-wallet-webextension/src/components/Checkbox.tsx index 59e84f4b0..0eb087b07 100644 --- a/packages/taler-wallet-webextension/src/components/Checkbox.tsx +++ b/packages/taler-wallet-webextension/src/components/Checkbox.tsx @@ -19,9 +19,9 @@ import { h, VNode } from "preact"; interface Props { enabled: boolean; onToggle: () => void; - label: string; + label: VNode; name: string; - description?: string; + description?: VNode; } export function Checkbox({ name, diff --git a/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx b/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx index 16909d29a..de7fb5e6c 100644 --- a/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx +++ b/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx @@ -20,7 +20,7 @@ import { h, VNode } from "preact"; interface Props { enabled: boolean; onToggle: () => void; - label: string; + label: VNode; name: string; } diff --git a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx index b57075805..522fbce98 100644 --- a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx +++ b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx @@ -14,6 +14,7 @@ TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ +import { Translate } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; export function DebugCheckbox({ @@ -36,7 +37,7 @@ export function DebugCheckbox({ htmlFor="checkbox-perm" style={{ marginLeft: "0.5em", fontWeight: "bold" }} > - Automatically open wallet based on page content + <Translate>Automatically open wallet based on page content</Translate> </label> <span style={{ @@ -46,8 +47,12 @@ export function DebugCheckbox({ marginLeft: "2em", }} > - (Enabling this option below will make using the wallet faster, but - requires more permissions from your browser.) + ( + <Translate> + Enabling this option below will make using the wallet faster, but + requires more permissions from your browser. + </Translate> + ) </span> </div> ); diff --git a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx index d368a10bf..04b6abb55 100644 --- a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx +++ b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { WalletDiagnostics } from "@gnu-taler/taler-util"; +import { Translate, WalletDiagnostics } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { PageLink } from "../renderHtml"; @@ -25,7 +25,13 @@ interface Props { export function Diagnostics({ timedOut, diagnostics }: Props): VNode { if (timedOut) { - return <p>Diagnostics timed out. Could not talk to the wallet backend.</p>; + return ( + <p> + <Translate> + Diagnostics timed out. Could not talk to the wallet backend. + </Translate> + </p> + ); } if (diagnostics) { @@ -41,7 +47,9 @@ export function Diagnostics({ timedOut, diagnostics }: Props): VNode { paddingBottom: "0.2em", }} > - <p>Problems detected:</p> + <p> + <Translate>Problems detected:</Translate> + </p> <ol> {diagnostics.errors.map((errMsg) => ( <li key={errMsg}>{errMsg}</li> @@ -49,22 +57,32 @@ export function Diagnostics({ timedOut, diagnostics }: Props): VNode { </ol> {diagnostics.firefoxIdbProblem ? ( <p> - Please check in your <code>about:config</code> settings that you - have IndexedDB enabled (check the preference name{" "} - <code>dom.indexedDB.enabled</code>). + <Translate> + Please check in your <code>about:config</code> settings that you + have IndexedDB enabled (check the preference name{" "} + <code>dom.indexedDB.enabled</code>). + </Translate> </p> ) : null} {diagnostics.dbOutdated ? ( <p> - Your wallet database is outdated. Currently automatic migration is - not supported. Please go{" "} - <PageLink pageName="/reset-required">here</PageLink> to reset the - wallet database. + <Translate> + Your wallet database is outdated. Currently automatic migration is + not supported. Please go{" "} + <PageLink pageName="/reset-required"> + <Translate>here</Translate> + </PageLink>{" "} + to reset the wallet database. + </Translate> </p> ) : null} </div> ); } - return <p>Running diagnostics ...</p>; + return ( + <p> + <Translate>Running diagnostics</Translate> ... + </p> + ); } diff --git a/packages/taler-wallet-webextension/src/components/EditableText.tsx b/packages/taler-wallet-webextension/src/components/EditableText.tsx index 72bfbe809..c5d6e397e 100644 --- a/packages/taler-wallet-webextension/src/components/EditableText.tsx +++ b/packages/taler-wallet-webextension/src/components/EditableText.tsx @@ -14,6 +14,7 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ +import { Translate } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; import { useRef, useState } from "preact/hooks"; @@ -39,7 +40,9 @@ export function EditableText({ return ( <div style={{ display: "flex", justifyContent: "space-between" }}> <p>{value}</p> - <button onClick={() => setEditing(true)}>edit</button> + <button onClick={() => setEditing(true)}> + <Translate>Edit</Translate> + </button> </div> ); }; @@ -54,7 +57,7 @@ export function EditableText({ onChange(ref.current.value).then(() => setEditing(false)); }} > - confirm + <Translate>Confirm</Translate> </button> </div> ); diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx index 21f10eeef..085bf0b82 100644 --- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx +++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx @@ -13,7 +13,7 @@ You should have received a copy of the GNU General Public License along with GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { VNode, h } from "preact"; +import { VNode, h, ComponentChildren } from "preact"; import { useState } from "preact/hooks"; import arrowDown from "../../static/img/chevron-down.svg"; import { ErrorBox } from "./styled"; @@ -22,11 +22,10 @@ export function ErrorMessage({ title, description, }: { - title?: string | VNode; + title: VNode; description?: string; }): VNode | null { const [showErrorDetail, setShowErrorDetail] = useState(false); - if (!title) return null; return ( <ErrorBox style={{ paddingTop: 0, paddingBottom: 0 }}> <div> diff --git a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx index a7b66ea3d..4852a71b1 100644 --- a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx +++ b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx @@ -24,7 +24,7 @@ export function ErrorTalerOperation({ title, error, }: { - title?: string; + title?: VNode; error?: TalerErrorDetails; }): VNode | null { const { devMode } = useDevContext(); diff --git a/packages/taler-wallet-webextension/src/components/Loading.tsx b/packages/taler-wallet-webextension/src/components/Loading.tsx index 34edac551..ff6d21376 100644 --- a/packages/taler-wallet-webextension/src/components/Loading.tsx +++ b/packages/taler-wallet-webextension/src/components/Loading.tsx @@ -13,8 +13,13 @@ You should have received a copy of the GNU General Public License along with TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ +import { Translate } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; export function Loading(): VNode { - return <div>Loading...</div>; + return ( + <div> + <Translate>Loading</Translate>... + </div> + ); } diff --git a/packages/taler-wallet-webextension/src/components/LoadingError.tsx b/packages/taler-wallet-webextension/src/components/LoadingError.tsx index 6f572b882..ea0ff40d6 100644 --- a/packages/taler-wallet-webextension/src/components/LoadingError.tsx +++ b/packages/taler-wallet-webextension/src/components/LoadingError.tsx @@ -19,7 +19,7 @@ import { ErrorMessage } from "./ErrorMessage"; import { ErrorTalerOperation } from "./ErrorTalerOperation"; export interface Props { - title: string; + title: VNode; error: HookError; } export function LoadingError({ title, error }: Props): VNode { diff --git a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx index 977ac557d..1f46cf82c 100644 --- a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx +++ b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx @@ -4,7 +4,7 @@ import { ButtonBoxPrimary, ButtonPrimary, ParagraphClickable } from "./styled"; import { useState } from "preact/hooks"; export interface Props { - label: (s: string) => string; + label: (s: string) => VNode; actions: string[]; onClick: (s: string) => void; } diff --git a/packages/taler-wallet-webextension/src/components/Part.tsx b/packages/taler-wallet-webextension/src/components/Part.tsx index c8ecb46d2..05da90b2d 100644 --- a/packages/taler-wallet-webextension/src/components/Part.tsx +++ b/packages/taler-wallet-webextension/src/components/Part.tsx @@ -15,11 +15,11 @@ */ import { AmountLike } from "@gnu-taler/taler-util"; import { ExtraLargeText, LargeText, SmallLightText } from "./styled"; -import { h } from "preact"; +import { h, VNode } from "preact"; export type Kind = "positive" | "negative" | "neutral"; interface Props { - title: string; + title: VNode; text: AmountLike; kind: Kind; big?: boolean; diff --git a/packages/taler-wallet-webextension/src/components/SelectList.tsx b/packages/taler-wallet-webextension/src/components/SelectList.tsx index c17b87339..a5f182d77 100644 --- a/packages/taler-wallet-webextension/src/components/SelectList.tsx +++ b/packages/taler-wallet-webextension/src/components/SelectList.tsx @@ -14,13 +14,14 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ +import { Translate } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { NiceSelect } from "./styled"; interface Props { value?: string; onChange: (s: string) => void; - label: string; + label: VNode; list: { [label: string]: string; }; @@ -58,7 +59,7 @@ export function SelectList({ {value === undefined || (canBeNull && ( <option selected disabled> - Select one option + <Translate>Select one option</Translate> </option> // ) : ( // <option selected>{list[value]}</option> diff --git a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx index 89d6235aa..5c8897006 100644 --- a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx +++ b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx @@ -21,6 +21,7 @@ import { Timestamp, Transaction, TransactionType, + Translate, } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; import imageBank from "../../static/img/ri-bank-line.svg"; @@ -133,7 +134,7 @@ function TransactionLayout(props: TransactionLayoutProps): VNode { </LargeText> {props.pending && ( <LightText style={{ marginTop: 5, marginBottom: 5 }}> - Waiting for confirmation + <Translate>Waiting for confirmation</Translate> </LightText> )} <SmallLightText style={{ marginTop: 5 }}> @@ -195,7 +196,11 @@ function TransactionAmount(props: TransactionAmountProps): VNode { {sign} {Amounts.stringifyValue(props.amount)} </ExtraLargeText> - {props.pending && <div>PENDING</div>} + {props.pending && ( + <div> + <Translate>PENDING</Translate> + </div> + )} </Column> ); } |