fix #7153: more error handling

if handler do not trap error then fail at compile time,
all safe handlers push alert on error
errors are typed so they render good information

3 files changed, 22 insertions, 20 deletions

diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
index 1fe324c5a..d5015ae1d 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
@@ -17,7 +17,7 @@
 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 { alertFromError, useAlertContext } from "../../context/alert.js";
 import { useBackendContext } from "../../context/backend.js";
 import { useTranslationContext } from "../../context/translation.js";
 import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js";
@@ -26,6 +26,7 @@ import { Contact, Props, State } from "./index.js";
 
 export function useComponentState(props: Props): RecursiveState<State> {
   const api = useBackendContext();
+  const { pushAlertOnError } = useAlertContext();
   const parsedInitialAmount = !props.amount
     ? undefined
     : Amounts.parse(props.amount);
@@ -108,26 +109,26 @@ export function useComponentState(props: Props): RecursiveState<State> {
         error: undefined,
         previous,
         selectCurrency: {
-          onClick: async () => {
+          onClick: pushAlertOnError(async () => {
             setAmount(undefined);
-          },
+          }),
         },
         goToBank: {
           onClick: invalid
             ? undefined
-            : async () => {
+            : pushAlertOnError(async () => {
                 props.goToWalletBankDeposit(currencyAndAmount);
-              },
+              }),
         },
         goToWallet: {
           onClick: invalid
             ? undefined
-            : async () => {
+            : pushAlertOnError(async () => {
                 props.goToWalletWalletSend(currencyAndAmount);
-              },
+              }),
         },
         amountHandler: {
-          onInput: async (s) => setAmount(s),
+          onInput: pushAlertOnError(async (s) => setAmount(s)),
           value: amount,
         },
         type: props.type,
@@ -138,26 +139,26 @@ export function useComponentState(props: Props): RecursiveState<State> {
         error: undefined,
         previous,
         selectCurrency: {
-          onClick: async () => {
+          onClick: pushAlertOnError(async () => {
             setAmount(undefined);
-          },
+          }),
         },
         goToBank: {
           onClick: invalid
             ? undefined
-            : async () => {
+            : pushAlertOnError(async () => {
                 props.goToWalletManualWithdraw(currencyAndAmount);
-              },
+              }),
         },
         goToWallet: {
           onClick: invalid
             ? undefined
-            : async () => {
+            : pushAlertOnError(async () => {
                 props.goToWalletWalletInvoice(currencyAndAmount);
-              },
+              }),
         },
         amountHandler: {
-          onInput: async (s) => setAmount(s),
+          onInput: pushAlertOnError(async (s) => setAmount(s)),
           value: amount,
         },
         type: props.type,
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/stories.tsx b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/stories.tsx
index ffec8ba36..111f47776 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/stories.tsx
@@ -19,14 +19,14 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 
-import { createExample } from "../../test-utils.js";
+import { tests } from "@gnu-taler/web-util/lib/index.browser";
 import { ReadyView, SelectCurrencyView } from "./views.js";
 
 export default {
   title: "destination",
 };
 
-export const GetCash = createExample(ReadyView, {
+export const GetCash = tests.createExample(ReadyView, {
   amountHandler: {
     value: {
       currency: "EUR",
@@ -40,7 +40,7 @@ export const GetCash = createExample(ReadyView, {
   selectCurrency: {},
   type: "get",
 });
-export const SendCash = createExample(ReadyView, {
+export const SendCash = tests.createExample(ReadyView, {
   amountHandler: {
     value: {
       currency: "EUR",
@@ -55,7 +55,7 @@ export const SendCash = createExample(ReadyView, {
   type: "send",
 });
 
-export const SelectCurrency = createExample(SelectCurrencyView, {
+export const SelectCurrency = tests.createExample(SelectCurrencyView, {
   currencies: {
     "": "Select a currency",
     USD: "USD",
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts
index cc511ce65..b079ef0e8 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts
@@ -28,7 +28,8 @@ import {
 import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
 import { expect } from "chai";
 import { tests } from "../../../../web-util/src/index.browser.js";
-import { createWalletApiMock, nullFunction } from "../../test-utils.js";
+import { nullFunction } from "../../mui/handlers.js";
+import { createWalletApiMock } from "../../test-utils.js";
 import { useComponentState } from "./state.js";
 
 const exchangeArs: ExchangeListItem = {