exchange selection for invoices and some fixes

3 files changed, 23 insertions, 12 deletions

diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
index 2834028c6..4b28904fb 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
@@ -41,13 +41,16 @@ export interface Props {
   onCancel: () => Promise<void>;
   onSelection: (exchange: string) => Promise<void>;
 }
+import {
+  State as SelectExchangeState
+} from "../../hooks/useSelectedExchange.js";
 
 export type State =
   | State.Loading
   | State.LoadingUriError
   | State.Ready
   | State.Comparing
-  | State.NoExchanges;
+  | SelectExchangeState.NoExchange;
 
 export namespace State {
   export interface Loading {
@@ -66,11 +69,6 @@ export namespace State {
     error: undefined;
   }
 
-  export interface NoExchanges {
-    status: "no-exchanges";
-    error: undefined;
-  }
-
   export interface Ready extends BaseInfo {
     status: "ready";
     timeline: OperationMap<FeeDescription[]>;
@@ -89,7 +87,7 @@ const viewMapping: StateViewMap<State> = {
   loading: Loading,
   "error-loading": ErrorLoadingView,
   comparing: ComparingView,
-  "no-exchanges": NoExchangesView,
+  "no-exchange": NoExchangesView,
   ready: ReadyView,
 };
 
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
index db6138f8e..0279f6514 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/state.ts
@@ -47,7 +47,7 @@ export function useComponentState(
       ? undefined
       : await api.getExchangeDetailedInfo(initialExchange.exchangeBaseUrl);
     return { exchanges, selected, original };
-  });
+  }, [value]);
 
   if (!hook) {
     return {
@@ -67,13 +67,14 @@ export function useComponentState(
   if (!selected) {
     //!selected <=> exchanges.length === 0
     return {
-      status: "no-exchanges",
+      status: "no-exchange",
       error: undefined,
+      currency: undefined,
     };
   }
 
   const exchangeMap = exchanges.reduce(
-    (prev, cur, idx) => ({ ...prev, [cur.exchangeBaseUrl]: String(idx) }),
+    (prev, cur, idx) => ({ ...prev, [String(idx)]: cur.exchangeBaseUrl }),
     {} as Record<string, string>,
   );
 
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
index dd85dff46..47554bfcd 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/views.tsx
@@ -31,6 +31,9 @@ import { useTranslationContext } from "../../context/translation.js";
 import { Button } from "../../mui/Button.js";
 import arrowDown from "../../svg/chevron-down.svg";
 import { State } from "./index.js";
+import {
+  State as SelectExchangeState
+} from "../../hooks/useSelectedExchange.js";
 
 const ButtonGroup = styled.div`
   & > button {
@@ -112,11 +115,20 @@ export function ErrorLoadingView({ error }: State.LoadingUriError): VNode {
   );
 }
 
-export function NoExchangesView(state: State.NoExchanges): VNode {
+
+
+export function NoExchangesView({currency}: SelectExchangeState.NoExchange): VNode {
   const { i18n } = useTranslationContext();
+  if (!currency) {
+    return (
+      <div>
+        <i18n.Translate>could not find any exchange</i18n.Translate>
+      </div>
+    );  
+  }
   return (
     <div>
-      <i18n.Translate>no exchanges</i18n.Translate>
+      <i18n.Translate>could not find any exchange for the currency {currency}</i18n.Translate>
     </div>
   );
 }