dd53: Deposits should use the receiver name of the payto-URI of the target account

1 files changed, 22 insertions, 16 deletions

diff --git a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
index 4d045ee13..7b80977f3 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
@@ -23,13 +23,12 @@ import {
   stringifyPaytoUri,
   validateIban,
 } from "@gnu-taler/taler-util";
+import { useTranslationContext } from "@gnu-taler/web-util/browser";
 import { styled } from "@linaria/react";
 import { Fragment, h, VNode } from "preact";
 import { useState } from "preact/hooks";
 import { ErrorMessage } from "../../components/ErrorMessage.js";
-import { SelectList } from "../../components/SelectList.js";
-import { Input, SubTitle, SvgIcon } from "../../components/styled/index.js";
-import { useTranslationContext } from "@gnu-taler/web-util/browser";
+import { SubTitle, SvgIcon } from "../../components/styled/index.js";
 import { Button } from "../../mui/Button.js";
 import { TextFieldHandler } from "../../mui/handlers.js";
 import { TextField } from "../../mui/TextField.js";
@@ -110,6 +109,7 @@ export function ReadyView({
         <div style={{ width: "100%", display: "flex" }}>
           {Object.entries(accountType.list).map(([key, name], idx) => (
             <div
+              key={idx}
               style={{
                 marginLeft: 8,
                 padding: 8,
@@ -119,7 +119,7 @@ export function ReadyView({
                   accountType.value === key ? "#0042b2" : "unset",
                 color: accountType.value === key ? "white" : "unset",
               }}
-              onClick={(e) => {
+              onClick={() => {
                 if (accountType.onChange) {
                   accountType.onChange(key);
                 }
@@ -130,6 +130,7 @@ export function ReadyView({
           ))}
         </div>
         <div style={{ border: "1px solid gray", padding: 8, borderRadius: 5 }}>
+          --- {uri.value} ---
           <p>
             <CustomFieldByAccountType
               type={accountType.value as AccountType}
@@ -431,7 +432,7 @@ function BitcoinAddressAccount({ field }: { field: TextFieldHandler }): VNode {
 }
 
 function undefinedIfEmpty<T extends object>(obj: T): T | undefined {
-  return Object.keys(obj).some((k) => (obj as any)[k] !== undefined)
+  return Object.keys(obj).some((k) => (obj as Record<string,unknown>)[k] !== undefined)
     ? obj
     : undefined;
 }
@@ -488,20 +489,21 @@ function TalerBankAddressAccount({
 }
 
 //Taken from libeufin and libeufin took it from the ISO20022 XSD schema
-const bicRegex = /^[A-Z]{6}[A-Z2-9][A-NP-Z0-9]([A-Z0-9]{3})?$/;
-const ibanRegex = /^[A-Z]{2}[0-9]{2}[a-zA-Z0-9]{1,30}$/;
+// const bicRegex = /^[A-Z]{6}[A-Z2-9][A-NP-Z0-9]([A-Z0-9]{3})?$/;
+// const ibanRegex = /^[A-Z]{2}[0-9]{2}[a-zA-Z0-9]{1,30}$/;
 
 function IbanAddressAccount({ field }: { field: TextFieldHandler }): VNode {
   const { i18n } = useTranslationContext();
-  const [bic, setBic] = useState<string | undefined>(undefined);
+  // const [bic, setBic] = useState<string | undefined>(undefined);
   const [iban, setIban] = useState<string | undefined>(undefined);
   const [name, setName] = useState<string | undefined>(undefined);
-  const errors = undefinedIfEmpty({
-    bic: !bic
-      ? undefined
-      : !bicRegex.test(bic)
-      ? i18n.str`Invalid bic`
-      : undefined,
+  const bic = ""
+  const errorsFN = (iban:string | undefined, name: string | undefined) => undefinedIfEmpty({
+    // bic: !bic
+    //   ? undefined
+    //   : !bicRegex.test(bic)
+    //   ? i18n.str`Invalid bic`
+    //   : undefined,
     iban: !iban
       ? i18n.str`Can't be empty`
       : validateIban(iban).type === "invalid"
@@ -509,16 +511,20 @@ function IbanAddressAccount({ field }: { field: TextFieldHandler }): VNode {
       : undefined,
     name: !name ? i18n.str`Can't be empty` : undefined,
   });
+  const errors = errorsFN(iban, name)
 
   function sendUpdateIfNoErrors(
     bic: string | undefined,
     iban: string,
     name: string,
   ): void {
-    if (!errors && field.onInput) {
+    if (!field.onInput) return;
+    if (!errorsFN(iban, name)) {
       const p = buildPayto("iban", iban, bic);
       p.params["receiver-name"] = name;
       field.onInput(stringifyPaytoUri(p));
+    } else {
+      field.onInput("")
     }
   }
   return (
@@ -584,7 +590,7 @@ function CustomFieldByAccountType({
   type: AccountType;
   field: TextFieldHandler;
 }): VNode {
-  const { i18n } = useTranslationContext();
+  // const { i18n } = useTranslationContext();
 
   const AccountForm = formComponentByAccountType[type];