issues found in latest qc

10 files changed, 85 insertions, 51 deletions

diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx b/packages/taler-wallet-webextension/src/NavigationBar.tsx
index 56c08f906..efdd6c2d7 100644
--- a/packages/taler-wallet-webextension/src/NavigationBar.tsx
+++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx
@@ -217,17 +217,17 @@ export function PopupNavBar({ path }: { path?: PopupNavBarOptions }): VNode {
   const { i18n } = useTranslationContext();
   return (
     <NavigationHeader>
-      <a href={Pages.balance} class={path === "balance" ? "active" : ""}>
+      <a href={`#${Pages.balance}`} class={path === "balance" ? "active" : ""}>
         <i18n.Translate>Balance</i18n.Translate>
       </a>
       <EnabledBySettings name="backup">
-        <a href={Pages.backup} class={path === "backup" ? "active" : ""}>
+        <a href={`#${Pages.backup}`} class={path === "backup" ? "active" : ""}>
           <i18n.Translate>Backup</i18n.Translate>
         </a>
       </EnabledBySettings>
       <div style={{ display: "flex", paddingTop: 4, justifyContent: "right" }}>
         {attentionCount > 0 ? (
-          <a href={Pages.notifications}>
+          <a href={`#${Pages.notifications}`}>
             <SvgIcon
               title={i18n.str`Notifications`}
               dangerouslySetInnerHTML={{ __html: warningIcon }}
@@ -237,14 +237,14 @@ export function PopupNavBar({ path }: { path?: PopupNavBarOptions }): VNode {
         ) : (
           <Fragment />
         )}
-        <a href={Pages.qr}>
+        <a href={`#${Pages.qr}`}>
           <SvgIcon
             title={i18n.str`QR Reader and Taler URI`}
             dangerouslySetInnerHTML={{ __html: qrIcon }}
             color="white"
           />
         </a>
-        <a href={Pages.settings}>
+        <a href={`#${Pages.settings}`}>
           <SvgIcon
             title={i18n.str`Settings`}
             dangerouslySetInnerHTML={{ __html: settingsIcon }}
@@ -272,17 +272,17 @@ export function WalletNavBar({ path }: { path?: WalletNavBarOptions }): VNode {
   return (
     <NavigationHeaderHolder>
       <NavigationHeader>
-        <a href={Pages.balance} class={path === "balance" ? "active" : ""}>
+        <a href={`#${Pages.balance}`} class={path === "balance" ? "active" : ""}>
           <i18n.Translate>Balance</i18n.Translate>
         </a>
         <EnabledBySettings name="backup">
-          <a href={Pages.backup} class={path === "backup" ? "active" : ""}>
+          <a href={`#${Pages.backup}`} class={path === "backup" ? "active" : ""}>
             <i18n.Translate>Backup</i18n.Translate>
           </a>
         </EnabledBySettings>
 
         {attentionCount > 0 ? (
-          <a href={Pages.notifications}>
+          <a href={`#${Pages.notifications}`}>
             <i18n.Translate>Notifications</i18n.Translate>
           </a>
         ) : (
@@ -290,7 +290,7 @@ export function WalletNavBar({ path }: { path?: WalletNavBarOptions }): VNode {
         )}
 
         <EnabledBySettings name="advancedMode">
-          <a href={Pages.dev} class={path === "dev" ? "active" : ""}>
+          <a href={`#${Pages.dev}`} class={path === "dev" ? "active" : ""}>
             <i18n.Translate>Dev tools</i18n.Translate>
           </a>
         </EnabledBySettings>
@@ -298,21 +298,21 @@ export function WalletNavBar({ path }: { path?: WalletNavBarOptions }): VNode {
         <div
           style={{ display: "flex", paddingTop: 4, justifyContent: "right" }}
         >
-          <a href={Pages.searchHistory({})}>
+          <a href={`#${Pages.searchHistory({})}`}>
             <SvgIcon
               title={i18n.str`Search transactions`}
               dangerouslySetInnerHTML={{ __html: searchIcon }}
               color="white"
             />
           </a>
-          <a href={Pages.qr}>
+          <a href={`#${Pages.qr}`}>
             <SvgIcon
               title={i18n.str`QR Reader and Taler URI`}
               dangerouslySetInnerHTML={{ __html: qrIcon }}
               color="white"
             />
           </a>
-          <a href={Pages.settings}>
+          <a href={`#${Pages.settings}`}>
             <SvgIcon
               title={i18n.str`Settings`}
               dangerouslySetInnerHTML={{ __html: settingsIcon }}
diff --git a/packages/taler-wallet-webextension/src/components/WalletActivity.tsx b/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
index 715dab2b1..cfe8ad0df 100644
--- a/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
+++ b/packages/taler-wallet-webextension/src/components/WalletActivity.tsx
@@ -180,7 +180,7 @@ function ShowBalanceChange({ events }: MoreInfoPRops): VNode {
       <dd>
         <a
           title={not.hintTransactionId}
-          href={Pages.balanceTransaction({ tid: not.hintTransactionId })}
+          href={`#${Pages.balanceTransaction({ tid: not.hintTransactionId })}`}
         >
           {not.hintTransactionId.substring(0, 10)}
         </a>
@@ -257,7 +257,7 @@ function ShowTransactionStateTransition({
       <dd>
         <a
           title={not.transactionId}
-          href={Pages.balanceTransaction({ tid: not.transactionId })}
+          href={`#${Pages.balanceTransaction({ tid: not.transactionId })}`}
         >
           {not.transactionId.substring(0, 10)}
         </a>
@@ -1069,7 +1069,7 @@ export function ActiveTasksTable(): VNode {
                   {task.transaction ? (
                     <a
                       title={task.transaction}
-                      href={Pages.balanceTransaction({ tid: task.transaction })}
+                      href={`#${Pages.balanceTransaction({ tid: task.transaction })}`}
                     >
                       {task.transaction.substring(0, 10)}
                     </a>
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
index 356ff7989..b1ee2f1be 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw/state.ts
@@ -317,7 +317,9 @@ export function useComponentStateFromURI({
     uriInfoHook.response.status !== "pending"
   ) {
     const info = uriInfoHook.response.txInfo;
-    const anotherWallet = info.txState.major === TransactionMajorState.Aborted && info.txState.minor === TransactionMinorState.CompletedByOtherWallet;
+    const anotherWallet =
+      info.txState.major === TransactionMajorState.Aborted &&
+      info.txState.minor === TransactionMinorState.CompletedByOtherWallet;
     return {
       status: "already-completed",
       operationState: uriInfoHook.response.status,
@@ -511,10 +513,7 @@ function exchangeSelectionState(
     const altCurrencies = amountHook.response.accounts
       .filter((a) => !!a.currencySpecification)
       .map((a) => a.currencySpecification!.name);
-    const chooseCurrencies =
-      altCurrencies.length === 0
-        ? []
-        : [toBeReceived.currency, ...altCurrencies];
+    const chooseCurrencies = altCurrencies.length <= 1 ? [] : altCurrencies;
 
     const convAccount = amountHook.response.accounts.find((c) => {
       return (
@@ -531,8 +530,11 @@ function exchangeSelectionState(
 
     const amountError = Amounts.isZero(choosenAmount)
       ? i18n.str`should be greater than zero`
-      : Amounts.cmp(choosenAmount, wInfo.maxAmount) === 1
-        ? i18n.str`you can withdra`
+      : Amounts.isNonZero(wInfo.maxAmount) &&
+          Amounts.cmp(choosenAmount, wInfo.maxAmount) === 1
+        ? i18n.str`can't be greater than ${Amounts.stringifyValue(
+            wInfo.maxAmount,
+          )}`
         : undefined;
 
     return {
diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index 60630f747..432ccf119 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -128,7 +128,7 @@ export function Application(): VNode {
                   onDetected={(talerActionUrl: TalerUri) => {
                     redirectTo(
                       Pages.defaultCta({
-                        uri: stringifyTalerUri(talerActionUrl),
+                        uri: encodeCrockForURI(stringifyTalerUri(talerActionUrl)),
                       }),
                     );
                   }}
@@ -455,7 +455,7 @@ export function Application(): VNode {
           <Route
             path={Pages.defaultCta.pattern}
             component={({ uri }: { uri: string }) => {
-              const path = getPathnameForTalerURI(uri);
+              const path = getPathnameForTalerURI(decodeCrockFromURI(uri));
               if (!path) {
                 return (
                   <CallToActionTemplate title={i18n.str`Taler URI handler`}>
@@ -759,7 +759,7 @@ function CallToActionTemplate({
     <WalletAction>
       <LogoHeader />
       <section style={{ display: "flex", justifyContent: "right", margin: 0 }}>
-        <LinkPrimary href={Pages.balance}>
+        <LinkPrimary href={`#${Pages.balance}`}>
           <div
             style={{
               height: 24,
@@ -779,7 +779,7 @@ function CallToActionTemplate({
         {children}
       </AlertProvider>
       <section style={{ display: "flex", justifyContent: "right" }}>
-        <LinkPrimary href={Pages.balance}>
+        <LinkPrimary href={`#${Pages.balance}`}>
           <i18n.Translate>Return to wallet</i18n.Translate>
         </LinkPrimary>
       </section>
diff --git a/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx b/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
index 5c950bec8..645fbf67c 100644
--- a/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/BackupPage.tsx
@@ -261,9 +261,9 @@ function BackupLayout(props: TransactionLayoutProps): VNode {
     <RowBorderGray>
       <div style={{ color: !props.active ? "grey" : undefined }}>
         <a
-          href={Pages.backupProviderDetail({
+          href={`#${Pages.backupProviderDetail({
             pid: props.id,
-          })}
+          })}`}
         >
           <span>{props.title}</span>
         </a>
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
index 1ae9960d1..959c65d6f 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts
@@ -41,12 +41,13 @@ export function useComponentState(props: Props): RecursiveState<State> {
       (scope ? Amounts.zeroOfCurrency(scope.currency) : undefined),
   );
 
+  const scopeStr = !scope ? undefined : stringifyScopeInfoShort(scope);
   useEffect(() => {
     if (!scope) return;
     if (!amount) {
       setAmount(Amounts.zeroOfCurrency(scope.currency));
     }
-  }, [scope]);
+  }, [scopeStr]);
 
   //FIXME: get this information from wallet
   // eslint-disable-next-line no-constant-condition
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
index a9105a601..497e1c786 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/views.tsx
@@ -62,7 +62,7 @@ export function SelectCurrencyView({
       </p>
       <div style={{ display: "flex", justifyContent: "space-between" }}>
         <div />
-        <LinkPrimary href={Pages.settingsExchangeAdd({})}>
+        <LinkPrimary href={`#${Pages.settingsExchangeAdd({})}`}>
           <i18n.Translate>Add an exchange</i18n.Translate>
         </LinkPrimary>
       </div>
diff --git a/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx b/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx
index 9aca75531..9c17d3cff 100644
--- a/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx
@@ -25,7 +25,10 @@ import {
   stringifyWithdrawExchange,
 } from "@gnu-taler/taler-util";
 import { WalletApiOperation } from "@gnu-taler/taler-wallet-core";
-import { useTranslationContext } from "@gnu-taler/web-util/browser";
+import {
+  encodeCrockForURI,
+  useTranslationContext,
+} from "@gnu-taler/web-util/browser";
 import { format } from "date-fns";
 import { Fragment, VNode, h } from "preact";
 import { useEffect, useRef, useState } from "preact/hooks";
@@ -337,7 +340,13 @@ export function DeveloperPage(): VNode {
                 return (
                   <tr key={idx}>
                     <td>
-                      <a href={!uri ? undefined : Pages.defaultCta({ uri })}>
+                      <a
+                        href={
+                          !uri
+                            ? undefined
+                            : `#${Pages.defaultCta({ uri: encodeCrockForURI(uri) })}`
+                        }
+                      >
                         {e.scopeInfo
                           ? `${e.scopeInfo.currency} (${
                               e.scopeInfo.type === ScopeType.Global
@@ -461,7 +470,7 @@ export function DeveloperPage(): VNode {
       )}
       <div style={{ display: "flex", justifyContent: "space-between" }}>
         <div />
-        <LinkPrimary href={Pages.settingsExchangeAdd({})}>
+        <LinkPrimary href={`#${Pages.settingsExchangeAdd({})}`}>
           <i18n.Translate>Add an exchange</i18n.Translate>
         </LinkPrimary>
       </div>
@@ -668,10 +677,10 @@ function ShowAllCoins({
 }
 
 /**
- * 
- * @param str 
+ *
+ * @param str
  * @deprecated FIXME: use a better base64 function
- * @returns 
+ * @returns
  */
 function toBase64(str: string): string {
   return btoa(
diff --git a/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx b/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
index 03a08016a..d205b2fa9 100644
--- a/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Notifications/views.tsx
@@ -104,7 +104,7 @@ function NotificationItem({
       return (
         <NotificationLayout
           timestamp={timestamp}
-          href={Pages.balanceTransaction({ tid: info.transactionId })}
+          href={`#${Pages.balanceTransaction({ tid: info.transactionId })}`}
           title="Withdrawal on hold"
           subtitle="Know-your-customer validation is required"
           iconPath={"K"}
@@ -115,7 +115,7 @@ function NotificationItem({
       return (
         <NotificationLayout
           timestamp={timestamp}
-          href={Pages.balanceTransaction({ tid: info.transactionId })}
+          href={`#${Pages.balanceTransaction({ tid: info.transactionId })}`}
           title="Merchant has refund your payment"
           subtitle="Accept or deny refund"
           iconPath={"K"}
@@ -126,7 +126,7 @@ function NotificationItem({
       return (
         <NotificationLayout
           timestamp={timestamp}
-          href={`${Pages.ctaPay}?talerPayUri=${info.talerUri}`}
+          href={`#${Pages.ctaPay}?talerPayUri=${info.talerUri}`}
           title="Backup provider is unpaid"
           subtitle="Complete the payment or remove the service provider"
           iconPath={"K"}
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 3bd6a9fba..581c1d416 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -119,10 +119,12 @@ export function TransactionPage({ tid, goToWalletHistory }: Props): VNode {
   }
 
   const currency = Amounts.parse(state.response.amountEffective)!.currency;
-  const txScope = !state.response.scopes.length ? {
-    type: ScopeType.Global as const,
-    currency,
-  } : state.response.scopes[0]
+  const txScope = !state.response.scopes.length
+    ? {
+        type: ScopeType.Global as const,
+        currency,
+      }
+    : state.response.scopes[0];
 
   return (
     <TransactionView
@@ -581,9 +583,9 @@ export function TransactionView({
                         <i18n.Translate>
                           {<Amount value={r.amountEffective} />}{" "}
                           <a
-                            href={Pages.balanceTransaction({
+                            href={`#${Pages.balanceTransaction({
                               tid: r.transactionId,
-                            })}
+                            })}`}
                           >
                             was refunded
                           </a>{" "}
@@ -720,9 +722,19 @@ export function TransactionView({
         ) : transaction.wireTransferProgress === 0 ? (
           <AlertView
             alert={{
-              type: "warning",
-              message: i18n.str`Wire transfer is not initiated.`,
-              description: i18n.str` `,
+              type: "info",
+              message: i18n.str`Wire transfer still pending.`,
+              description: (
+                <i18n.Translate>
+                  The service provider deadline to make the wire transfer is:{" "}
+                  <Time
+                    timestamp={AbsoluteTime.fromProtocolTimestamp(
+                      transaction.wireTransferDeadline,
+                    )}
+                    format="dd MMMM yyyy, HH:mm"
+                  />
+                </i18n.Translate>
+              ),
             }}
           />
         ) : transaction.wireTransferProgress === 100 ? (
@@ -749,7 +761,17 @@ export function TransactionView({
             alert={{
               type: "info",
               message: i18n.str`Wire transfer in progress.`,
-              description: i18n.str` `,
+              description: (
+                <i18n.Translate>
+                  The service provider deadline to make the wire transfer is:{" "}
+                  <Time
+                    timestamp={AbsoluteTime.fromProtocolTimestamp(
+                      transaction.wireTransferDeadline,
+                    )}
+                    format="dd MMMM yyyy, HH:mm"
+                  />
+                </i18n.Translate>
+              ),
             }}
           />
         )}
@@ -807,9 +829,9 @@ export function TransactionView({
         >
           {transaction.paymentInfo ? (
             <a
-              href={Pages.balanceTransaction({
+              href={`#${Pages.balanceTransaction({
                 tid: transaction.refundedTransactionId,
-              })}
+              })}`}
             >
               {transaction.paymentInfo.summary}
             </a>