fix: fixing navigation when trying to pay and there is no balance for that currency

packages/taler-wallet-webextension/src/NavigationBar.tsx

@@ -51,7 +51,7 @@ export enum Pages {
   backup_provider_add = "/backup/provider/add",
 
   settings = "/settings",
-  settings_exchange_add = "/settings/exchange/add",
+  settings_exchange_add = "/settings/exchange/add/:currency?",
 
   cta = "/cta/:action",
   cta_pay = "/cta/pay",

packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx

@@ -67,9 +67,9 @@ export function useComponentState(
   const initialExchange =
     foundExchangeForCurrency !== -1
       ? exchangeSelectList[foundExchangeForCurrency]
-      : exchangeSelectList.length > 0
-      ? exchangeSelectList[0]
-      : undefined;
+      : // : exchangeSelectList.length > 0
+        // ? exchangeSelectList[0]
+        undefined;
 
   const [exchange, setExchange] = useState(initialExchange || "");
   const [currency, setCurrency] = useState(
@@ -137,6 +137,40 @@ export function CreateManualWithdraw({
   const state = useComponentState(exchangeList, initialAmount, initialCurrency);
 
   if (!state.initialExchange) {
+    if (initialCurrency !== undefined) {
+      return (
+        <section>
+          <h2>
+            <i18n.Translate>
+              Manual Withdrawal for {initialCurrency}
+            </i18n.Translate>
+          </h2>
+          <LightText>
+            <i18n.Translate>
+              Choose a exchange from where the coins will be withdrawn. The
+              exchange will send the coins to this wallet after receiving a wire
+              transfer with the correct subject.
+            </i18n.Translate>
+          </LightText>
+          <Centered style={{ marginTop: 100 }}>
+            <BoldLight>
+              <i18n.Translate>
+                No exchange found for {initialCurrency}
+              </i18n.Translate>
+            </BoldLight>
+            <LinkPrimary
+              href={Pages.settings_exchange_add.replace(
+                ":currency?",
+                initialCurrency,
+              )}
+              style={{ marginLeft: "auto" }}
+            >
+              <i18n.Translate>Add Exchange</i18n.Translate>
+            </LinkPrimary>
+          </Centered>
+        </section>
+      );
+    }
     return (
       <section>
         <h2>

packages/taler-wallet-webextension/src/wallet/ExchangeAddPage.tsx

@@ -31,7 +31,7 @@ interface Props {
   onBack: () => void;
 }
 
-export function ExchangeAddPage({ onBack }: Props): VNode {
+export function ExchangeAddPage({ currency, onBack }: Props): VNode {
   const [verifying, setVerifying] = useState<
     { url: string; config: TalerConfigResponse } | undefined
   >(undefined);
@@ -47,6 +47,7 @@ export function ExchangeAddPage({ onBack }: Props): VNode {
     return (
       <ExchangeSetUrlPage
         onCancel={onBack}
+        expectedCurrency={currency}
         onVerify={async (url) => {
           const found =
             knownExchanges.findIndex((e) => e.exchangeBaseUrl === url) !== -1;

packages/taler-wallet-webextension/src/wallet/ManualWithdrawPage.tsx

@@ -26,10 +26,8 @@ import { Loading } from "../components/Loading";
 import { LoadingError } from "../components/LoadingError";
 import { useTranslationContext } from "../context/translation";
 import { useAsyncAsHook } from "../hooks/useAsyncAsHook";
-import { Pages } from "../NavigationBar";
 import * as wxApi from "../wxApi";
 import { CreateManualWithdraw } from "./CreateManualWithdraw";
-import { ExchangeAddPage } from "./ExchangeAddPage";
 import { ReserveCreated } from "./ReserveCreated";
 
 interface Props {