fix #7152

4 files changed, 21 insertions, 26 deletions

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"
         />