aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--packages/taler-wallet-webextension/package.json2
-rw-r--r--packages/taler-wallet-webextension/src/components/AmountField.stories.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/AmountField.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx35
-rw-r--r--packages/taler-wallet-webextension/src/components/Banner.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/Checkbox.tsx5
-rw-r--r--packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx108
-rw-r--r--packages/taler-wallet-webextension/src/components/ErrorMessage.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/components/Loading.tsx96
-rw-r--r--packages/taler-wallet-webextension/src/components/LoadingError.tsx30
-rw-r--r--packages/taler-wallet-webextension/src/components/MultiActionButton.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/components/Part.tsx10
-rw-r--r--packages/taler-wallet-webextension/src/components/PaymentButtons.tsx13
-rw-r--r--packages/taler-wallet-webextension/src/components/PendingTransactions.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/SelectList.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.stories.tsx5
-rw-r--r--packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.tsx16
-rw-r--r--packages/taler-wallet-webextension/src/components/TermsOfService/index.ts22
-rw-r--r--packages/taler-wallet-webextension/src/components/TermsOfService/state.ts36
-rw-r--r--packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx34
-rw-r--r--packages/taler-wallet-webextension/src/components/styled/index.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/context/alert.ts118
-rw-r--r--packages/taler-wallet-webextension/src/cta/Deposit/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/Deposit/state.ts10
-rw-r--r--packages/taler-wallet-webextension/src/cta/Deposit/test.ts8
-rw-r--r--packages/taler-wallet-webextension/src/cta/Deposit/views.tsx18
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts14
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts37
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx44
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx37
-rw-r--r--packages/taler-wallet-webextension/src/cta/Payment/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/Payment/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Payment/test.ts6
-rw-r--r--packages/taler-wallet-webextension/src/cta/Payment/views.tsx34
-rw-r--r--packages/taler-wallet-webextension/src/cta/Recovery/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/Recovery/state.ts23
-rw-r--r--packages/taler-wallet-webextension/src/cta/Recovery/views.tsx16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Refund/index.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Refund/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Refund/test.ts8
-rw-r--r--packages/taler-wallet-webextension/src/cta/Refund/views.tsx29
-rw-r--r--packages/taler-wallet-webextension/src/cta/Tip/index.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Tip/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Tip/test.ts9
-rw-r--r--packages/taler-wallet-webextension/src/cta/Tip/views.tsx28
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx32
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx35
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw/index.ts16
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw/state.ts26
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw/test.ts8
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx53
-rw-r--r--packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts18
-rw-r--r--packages/taler-wallet-webextension/src/hooks/useLang.ts1
-rw-r--r--packages/taler-wallet-webextension/src/hooks/useLocalStorage.ts5
-rw-r--r--packages/taler-wallet-webextension/src/mui/Alert.stories.tsx33
-rw-r--r--packages/taler-wallet-webextension/src/mui/Alert.tsx10
-rw-r--r--packages/taler-wallet-webextension/src/mui/Paper.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/mui/colors/manipulation.ts2
-rw-r--r--packages/taler-wallet-webextension/src/platform/api.ts8
-rw-r--r--packages/taler-wallet-webextension/src/platform/chrome.ts60
-rw-r--r--packages/taler-wallet-webextension/src/platform/firefox.ts7
-rw-r--r--packages/taler-wallet-webextension/src/popup/BalancePage.tsx24
-rw-r--r--packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/svg/progress.svg12
-rw-r--r--packages/taler-wallet-webextension/src/test-utils.ts5
-rw-r--r--packages/taler-wallet-webextension/src/wallet/AddBackupProvider/index.ts15
-rw-r--r--packages/taler-wallet-webextension/src/wallet/AddBackupProvider/views.tsx16
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Application.tsx45
-rw-r--r--packages/taler-wallet-webextension/src/wallet/BackupPage.tsx19
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DepositPage/index.ts10
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DepositPage/state.ts7
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DepositPage/views.tsx43
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts8
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx29
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx12
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts9
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts10
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx24
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ExchangeSetUrl.tsx6
-rw-r--r--packages/taler-wallet-webextension/src/wallet/History.tsx15
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ManageAccount/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts7
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx21
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Notifications/index.ts11
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Notifications/state.ts11
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx12
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ProviderAddPage.tsx10
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ProviderDetailPage.tsx45
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Settings.tsx32
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Transaction.tsx119
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Welcome.tsx6
-rw-r--r--packages/taler-wallet-webextension/src/wxApi.ts44
-rw-r--r--packages/taler-wallet-webextension/src/wxBackend.ts31
-rw-r--r--pnpm-lock.yaml21
104 files changed, 1076 insertions, 1030 deletions
diff --git a/packages/taler-wallet-webextension/package.json b/packages/taler-wallet-webextension/package.json
index 8a6c19406..87fb27a72 100644
--- a/packages/taler-wallet-webextension/package.json
+++ b/packages/taler-wallet-webextension/package.json
@@ -69,7 +69,7 @@
"preact-cli": "^3.3.5",
"preact-render-to-string": "^5.1.19",
"rimraf": "^3.0.2",
- "typescript": "^4.8.4"
+ "typescript": "4.9.4"
},
"nyc": {
"include": [
diff --git a/packages/taler-wallet-webextension/src/components/AmountField.stories.tsx b/packages/taler-wallet-webextension/src/components/AmountField.stories.tsx
index 9a1d96014..61c4a7661 100644
--- a/packages/taler-wallet-webextension/src/components/AmountField.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/AmountField.stories.tsx
@@ -49,7 +49,7 @@ function RenderAmount(): VNode {
<Fragment>
<AmountField
required
- label={<i18n.Translate>Amount</i18n.Translate>}
+ label={i18n.str`Amount`}
highestDenom={2000000}
lowestDenom={0.01}
handler={handler}
diff --git a/packages/taler-wallet-webextension/src/components/AmountField.tsx b/packages/taler-wallet-webextension/src/components/AmountField.tsx
index 2e8942f0d..4936e0604 100644
--- a/packages/taler-wallet-webextension/src/components/AmountField.tsx
+++ b/packages/taler-wallet-webextension/src/components/AmountField.tsx
@@ -21,6 +21,7 @@ import {
amountMaxValue,
Amounts,
Result,
+ TranslatedString,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
@@ -37,7 +38,7 @@ export function AmountField({
highestDenom = 1,
required,
}: {
- label: VNode;
+ label: TranslatedString;
lowestDenom?: number;
highestDenom?: number;
required?: boolean;
diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
index 6f4980aff..d233547a4 100644
--- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
+++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
@@ -19,6 +19,7 @@ import {
Amounts,
PaytoUri,
segwitMinAmount,
+ TranslatedString,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useEffect, useRef, useState } from "preact/hooks";
@@ -106,27 +107,18 @@ export function BankDetailsByPaytoType({
}
const accountPart = !payto.isKnown ? (
- <Row
- name={<i18n.Translate>Account</i18n.Translate>}
- value={payto.targetPath}
- />
+ <Row name={i18n.str`Account`} value={payto.targetPath} />
) : payto.targetType === "x-taler-bank" ? (
<Fragment>
- <Row
- name={<i18n.Translate>Bank host</i18n.Translate>}
- value={payto.host}
- />
- <Row
- name={<i18n.Translate>Bank account</i18n.Translate>}
- value={payto.account}
- />
+ <Row name={i18n.str`Bank host`} value={payto.host} />
+ <Row name={i18n.str`Bank account`} value={payto.account} />
</Fragment>
) : payto.targetType === "iban" ? (
<Fragment>
{payto.bic !== undefined ? (
- <Row name={<i18n.Translate>BIC</i18n.Translate>} value={payto.bic} />
+ <Row name={i18n.str`BIC`} value={payto.bic} />
) : undefined}
- <Row name={<i18n.Translate>IBAN</i18n.Translate>} value={payto.iban} />
+ <Row name={i18n.str`IBAN`} value={payto.iban} />
</Fragment>
) : undefined;
@@ -146,19 +138,12 @@ export function BankDetailsByPaytoType({
<table>
{accountPart}
<Row
- name={<i18n.Translate>Amount</i18n.Translate>}
+ name={i18n.str`Amount`}
value={<Amount value={amount} hideCurrency />}
/>
- <Row
- name={<i18n.Translate>Subject</i18n.Translate>}
- value={subject}
- literal
- />
+ <Row name={i18n.str`Subject`} value={subject} literal />
{receiver ? (
- <Row
- name={<i18n.Translate>Receiver name</i18n.Translate>}
- value={receiver}
- />
+ <Row name={i18n.str`Receiver name`} value={receiver} />
) : undefined}
</table>
</div>
@@ -200,7 +185,7 @@ function Row({
value,
literal,
}: {
- name: VNode;
+ name: TranslatedString;
value: string | VNode;
literal?: boolean;
}): VNode {
diff --git a/packages/taler-wallet-webextension/src/components/Banner.tsx b/packages/taler-wallet-webextension/src/components/Banner.tsx
index a91fd384f..40a4847b8 100644
--- a/packages/taler-wallet-webextension/src/components/Banner.tsx
+++ b/packages/taler-wallet-webextension/src/components/Banner.tsx
@@ -13,6 +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 { TranslatedString } from "@gnu-taler/taler-util";
import { ComponentChildren, Fragment, h, JSX, VNode } from "preact";
import { Button } from "../mui/Button.js";
import { Divider } from "../mui/Divider.js";
@@ -20,7 +21,7 @@ import { Grid } from "../mui/Grid.js";
import { Paper } from "../mui/Paper.js";
interface Props extends JSX.HTMLAttributes<HTMLDivElement> {
- titleHead?: VNode;
+ titleHead?: VNode | TranslatedString;
children: ComponentChildren;
// elements: {
// icon?: VNode;
diff --git a/packages/taler-wallet-webextension/src/components/Checkbox.tsx b/packages/taler-wallet-webextension/src/components/Checkbox.tsx
index b6fa8b663..70dfab597 100644
--- a/packages/taler-wallet-webextension/src/components/Checkbox.tsx
+++ b/packages/taler-wallet-webextension/src/components/Checkbox.tsx
@@ -14,14 +14,15 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { TranslatedString } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
interface Props {
enabled?: boolean;
onToggle?: () => Promise<void>;
- label: VNode;
+ label: TranslatedString;
name: string;
- description?: VNode;
+ description?: VNode | TranslatedString;
}
export function Checkbox({
name,
diff --git a/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx b/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx
new file mode 100644
index 000000000..a56c82dee
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/components/CurrentAlerts.tsx
@@ -0,0 +1,108 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+ 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 { ComponentChildren, Fragment, h, VNode } from "preact";
+import { useState } from "preact/hooks";
+import { useTranslationContext } from "../../../web-util/src/index.browser.js";
+import {
+ ErrorAlert,
+ Alert as AlertNotification,
+ useAlertContext,
+} from "../context/alert.js";
+import { Alert } from "../mui/Alert.js";
+
+/**
+ *
+ * @author sebasjm
+ */
+
+function AlertContext({
+ context,
+ cause,
+}: {
+ cause: unknown;
+ context: undefined | object;
+}): VNode {
+ const [more, setMore] = useState(false);
+ const { i18n } = useTranslationContext();
+ if (!more) {
+ return (
+ <div style={{ display: "flex", justifyContent: "right" }}>
+ <a onClick={() => setMore(true)}>
+ <i18n.Translate>more info</i18n.Translate>
+ </a>
+ </div>
+ );
+ }
+ return (
+ <pre style={{ overflow: "overlay" }}>
+ {JSON.stringify(
+ context === undefined ? { cause } : { context, cause },
+ undefined,
+ 2,
+ )}
+ </pre>
+ );
+}
+
+export function ErrorAlertView({
+ error: alert,
+ onClose,
+}: {
+ error: ErrorAlert;
+ onClose?: () => Promise<void>;
+}): VNode {
+ return (
+ <Alert title={alert.message} severity={alert.type} onClose={onClose}>
+ <div style={{ display: "flex", flexDirection: "column" }}>
+ <div>{alert.description}</div>
+ <AlertContext context={alert.context} cause={alert.cause} />
+ </div>
+ </Alert>
+ );
+}
+
+export function AlertView({
+ alert,
+ onClose,
+}: {
+ alert: AlertNotification;
+ onClose?: () => Promise<void>;
+}): VNode {
+ return (
+ <Alert title={alert.message} severity={alert.type} onClose={onClose}>
+ <div style={{ display: "flex", flexDirection: "column" }}>
+ <div>{alert.description}</div>
+ </div>
+ </Alert>
+ );
+}
+
+export function CurrentAlerts(): VNode {
+ const { alerts, removeAlert } = useAlertContext();
+ if (alerts.length === 0) return <Fragment />;
+ return (
+ <Wrapper>
+ {alerts.map((n, i) => (
+ <AlertView key={i} alert={n} onClose={async () => removeAlert(n)} />
+ ))}
+ </Wrapper>
+ );
+}
+
+function Wrapper({ children }: { children: ComponentChildren }): VNode {
+ return <div style={{ margin: "2em" }}>{children}</div>;
+}
diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
index ce8dc0ad1..11f526865 100644
--- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
+++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
@@ -13,6 +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 { TranslatedString } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
import { useState } from "preact/hooks";
import arrowDown from "../svg/chevron-down.svg";
@@ -22,7 +23,7 @@ export function ErrorMessage({
title,
description,
}: {
- title: VNode;
+ title: TranslatedString;
description?: string | VNode;
}): VNode | null {
const [showErrorDetail, setShowErrorDetail] = useState(false);
diff --git a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx
index a7223d2db..f8203f38a 100644
--- a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx
+++ b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.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 { TalerErrorDetail } from "@gnu-taler/taler-util";
+import { TalerErrorDetail, TranslatedString } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
import arrowDown from "../svg/chevron-down.svg";
@@ -24,7 +24,7 @@ export function ErrorTalerOperation({
title,
error,
}: {
- title?: VNode;
+ title?: TranslatedString;
error?: TalerErrorDetail;
}): 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 f2195b646..3a6daaaa6 100644
--- a/packages/taler-wallet-webextension/src/components/Loading.tsx
+++ b/packages/taler-wallet-webextension/src/components/Loading.tsx
@@ -13,30 +13,88 @@
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 { css } from "@linaria/core";
import { Fragment, h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks";
import { useTranslationContext } from "../context/translation.js";
+import ProgressIcon from "../svg/progress.svg";
import { CenteredText } from "./styled/index.js";
+const fadeIn = css`
+ & {
+ animation: fadein 3s;
+ }
+ @keyframes fadein {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+ }
+`;
+
export function Loading(): VNode {
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 />;
+ return (
+ <section style={{ margin: "auto" }}>
+ <CenteredText class={fadeIn}>
+ <i18n.Translate>Loading</i18n.Translate>...
+ </CenteredText>
+ {/* <div class={ripple} style={{ "--size": "250px" }}>
+ <div></div>
+ <div></div>
+ </div> */}
+ <div class={fadeIn} dangerouslySetInnerHTML={{ __html: ProgressIcon }} />
+ </section>
+ );
}
+
+const ripple = css`
+ & {
+ display: inline-block;
+ position: relative;
+ width: var(--size);
+ height: var(--size);
+ }
+ & div {
+ position: absolute;
+ border: 4px solid black;
+ opacity: 1;
+ border-radius: 50%;
+ animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
+ }
+ & div:nth-child(2) {
+ animation-delay: -0.3s;
+ }
+ @keyframes lds-ripple {
+ 0% {
+ top: calc(var(--size) / 2);
+ left: calc(var(--size) / 2);
+ width: 0;
+ height: 0;
+ opacity: 0;
+ }
+ 14.9% {
+ top: calc(var(--size) / 2);
+ left: calc(var(--size) / 2);
+ width: 0;
+ height: 0;
+ opacity: 0;
+ }
+ 15% {
+ top: calc(var(--size) / 2);
+ left: calc(var(--size) / 2);
+ width: 0;
+ height: 0;
+ opacity: 1;
+ }
+ 100% {
+ top: 0px;
+ left: 0px;
+ width: var(--size);
+ height: var(--size);
+ opacity: 0;
+ }
+ }
+`;
diff --git a/packages/taler-wallet-webextension/src/components/LoadingError.tsx b/packages/taler-wallet-webextension/src/components/LoadingError.tsx
deleted file mode 100644
index 2cd8bee3b..000000000
--- a/packages/taler-wallet-webextension/src/components/LoadingError.tsx
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- This file is part of GNU Taler
- (C) 2022 Taler Systems S.A.
-
- GNU Taler is free software; you can redistribute it and/or modify it under the
- terms of the GNU General Public License as published by the Free Software
- Foundation; either version 3, or (at your option) any later version.
-
- GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
- WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- A PARTICULAR PURPOSE. See the GNU General Public License for more details.
-
- 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 { h, VNode } from "preact";
-import { HookError } from "../hooks/useAsyncAsHook.js";
-import { ErrorMessage } from "./ErrorMessage.js";
-import { ErrorTalerOperation } from "./ErrorTalerOperation.js";
-
-export interface Props {
- title: VNode;
- error: HookError;
-}
-export function LoadingError({ title, error }: Props): VNode {
- if (error.operational) {
- return <ErrorTalerOperation title={title} error={error.details} />;
- }
- return <ErrorMessage title={title} description={error.message} />;
-}
diff --git a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx
index 673ff3dc2..d6a730a4f 100644
--- a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx
+++ b/packages/taler-wallet-webextension/src/components/MultiActionButton.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 { getUnpackedSettings } from "http2";
+import { TranslatedString } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
import { useState } from "preact/hooks";
import { Button } from "../mui/Button.js";
@@ -21,7 +21,7 @@ import arrowDown from "../svg/chevron-down.svg";
import { ParagraphClickable } from "./styled/index.js";
export interface Props {
- label: (s: string) => VNode;
+ label: (s: string) => TranslatedString;
actions: string[];
onClick: (s: string) => Promise<void>;
}
diff --git a/packages/taler-wallet-webextension/src/components/Part.tsx b/packages/taler-wallet-webextension/src/components/Part.tsx
index a488ca4dc..1449bcac6 100644
--- a/packages/taler-wallet-webextension/src/components/Part.tsx
+++ b/packages/taler-wallet-webextension/src/components/Part.tsx
@@ -14,7 +14,11 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { PaytoUri, stringifyPaytoUri } from "@gnu-taler/taler-util";
+import {
+ PaytoUri,
+ stringifyPaytoUri,
+ TranslatedString,
+} from "@gnu-taler/taler-util";
import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
@@ -27,8 +31,8 @@ import {
export type Kind = "positive" | "negative" | "neutral";
interface Props {
- title: VNode | string;
- text: VNode | string;
+ title: VNode | TranslatedString;
+ text: VNode | TranslatedString;
kind?: Kind;
big?: boolean;
showSign?: boolean;
diff --git a/packages/taler-wallet-webextension/src/components/PaymentButtons.tsx b/packages/taler-wallet-webextension/src/components/PaymentButtons.tsx
index def1e16eb..30c2ef833 100644
--- a/packages/taler-wallet-webextension/src/components/PaymentButtons.tsx
+++ b/packages/taler-wallet-webextension/src/components/PaymentButtons.tsx
@@ -19,6 +19,7 @@ import {
Amounts,
PreparePayResult,
PreparePayResultType,
+ TranslatedString,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
@@ -109,8 +110,10 @@ export function PaymentButtons({
<section>
{payStatus.paid && payStatus.contractTerms.fulfillment_message && (
<Part
- title={<i18n.Translate>Merchant message</i18n.Translate>}
- text={payStatus.contractTerms.fulfillment_message}
+ title={i18n.str`Merchant message`}
+ text={
+ payStatus.contractTerms.fulfillment_message as TranslatedString
+ }
kind="neutral"
/>
)}
@@ -131,11 +134,7 @@ function PayWithMobile({ uri }: { uri: string }): VNode {
return (
<section>
<LinkSuccess upperCased onClick={() => setShowQR((qr) => !qr)}>
- {!showQR ? (
- <i18n.Translate>Pay with a mobile phone</i18n.Translate>
- ) : (
- <i18n.Translate>Hide QR</i18n.Translate>
- )}
+ {!showQR ? i18n.str`Pay with a mobile phone` : i18n.str`Hide QR`}
</LinkSuccess>
{showQR && (
<div>
diff --git a/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx b/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
index e41ff2836..2bba86dba 100644
--- a/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
+++ b/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
@@ -87,7 +87,7 @@ export function PendingTransactionsView({
}}
>
<Banner
- titleHead={<i18n.Translate>PENDING OPERATIONS</i18n.Translate>}
+ titleHead={i18n.str`PENDING OPERATIONS`}
style={{
backgroundColor: "lightcyan",
maxHeight: 150,
diff --git a/packages/taler-wallet-webextension/src/components/SelectList.tsx b/packages/taler-wallet-webextension/src/components/SelectList.tsx
index 3ceac752e..809698711 100644
--- a/packages/taler-wallet-webextension/src/components/SelectList.tsx
+++ b/packages/taler-wallet-webextension/src/components/SelectList.tsx
@@ -14,6 +14,7 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { TranslatedString } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { useTranslationContext } from "../context/translation.js";
import { NiceSelect } from "./styled/index.js";
@@ -21,7 +22,7 @@ import { NiceSelect } from "./styled/index.js";
interface Props {
value?: string;
onChange?: (s: string) => void;
- label: VNode;
+ label: VNode | TranslatedString;
list: {
[label: string]: string;
};
diff --git a/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.stories.tsx b/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.stories.tsx
index 841583113..8c94e6e60 100644
--- a/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.stories.tsx
@@ -94,7 +94,10 @@ export const Error = createExample(ErrorView, {
error: {
hasError: true,
message: "message",
- operational: false,
+ // details: {
+ // co
+ // },
+ type: "error",
// details: {
// code: 123,
// },
diff --git a/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.tsx b/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.tsx
index 47c10347c..9871611f2 100644
--- a/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.tsx
+++ b/packages/taler-wallet-webextension/src/components/ShowFullContractTermPopup.tsx
@@ -22,15 +22,16 @@ import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import { Modal } from "../components/Modal.js";
import { Time } from "../components/Time.js";
+import { alertFromError } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
import { HookError, useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
import { ButtonHandler } from "../mui/handlers.js";
import { compose, StateViewMap } from "../utils/index.js";
import { Amount } from "./Amount.js";
+import { AlertView } from "./CurrentAlerts.js";
import { Link } from "./styled/index.js";
const ContractTermsTable = styled.table`
@@ -160,13 +161,12 @@ export function ErrorView({
const { i18n } = useTranslationContext();
return (
<Modal title="Full detail" onClose={hideHandler}>
- <LoadingError
- title={
- <i18n.Translate>
- Could not load purchase proposal details
- </i18n.Translate>
- }
- error={error}
+ <AlertView
+ alert={alertFromError(
+ i18n.str`Could not load purchase proposal details`,
+ error,
+ { proposalId },
+ )}
/>
</Modal>
);
diff --git a/packages/taler-wallet-webextension/src/components/TermsOfService/index.ts b/packages/taler-wallet-webextension/src/components/TermsOfService/index.ts
index d7716f208..a8c1558d8 100644
--- a/packages/taler-wallet-webextension/src/components/TermsOfService/index.ts
+++ b/packages/taler-wallet-webextension/src/components/TermsOfService/index.ts
@@ -15,14 +15,13 @@
*/
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ToggleHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
+import { ErrorAlertView } from "../CurrentAlerts.js";
import { useComponentState } from "./state.js";
import { TermsState } from "./utils.js";
import {
- ErrorAcceptingView,
- LoadingUriView,
ShowButtonsAcceptedTosView,
ShowButtonsNonAcceptedTosView,
ShowTosContentView,
@@ -35,8 +34,7 @@ export interface Props {
export type State =
| State.Loading
- | State.LoadingUriError
- | State.ErrorAccepting
+ | State.Error
| State.ShowButtonsAccepted
| State.ShowButtonsNotAccepted
| State.ShowContent;
@@ -47,14 +45,9 @@ export namespace State {
error: undefined;
}
- export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
- }
-
- export interface ErrorAccepting {
- status: "error-accepting";
- error: HookError;
+ export interface Error {
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -79,11 +72,10 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
"show-content": ShowTosContentView,
"show-buttons-accepted": ShowButtonsAcceptedTosView,
"show-buttons-not-accepted": ShowButtonsNonAcceptedTosView,
- "error-accepting": ErrorAcceptingView,
};
export const TermsOfService = compose(
diff --git a/packages/taler-wallet-webextension/src/components/TermsOfService/state.ts b/packages/taler-wallet-webextension/src/components/TermsOfService/state.ts
index 3b75965d3..c25c0ed13 100644
--- a/packages/taler-wallet-webextension/src/components/TermsOfService/state.ts
+++ b/packages/taler-wallet-webextension/src/components/TermsOfService/state.ts
@@ -16,7 +16,9 @@
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError, useAlertContext } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
import { buildTermsOfServiceState } from "./utils.js";
@@ -25,9 +27,8 @@ export function useComponentState({ exchangeUrl, onChange }: Props): State {
const api = useBackendContext();
const readOnly = !onChange;
const [showContent, setShowContent] = useState<boolean>(readOnly);
- const [errorAccepting, setErrorAccepting] = useState<Error | undefined>(
- undefined,
- );
+ const { i18n } = useTranslationContext();
+ const { pushAlert } = useAlertContext();
/**
* For the exchange selected, bring the status of the terms of service
@@ -54,22 +55,13 @@ export function useComponentState({ exchangeUrl, onChange }: Props): State {
}
if (terms.hasError) {
return {
- status: "loading-error",
- error: terms,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ terms,
+ ),
};
}
-
- if (errorAccepting) {
- return {
- status: "error-accepting",
- error: {
- hasError: true,
- operational: false,
- message: errorAccepting.message,
- },
- };
- }
-
const { state } = terms.response;
async function onUpdate(accepted: boolean): Promise<void> {
@@ -77,13 +69,13 @@ export function useComponentState({ exchangeUrl, onChange }: Props): State {
try {
if (accepted) {
- api.wallet.call(WalletApiOperation.SetExchangeTosAccepted, {
+ await api.wallet.call(WalletApiOperation.SetExchangeTosAccepted, {
exchangeBaseUrl: exchangeUrl,
etag: state.version,
});
} else {
// mark as not accepted
- api.wallet.call(WalletApiOperation.SetExchangeTosAccepted, {
+ await api.wallet.call(WalletApiOperation.SetExchangeTosAccepted, {
exchangeBaseUrl: exchangeUrl,
etag: undefined,
});
@@ -91,11 +83,7 @@ export function useComponentState({ exchangeUrl, onChange }: Props): State {
// setAccepted(accepted);
if (!readOnly) onChange(accepted); //external update
} catch (e) {
- if (e instanceof Error) {
- //FIXME: uncomment this and display error
- // setErrorAccepting(e.message);
- setErrorAccepting(e);
- }
+ pushAlert(alertFromError(i18n.str`Could not accept terms of service`, e));
}
}
diff --git a/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx b/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
index a7e03fd01..0b5a71b3e 100644
--- a/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
+++ b/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
@@ -14,49 +14,23 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { ExchangeTosStatus } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
-import { useTranslationContext } from "../../context/translation.js";
-import { TermsDocument, TermsState } from "./utils.js";
-import { State } from "./index.js";
import { CheckboxOutlined } from "../../components/CheckboxOutlined.js";
+import { ExchangeXmlTos } from "../../components/ExchangeToS.js";
import {
LinkSuccess,
TermsOfService,
WarningBox,
WarningText,
} from "../../components/styled/index.js";
-import { ExchangeXmlTos } from "../../components/ExchangeToS.js";
-import { ToggleHandler } from "../../mui/handlers.js";
+import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
-import { ExchangeTosStatus } from "@gnu-taler/taler-util";
-
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
-export function ErrorAcceptingView({ error }: State.ErrorAccepting): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
+import { State } from "./index.js";
export function ShowButtonsAcceptedTosView({
termsAccepted,
showingTermsOfService,
- terms,
}: State.ShowButtonsAccepted): VNode {
const { i18n } = useTranslationContext();
const ableToReviewTermsOfService =
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index 8e98f75eb..e36502333 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -535,7 +535,7 @@ export const LinkDestructive = styled(Link)`
`;
export const LinkPrimary = styled(Link)`
- color: rgb(66, 184, 221);
+ color: black;
`;
export const ButtonPrimary = styled(ButtonVariant)<{ small?: boolean }>`
diff --git a/packages/taler-wallet-webextension/src/context/alert.ts b/packages/taler-wallet-webextension/src/context/alert.ts
new file mode 100644
index 000000000..cc98ec1e0
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/context/alert.ts
@@ -0,0 +1,118 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+ 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/>
+ */
+
+/**
+ *
+ * @author Sebastian Javier Marchano (sebasjm)
+ */
+
+import { TranslatedString } from "@gnu-taler/taler-util";
+import { ComponentChildren, createContext, h, VNode } from "preact";
+import { useContext, useState } from "preact/hooks";
+
+export type AlertType = "info" | "warning" | "error" | "success";
+
+export interface Alert {
+ message: TranslatedString;
+ description: TranslatedString | VNode;
+ type: AlertType;
+}
+
+export interface ErrorAlert extends Alert {
+ type: "error";
+ context: object;
+ cause: any;
+}
+
+type Type = {
+ alerts: Alert[];
+ pushAlert: (n: Alert) => void;
+ removeAlert: (n: Alert) => void;
+};
+
+const initial: Type = {
+ alerts: [],
+ pushAlert: () => {
+ null;
+ },
+ removeAlert: () => {
+ null;
+ },
+};
+
+const Context = createContext<Type>(initial);
+
+type AlertWithDate = Alert & { since: Date };
+
+type Props = Partial<Type> & {
+ children: ComponentChildren;
+};
+
+export const AlertProvider = ({ children }: Props): VNode => {
+ const timeout = 3000;
+
+ const [alerts, setAlerts] = useState<AlertWithDate[]>([]);
+
+ const pushAlert = (n: Alert): void => {
+ const entry = { ...n, since: new Date() };
+ setAlerts((ns) => [...ns, entry]);
+ if (n.type !== "error") {
+ setTimeout(() => {
+ setAlerts((ns) => ns.filter((x) => x.since !== entry.since));
+ }, timeout);
+ }
+ };
+
+ const removeAlert = (alert: Alert): void => {
+ setAlerts((ns: AlertWithDate[]) => ns.filter((n) => n !== alert));
+ };
+
+ return h(Context.Provider, {
+ value: { alerts, pushAlert, removeAlert },
+ children,
+ });
+};
+
+export const useAlertContext = (): Type => useContext(Context);
+
+export function alertFromError(
+ message: TranslatedString,
+ error: unknown,
+ ...context: any[]
+): ErrorAlert {
+ let description = "" as TranslatedString;
+
+ const isObject = typeof error === "object" &&
+ error !== null;
+ const hasMessage =
+ isObject &&
+ "message" in error &&
+ typeof error.message === "string";
+
+ if (hasMessage) {
+ description = error.message as TranslatedString;
+ } else {
+ description = `Unknown error: ${String(error)}` as TranslatedString;
+ }
+
+ return {
+ type: "error",
+ message,
+ description,
+ cause: error,
+ context,
+ };
+}
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/index.ts b/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
index 9ff3ddd1d..6b228188b 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
@@ -15,12 +15,13 @@
*/
import { AmountJson, AmountString } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
talerDepositUri: string | undefined;
@@ -37,8 +38,8 @@ export namespace State {
error: undefined;
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface Ready {
status: "ready";
@@ -57,7 +58,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/state.ts b/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
index dba435611..4cee7cfd0 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
@@ -16,7 +16,9 @@
import { Amounts } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -38,12 +40,16 @@ export function useComponentState({
});
return { deposit, uri: talerDepositUri, amount };
});
+ const { i18n } = useTranslationContext();
if (!info) return { status: "loading", error: undefined };
if (info.hasError) {
return {
- status: "loading-uri",
- error: info,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ info,
+ ),
};
}
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/test.ts b/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
index 6a896fb7f..031dcffaa 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
@@ -50,12 +50,12 @@ describe("Deposit CTA states", () => {
expect(status).equals("loading");
},
({ status, error }) => {
- expect(status).equals("loading-uri");
+ expect(status).equals("error");
if (!error) expect.fail();
- if (!error.hasError) expect.fail();
- if (error.operational) expect.fail();
- expect(error.message).eq("ERROR_NO-URI-FOR-DEPOSIT");
+ // if (!error.hasError) expect.fail();
+ // if (error.operational) expect.fail();
+ expect(error.cause?.message).eq("ERROR_NO-URI-FOR-DEPOSIT");
},
],
TestingContext,
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx b/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
index 2ec305de5..7fa43f878 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
@@ -17,7 +17,6 @@
import { Amounts } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { Amount } from "../../components/Amount.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
import { SubTitle, WalletAction } from "../../components/styled/index.js";
@@ -30,17 +29,6 @@ import { State } from "./index.js";
* @author sebasjm
*/
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load deposit status</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView(state: State.Ready): VNode {
const { i18n } = useTranslationContext();
@@ -55,7 +43,7 @@ export function ReadyView(state: State.Ready): VNode {
{Amounts.isNonZero(state.cost) && (
<Part
big
- title={<i18n.Translate>Cost</i18n.Translate>}
+ title={i18n.str`Cost`}
text={<Amount value={state.cost} />}
kind="negative"
/>
@@ -63,14 +51,14 @@ export function ReadyView(state: State.Ready): VNode {
{Amounts.isNonZero(state.fee) && (
<Part
big
- title={<i18n.Translate>Fee</i18n.Translate>}
+ title={i18n.str`Fee`}
text={<Amount value={state.fee} />}
kind="negative"
/>
)}
<Part
big
- title={<i18n.Translate>To be received</i18n.Translate>}
+ title={i18n.str`To be received`}
text={<Amount value={state.effective} />}
kind="positive"
/>
diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts
index 0569e8e5f..f39ab6794 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts
@@ -14,16 +14,17 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util";
+import { AmountJson } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { State as SelectExchangeState } from "../../hooks/useSelectedExchange.js";
import { ButtonHandler, TextFieldHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { ExchangeSelectionPage } from "../../wallet/ExchangeSelection/index.js";
import { NoExchangesView } from "../../wallet/ExchangeSelection/views.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
amount: string;
@@ -45,8 +46,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -63,13 +64,12 @@ export namespace State {
requestAmount: AmountJson;
exchangeUrl: string;
error: undefined;
- operationError?: TalerErrorDetail;
}
}
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
"no-exchange": NoExchangesView,
"selecting-exchange": ExchangeSelectionPage,
ready: ReadyView,
diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts
index 998270e53..46b1262b1 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts
@@ -23,7 +23,9 @@ import {
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { isFuture, parse } from "date-fns";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { useSelectedExchange } from "../../hooks/useSelectedExchange.js";
import { RecursiveState } from "../../utils/index.js";
@@ -40,6 +42,7 @@ export function useComponentState({
const hook = useAsyncAsHook(() =>
api.wallet.call(WalletApiOperation.ListExchanges, {}),
);
+ const { i18n } = useTranslationContext();
if (!hook) {
return {
@@ -49,10 +52,19 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
}
+ // if (hook.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
+ // }
const exchangeList = hook.response.exchanges;
@@ -60,10 +72,6 @@ export function useComponentState({
const [subject, setSubject] = useState<string | undefined>();
const [timestamp, setTimestamp] = useState<string | undefined>();
- const [operationError, setOperationError] = useState<
- TalerErrorDetail | undefined
- >(undefined);
-
const selectedExchange = useSelectedExchange({
currency: amount.currency,
defaultExchange: undefined,
@@ -93,11 +101,19 @@ export function useComponentState({
error: undefined,
};
}
+
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
}
const { amountEffective, amountRaw } = hook.response;
@@ -160,8 +176,8 @@ export function useComponentState({
subject === undefined
? undefined
: !subject
- ? "Can't be empty"
- : undefined,
+ ? "Can't be empty"
+ : undefined,
value: subject ?? "",
onInput: async (e) => setSubject(e),
},
@@ -183,7 +199,6 @@ export function useComponentState({
requestAmount,
toBeReceived,
error: undefined,
- operationError,
};
};
}
diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx
index 0ef5c697e..10e0e68d5 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx
@@ -17,41 +17,24 @@
import { format } from "date-fns";
import { h, VNode } from "preact";
import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
-import { QR } from "../../components/QR.js";
import {
- Link,
SubTitle,
SvgIcon,
WalletAction,
} from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
-import { Grid } from "../../mui/Grid.js";
import { TextField } from "../../mui/TextField.js";
import editIcon from "../../svg/edit_24px.svg";
import { ExchangeDetails, InvoiceDetails } from "../../wallet/Transaction.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView({
exchangeUrl,
subject,
expiration,
- cancel,
- operationError,
create,
toBeReceived,
requestAmount,
@@ -59,7 +42,7 @@ export function ReadyView({
}: State.Ready): VNode {
const { i18n } = useTranslationContext();
- async function oneDayExpiration() {
+ async function oneDayExpiration(): Promise<void> {
if (expiration.onInput) {
expiration.onInput(
format(new Date().getTime() + 1000 * 60 * 60 * 24, "dd/MM/yyyy"),
@@ -67,14 +50,14 @@ export function ReadyView({
}
}
- async function oneWeekExpiration() {
+ async function oneWeekExpiration(): Promise<void> {
if (expiration.onInput) {
expiration.onInput(
format(new Date().getTime() + 1000 * 60 * 60 * 24 * 7, "dd/MM/yyyy"),
);
}
}
- async function _20DaysExpiration() {
+ async function _20DaysExpiration(): Promise<void> {
if (expiration.onInput) {
expiration.onInput(
format(new Date().getTime() + 1000 * 60 * 60 * 24 * 20, "dd/MM/yyyy"),
@@ -87,16 +70,6 @@ export function ReadyView({
<SubTitle>
<i18n.Translate>Digital invoice</i18n.Translate>
</SubTitle>
- {operationError && (
- <ErrorTalerOperation
- title={
- <i18n.Translate>
- Could not finish the invoice creation
- </i18n.Translate>
- }
- error={operationError}
- />
- )}
<section style={{ textAlign: "left" }}>
<Part
title={
@@ -125,9 +98,7 @@ export function ReadyView({
label="Subject"
variant="filled"
error={subject.error}
- helperText={
- <i18n.Translate>Short description of the invoice</i18n.Translate>
- }
+ helperText={i18n.str`Short description of the invoice`}
required
fullWidth
value={subject.value}
@@ -171,7 +142,7 @@ export function ReadyView({
</p>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<InvoiceDetails
amount={{
@@ -187,11 +158,6 @@ export function ReadyView({
<i18n.Translate>Create</i18n.Translate>
</Button>
</section>
- <section>
- <Link upperCased onClick={cancel.onClick}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts b/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts
index f3de0885d..82b2c7af5 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts
@@ -20,12 +20,13 @@ import {
PreparePayResult,
TalerErrorDetail,
} from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
talerPayPullUri: string;
@@ -48,8 +49,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -83,7 +84,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
"no-balance-for-currency": ReadyView,
"no-enough-balance": ReadyView,
ready: ReadyView,
diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts b/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts
index c0b97c106..9c4a3162e 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts
@@ -25,7 +25,9 @@ import {
} from "@gnu-taler/taler-util";
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useEffect, useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -36,6 +38,7 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const hook = useAsyncAsHook(async () => {
const p2p = await api.wallet.call(WalletApiOperation.CheckPeerPullPayment, {
talerUri: talerPayPullUri,
@@ -63,10 +66,19 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
}
+ // if (hook.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
+ // }
const { contractTerms, peerPullPaymentIncomingId } = hook.response.p2p;
diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx
index a53fa881a..6a9ab3cf7 100644
--- a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx
@@ -17,26 +17,14 @@
import { Fragment, h, VNode } from "preact";
import { Amount } from "../../components/Amount.js";
import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
+import { PaymentButtons } from "../../components/PaymentButtons.js";
import { Link, SubTitle, WalletAction } from "../../components/styled/index.js";
import { Time } from "../../components/Time.js";
import { useTranslationContext } from "../../context/translation.js";
-import { PaymentButtons } from "../../components/PaymentButtons";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView(
state: State.Ready | State.NoBalanceForCurrency | State.NoEnoughBalance,
): VNode {
@@ -60,25 +48,15 @@ export function ReadyView(
</SubTitle>
{operationError && (
<ErrorTalerOperation
- title={
- <i18n.Translate>
- Could not finish the payment operation
- </i18n.Translate>
- }
+ title={i18n.str`Could not finish the payment operation`}
error={operationError}
/>
)}
<section style={{ textAlign: "left" }}>
+ <Part title={i18n.str`Subject`} text={<div>{summary}</div>} />
+ <Part title={i18n.str`Amount`} text={<Amount value={amount} />} />
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={<div>{summary}</div>}
- />
- <Part
- title={<i18n.Translate>Amount</i18n.Translate>}
- text={<Amount value={amount} />}
- />
- <Part
- title={<i18n.Translate>Valid until</i18n.Translate>}
+ title={i18n.str`Valid until`}
text={<Time timestamp={expiration} format="dd MMMM yyyy, HH:mm" />}
kind="neutral"
/>
@@ -91,11 +69,6 @@ export function ReadyView(
payHandler={status === "ready" ? state.accept : undefined}
goToWalletManualWithdraw={state.goToWalletManualWithdraw}
/>
- <section>
- <Link upperCased onClick={cancel.onClick}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/Payment/index.ts b/packages/taler-wallet-webextension/src/cta/Payment/index.ts
index 2dc6b6741..e844c1706 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Payment/index.ts
@@ -21,12 +21,13 @@ import {
PreparePayResultInsufficientBalance,
PreparePayResultPaymentPossible,
} from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { BaseView, LoadingUriView } from "./views.js";
+import { BaseView } from "./views.js";
export interface Props {
talerPayUri?: string;
@@ -49,8 +50,8 @@ export namespace State {
error: undefined;
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
interface BaseInfo {
@@ -86,7 +87,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
"no-balance-for-currency": BaseView,
"no-enough-balance": BaseView,
confirmed: BaseView,
diff --git a/packages/taler-wallet-webextension/src/cta/Payment/state.ts b/packages/taler-wallet-webextension/src/cta/Payment/state.ts
index d4adf4bcb..6d7ef6b20 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Payment/state.ts
@@ -23,7 +23,9 @@ import {
} from "@gnu-taler/taler-util";
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useEffect, useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { Props, State } from "./index.js";
@@ -36,6 +38,7 @@ export function useComponentState({
}: Props): State {
const [payErrMsg, setPayErrMsg] = useState<TalerError | undefined>(undefined);
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const hook = useAsyncAsHook(async () => {
if (!talerPayUri) throw Error("ERROR_NO-URI-FOR-PAYMENT");
@@ -80,10 +83,19 @@ export function useComponentState({
if (!hook) return { status: "loading", error: undefined };
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
}
+ // if (hook.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
+ // }
const { payStatus } = hook.response;
const amount = Amounts.parseOrThrow(payStatus.amountRaw);
diff --git a/packages/taler-wallet-webextension/src/cta/Payment/test.ts b/packages/taler-wallet-webextension/src/cta/Payment/test.ts
index 077930972..123e95a87 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Payment/test.ts
@@ -54,10 +54,10 @@ describe("Payment CTA states", () => {
expect(error).undefined;
},
({ status, error }) => {
- expect(status).equals("loading-uri");
+ expect(status).equals("error");
if (error === undefined) expect.fail();
- expect(error.hasError).true;
- expect(error.operational).false;
+ // expect(error.hasError).true;
+ // expect(error.operational).false;
},
],
TestingContext,
diff --git a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
index efc8bcfc4..244ac5886 100644
--- a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx
@@ -19,28 +19,17 @@ import {
Amounts,
MerchantContractTerms as ContractTerms,
PreparePayResultType,
+ TranslatedString,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
import { Part } from "../../components/Part.js";
import { PaymentButtons } from "../../components/PaymentButtons.js";
-import { Link, SuccessBox, WarningBox } from "../../components/styled/index.js";
+import { SuccessBox, WarningBox } from "../../components/styled/index.js";
import { Time } from "../../components/Time.js";
import { useTranslationContext } from "../../context/translation.js";
import { MerchantDetails, PurchaseDetails } from "../../wallet/Transaction.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load pay status</i18n.Translate>}
- error={error}
- />
- );
-}
-
type SupportedStates =
| State.Ready
| State.Confirmed
@@ -66,17 +55,17 @@ export function BaseView(state: SupportedStates): VNode {
<section style={{ textAlign: "left" }}>
<Part
- title={<i18n.Translate>Purchase</i18n.Translate>}
- text={contractTerms.summary}
+ title={i18n.str`Purchase`}
+ text={contractTerms.summary as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Merchant</i18n.Translate>}
+ title={i18n.str`Merchant`}
text={<MerchantDetails merchant={contractTerms.merchant} />}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<PurchaseDetails
price={price}
@@ -93,14 +82,14 @@ export function BaseView(state: SupportedStates): VNode {
/>
{contractTerms.order_id && (
<Part
- title={<i18n.Translate>Receipt</i18n.Translate>}
- text={`#${contractTerms.order_id}`}
+ title={i18n.str`Receipt`}
+ text={`#${contractTerms.order_id}` as TranslatedString}
kind="neutral"
/>
)}
{contractTerms.pay_deadline && (
<Part
- title={<i18n.Translate>Valid until</i18n.Translate>}
+ title={i18n.str`Valid until`}
text={
<Time
timestamp={AbsoluteTime.fromTimestamp(
@@ -121,11 +110,6 @@ export function BaseView(state: SupportedStates): VNode {
payHandler={state.status === "ready" ? state.payHandler : undefined}
goToWalletManualWithdraw={state.goToWalletManualWithdraw}
/>
- <section>
- <Link upperCased onClick={state.cancel}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</Fragment>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/Recovery/index.ts b/packages/taler-wallet-webextension/src/cta/Recovery/index.ts
index 4a6fc79c9..79056c15b 100644
--- a/packages/taler-wallet-webextension/src/cta/Recovery/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Recovery/index.ts
@@ -14,12 +14,13 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
talerRecoveryUri?: string;
@@ -36,8 +37,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -53,7 +54,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/cta/Recovery/state.ts b/packages/taler-wallet-webextension/src/cta/Recovery/state.ts
index 4fef2c862..078e53bf9 100644
--- a/packages/taler-wallet-webextension/src/cta/Recovery/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Recovery/state.ts
@@ -16,7 +16,9 @@
import { parseRecoveryUri } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
+import { Alert } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { Props, State } from "./index.js";
export function useComponentState({
@@ -25,13 +27,16 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
if (!talerRecoveryUri) {
return {
- status: "loading-uri",
+ status: "error",
error: {
- operational: false,
- hasError: true,
- message: "Missing URI",
+ type: "error",
+ message: i18n.str`Missing URI`,
+ description: i18n.str``,
+ cause: new Error("something"),
+ context: {},
},
};
}
@@ -39,11 +44,13 @@ export function useComponentState({
if (!info) {
return {
- status: "loading-uri",
+ status: "error",
error: {
- operational: false,
- hasError: true,
- message: "Could not be read",
+ type: "error",
+ message: i18n.str`Could not parse the recovery URI`,
+ description: i18n.str``,
+ cause: new Error("something"),
+ context: {},
},
};
}
diff --git a/packages/taler-wallet-webextension/src/cta/Recovery/views.tsx b/packages/taler-wallet-webextension/src/cta/Recovery/views.tsx
index 371516932..858349ef3 100644
--- a/packages/taler-wallet-webextension/src/cta/Recovery/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Recovery/views.tsx
@@ -15,28 +15,12 @@
*/
import { Fragment, h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { SubTitle, WalletAction } from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={
- <i18n.Translate>
- Could not load backup recovery information
- </i18n.Translate>
- }
- error={error}
- />
- );
-}
-
export function ReadyView({ accept, cancel }: State.Ready): VNode {
const { i18n } = useTranslationContext();
return (
diff --git a/packages/taler-wallet-webextension/src/cta/Refund/index.ts b/packages/taler-wallet-webextension/src/cta/Refund/index.ts
index f79a77680..e90f770ff 100644
--- a/packages/taler-wallet-webextension/src/cta/Refund/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Refund/index.ts
@@ -15,17 +15,13 @@
*/
import { AmountJson, Product } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import {
- IgnoredView,
- InProgressView,
- LoadingUriView,
- ReadyView,
-} from "./views.js";
+import { IgnoredView, InProgressView, ReadyView } from "./views.js";
export interface Props {
talerRefundUri?: string;
@@ -47,8 +43,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
interface BaseInfo {
@@ -81,7 +77,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
"in-progress": InProgressView,
ignored: IgnoredView,
ready: ReadyView,
diff --git a/packages/taler-wallet-webextension/src/cta/Refund/state.ts b/packages/taler-wallet-webextension/src/cta/Refund/state.ts
index 9e3311b65..5a5073ba3 100644
--- a/packages/taler-wallet-webextension/src/cta/Refund/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Refund/state.ts
@@ -17,7 +17,9 @@
import { Amounts, NotificationType } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useEffect, useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -27,6 +29,7 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const [ignored, setIgnored] = useState(false);
const info = useAsyncAsHook(async () => {
@@ -49,10 +52,19 @@ export function useComponentState({
}
if (info.hasError) {
return {
- status: "loading-uri",
- error: info,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ info,
+ ),
};
}
+ // if (info.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: info,
+ // };
+ // }
const { refund, uri } = info.response;
diff --git a/packages/taler-wallet-webextension/src/cta/Refund/test.ts b/packages/taler-wallet-webextension/src/cta/Refund/test.ts
index 24d483a9a..8c4daa4d2 100644
--- a/packages/taler-wallet-webextension/src/cta/Refund/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Refund/test.ts
@@ -53,11 +53,11 @@ describe("Refund CTA states", () => {
expect(error).undefined;
},
({ status, error }) => {
- expect(status).equals("loading-uri");
+ expect(status).equals("error");
if (!error) expect.fail();
- if (!error.hasError) expect.fail();
- if (error.operational) expect.fail();
- expect(error.message).eq("ERROR_NO-URI-FOR-REFUND");
+ // if (!error.hasError) expect.fail();
+ // if (error.operational) expect.fail();
+ expect(error.cause?.message).eq("ERROR_NO-URI-FOR-REFUND");
},
],
TestingContext,
diff --git a/packages/taler-wallet-webextension/src/cta/Refund/views.tsx b/packages/taler-wallet-webextension/src/cta/Refund/views.tsx
index a55bc43dd..16e1c519c 100644
--- a/packages/taler-wallet-webextension/src/cta/Refund/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Refund/views.tsx
@@ -17,26 +17,14 @@
import { Amounts } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { Amount } from "../../components/Amount.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
+import { ProductList } from "../../components/ProductList.js";
import { Link, SubTitle, WalletAction } from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
-import { ProductList } from "../../components/ProductList.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load refund status</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function IgnoredView(state: State.Ignored): VNode {
const { i18n } = useTranslationContext();
@@ -73,13 +61,13 @@ export function InProgressView(state: State.InProgress): VNode {
<section>
<Part
big
- title={<i18n.Translate>Total to refund</i18n.Translate>}
+ title={i18n.str`Total to refund`}
text={<Amount value={state.awaitingAmount} />}
kind="negative"
/>
<Part
big
- title={<i18n.Translate>Refunded</i18n.Translate>}
+ title={i18n.str`Refunded`}
text={<Amount value={state.amount} />}
kind="negative"
/>
@@ -112,21 +100,21 @@ export function ReadyView(state: State.Ready): VNode {
<section>
<Part
big
- title={<i18n.Translate>Order amount</i18n.Translate>}
+ title={i18n.str`Order amount`}
text={<Amount value={state.amount} />}
kind="neutral"
/>
{Amounts.isNonZero(state.granted) && (
<Part
big
- title={<i18n.Translate>Already refunded</i18n.Translate>}
+ title={i18n.str`Already refunded`}
text={<Amount value={state.granted} />}
kind="neutral"
/>
)}
<Part
big
- title={<i18n.Translate>Refund offered</i18n.Translate>}
+ title={i18n.str`Refund offered`}
text={<Amount value={state.awaitingAmount} />}
kind="positive"
/>
@@ -147,11 +135,6 @@ export function ReadyView(state: State.Ready): VNode {
</i18n.Translate>
</Button>
</section>
- <section>
- <Link upperCased onClick={state.cancel}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/Tip/index.ts b/packages/taler-wallet-webextension/src/cta/Tip/index.ts
index 62e0688be..5e56db7bc 100644
--- a/packages/taler-wallet-webextension/src/cta/Tip/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Tip/index.ts
@@ -15,17 +15,13 @@
*/
import { AmountJson } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import {
- AcceptedView,
- IgnoredView,
- LoadingUriView,
- ReadyView,
-} from "./views.js";
+import { AcceptedView, IgnoredView, ReadyView } from "./views.js";
export interface Props {
talerTipUri?: string;
@@ -48,8 +44,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -75,7 +71,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
accepted: AcceptedView,
ignored: IgnoredView,
ready: ReadyView,
diff --git a/packages/taler-wallet-webextension/src/cta/Tip/state.ts b/packages/taler-wallet-webextension/src/cta/Tip/state.ts
index e83755119..29a9c4c71 100644
--- a/packages/taler-wallet-webextension/src/cta/Tip/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Tip/state.ts
@@ -16,7 +16,9 @@
import { Amounts } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -26,6 +28,7 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const tipInfo = useAsyncAsHook(async () => {
if (!talerTipUri) throw Error("ERROR_NO-URI-FOR-TIP");
const tip = await api.wallet.call(WalletApiOperation.PrepareTip, {
@@ -42,10 +45,19 @@ export function useComponentState({
}
if (tipInfo.hasError) {
return {
- status: "loading-uri",
- error: tipInfo,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ tipInfo,
+ ),
};
}
+ // if (tipInfo.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: tipInfo,
+ // };
+ // }
const { tip } = tipInfo.response;
diff --git a/packages/taler-wallet-webextension/src/cta/Tip/test.ts b/packages/taler-wallet-webextension/src/cta/Tip/test.ts
index 5688d82a9..2cc95f424 100644
--- a/packages/taler-wallet-webextension/src/cta/Tip/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Tip/test.ts
@@ -23,8 +23,7 @@ import { Amounts } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { expect } from "chai";
import { tests } from "../../../../web-util/src/index.browser.js";
-import { mountHook, nullFunction } from "../../test-utils.js";
-import { createWalletApiMock } from "../../test-utils.js";
+import { createWalletApiMock, nullFunction } from "../../test-utils.js";
import { Props } from "./index.js";
import { useComponentState } from "./state.js";
@@ -47,11 +46,9 @@ describe("Tip CTA states", () => {
expect(error).undefined;
},
({ status, error }) => {
- expect(status).equals("loading-uri");
+ expect(status).equals("error");
if (!error) expect.fail();
- if (!error.hasError) expect.fail();
- if (error.operational) expect.fail();
- expect(error.message).eq("ERROR_NO-URI-FOR-TIP");
+ expect(error.cause?.message).eq("ERROR_NO-URI-FOR-TIP");
},
],
TestingContext,
diff --git a/packages/taler-wallet-webextension/src/cta/Tip/views.tsx b/packages/taler-wallet-webextension/src/cta/Tip/views.tsx
index fbc93c5ab..000daf19e 100644
--- a/packages/taler-wallet-webextension/src/cta/Tip/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Tip/views.tsx
@@ -14,9 +14,9 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { TranslatedString } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { Amount } from "../../components/Amount.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
import { Link, SubTitle, WalletAction } from "../../components/styled/index.js";
@@ -24,17 +24,6 @@ import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load tip status</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function IgnoredView(state: State.Ignored): VNode {
const { i18n } = useTranslationContext();
return (
@@ -66,18 +55,18 @@ export function ReadyView(state: State.Ready): VNode {
<i18n.Translate>The merchant is offering you a tip</i18n.Translate>
</p>
<Part
- title={<i18n.Translate>Amount</i18n.Translate>}
+ title={i18n.str`Amount`}
text={<Amount value={state.amount} />}
kind="positive"
/>
<Part
- title={<i18n.Translate>Merchant URL</i18n.Translate>}
- text={state.merchantBaseUrl}
+ title={i18n.str`Merchant URL`}
+ text={state.merchantBaseUrl as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Exchange</i18n.Translate>}
- text={state.exchangeBaseUrl}
+ title={i18n.str`Exchange`}
+ text={state.exchangeBaseUrl as TranslatedString}
kind="neutral"
/>
</section>
@@ -92,11 +81,6 @@ export function ReadyView(state: State.Ready): VNode {
</i18n.Translate>
</Button>
</section>
- <section>
- <Link upperCased onClick={state.cancel.onClick}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts b/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts
index 0715bb60e..b191b4efa 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts
@@ -15,12 +15,13 @@
*/
import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler, TextFieldHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
amount: string;
@@ -37,8 +38,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -59,7 +60,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts
index c09a524c8..ecea53848 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts
@@ -22,7 +22,9 @@ import {
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { isFuture, parse } from "date-fns";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -33,6 +35,7 @@ export function useComponentState({
}: Props): State {
const api = useBackendContext();
const amount = Amounts.parseOrThrow(amountStr);
+ const { i18n } = useTranslationContext();
const [subject, setSubject] = useState<string | undefined>();
const [timestamp, setTimestamp] = useState<string | undefined>();
@@ -59,10 +62,19 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
}
+ // if (hook.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
+ // }
const { amountEffective, amountRaw } = hook.response;
const debitAmount = Amounts.parseOrThrow(amountRaw);
diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx
index 0b034e3fb..cee61b3b8 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx
@@ -17,10 +17,8 @@
import { format } from "date-fns";
import { h, VNode } from "preact";
import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
-import { QR } from "../../components/QR.js";
import { Link, SubTitle, WalletAction } from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
@@ -28,17 +26,6 @@ import { TextField } from "../../mui/TextField.js";
import { TransferDetails } from "../../wallet/Transaction.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView({
subject,
expiration,
@@ -80,11 +67,7 @@ export function ReadyView({
</SubTitle>
{operationError && (
<ErrorTalerOperation
- title={
- <i18n.Translate>
- Could not finish the transfer creation
- </i18n.Translate>
- }
+ title={i18n.str`Could not finish the transfer creation`}
error={operationError}
/>
)}
@@ -93,9 +76,7 @@ export function ReadyView({
<TextField
label="Subject"
variant="filled"
- helperText={
- <i18n.Translate>Short description of the transfer</i18n.Translate>
- }
+ helperText={i18n.str`Short description of the transfer`}
error={subject.error}
required
fullWidth
@@ -138,7 +119,7 @@ export function ReadyView({
</p>
</p>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<TransferDetails
amount={{
@@ -154,13 +135,6 @@ export function ReadyView({
<i18n.Translate>Create</i18n.Translate>
</Button>
</section>
- <section>
- <section>
- <Link upperCased onClick={cancel.onClick}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts b/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts
index fe6fb2ada..7bb8785d7 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts
@@ -19,12 +19,13 @@ import {
AmountJson,
TalerErrorDetail,
} from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
talerPayPushUri: string;
@@ -41,8 +42,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-uri";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -62,7 +63,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-uri": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts b/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts
index 82c95b0c6..04fc0e0a7 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts
@@ -22,7 +22,9 @@ import {
} from "@gnu-taler/taler-util";
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -32,6 +34,7 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const hook = useAsyncAsHook(async () => {
return await api.wallet.call(WalletApiOperation.CheckPeerPushPayment, {
talerUri: talerPayPushUri,
@@ -49,10 +52,19 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-uri",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the status of the term of service`,
+ hook,
+ ),
};
}
+ // if (hook.hasError) {
+ // return {
+ // status: "loading-uri",
+ // error: hook,
+ // };
+ // }
const { contractTerms, peerPushPaymentIncomingId } = hook.response;
diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx
index c43b0ff52..d2402db3a 100644
--- a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx
@@ -17,7 +17,6 @@
import { h, VNode } from "preact";
import { Amount } from "../../components/Amount.js";
import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { LogoHeader } from "../../components/LogoHeader.js";
import { Part } from "../../components/Part.js";
import { Link, SubTitle, WalletAction } from "../../components/styled/index.js";
@@ -26,17 +25,6 @@ import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView({
accept,
summary,
@@ -54,25 +42,15 @@ export function ReadyView({
</SubTitle>
{operationError && (
<ErrorTalerOperation
- title={
- <i18n.Translate>
- Could not finish the pickup operation
- </i18n.Translate>
- }
+ title={i18n.str`Could not finish the pickup operation`}
error={operationError}
/>
)}
<section style={{ textAlign: "left" }}>
+ <Part title={i18n.str`Subject`} text={<div>{summary}</div>} />
+ <Part title={i18n.str`Amount`} text={<Amount value={amount} />} />
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={<div>{summary}</div>}
- />
- <Part
- title={<i18n.Translate>Amount</i18n.Translate>}
- text={<Amount value={amount} />}
- />
- <Part
- title={<i18n.Translate>Valid until</i18n.Translate>}
+ title={i18n.str`Valid until`}
text={<Time timestamp={expiration} format="dd MMMM yyyy, HH:mm" />}
kind="neutral"
/>
@@ -84,11 +62,6 @@ export function ReadyView({
</i18n.Translate>
</Button>
</section>
- <section>
- <Link upperCased onClick={cancel.onClick}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</WalletAction>
);
}
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts
index 25d4e44e5..7dfc7c141 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw/index.ts
@@ -27,7 +27,9 @@ import {
import { ExchangeSelectionPage } from "../../wallet/ExchangeSelection/index.js";
import { NoExchangesView } from "../../wallet/ExchangeSelection/views.js";
-import { LoadingInfoView, LoadingUriView, SuccessView } from "./views.js";
+import { SuccessView } from "./views.js";
+import { ErrorAlert } from "../../context/alert.js";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
export interface PropsFromURI {
talerWithdrawUri: string | undefined;
@@ -44,7 +46,6 @@ export interface PropsFromParams {
export type State =
| State.Loading
| State.LoadingUriError
- | State.LoadingInfoError
| SelectExchangeState.NoExchange
| SelectExchangeState.Selecting
| State.Success;
@@ -55,12 +56,8 @@ export namespace State {
error: undefined;
}
export interface LoadingUriError {
- status: "uri-error";
- error: HookError;
- }
- export interface LoadingInfoError {
- status: "amount-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export type Success = {
@@ -86,8 +83,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "uri-error": LoadingUriView,
- "amount-error": LoadingInfoView,
+ error: ErrorAlertView,
"no-exchange": NoExchangesView,
"selecting-exchange": ExchangeSelectionPage,
success: SuccessView,
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
index d1853442b..18c467aae 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
@@ -23,7 +23,9 @@ import {
} from "@gnu-taler/taler-util";
import { TalerError, WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { useSelectedExchange } from "../../hooks/useSelectedExchange.js";
import { RecursiveState } from "../../utils/index.js";
@@ -35,6 +37,7 @@ export function useComponentStateFromParams({
onSuccess,
}: PropsFromParams): RecursiveState<State> {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const uriInfoHook = useAsyncAsHook(async () => {
const exchanges = await api.wallet.call(
WalletApiOperation.ListExchanges,
@@ -47,8 +50,11 @@ export function useComponentStateFromParams({
if (uriInfoHook.hasError) {
return {
- status: "uri-error",
- error: uriInfoHook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the list of exchanges`,
+ uriInfoHook,
+ ),
};
}
@@ -95,6 +101,7 @@ export function useComponentStateFromURI({
onSuccess,
}: PropsFromURI): RecursiveState<State> {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
/**
* Ask the wallet about the withdraw URI
*/
@@ -123,8 +130,11 @@ export function useComponentStateFromURI({
if (uriInfoHook.hasError) {
return {
- status: "uri-error",
- error: uriInfoHook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load info from URI`,
+ uriInfoHook,
+ ),
};
}
@@ -194,6 +204,7 @@ function exchangeSelectionState(
}
return () => {
+ const { i18n } = useTranslationContext();
const [ageRestricted, setAgeRestricted] = useState(0);
const currentExchange = selectedExchange.selected;
const tosNeedToBeAccepted =
@@ -255,8 +266,11 @@ function exchangeSelectionState(
}
if (amountHook.hasError) {
return {
- status: "amount-error",
- error: amountHook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load the withdrawal details`,
+ amountHook,
+ ),
};
}
if (!amountHook.response) {
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts
index 3277ac18d..2caa50dca 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw/test.ts
@@ -84,11 +84,11 @@ describe("Withdraw CTA states", () => {
expect(status).equals("loading");
},
({ status, error }) => {
- if (status != "uri-error") expect.fail();
+ if (status != "error") expect.fail();
if (!error) expect.fail();
- if (!error.hasError) expect.fail();
- if (error.operational) expect.fail();
- expect(error.message).eq("ERROR_NO-URI-FOR-WITHDRAWAL");
+ // if (!error.hasError) expect.fail();
+ // if (error.operational) expect.fail();
+ expect(error.cause?.message).eq("ERROR_NO-URI-FOR-WITHDRAWAL");
},
],
TestingContext,
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx
index 9dbe24b7e..cf87b35bb 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw/views.tsx
@@ -19,16 +19,10 @@ import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
import { Amount } from "../../components/Amount.js";
import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { Part } from "../../components/Part.js";
import { QR } from "../../components/QR.js";
import { SelectList } from "../../components/SelectList.js";
-import {
- Input,
- Link,
- LinkSuccess,
- SvgIcon,
-} from "../../components/styled/index.js";
+import { Input, LinkSuccess, SvgIcon } from "../../components/styled/index.js";
import { TermsOfService } from "../../components/TermsOfService/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
@@ -36,30 +30,6 @@ import editIcon from "../../svg/edit_24px.svg";
import { ExchangeDetails, WithdrawDetails } from "../../wallet/Transaction.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={
- <i18n.Translate>Could not get the info from the URI</i18n.Translate>
- }
- error={error}
- />
- );
-}
-
-export function LoadingInfoView({ error }: State.LoadingInfoError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not get info of withdrawal</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function SuccessView(state: State.Success): VNode {
const { i18n } = useTranslationContext();
const currentTosVersionIsAccepted =
@@ -68,11 +38,7 @@ export function SuccessView(state: State.Success): VNode {
<Fragment>
{state.doWithdrawal.error && (
<ErrorTalerOperation
- title={
- <i18n.Translate>
- Could not finish the withdrawal operation
- </i18n.Translate>
- }
+ title={i18n.str`Could not finish the withdrawal operation`}
error={state.doWithdrawal.error.errorDetail}
/>
)}
@@ -103,7 +69,7 @@ export function SuccessView(state: State.Success): VNode {
big
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<WithdrawDetails
amount={{
@@ -116,7 +82,7 @@ export function SuccessView(state: State.Success): VNode {
{state.ageRestriction && (
<Input>
<SelectList
- label={<i18n.Translate>Age restriction</i18n.Translate>}
+ label={i18n.str`Age restriction`}
list={state.ageRestriction.list}
name="age"
value={state.ageRestriction.value}
@@ -148,11 +114,6 @@ export function SuccessView(state: State.Success): VNode {
{state.talerWithdrawUri ? (
<WithdrawWithMobile talerWithdrawUri={state.talerWithdrawUri} />
) : undefined}
- <section>
- <Link upperCased onClick={state.cancel}>
- <i18n.Translate>Cancel</i18n.Translate>
- </Link>
- </section>
</Fragment>
);
}
@@ -168,11 +129,7 @@ function WithdrawWithMobile({
return (
<section>
<LinkSuccess upperCased onClick={() => setShowQR((qr) => !qr)}>
- {!showQR ? (
- <i18n.Translate>Withdraw to a mobile phone</i18n.Translate>
- ) : (
- <i18n.Translate>Hide QR</i18n.Translate>
- )}
+ {!showQR ? i18n.str`Withdraw to a mobile phone` : i18n.str`Hide QR`}
</LinkSuccess>
{showQR && (
<div>
diff --git a/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts b/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts
index 1b2929317..978ea90e1 100644
--- a/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts
+++ b/packages/taler-wallet-webextension/src/hooks/useAsyncAsHook.ts
@@ -16,6 +16,7 @@
import { TalerErrorDetail } from "@gnu-taler/taler-util";
import { TalerError } from "@gnu-taler/taler-wallet-core";
import { useEffect, useMemo, useState } from "preact/hooks";
+import { WalletError } from "../wxApi.js";
export interface HookOk<T> {
hasError: false;
@@ -26,13 +27,14 @@ export type HookError = HookGenericError | HookOperationalError;
export interface HookGenericError {
hasError: true;
- operational: false;
+ type: "error";
message: string;
}
export interface HookOperationalError {
hasError: true;
- operational: true;
+ type: "taler";
+ message: string;
details: TalerErrorDetail;
}
@@ -68,13 +70,21 @@ export function useAsyncAsHook<T>(
if (e instanceof TalerError) {
setHookResponse({
hasError: true,
- operational: true,
+ type: "taler",
+ message: e.message,
details: e.errorDetail,
});
+ } else if (e instanceof WalletError) {
+ setHookResponse({
+ hasError: true,
+ type: "taler",
+ message: e.message,
+ details: e.errorDetail.errorDetail,
+ });
} else if (e instanceof Error) {
setHookResponse({
hasError: true,
- operational: false,
+ type: "error",
message: e.message,
});
}
diff --git a/packages/taler-wallet-webextension/src/hooks/useLang.ts b/packages/taler-wallet-webextension/src/hooks/useLang.ts
index 269fe6239..b1aa40015 100644
--- a/packages/taler-wallet-webextension/src/hooks/useLang.ts
+++ b/packages/taler-wallet-webextension/src/hooks/useLang.ts
@@ -17,6 +17,7 @@
import { useNotNullLocalStorage } from "./useLocalStorage.js";
function getBrowserLang(): string | undefined {
+ if (typeof window === "undefined") return undefined;
if (window.navigator.languages) return window.navigator.languages[0];
if (window.navigator.language) return window.navigator.language;
return undefined;
diff --git a/packages/taler-wallet-webextension/src/hooks/useLocalStorage.ts b/packages/taler-wallet-webextension/src/hooks/useLocalStorage.ts
index 88b7655b6..387798c96 100644
--- a/packages/taler-wallet-webextension/src/hooks/useLocalStorage.ts
+++ b/packages/taler-wallet-webextension/src/hooks/useLocalStorage.ts
@@ -75,6 +75,9 @@ export function useNotNullLocalStorage(
}
};
- const isSaved = window.localStorage.getItem(key) !== null;
+ const isSaved =
+ typeof window === "undefined"
+ ? false
+ : window.localStorage.getItem(key) !== null;
return [storedValue, setValue, isSaved];
}
diff --git a/packages/taler-wallet-webextension/src/mui/Alert.stories.tsx b/packages/taler-wallet-webextension/src/mui/Alert.stories.tsx
index 62f7a2993..b0c2a2730 100644
--- a/packages/taler-wallet-webextension/src/mui/Alert.stories.tsx
+++ b/packages/taler-wallet-webextension/src/mui/Alert.stories.tsx
@@ -19,6 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
+import { TranslatedString } from "@gnu-taler/taler-util";
import { css } from "@linaria/core";
import { ComponentChildren, Fragment, h, VNode } from "preact";
import { Alert } from "./Alert.jsx";
@@ -53,16 +54,16 @@ export const BasicExample = (): VNode => (
export const WithTitle = (): VNode => (
<Wrapper>
- <Alert title="Warning" severity="warning">
+ <Alert title={"Warning" as TranslatedString} severity="warning">
this is an warning
</Alert>
- <Alert title="Error" severity="error">
+ <Alert title={"Error" as TranslatedString} severity="error">
this is an error
</Alert>
- <Alert title="Success" severity="success">
+ <Alert title={"Success" as TranslatedString} severity="success">
this is an success
</Alert>
- <Alert title="Info" severity="info">
+ <Alert title={"Info" as TranslatedString} severity="info">
this is an info
</Alert>
</Wrapper>
@@ -74,16 +75,32 @@ const showSomething = async function (): Promise<void> {
export const WithAction = (): VNode => (
<Wrapper>
- <Alert title="Warning" severity="warning" onClose={showSomething}>
+ <Alert
+ title={"Warning" as TranslatedString}
+ severity="warning"
+ onClose={showSomething}
+ >
this is an warning
</Alert>
- <Alert title="Error" severity="error" onClose={showSomething}>
+ <Alert
+ title={"Error" as TranslatedString}
+ severity="error"
+ onClose={showSomething}
+ >
this is an error
</Alert>
- <Alert title="Success" severity="success" onClose={showSomething}>
+ <Alert
+ title={"Success" as TranslatedString}
+ severity="success"
+ onClose={showSomething}
+ >
this is an success
</Alert>
- <Alert title="Info" severity="info" onClose={showSomething}>
+ <Alert
+ title={"Info" as TranslatedString}
+ severity="info"
+ onClose={showSomething}
+ >
this is an info
</Alert>
</Wrapper>
diff --git a/packages/taler-wallet-webextension/src/mui/Alert.tsx b/packages/taler-wallet-webextension/src/mui/Alert.tsx
index 360c3c3cb..b00312a86 100644
--- a/packages/taler-wallet-webextension/src/mui/Alert.tsx
+++ b/packages/taler-wallet-webextension/src/mui/Alert.tsx
@@ -13,6 +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 { TranslatedString } from "@gnu-taler/taler-util";
import { css } from "@linaria/core";
import { ComponentChildren, h, VNode } from "preact";
// eslint-disable-next-line import/extensions
@@ -61,7 +62,7 @@ const colorVariant = {
};
interface Props {
- title?: string;
+ title?: TranslatedString;
variant?: "filled" | "outlined" | "standard";
role?: string;
onClose?: () => Promise<void>;
@@ -110,20 +111,20 @@ function Message({
title,
children,
}: {
- title?: string;
+ title?: TranslatedString;
children: ComponentChildren;
}): VNode {
return (
<div
class={css`
padding: 8px 0px;
- width: 100%;
+ width: 90%;
`}
>
{title && (
<Typography
class={css`
- font-weight: ${theme.typography.fontWeightMedium};
+ font-weight: ${theme.typography.fontWeightBold};
`}
gutterBottom
>
@@ -160,6 +161,7 @@ export function Alert({
"--color-main": theme.palette[severity].main,
"--color-light": theme.palette[severity].light,
// ...(style as any),
+ textAlign: "left",
}}
elevation={1}
>
diff --git a/packages/taler-wallet-webextension/src/mui/Paper.tsx b/packages/taler-wallet-webextension/src/mui/Paper.tsx
index 3b5f24bc1..0c805e307 100644
--- a/packages/taler-wallet-webextension/src/mui/Paper.tsx
+++ b/packages/taler-wallet-webextension/src/mui/Paper.tsx
@@ -29,9 +29,6 @@ const borderVariant = {
`,
};
const baseStyle = css`
- background-color: ${theme.palette.background.paper};
- color: ${theme.palette.text.primary};
-
.theme-dark & {
background-image: var(--gradient-white-elevation);
}
diff --git a/packages/taler-wallet-webextension/src/mui/colors/manipulation.ts b/packages/taler-wallet-webextension/src/mui/colors/manipulation.ts
index 226d3c860..f9bf9eb2b 100644
--- a/packages/taler-wallet-webextension/src/mui/colors/manipulation.ts
+++ b/packages/taler-wallet-webextension/src/mui/colors/manipulation.ts
@@ -57,7 +57,7 @@ export function hexToRgb(color: string): string {
let colors = color.match(re);
if (colors && colors[0].length === 1) {
- colors = colors.map((n) => n + n);
+ colors = colors.map((n) => n + n) as RegExpMatchArray;
}
return colors
diff --git a/packages/taler-wallet-webextension/src/platform/api.ts b/packages/taler-wallet-webextension/src/platform/api.ts
index cd09f6438..40993477b 100644
--- a/packages/taler-wallet-webextension/src/platform/api.ts
+++ b/packages/taler-wallet-webextension/src/platform/api.ts
@@ -146,9 +146,9 @@ export interface BackgroundPlatformAPI {
*/
getPermissionsApi(): CrossBrowserPermissionsApi;
/**
- * Used by the wallet backend to send notification about new information
- * @param message
- */
+ * Used by the wallet backend to send notification about new information
+ * @param message
+ */
sendMessageToAllChannels(message: MessageFromBackend): void;
/**
@@ -196,7 +196,6 @@ export interface ForegroundPlatformAPI {
*/
openWalletURIFromPopup(talerUri: string): void;
-
/**
* Popup API
*
@@ -248,5 +247,4 @@ export interface ForegroundPlatformAPI {
listenToWalletBackground(
listener: (message: MessageFromBackend) => void,
): () => void;
-
}
diff --git a/packages/taler-wallet-webextension/src/platform/chrome.ts b/packages/taler-wallet-webextension/src/platform/chrome.ts
index e5efdec4e..fc51a65fb 100644
--- a/packages/taler-wallet-webextension/src/platform/chrome.ts
+++ b/packages/taler-wallet-webextension/src/platform/chrome.ts
@@ -14,17 +14,17 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import {
- classifyTalerUri, Logger,
- TalerUriType
-} from "@gnu-taler/taler-util";
+import { classifyTalerUri, Logger, TalerUriType } from "@gnu-taler/taler-util";
import { WalletOperations } from "@gnu-taler/taler-wallet-core";
import { BackgroundOperations } from "../wxApi.js";
import {
- BackgroundPlatformAPI, CrossBrowserPermissionsApi, ForegroundPlatformAPI, MessageFromBackend,
+ BackgroundPlatformAPI,
+ CrossBrowserPermissionsApi,
+ ForegroundPlatformAPI,
+ MessageFromBackend,
MessageFromFrontend,
MessageResponse,
- Permissions
+ Permissions,
} from "./api.js";
const api: BackgroundPlatformAPI & ForegroundPlatformAPI = {
@@ -306,13 +306,12 @@ function openWalletPageFromPopup(page: string): void {
});
}
-
let nextMessageIndex = 0;
/**
* To be used by the foreground
- * @param message
- * @returns
+ * @param message
+ * @returns
*/
async function sendMessageToBackground<
Op extends WalletOperations | BackgroundOperations,
@@ -321,13 +320,13 @@ async function sendMessageToBackground<
return new Promise<any>((resolve, reject) => {
logger.trace("send operation to the wallet background", message);
- let timedout = false
+ let timedout = false;
setTimeout(() => {
- timedout = true
- reject("timedout")
+ timedout = true;
+ reject("timedout");
}, 2000);
chrome.runtime.sendMessage(messageWithId, (backgroundResponse) => {
- if (timedout) return false
+ if (timedout) return false;
if (chrome.runtime.lastError) {
reject(chrome.runtime.lastError.message);
} else {
@@ -358,7 +357,6 @@ function listenToWalletBackground(listener: (m: any) => void): () => void {
const allPorts: chrome.runtime.Port[] = [];
-
function sendMessageToAllChannels(message: MessageFromBackend): void {
for (const notif of allPorts) {
// const message: MessageFromBackend = { type: msg.type };
@@ -578,26 +576,26 @@ function setAlertedIcon(): void {
interface OffscreenCanvasRenderingContext2D
extends CanvasState,
- CanvasTransform,
- CanvasCompositing,
- CanvasImageSmoothing,
- CanvasFillStrokeStyles,
- CanvasShadowStyles,
- CanvasFilters,
- CanvasRect,
- CanvasDrawPath,
- CanvasUserInterface,
- CanvasText,
- CanvasDrawImage,
- CanvasImageData,
- CanvasPathDrawingStyles,
- CanvasTextDrawingStyles,
- CanvasPath {
+ CanvasTransform,
+ CanvasCompositing,
+ CanvasImageSmoothing,
+ CanvasFillStrokeStyles,
+ CanvasShadowStyles,
+ CanvasFilters,
+ CanvasRect,
+ CanvasDrawPath,
+ CanvasUserInterface,
+ CanvasText,
+ CanvasDrawImage,
+ CanvasImageData,
+ CanvasPathDrawingStyles,
+ CanvasTextDrawingStyles,
+ CanvasPath {
readonly canvas: OffscreenCanvas;
}
declare const OffscreenCanvasRenderingContext2D: {
prototype: OffscreenCanvasRenderingContext2D;
- new(): OffscreenCanvasRenderingContext2D;
+ new (): OffscreenCanvasRenderingContext2D;
};
interface OffscreenCanvas extends EventTarget {
@@ -610,7 +608,7 @@ interface OffscreenCanvas extends EventTarget {
}
declare const OffscreenCanvas: {
prototype: OffscreenCanvas;
- new(width: number, height: number): OffscreenCanvas;
+ new (width: number, height: number): OffscreenCanvas;
};
function createCanvas(size: number): OffscreenCanvas {
diff --git a/packages/taler-wallet-webextension/src/platform/firefox.ts b/packages/taler-wallet-webextension/src/platform/firefox.ts
index a36859a0b..7f6980be7 100644
--- a/packages/taler-wallet-webextension/src/platform/firefox.ts
+++ b/packages/taler-wallet-webextension/src/platform/firefox.ts
@@ -14,7 +14,12 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { BackgroundPlatformAPI, CrossBrowserPermissionsApi, ForegroundPlatformAPI, Permissions } from "./api.js";
+import {
+ BackgroundPlatformAPI,
+ CrossBrowserPermissionsApi,
+ ForegroundPlatformAPI,
+ Permissions,
+} from "./api.js";
import chromePlatform, {
containsHostPermissions as chromeHostContains,
removeHostPermissions as chromeHostRemove,
diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
index 8786b2ff7..96f0f6dd9 100644
--- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
@@ -19,12 +19,13 @@ import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { Fragment, h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks";
import { BalanceTable } from "../components/BalanceTable.js";
+import { ErrorAlertView } from "../components/CurrentAlerts.js";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import { MultiActionButton } from "../components/MultiActionButton.js";
+import { alertFromError, ErrorAlert } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
-import { HookError, useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
+import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
import { Button } from "../mui/Button.js";
import { ButtonHandler } from "../mui/handlers.js";
import { compose, StateViewMap } from "../utils/index.js";
@@ -47,7 +48,7 @@ export namespace State {
export interface Error {
status: "error";
- error: HookError;
+ error: ErrorAlert;
}
export interface Action {
@@ -73,6 +74,7 @@ function useComponentState({
goToWalletManualWithdraw,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const [addingAction, setAddingAction] = useState(false);
const state = useAsyncAsHook(() =>
api.wallet.call(WalletApiOperation.GetBalances, {}),
@@ -94,7 +96,7 @@ function useComponentState({
if (state.hasError) {
return {
status: "error",
- error: state,
+ error: alertFromError(i18n.str`Could not load the balance`, state),
};
}
if (addingAction) {
@@ -123,7 +125,7 @@ function useComponentState({
const viewMapping: StateViewMap<State> = {
loading: Loading,
- error: ErrorView,
+ error: ErrorAlertView,
action: ActionView,
balance: BalanceView,
};
@@ -134,16 +136,6 @@ export const BalancePage = compose(
viewMapping,
);
-function ErrorView({ error }: State.Error): VNode {
- const { i18n } = useTranslationContext();
- return (
- <LoadingError
- title={<i18n.Translate>Could not load balance page</i18n.Translate>}
- error={error}
- />
- );
-}
-
function ActionView({ cancel }: State.Action): VNode {
return <AddNewActionView onCancel={cancel.onClick!} />;
}
@@ -179,7 +171,7 @@ export function BalanceView(state: State.Balances): VNode {
</Button>
{currencyWithNonZeroAmount.length > 0 && (
<MultiActionButton
- label={(s) => <i18n.Translate>Send {s}</i18n.Translate>}
+ label={(s) => i18n.str`Send ${s}`}
actions={currencyWithNonZeroAmount}
onClick={(c) => state.goToWalletDeposit(c)}
/>
diff --git a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
index 7d2e15726..5eb31ba46 100644
--- a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
+++ b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
@@ -33,7 +33,7 @@ export function NoBalanceHelp({
const { i18n } = useTranslationContext();
return (
<Paper class={margin}>
- <Alert title="Your wallet is empty." severity="info">
+ <Alert title={i18n.str`Your wallet is empty.`} severity="info">
<Button
fullWidth
color="info"
diff --git a/packages/taler-wallet-webextension/src/svg/progress.svg b/packages/taler-wallet-webextension/src/svg/progress.svg
new file mode 100644
index 000000000..c7284a545
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/svg/progress.svg
@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;background:#fff;display:block;" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+ <defs>
+ <clipPath id="progress-cp" x="0" y="0" width="100" height="100">
+ <rect x="0" y="0" width="0" height="100">
+ <animate attributeName="width" repeatCount="indefinite" dur="2s" values="0;100;100" keyTimes="0;0.5;1"></animate>
+ <animate attributeName="x" repeatCount="indefinite" dur="2s" values="0;0;100" keyTimes="0;0.5;1"></animate>
+ </rect>
+ </clipPath>
+ </defs>
+ <path fill="none" stroke="darkgrey" stroke-width="1.04" d="M10.000000000000004 44.019999999999996L89.99999999999999 44.019999999999996A5.98 5.98 0 0 1 95.97999999999999 50L95.97999999999999 50A5.98 5.98 0 0 1 89.99999999999999 55.980000000000004L10.000000000000004 55.980000000000004A5.98 5.98 0 0 1 4.020000000000003 50L4.020000000000003 50A5.98 5.98 0 0 1 10.000000000000004 44.019999999999996 Z"></path>
+ <path fill="#0042b2" clip-path="url(#progress-cp)" d="M10.000000000000004 45.54L90 45.54A4.460000000000001 4.460000000000001 0 0 1 94.46 50L94.46 50A4.460000000000001 4.460000000000001 0 0 1 90 54.46L10.000000000000004 54.46A4.460000000000001 4.460000000000001 0 0 1 5.540000000000003 50L5.540000000000003 50A4.460000000000001 4.460000000000001 0 0 1 10.000000000000004 45.54 Z"></path>
+</svg> \ No newline at end of file
diff --git a/packages/taler-wallet-webextension/src/test-utils.ts b/packages/taler-wallet-webextension/src/test-utils.ts
index 379513782..7e7ddd88d 100644
--- a/packages/taler-wallet-webextension/src/test-utils.ts
+++ b/packages/taler-wallet-webextension/src/test-utils.ts
@@ -32,6 +32,7 @@ import {
} from "preact";
import { render as renderToString } from "preact-render-to-string";
import { BackendProvider } from "./context/backend.js";
+import { TranslationProvider } from "./context/translation.js";
import { BackgroundApiClient, wxApi } from "./wxApi.js";
// When doing tests we want the requestAnimationFrame to be as fast as possible.
@@ -359,10 +360,12 @@ export function createWalletApiMock(): {
};
function TestingContext({
- children,
+ children: _cs,
}: {
children: ComponentChildren;
}): VNode {
+ let children = _cs;
+ children = create(TranslationProvider, { children }, children);
return create(
BackendProvider,
{
diff --git a/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/index.ts b/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/index.ts
index 10fcd84ce..4ec4c0ffe 100644
--- a/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/index.ts
@@ -16,8 +16,9 @@
import { TalerErrorDetail } from "@gnu-taler/taler-util";
import { SyncTermsOfServiceResponse } from "@gnu-taler/taler-wallet-core";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import {
ButtonHandler,
TextFieldHandler,
@@ -25,11 +26,7 @@ import {
} from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import {
- ConfirmProviderView,
- LoadingUriView,
- SelectProviderView,
-} from "./views.js";
+import { ConfirmProviderView, SelectProviderView } from "./views.js";
export interface Props {
onBack: () => Promise<void>;
@@ -50,8 +47,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface ConfirmProvider {
@@ -77,7 +74,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
"select-provider": SelectProviderView,
"confirm-provider": ConfirmProviderView,
};
diff --git a/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/views.tsx b/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/views.tsx
index b633a595f..c3afc0d33 100644
--- a/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/AddBackupProvider/views.tsx
@@ -17,12 +17,10 @@
import { Amounts } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { Checkbox } from "../../components/Checkbox.js";
-import { LoadingError } from "../../components/LoadingError.js";
import {
LightText,
SmallLightText,
SubTitle,
- TermsOfService,
Title,
} from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
@@ -30,17 +28,6 @@ import { Button } from "../../mui/Button.js";
import { TextField } from "../../mui/TextField.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ConfirmProviderView({
url,
provider,
@@ -88,9 +75,8 @@ export function ConfirmProviderView({
of service
</i18n.Translate>
</p>
- {/* replace with <TermsOfService /> */}
<Checkbox
- label={<i18n.Translate>Accept terms of service</i18n.Translate>}
+ label={i18n.str`Accept terms of service`}
name="terms"
onToggle={tos.button.onClick}
enabled={tos.value}
diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index 372db847c..46fe02225 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -25,13 +25,17 @@ import { createHashHistory } from "history";
import { ComponentChildren, Fragment, h, VNode } from "preact";
import Router, { route, Route } from "preact-router";
import { useEffect } from "preact/hooks";
+import { CurrentAlerts } from "../components/CurrentAlerts.js";
import { LogoHeader } from "../components/LogoHeader.js";
import PendingTransactions from "../components/PendingTransactions.js";
import {
+ Link,
+ LinkPrimary,
SubTitle,
WalletAction,
WalletBox,
} from "../components/styled/index.js";
+import { AlertProvider } from "../context/alert.js";
import { DevContextProvider } from "../context/devContext.js";
import { IoCProviderForRuntime } from "../context/iocContext.js";
import {
@@ -66,6 +70,7 @@ import { QrReaderPage } from "./QrReader.js";
import { SettingsPage } from "./Settings.js";
import { TransactionPage } from "./Transaction.js";
import { WelcomePage } from "./Welcome.js";
+import CloseIcon from "../svg/close_24px.svg";
export function Application(): VNode {
const { i18n } = useTranslationContext();
@@ -495,15 +500,6 @@ function matchesRoute(url: string, route: string): boolean {
return !result ? false : true;
}
-function shouldShowPendingOperations(url: string): boolean {
- return [
- Pages.balanceHistory.pattern,
- Pages.dev,
- Pages.settings,
- Pages.backup,
- ].some((p) => matchesRoute(url, p));
-}
-
function CallToActionTemplate({
title,
children,
@@ -511,11 +507,35 @@ function CallToActionTemplate({
title: TranslatedString;
children: ComponentChildren;
}): VNode {
+ const { i18n } = useTranslationContext();
return (
<WalletAction>
<LogoHeader />
+ <section style={{ display: "flex", justifyContent: "right", margin: 0 }}>
+ <LinkPrimary href={Pages.balance}>
+ <div
+ style={{
+ height: 24,
+ width: 24,
+ marginLeft: 4,
+ marginRight: 4,
+ border: "1px solid black",
+ borderRadius: 12,
+ }}
+ dangerouslySetInnerHTML={{ __html: CloseIcon }}
+ />
+ </LinkPrimary>
+ </section>
<SubTitle>{title}</SubTitle>
- {children}
+ <AlertProvider>
+ <CurrentAlerts />
+ {children}
+ </AlertProvider>
+ <section style={{ display: "flex", justifyContent: "right" }}>
+ <LinkPrimary href={Pages.balance}>
+ <i18n.Translate>Return to wallet</i18n.Translate>
+ </LinkPrimary>
+ </section>
</WalletAction>
);
}
@@ -536,7 +556,10 @@ function WalletTemplate({
{goToTransaction ? (
<PendingTransactions goToTransaction={goToTransaction} />
) : undefined}
- <WalletBox>{children}</WalletBox>
+ <CurrentAlerts />
+ <WalletBox>
+ <AlertProvider>{children}</AlertProvider>
+ </WalletBox>
</Fragment>
);
}
diff --git a/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx b/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
index 6e987f965..48c9c9cb1 100644
--- a/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
@@ -29,8 +29,8 @@ import {
} from "date-fns";
import { Fragment, h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks";
+import { AlertView } from "../components/CurrentAlerts.js";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import { QR } from "../components/QR.js";
import {
BoldLight,
@@ -42,6 +42,7 @@ import {
SmallText,
WarningBox,
} from "../components/styled/index.js";
+import { alertFromError } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
@@ -117,9 +118,11 @@ export function BackupPage({ onAddProvider }: Props): VNode {
}
if (status.hasError) {
return (
- <LoadingError
- title={<i18n.Translate>Could not load backup providers</i18n.Translate>}
- error={status}
+ <AlertView
+ alert={alertFromError(
+ i18n.str`Could not load backup providers`,
+ status,
+ )}
/>
);
}
@@ -219,11 +222,9 @@ export function BackupView({
</div>
<div>
<Button variant="contained" onClick={onSyncAll}>
- {providers.length > 1 ? (
- <i18n.Translate>Sync all backups</i18n.Translate>
- ) : (
- <i18n.Translate>Sync now</i18n.Translate>
- )}
+ {providers.length > 1
+ ? i18n.str`Sync all backups`
+ : i18n.str`Sync now`}
</Button>
<Button variant="contained" color="success" onClick={onAddProvider}>
<i18n.Translate>Add provider</i18n.Translate>
diff --git a/packages/taler-wallet-webextension/src/wallet/DepositPage/index.ts b/packages/taler-wallet-webextension/src/wallet/DepositPage/index.ts
index 6ffbccc27..6de406400 100644
--- a/packages/taler-wallet-webextension/src/wallet/DepositPage/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DepositPage/index.ts
@@ -15,8 +15,9 @@
*/
import { AmountJson, PaytoUri } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import {
AmountFieldHandler,
ButtonHandler,
@@ -27,7 +28,6 @@ import { ManageAccountPage } from "../ManageAccount/index.js";
import { useComponentState } from "./state.js";
import {
AmountOrCurrencyErrorView,
- LoadingErrorView,
NoAccountToDepositView,
NoEnoughBalanceView,
ReadyView,
@@ -56,8 +56,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface AddingAccount {
@@ -107,7 +107,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingErrorView,
+ error: ErrorAlertView,
"amount-or-currency-error": AmountOrCurrencyErrorView,
"no-enough-balance": NoEnoughBalanceView,
"no-accounts": NoAccountToDepositView,
diff --git a/packages/taler-wallet-webextension/src/wallet/DepositPage/state.ts b/packages/taler-wallet-webextension/src/wallet/DepositPage/state.ts
index 02e85a1c7..b597c77be 100644
--- a/packages/taler-wallet-webextension/src/wallet/DepositPage/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DepositPage/state.ts
@@ -25,7 +25,9 @@ import {
} from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -36,6 +38,7 @@ export function useComponentState({
onSuccess,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const parsed = amountStr === undefined ? undefined : Amounts.parse(amountStr);
const currency = parsed !== undefined ? parsed.currency : currencyStr;
@@ -82,8 +85,8 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-error",
- error: hook,
+ status: "error",
+ error: alertFromError(i18n.str`Could not load balance information`, hook),
};
}
const { accounts, balances } = hook.response;
diff --git a/packages/taler-wallet-webextension/src/wallet/DepositPage/views.tsx b/packages/taler-wallet-webextension/src/wallet/DepositPage/views.tsx
index 6a28f31e1..0d827db43 100644
--- a/packages/taler-wallet-webextension/src/wallet/DepositPage/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DepositPage/views.tsx
@@ -18,31 +18,13 @@ import { Amounts, PaytoUri } from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
import { AmountField } from "../../components/AmountField.js";
import { ErrorMessage } from "../../components/ErrorMessage.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { SelectList } from "../../components/SelectList.js";
-import {
- ErrorText,
- Input,
- InputWithLabel,
- SubTitle,
- WarningBox,
-} from "../../components/styled/index.js";
+import { Input, SubTitle, WarningBox } from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
import { Grid } from "../../mui/Grid.js";
import { State } from "./index.js";
-export function LoadingErrorView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load deposit balance</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function AmountOrCurrencyErrorView(
p: State.AmountOrCurrencyError,
): VNode {
@@ -50,11 +32,7 @@ export function AmountOrCurrencyErrorView(
return (
<ErrorMessage
- title={
- <i18n.Translate>
- A currency or an amount should be indicated
- </i18n.Translate>
- }
+ title={i18n.str`A currency or an amount should be indicated`}
/>
);
}
@@ -66,11 +44,7 @@ export function NoEnoughBalanceView({
return (
<ErrorMessage
- title={
- <i18n.Translate>
- There is no enough balance to make a deposit for currency {currency}
- </i18n.Translate>
- }
+ title={i18n.str`There is no enough balance to make a deposit for currency ${currency}`}
/>
);
}
@@ -150,7 +124,7 @@ export function ReadyView(state: State.Ready): VNode {
>
<Input>
<SelectList
- label={<i18n.Translate>Select account</i18n.Translate>}
+ label={i18n.str`Select account`}
list={state.account.list}
name="account"
value={state.account.value}
@@ -171,14 +145,11 @@ export function ReadyView(state: State.Ready): VNode {
</p>
<Grid container spacing={2} columns={1}>
<Grid item xs={1}>
- <AmountField
- label={<i18n.Translate>Amount</i18n.Translate>}
- handler={state.amount}
- />
+ <AmountField label={i18n.str`Amount`} handler={state.amount} />
</Grid>
<Grid item xs={1}>
<AmountField
- label={<i18n.Translate>Deposit fee</i18n.Translate>}
+ label={i18n.str`Deposit fee`}
handler={{
value: state.totalFee,
}}
@@ -186,7 +157,7 @@ export function ReadyView(state: State.Ready): VNode {
</Grid>
<Grid item xs={1}>
<AmountField
- label={<i18n.Translate>Total deposit</i18n.Translate>}
+ label={i18n.str`Total deposit`}
handler={{
value: state.totalToDeposit,
}}
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts
index f1e766a18..bd6b32e78 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts
@@ -14,12 +14,13 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { AmountFieldHandler, ButtonHandler } from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView, SelectCurrencyView } from "./views.js";
+import { ReadyView, SelectCurrencyView } from "./views.js";
export type Props = PropsGet | PropsSend;
@@ -49,8 +50,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface SelectCurrency {
@@ -80,7 +81,7 @@ export type Contact = {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
"select-currency": SelectCurrencyView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
index dd711f406..1fe324c5a 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
@@ -17,7 +17,9 @@
import { Amounts } from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { assertUnreachable, RecursiveState } from "../../utils/index.js";
import { Contact, Props, State } from "./index.js";
@@ -59,6 +61,8 @@ export function useComponentState(props: Props): RecursiveState<State> {
if (!amount) {
return () => {
// eslint-disable-next-line react-hooks/rules-of-hooks
+ const { i18n } = useTranslationContext();
+ // eslint-disable-next-line react-hooks/rules-of-hooks
const hook = useAsyncAsHook(() =>
api.wallet.call(WalletApiOperation.ListExchanges, {}),
);
@@ -71,8 +75,8 @@ export function useComponentState(props: Props): RecursiveState<State> {
}
if (hook.hasError) {
return {
- status: "loading-error",
- error: hook,
+ status: "error",
+ error: alertFromError(i18n.str`Could not load exchanges`, hook),
};
}
const currencies: Record<string, string> = {};
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
index a9a4b2e41..8a7a1fa97 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
@@ -16,7 +16,7 @@
import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
+import { AmountField } from "../../components/AmountField.js";
import { SelectList } from "../../components/SelectList.js";
import {
Input,
@@ -25,24 +25,14 @@ import {
SvgIcon,
} from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
-import { Pages } from "../../NavigationBar.js";
-import { Contact, State } from "./index.js";
-import arrowIcon from "../../svg/chevron-down.svg";
-import { AmountField } from "../../components/AmountField.js";
+import { Button } from "../../mui/Button.js";
import { Grid } from "../../mui/Grid.js";
import { Paper } from "../../mui/Paper.js";
-import { Button } from "../../mui/Button.js";
+import { Pages } from "../../NavigationBar.js";
+import arrowIcon from "../../svg/chevron-down.svg";
+import bankIcon from "../../svg/ri-bank-line.svg";
import { assertUnreachable } from "../../utils/index.js";
-
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
+import { Contact, State } from "./index.js";
export function SelectCurrencyView({
currencies,
@@ -61,7 +51,7 @@ export function SelectCurrencyView({
<p>
<Input>
<SelectList
- label={<i18n.Translate>Known currencies</i18n.Translate>}
+ label={i18n.str`Known currencies`}
list={currencies}
name="lang"
value={""}
@@ -214,7 +204,7 @@ export function ReadyGetView({
</h1>
<Grid container columns={2} justifyContent="space-between">
<AmountField
- label={<i18n.Translate>Amount</i18n.Translate>}
+ label={i18n.str`Amount`}
required
handler={amountHandler}
/>
@@ -304,7 +294,7 @@ export function ReadySendView({
<div>
<AmountField
- label={<i18n.Translate>Amount</i18n.Translate>}
+ label={i18n.str`Amount`}
required
handler={amountHandler}
/>
@@ -377,7 +367,6 @@ export function ReadySendView({
</Container>
);
}
-import bankIcon from "../../svg/ri-bank-line.svg";
function RowExample({
info,
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts
index 95badb218..afbaf1945 100644
--- a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts
@@ -14,11 +14,12 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
p: string;
@@ -33,8 +34,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -48,7 +49,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx
index 5784a7db5..dc8a42b84 100644
--- a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx
@@ -15,21 +15,9 @@
*/
import { h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
import { useTranslationContext } from "../../context/translation.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView({ error }: State.Ready): VNode {
const { i18n } = useTranslationContext();
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
index 10e44ce7d..299c236c4 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
@@ -20,7 +20,9 @@ import {
ExchangeListItem,
FeeDescriptionPair,
} from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
+import { ErrorAlert } from "../../context/alert.js";
import { HookError } from "../../hooks/useAsyncAsHook.js";
import { State as SelectExchangeState } from "../../hooks/useSelectedExchange.js";
import { ButtonHandler, SelectFieldHandler } from "../../mui/handlers.js";
@@ -28,7 +30,6 @@ import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
import {
ComparingView,
- ErrorLoadingView,
NoExchangesView,
PrivacyContentView,
ReadyView,
@@ -58,8 +59,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "error-loading";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -99,7 +100,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "error-loading": ErrorLoadingView,
+ error: ErrorAlertView,
comparing: ComparingView,
"no-exchange": NoExchangesView,
"showing-tos": TosContentView,
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
index 3c10febd9..cfb32cbbb 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
@@ -20,7 +20,9 @@ import {
WalletApiOperation,
} from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
@@ -31,6 +33,7 @@ export function useComponentState({
currentExchange,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const initialValue = exchanges.findIndex(
(e) => e.exchangeBaseUrl === currentExchange,
);
@@ -84,8 +87,11 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "error-loading",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load exchange details info`,
+ hook,
+ ),
};
}
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
index 26ff2c0d3..d01ce7ca0 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
@@ -20,7 +20,6 @@ import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
import { Amount } from "../../components/Amount.js";
import { ErrorMessage } from "../../components/ErrorMessage.js";
-import { LoadingError } from "../../components/LoadingError.js";
import { SelectList } from "../../components/SelectList.js";
import { Input, SvgIcon } from "../../components/styled/index.js";
import { TermsOfService } from "../../components/TermsOfService/index.js";
@@ -110,17 +109,6 @@ const Container = styled.div`
}
`;
-export function ErrorLoadingView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load exchange fees</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function PrivacyContentView({
exchangeUrl,
onClose,
@@ -156,19 +144,11 @@ export function NoExchangesView({
}: SelectExchangeState.NoExchange): VNode {
const { i18n } = useTranslationContext();
if (!currency) {
- return (
- <ErrorMessage
- title={<i18n.Translate>Could not find any exchange</i18n.Translate>}
- />
- );
+ return <ErrorMessage title={i18n.str`Could not find any exchange`} />;
}
return (
<ErrorMessage
- title={
- <i18n.Translate>
- Could not find any exchange for the currency {currency}
- </i18n.Translate>
- }
+ title={i18n.str`Could not find any exchange for the currency ${currency}`}
/>
);
}
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSetUrl.tsx b/packages/taler-wallet-webextension/src/wallet/ExchangeSetUrl.tsx
index 8c31d8d95..404fc8bee 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSetUrl.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSetUrl.tsx
@@ -140,15 +140,13 @@ export function ExchangeSetUrlPage({
)}
{error && (
<ErrorMessage
- title={
- <i18n.Translate>Unable to verify this exchange</i18n.Translate>
- }
+ title={i18n.str`Unable to verify this exchange`}
description={error}
/>
)}
{confirmationError && (
<ErrorMessage
- title={<i18n.Translate>Unable to add this exchange</i18n.Translate>}
+ title={i18n.str`Unable to add this exchange`}
description={confirmationError}
/>
)}
diff --git a/packages/taler-wallet-webextension/src/wallet/History.tsx b/packages/taler-wallet-webextension/src/wallet/History.tsx
index 50f634f52..143d3adbb 100644
--- a/packages/taler-wallet-webextension/src/wallet/History.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/History.tsx
@@ -23,8 +23,8 @@ import {
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { Fragment, h, VNode } from "preact";
import { useEffect, useState } from "preact/hooks";
+import { AlertView } from "../components/CurrentAlerts.js";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import {
CenteredBoldText,
CenteredText,
@@ -33,6 +33,7 @@ import {
} from "../components/styled/index.js";
import { Time } from "../components/Time.js";
import { TransactionItem } from "../components/TransactionItem.js";
+import { alertFromError } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
@@ -71,13 +72,11 @@ export function HistoryPage({
if (state.hasError) {
return (
- <LoadingError
- title={
- <i18n.Translate>
- Could not load the list of transactions
- </i18n.Translate>
- }
- error={state}
+ <AlertView
+ alert={alertFromError(
+ i18n.str`Could not load the list of transactions`,
+ state,
+ )}
/>
);
}
diff --git a/packages/taler-wallet-webextension/src/wallet/ManageAccount/index.ts b/packages/taler-wallet-webextension/src/wallet/ManageAccount/index.ts
index 8541821b7..3a00d48ce 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/index.ts
@@ -15,8 +15,9 @@
*/
import { KnownBankAccountsInfo } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import {
ButtonHandler,
SelectFieldHandler,
@@ -24,7 +25,7 @@ import {
} from "../../mui/handlers.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export interface Props {
currency: string;
@@ -41,8 +42,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -68,7 +69,7 @@ export type AccountByType = {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts b/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
index 9690a5c79..176a8d100 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
@@ -21,7 +21,9 @@ import {
} from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
import { useState } from "preact/hooks";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { AccountByType, Props, State } from "./index.js";
@@ -31,6 +33,7 @@ export function useComponentState({
onCancel,
}: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const hook = useAsyncAsHook(() =>
api.wallet.call(WalletApiOperation.ListKnownBankAccounts, { currency }),
);
@@ -47,8 +50,8 @@ export function useComponentState({
}
if (hook.hasError) {
return {
- status: "loading-error",
- error: hook,
+ status: "error",
+ error: alertFromError(i18n.str`Could not load known bank accounts`, hook),
};
}
diff --git a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
index 3af0d5505..e5be8d17d 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
@@ -23,11 +23,10 @@ import {
import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
-import { LoadingError } from "../../components/LoadingError.js";
+import { ErrorMessage } from "../../components/ErrorMessage.js";
import { SelectList } from "../../components/SelectList.js";
import {
Input,
- LightText,
SubTitle,
SvgIcon,
WarningText,
@@ -37,10 +36,9 @@ import { Button } from "../../mui/Button.js";
import { TextFieldHandler } from "../../mui/handlers.js";
import { TextField } from "../../mui/TextField.js";
import checkIcon from "../../svg/check_24px.svg";
-import warningIcon from "../../svg/warning_24px.svg";
import deleteIcon from "../../svg/delete_24px.svg";
+import warningIcon from "../../svg/warning_24px.svg";
import { State } from "./index.js";
-import { ErrorMessage } from "../../components/ErrorMessage.js";
type AccountType = "bitcoin" | "x-taler-bank" | "iban";
type ComponentFormByAccountType = {
@@ -80,17 +78,6 @@ const AccountTable = styled.table`
}
`;
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load</i18n.Translate>}
- error={error}
- />
- );
-}
-
export function ReadyView({
currency,
error,
@@ -118,14 +105,14 @@ export function ReadyView({
{error && (
<ErrorMessage
- title={<i18n.Translate>Unable add this account</i18n.Translate>}
+ title={i18n.str`Unable add this account`}
description={error}
/>
)}
<p>
<Input>
<SelectList
- label={<i18n.Translate>Select account type</i18n.Translate>}
+ label={i18n.str`Select account type`}
list={accountType.list}
name="accountType"
value={accountType.value}
diff --git a/packages/taler-wallet-webextension/src/wallet/Notifications/index.ts b/packages/taler-wallet-webextension/src/wallet/Notifications/index.ts
index 4697ca549..22b3adb0f 100644
--- a/packages/taler-wallet-webextension/src/wallet/Notifications/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/Notifications/index.ts
@@ -15,11 +15,12 @@
*/
import { UserAttentionUnreadList } from "@gnu-taler/taler-util";
+import { ErrorAlertView } from "../../components/CurrentAlerts.js";
import { Loading } from "../../components/Loading.js";
-import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { ErrorAlert } from "../../context/alert.js";
import { compose, StateViewMap } from "../../utils/index.js";
import { useComponentState } from "./state.js";
-import { LoadingUriView, ReadyView } from "./views.js";
+import { ReadyView } from "./views.js";
export type Props = object;
@@ -32,8 +33,8 @@ export namespace State {
}
export interface LoadingUriError {
- status: "loading-error";
- error: HookError;
+ status: "error";
+ error: ErrorAlert;
}
export interface BaseInfo {
@@ -49,7 +50,7 @@ export namespace State {
const viewMapping: StateViewMap<State> = {
loading: Loading,
- "loading-error": LoadingUriView,
+ error: ErrorAlertView,
ready: ReadyView,
};
diff --git a/packages/taler-wallet-webextension/src/wallet/Notifications/state.ts b/packages/taler-wallet-webextension/src/wallet/Notifications/state.ts
index 648e490ce..0e06a1e75 100644
--- a/packages/taler-wallet-webextension/src/wallet/Notifications/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/Notifications/state.ts
@@ -15,12 +15,15 @@
*/
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
+import { alertFromError } from "../../context/alert.js";
import { useBackendContext } from "../../context/backend.js";
+import { useTranslationContext } from "../../context/translation.js";
import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
import { Props, State } from "./index.js";
export function useComponentState(p: Props): State {
const api = useBackendContext();
+ const { i18n } = useTranslationContext();
const hook = useAsyncAsHook(async () => {
return await api.wallet.call(
WalletApiOperation.GetUserAttentionRequests,
@@ -34,10 +37,14 @@ export function useComponentState(p: Props): State {
error: undefined,
};
}
+
if (hook.hasError) {
return {
- status: "loading-error",
- error: hook,
+ status: "error",
+ error: alertFromError(
+ i18n.str`Could not load user attention request`,
+ hook,
+ ),
};
}
diff --git a/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx b/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
index 9146d8837..8d0bb34c0 100644
--- a/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
@@ -20,7 +20,6 @@ import {
AttentionType,
} from "@gnu-taler/taler-util";
import { Fragment, h, VNode } from "preact";
-import { LoadingError } from "../../components/LoadingError.js";
import {
Column,
DateSeparator,
@@ -37,17 +36,6 @@ import { Pages } from "../../NavigationBar.js";
import { assertUnreachable } from "../../utils/index.js";
import { State } from "./index.js";
-export function LoadingUriView({ error }: State.LoadingUriError): VNode {
- const { i18n } = useTranslationContext();
-
- return (
- <LoadingError
- title={<i18n.Translate>Could not load notifications</i18n.Translate>}
- error={error}
- />
- );
-}
-
const term = 1000 * 60 * 60 * 24;
function normalizeToDay(x: number): number {
return Math.round(x / term) * term;
diff --git a/packages/taler-wallet-webextension/src/wallet/ProviderAddPage.tsx b/packages/taler-wallet-webextension/src/wallet/ProviderAddPage.tsx
index eb86c9a3f..286a2a88d 100644
--- a/packages/taler-wallet-webextension/src/wallet/ProviderAddPage.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ProviderAddPage.tsx
@@ -127,11 +127,7 @@ export function SetUrlView({
</Title>
{error && (
<ErrorMessage
- title={
- <i18n.Translate>
- Could not get provider information
- </i18n.Translate>
- }
+ title={i18n.str`Could not get provider information`}
description={error}
/>
)}
@@ -223,7 +219,7 @@ export function ConfirmProviderView({
</SubTitle>
<p>
{Amounts.isZero(provider.annual_fee) ? (
- <i18n.Translate>free of charge</i18n.Translate>
+ i18n.str`free of charge`
) : (
<i18n.Translate>
{provider.annual_fee} per year of service
@@ -240,7 +236,7 @@ export function ConfirmProviderView({
</i18n.Translate>
</p>
<Checkbox
- label={<i18n.Translate>Accept terms of service</i18n.Translate>}
+ label={i18n.str`Accept terms of service`}
name="terms"
onToggle={async () => setAccepted((old) => !old)}
enabled={accepted}
diff --git a/packages/taler-wallet-webextension/src/wallet/ProviderDetailPage.tsx b/packages/taler-wallet-webextension/src/wallet/ProviderDetailPage.tsx
index 46d54e871..9b72c0fae 100644
--- a/packages/taler-wallet-webextension/src/wallet/ProviderDetailPage.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ProviderDetailPage.tsx
@@ -23,11 +23,12 @@ import {
WalletApiOperation,
} from "@gnu-taler/taler-wallet-core";
import { Fragment, h, VNode } from "preact";
+import { AlertView } from "../components/CurrentAlerts.js";
import { ErrorMessage } from "../components/ErrorMessage.js";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import { PaymentStatus, SmallLightText } from "../components/styled/index.js";
import { Time } from "../components/Time.js";
+import { alertFromError } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
@@ -65,14 +66,11 @@ export function ProviderDetailPage({
}
if (state.hasError) {
return (
- <LoadingError
- title={
- <i18n.Translate>
- There was an error loading the provider detail for &quot;
- {providerURL}&quot;
- </i18n.Translate>
- }
- error={state}
+ <AlertView
+ alert={alertFromError(
+ i18n.str`There was an error loading the provider detail for &quot;${providerURL}&quot;`,
+ state,
+ )}
/>
);
}
@@ -270,9 +268,7 @@ function Error({ info }: { info: ProviderInfo }): VNode {
if (info.lastError) {
return (
<ErrorMessage
- title={
- <i18n.Translate>This provider has reported an error</i18n.Translate>
- }
+ title={i18n.str`This provider has reported an error`}
description={info.lastError.hint}
/>
);
@@ -282,32 +278,17 @@ function Error({ info }: { info: ProviderInfo }): VNode {
case "backup-conflicting-device":
return (
<ErrorMessage
- title={
- <Fragment>
- <i18n.Translate>
- There is conflict with another backup from{" "}
- <b>{info.backupProblem.otherDeviceId}</b>
- </i18n.Translate>
- </Fragment>
- }
+ title={i18n.str`There is conflict with another backup from &quot;${info.backupProblem.otherDeviceId}&quot;`}
/>
);
case "backup-unreadable":
- return (
- <ErrorMessage
- title={<i18n.Translate>Backup is not readable</i18n.Translate>}
- />
- );
+ return <ErrorMessage title={i18n.str`Backup is not readable`} />;
default:
return (
<ErrorMessage
- title={
- <Fragment>
- <i18n.Translate>
- Unknown backup problem: {JSON.stringify(info.backupProblem)}
- </i18n.Translate>
- </Fragment>
- }
+ title={i18n.str`Unknown backup problem: ${JSON.stringify(
+ info.backupProblem,
+ )}`}
/>
);
}
diff --git a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
index a259f7c9a..c366f014f 100644
--- a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
@@ -42,8 +42,8 @@ export function ReserveCreated({
if (!paytoURI) {
return (
<ErrorMessage
- title={<i18n.Translate>Could not parse the payto URI</i18n.Translate>}
- description={<i18n.Translate>Please check the uri</i18n.Translate>}
+ title={i18n.str`Could not parse the payto URI`}
+ description={i18n.str`Please check the uri`}
/>
);
}
diff --git a/packages/taler-wallet-webextension/src/wallet/Settings.tsx b/packages/taler-wallet-webextension/src/wallet/Settings.tsx
index 768a4ca6a..ed1bc838a 100644
--- a/packages/taler-wallet-webextension/src/wallet/Settings.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Settings.tsx
@@ -111,13 +111,13 @@ export function SettingsView({
<section>
{autoOpenToggle.button.error && (
<ErrorTalerOperation
- title={<i18n.Translate>Could not toggle auto-open</i18n.Translate>}
+ title={i18n.str`Could not toggle auto-open`}
error={autoOpenToggle.button.error.errorDetail}
/>
)}
{/* {clipboardToggle.button.error && (
<ErrorTalerOperation
- title={<i18n.Translate>Could not toggle clipboard</i18n.Translate>}
+ title={i18n.str`Could not toggle clipboard`}
error={clipboardToggle.button.error.errorDetail}
/>
)} */}
@@ -125,11 +125,7 @@ export function SettingsView({
<i18n.Translate>Navigator</i18n.Translate>
</SubTitle>
<Checkbox
- label={
- <i18n.Translate>
- Automatically open wallet based on page content
- </i18n.Translate>
- }
+ label={i18n.str`Automatically open wallet based on page content`}
name="autoOpen"
description={
<i18n.Translate>
@@ -142,9 +138,7 @@ export function SettingsView({
/>
{/* <Checkbox
label={
- <i18n.Translate>
- Automatically check clipboard for Taler URI
- </i18n.Translate>
+ i18n.str`Automatically check clipboard for Taler URI`
}
name="clipboard"
description={
@@ -241,13 +235,9 @@ export function SettingsView({
<i18n.Translate>Troubleshooting</i18n.Translate>
</SubTitle>
<Checkbox
- label={<i18n.Translate>Developer mode</i18n.Translate>}
+ label={i18n.str`Developer mode`}
name="devMode"
- description={
- <i18n.Translate>
- More options and information useful for debugging
- </i18n.Translate>
- }
+ description={i18n.str`More options and information useful for debugging`}
enabled={devModeToggle.value!}
onToggle={devModeToggle.button.onClick!}
/>
@@ -271,7 +261,7 @@ export function SettingsView({
</SubTitle>
{coreVersion && (
<Part
- title={<i18n.Translate>Wallet Core</i18n.Translate>}
+ title={i18n.str`Wallet Core`}
text={
<span>
{coreVersion.version}{" "}
@@ -281,7 +271,7 @@ export function SettingsView({
/>
)}
<Part
- title={<i18n.Translate>Web Extension</i18n.Translate>}
+ title={i18n.str`Web Extension`}
text={
<span>
{webexVersion.version}{" "}
@@ -292,15 +282,15 @@ export function SettingsView({
{coreVersion && (
<JustInDevMode>
<Part
- title={<i18n.Translate>Exchange compatibility</i18n.Translate>}
+ title={i18n.str`Exchange compatibility`}
text={<span>{coreVersion.exchange}</span>}
/>
<Part
- title={<i18n.Translate>Merchant compatibility</i18n.Translate>}
+ title={i18n.str`Merchant compatibility`}
text={<span>{coreVersion.merchant}</span>}
/>
<Part
- title={<i18n.Translate>Bank compatibility</i18n.Translate>}
+ title={i18n.str`Bank compatibility`}
text={<span>{coreVersion.bank}</span>}
/>
</JustInDevMode>
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index b7eb4a947..542694490 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -32,6 +32,7 @@ import {
TransactionRefund,
TransactionTip,
TransactionType,
+ TranslatedString,
WithdrawalType,
} from "@gnu-taler/taler-util";
import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
@@ -43,9 +44,8 @@ import emptyImg from "../../static/img/empty.png";
import { Amount } from "../components/Amount.js";
import { BankDetailsByPaytoType } from "../components/BankDetailsByPaytoType.js";
import { CopyButton } from "../components/CopyButton.js";
-import { ErrorTalerOperation } from "../components/ErrorTalerOperation.js";
+import { AlertView, ErrorAlertView } from "../components/CurrentAlerts.js";
import { Loading } from "../components/Loading.js";
-import { LoadingError } from "../components/LoadingError.js";
import { Kind, Part, PartCollapsible, PartPayto } from "../components/Part.js";
import { QR } from "../components/QR.js";
import { ShowFullContractTermPopup } from "../components/ShowFullContractTermPopup.js";
@@ -60,6 +60,7 @@ import {
WarningBox,
} from "../components/styled/index.js";
import { Time } from "../components/Time.js";
+import { alertFromError } from "../context/alert.js";
import { useBackendContext } from "../context/backend.js";
import { useTranslationContext } from "../context/translation.js";
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
@@ -98,13 +99,11 @@ export function TransactionPage({
if (state.hasError) {
return (
- <LoadingError
- title={
- <i18n.Translate>
- Could not load the transaction information
- </i18n.Translate>
- }
- error={state}
+ <AlertView
+ alert={alertFromError(
+ i18n.str`Could not load transaction information`,
+ state,
+ )}
/>
);
}
@@ -199,14 +198,14 @@ export function TransactionView({
return (
<Fragment>
<section style={{ padding: 8, textAlign: "center" }}>
- <ErrorTalerOperation
- title={
- <i18n.Translate>
- There was an error trying to complete the transaction
- </i18n.Translate>
- }
- error={transaction?.error}
- />
+ {transaction?.error ? (
+ <ErrorAlertView
+ error={alertFromError(
+ i18n.str`There was an error trying to complete the transaction`,
+ transaction.error,
+ )}
+ />
+ ) : undefined}
{transaction.pending && (
<WarningBox>
<i18n.Translate>This transaction is not completed</i18n.Translate>
@@ -367,7 +366,7 @@ export function TransactionView({
</Fragment>
)}
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<WithdrawDetails
amount={{
@@ -420,7 +419,7 @@ export function TransactionView({
<br />
{transaction.refunds.length > 0 ? (
<Part
- title={<i18n.Translate>Refunds</i18n.Translate>}
+ title={i18n.str`Refunds`}
text={
<table>
{transaction.refunds.map((r, i) => {
@@ -462,7 +461,7 @@ export function TransactionView({
picked up.
</i18n.Translate>
<Part
- title={<i18n.Translate>Offer</i18n.Translate>}
+ title={i18n.str`Offer`}
text={<Amount value={pendingRefund} />}
kind="positive"
/>
@@ -480,17 +479,17 @@ export function TransactionView({
</InfoBox>
)}
<Part
- title={<i18n.Translate>Merchant</i18n.Translate>}
+ title={i18n.str`Merchant`}
text={<MerchantDetails merchant={transaction.info.merchant} />}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Invoice ID</i18n.Translate>}
- text={transaction.info.orderId}
+ title={i18n.str`Invoice ID`}
+ text={transaction.info.orderId as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<PurchaseDetails
price={price}
@@ -520,12 +519,12 @@ export function TransactionView({
</Header>
{payto && <PartPayto payto={payto} kind="neutral" />}
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={<DepositDetails transaction={transaction} />}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Wire transfer deadline</i18n.Translate>}
+ title={i18n.str`Wire transfer deadline`}
text={
<Time
timestamp={AbsoluteTime.fromTimestamp(
@@ -557,7 +556,7 @@ export function TransactionView({
{transaction.exchangeBaseUrl}
</Header>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={<RefreshDetails transaction={transaction} />}
/>
</TransactionTemplate>
@@ -578,12 +577,12 @@ export function TransactionView({
{transaction.merchantBaseUrl}
</Header>
{/* <Part
- title={<i18n.Translate>Merchant</i18n.Translate>}
+ title={i18n.str`Merchant`}
text={<MerchantDetails merchant={transaction.merchant} />}
kind="neutral"
/> */}
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={<TipDetails transaction={transaction} />}
/>
</TransactionTemplate>
@@ -604,12 +603,12 @@ export function TransactionView({
</Header>
<Part
- title={<i18n.Translate>Merchant</i18n.Translate>}
- text={transaction.info.merchant.name}
+ title={i18n.str`Merchant`}
+ text={transaction.info.merchant.name as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Original order ID</i18n.Translate>}
+ title={i18n.str`Original order ID`}
text={
<a
href={Pages.balanceTransaction({
@@ -622,12 +621,12 @@ export function TransactionView({
kind="neutral"
/>
<Part
- title={<i18n.Translate>Purchase summary</i18n.Translate>}
- text={transaction.info.summary}
+ title={i18n.str`Purchase summary`}
+ text={transaction.info.summary as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={<RefundDetails transaction={transaction} />}
/>
</TransactionTemplate>
@@ -683,25 +682,25 @@ export function TransactionView({
{transaction.info.summary ? (
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={transaction.info.summary}
+ title={i18n.str`Subject`}
+ text={transaction.info.summary as TranslatedString}
kind="neutral"
/>
) : undefined}
<Part
- title={<i18n.Translate>Exchange</i18n.Translate>}
- text={transaction.exchangeBaseUrl}
+ title={i18n.str`Exchange`}
+ text={transaction.exchangeBaseUrl as TranslatedString}
kind="neutral"
/>
{transaction.pending /** pending is not-pay */ && (
<Part
- title={<i18n.Translate>URI</i18n.Translate>}
+ title={i18n.str`URI`}
text={<ShowQrWithCopy text={transaction.talerUri} />}
kind="neutral"
/>
)}
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<InvoiceDetails
amount={{
@@ -730,18 +729,18 @@ export function TransactionView({
{transaction.info.summary ? (
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={transaction.info.summary}
+ title={i18n.str`Subject`}
+ text={transaction.info.summary as TranslatedString}
kind="neutral"
/>
) : undefined}
<Part
- title={<i18n.Translate>Exchange</i18n.Translate>}
- text={transaction.exchangeBaseUrl}
+ title={i18n.str`Exchange`}
+ text={transaction.exchangeBaseUrl as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<InvoiceDetails
amount={{
@@ -769,25 +768,25 @@ export function TransactionView({
{transaction.info.summary ? (
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={transaction.info.summary}
+ title={i18n.str`Subject`}
+ text={transaction.info.summary as TranslatedString}
kind="neutral"
/>
) : undefined}
<Part
- title={<i18n.Translate>Exchange</i18n.Translate>}
- text={transaction.exchangeBaseUrl}
+ title={i18n.str`Exchange`}
+ text={transaction.exchangeBaseUrl as TranslatedString}
kind="neutral"
/>
{/* {transaction.pending && ( //pending is not-received
)} */}
<Part
- title={<i18n.Translate>URI</i18n.Translate>}
+ title={i18n.str`URI`}
text={<ShowQrWithCopy text={transaction.talerUri} />}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<TransferDetails
amount={{
@@ -816,18 +815,18 @@ export function TransactionView({
{transaction.info.summary ? (
<Part
- title={<i18n.Translate>Subject</i18n.Translate>}
- text={transaction.info.summary}
+ title={i18n.str`Subject`}
+ text={transaction.info.summary as TranslatedString}
kind="neutral"
/>
) : undefined}
<Part
- title={<i18n.Translate>Exchange</i18n.Translate>}
- text={transaction.exchangeBaseUrl}
+ title={i18n.str`Exchange`}
+ text={transaction.exchangeBaseUrl as TranslatedString}
kind="neutral"
/>
<Part
- title={<i18n.Translate>Details</i18n.Translate>}
+ title={i18n.str`Details`}
text={
<TransferDetails
amount={{
@@ -1245,7 +1244,7 @@ export function PurchaseDetails({
<td colSpan={2}>
<PartCollapsible
big
- title={<i18n.Translate>Products</i18n.Translate>}
+ title={i18n.str`Products`}
text={
<ListOfProducts>
{info.products?.map((p, k) => (
@@ -1274,7 +1273,7 @@ export function PurchaseDetails({
<td colSpan={2}>
<PartCollapsible
big
- title={<i18n.Translate>Delivery</i18n.Translate>}
+ title={i18n.str`Delivery`}
text={
<DeliveryDetails
date={info.delivery_date}
@@ -1508,7 +1507,7 @@ function Header({
total: AmountJson;
children: ComponentChildren;
kind: Kind;
- type: string;
+ type: TranslatedString;
}): VNode {
return (
<div
diff --git a/packages/taler-wallet-webextension/src/wallet/Welcome.tsx b/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
index 0b64417b8..b243eaa1c 100644
--- a/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
@@ -91,11 +91,7 @@ export function View({
<i18n.Translate>Permissions</i18n.Translate>
</SubTitle>
<Checkbox
- label={
- <i18n.Translate>
- Automatically open wallet based on page content
- </i18n.Translate>
- }
+ label={i18n.str`Automatically open wallet based on page content`}
name="perm"
description={
<i18n.Translate>
diff --git a/packages/taler-wallet-webextension/src/wxApi.ts b/packages/taler-wallet-webextension/src/wxApi.ts
index 5c2a577b3..a41372e37 100644
--- a/packages/taler-wallet-webextension/src/wxApi.ts
+++ b/packages/taler-wallet-webextension/src/wxApi.ts
@@ -25,6 +25,8 @@ import {
CoreApiResponse,
Logger,
NotificationType,
+ TalerErrorCode,
+ TalerErrorDetail,
WalletDiagnostics,
} from "@gnu-taler/taler-util";
import {
@@ -33,11 +35,14 @@ import {
WalletCoreOpKeys,
WalletCoreRequestType,
WalletCoreResponseType,
+ WalletOperations,
} from "@gnu-taler/taler-wallet-core";
-import { MessageFromBackend, MessageFromFrontendBackground, MessageFromFrontendWallet } from "./platform/api.js";
import {
- platform,
-} from "./platform/foreground.js";
+ MessageFromBackend,
+ MessageFromFrontendBackground,
+ MessageFromFrontendWallet,
+} from "./platform/api.js";
+import { platform } from "./platform/foreground.js";
/**
*
@@ -88,6 +93,25 @@ export interface BackgroundApiClient {
): Promise<BackgroundOperations[Op]["response"]>;
}
+export class WalletError extends Error {
+ public errorDetail: TalerError;
+
+ constructor(op: string, e: TalerError) {
+ super(`Wallet operation "${op}" failed: ${e.message}`);
+ this.errorDetail = e;
+ // Object.setPrototypeOf(this, WalletError.prototype);
+ }
+}
+export class BackgroundError extends Error {
+ public errorDetail: TalerErrorDetail;
+
+ constructor(op: string, e: TalerErrorDetail) {
+ super(`Background operation "${op}" failed: ${e.message}`);
+ this.errorDetail = e;
+ // Object.setPrototypeOf(this, BackgroundError.prototype);
+ }
+}
+
/**
* BackgroundApiClient integration with browser platform
*/
@@ -106,13 +130,18 @@ class BackgroundApiClientImpl implements BackgroundApiClient {
try {
response = await platform.sendMessageToBackground(message);
- } catch (e) {
+ } catch (error) {
console.log("Error calling backend");
- throw new Error(`Error contacting backend: ${e}`);
+ if (error instanceof Error) {
+ throw new BackgroundError(operation, {
+ code: TalerErrorCode.GENERIC_UNEXPECTED_REQUEST_ERROR,
+ });
+ }
+ throw error;
}
logger.info("got response", response);
if (response.type === "error") {
- throw TalerError.fromUncheckedDetail(response.error);
+ throw new BackgroundError(operation, response.error);
}
return response.result as any;
}
@@ -140,7 +169,8 @@ class WalletApiClientImpl implements WalletCoreApiClient {
}
logger.info("got response", response);
if (response.type === "error") {
- throw TalerError.fromUncheckedDetail(response.error);
+ const error = TalerError.fromUncheckedDetail(response.error);
+ throw new WalletError(operation, error);
}
return response.result as any;
}
diff --git a/packages/taler-wallet-webextension/src/wxBackend.ts b/packages/taler-wallet-webextension/src/wxBackend.ts
index b75e92004..c7b964c28 100644
--- a/packages/taler-wallet-webextension/src/wxBackend.ts
+++ b/packages/taler-wallet-webextension/src/wxBackend.ts
@@ -46,9 +46,7 @@ import {
WalletStoresV1,
} from "@gnu-taler/taler-wallet-core";
import { BrowserHttpLib } from "./browserHttpLib.js";
-import {
- platform,
-} from "./platform/background.js";
+import { platform } from "./platform/background.js";
import {
MessageFromBackend,
MessageFromFrontend,
@@ -199,13 +197,22 @@ async function dispatch<Op extends WalletOperations | BackgroundOperations>(
),
};
}
- const result = await handler(req.payload);
- return {
- type: "response",
- id: req.id,
- operation: String(req.operation),
- result,
- };
+ try {
+ const result = await handler(req.payload);
+ return {
+ type: "response",
+ id: req.id,
+ operation: String(req.operation),
+ result,
+ };
+ } catch (er) {
+ return {
+ type: "error",
+ id: req.id,
+ error: getErrorDetailFromException(er),
+ operation: String(req.operation),
+ };
+ }
}
if (req.channel === "wallet") {
@@ -232,7 +239,9 @@ async function dispatch<Op extends WalletOperations | BackgroundOperations>(
id: anyReq.id,
operation: String(anyReq.operation),
error: getErrorDetailFromException(
- Error(`unknown channel ${anyReq.channel}`),
+ Error(
+ `unknown channel ${anyReq.channel}, should be "background" or "wallet"`,
+ ),
),
};
}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6983ba177..0355f1535 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -649,7 +649,7 @@ importers:
qrcode-generator: ^1.4.4
rimraf: ^3.0.2
tslib: ^2.4.0
- typescript: ^4.8.4
+ typescript: 4.9.4
dependencies:
'@gnu-taler/taler-util': link:../taler-util
'@gnu-taler/taler-wallet-core': link:../taler-wallet-core
@@ -687,7 +687,7 @@ importers:
preact-cli: 3.4.1_i2jslynuqxjzp37vlc24guk7gu
preact-render-to-string: 5.2.6_preact@10.11.3
rimraf: 3.0.2
- typescript: 4.8.4
+ typescript: 4.9.4
packages/web-util:
specifiers:
@@ -8412,7 +8412,7 @@ packages:
minipass-pipeline: 1.2.4
mkdirp: 1.0.4
p-map: 4.0.0
- promise-inflight: 1.0.1
+ promise-inflight: 1.0.1_bluebird@3.7.2
rimraf: 3.0.2
ssri: 8.0.1
tar: 6.1.11
@@ -18096,15 +18096,6 @@ packages:
engines: {node: '>=0.4.0'}
dev: true
- /promise-inflight/1.0.1:
- resolution: {integrity: sha512-6zWPyEOFaQBJYcGMHBKTKJ3u6TBsnMFOIZSa6ce1e/ZrrsOlnHRHbabMjLiBYKp+n44X9eUI6VUPaukCXHuG4g==}
- peerDependencies:
- bluebird: '*'
- peerDependenciesMeta:
- bluebird:
- optional: true
- dev: true
-
/promise-inflight/1.0.1_bluebird@3.7.2:
resolution: {integrity: sha512-6zWPyEOFaQBJYcGMHBKTKJ3u6TBsnMFOIZSa6ce1e/ZrrsOlnHRHbabMjLiBYKp+n44X9eUI6VUPaukCXHuG4g==}
peerDependencies:
@@ -20691,6 +20682,12 @@ packages:
hasBin: true
dev: true
+ /typescript/4.9.4:
+ resolution: {integrity: sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg==}
+ engines: {node: '>=4.2.0'}
+ hasBin: true
+ dev: true
+
/uglify-js/3.17.4:
resolution: {integrity: sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==}
engines: {node: '>=0.8.0'}