summaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension/src/components
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2022-03-14 15:20:32 -0300
committerSebastian <sebasjm@gmail.com>2022-03-14 15:21:24 -0300
commit08959f83bc9f6d5df93cb6c2d34b671bf419d05a (patch)
tree1a366b05453de18b598c9a587caea7ba6d1c93e7 /packages/taler-wallet-webextension/src/components
parent1d7c8f7083f2aa98295f1ad28399c8e19a9e7754 (diff)
downloadwallet-core-08959f83bc9f6d5df93cb6c2d34b671bf419d05a.tar.gz
wallet-core-08959f83bc9f6d5df93cb6c2d34b671bf419d05a.tar.bz2
wallet-core-08959f83bc9f6d5df93cb6c2d34b671bf419d05a.zip
take translator from transaltion context
Diffstat (limited to 'packages/taler-wallet-webextension/src/components')
-rw-r--r--packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/components/Diagnostics.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/components/EditableText.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/Loading.tsx31
-rw-r--r--packages/taler-wallet-webextension/src/components/SelectList.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/TransactionItem.tsx11
7 files changed, 39 insertions, 19 deletions
diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
index 48360f7c7..f55f5c846 100644
--- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
+++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
@@ -17,7 +17,7 @@
import { PaytoUri } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks";
-import { useTranslationContext } from "../context/translation.js";
+import { useTranslationContext } from "../context/translation";
import { CopiedIcon, CopyIcon } from "../svg";
import { ButtonBox, TooltipRight } from "./styled";
diff --git a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
index b5ad7cda7..dc42b9ef7 100644
--- a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
+++ b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
@@ -14,8 +14,8 @@
TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { i18n } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
+import { useTranslationContext } from "../context/translation";
export function DebugCheckbox({
enabled,
@@ -24,6 +24,8 @@ export function DebugCheckbox({
enabled: boolean;
onToggle: () => void;
}): VNode {
+ const { i18n } = useTranslationContext();
+
return (
<div>
<input
diff --git a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
index b136ebc24..0998cab7b 100644
--- a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
+++ b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
@@ -14,8 +14,9 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { i18n, WalletDiagnostics } from "@gnu-taler/taler-util";
+import { WalletDiagnostics } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
+import { useTranslationContext } from "../context/translation";
import { PageLink } from "../renderHtml";
interface Props {
@@ -24,6 +25,7 @@ interface Props {
}
export function Diagnostics({ timedOut, diagnostics }: Props): VNode {
+ const { i18n } = useTranslationContext();
if (timedOut) {
return (
<p>
diff --git a/packages/taler-wallet-webextension/src/components/EditableText.tsx b/packages/taler-wallet-webextension/src/components/EditableText.tsx
index 8d45cae90..8f342ef28 100644
--- a/packages/taler-wallet-webextension/src/components/EditableText.tsx
+++ b/packages/taler-wallet-webextension/src/components/EditableText.tsx
@@ -14,9 +14,9 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { i18n } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
import { useRef, useState } from "preact/hooks";
+import { useTranslationContext } from "../context/translation";
interface Props {
value: string;
@@ -32,6 +32,7 @@ export function EditableText({
label,
description,
}: Props): VNode {
+ const { i18n } = useTranslationContext();
const [editing, setEditing] = useState(false);
const ref = useRef<HTMLInputElement>(null);
let InputText;
diff --git a/packages/taler-wallet-webextension/src/components/Loading.tsx b/packages/taler-wallet-webextension/src/components/Loading.tsx
index 7504034a0..d28953a10 100644
--- a/packages/taler-wallet-webextension/src/components/Loading.tsx
+++ b/packages/taler-wallet-webextension/src/components/Loading.tsx
@@ -13,13 +13,30 @@
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 { i18n } from "@gnu-taler/taler-util";
-import { h, VNode } from "preact";
+import { Fragment, h, VNode } from "preact";
+import { useEffect, useState } from "preact/hooks";
+import { useTranslationContext } from "../context/translation";
+import { CenteredText } from "./styled";
export function Loading(): VNode {
- return (
- <div>
- <i18n.Translate>Loading</i18n.Translate>...
- </div>
- );
+ const { i18n } = useTranslationContext();
+ const [tooLong, setTooLong] = useState(false);
+ useEffect(() => {
+ const id = setTimeout(() => {
+ setTooLong(true);
+ }, 500);
+ return () => {
+ clearTimeout(id);
+ };
+ });
+ if (tooLong) {
+ return (
+ <section style={{ margin: "auto" }}>
+ <CenteredText>
+ <i18n.Translate>Loading</i18n.Translate>...
+ </CenteredText>
+ </section>
+ );
+ }
+ return <Fragment />;
}
diff --git a/packages/taler-wallet-webextension/src/components/SelectList.tsx b/packages/taler-wallet-webextension/src/components/SelectList.tsx
index 676fd672f..122b473b1 100644
--- a/packages/taler-wallet-webextension/src/components/SelectList.tsx
+++ b/packages/taler-wallet-webextension/src/components/SelectList.tsx
@@ -14,8 +14,8 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { i18n } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
+import { useTranslationContext } from "../context/translation";
import { NiceSelect } from "./styled";
interface Props {
@@ -39,6 +39,7 @@ export function SelectList({
description,
canBeNull,
}: Props): VNode {
+ const { i18n } = useTranslationContext();
return (
<Fragment>
<label
diff --git a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
index b17dfce88..42afe5eaf 100644
--- a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
+++ b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
@@ -21,23 +21,18 @@ import {
Timestamp,
Transaction,
TransactionType,
- i18n,
} from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
-import imageBank from "../../static/img/ri-bank-line.svg";
-import imageHandHeart from "../../static/img/ri-hand-heart-line.svg";
-import imageRefresh from "../../static/img/ri-refresh-line.svg";
-import imageRefund from "../../static/img/ri-refund-2-line.svg";
-import imageShoppingCart from "../../static/img/ri-shopping-cart-line.svg";
+import { useTranslationContext } from "../context/translation";
import { Avatar } from "../mui/Avatar";
import { Pages } from "../NavigationBar";
import {
Column,
ExtraLargeText,
HistoryRow,
- SmallLightText,
LargeText,
LightText,
+ SmallLightText,
} from "./styled";
import { Time } from "./Time";
@@ -121,6 +116,7 @@ export function TransactionItem(props: { tx: Transaction }): VNode {
}
function TransactionLayout(props: TransactionLayoutProps): VNode {
+ const { i18n } = useTranslationContext();
return (
<HistoryRow
href={Pages.balance_transaction.replace(":tid", props.id)}
@@ -183,6 +179,7 @@ interface TransactionAmountProps {
}
function TransactionAmount(props: TransactionAmountProps): VNode {
+ const { i18n } = useTranslationContext();
let sign: string;
switch (props.debitCreditIndicator) {
case "credit":