show cashout details

1 files changed, 51 insertions, 42 deletions

diff --git a/packages/demobank-ui/src/pages/admin/AccountForm.tsx b/packages/demobank-ui/src/pages/admin/AccountForm.tsx
index b38d40012..526deeeab 100644
--- a/packages/demobank-ui/src/pages/admin/AccountForm.tsx
+++ b/packages/demobank-ui/src/pages/admin/AccountForm.tsx
@@ -27,11 +27,13 @@ export function AccountForm({
   purpose,
   onChange,
   focus,
+  noCashout,
   children,
 }: {
   focus?: boolean,
   children: ComponentChildren,
   username?: string,
+  noCashout?: boolean,
   template: TalerCorebankApi.AccountData | undefined;
   onChange: (a: AccountFormData | undefined) => void;
   purpose: "create" | "update" | "show";
@@ -44,14 +46,14 @@ export function AccountForm({
   const { i18n } = useTranslationContext();
 
   function updateForm(newForm: typeof initial): void {
-
+    console.log(newForm)
     const parsed = !newForm.cashout_payto_uri
       ? undefined
       : buildPayto("iban", newForm.cashout_payto_uri, undefined);;
 
     const errors = undefinedIfEmpty<RecursivePartial<typeof initial>>({
       cashout_payto_uri: (!newForm.cashout_payto_uri
-        ? i18n.str`required`
+        ? undefined
         : !parsed
           ? i18n.str`does not follow the pattern`
           : !parsed.isKnown || parsed.targetType !== "iban"
@@ -81,10 +83,10 @@ export function AccountForm({
     if (errors) {
       onChange(undefined)
     } else {
-      const cashout = buildPayto("iban", newForm.cashout_payto_uri!, undefined)
+      const cashout = !newForm.cashout_payto_uri? undefined :buildPayto("iban", newForm.cashout_payto_uri, undefined)
       const account: AccountFormData = {
         ...newForm as any,
-        cashout_payto_uri: stringifyPaytoUri(cashout)
+        cashout_payto_uri: !cashout ? undefined : stringifyPaytoUri(cashout)
       }
       onChange(account);
     }
@@ -194,6 +196,9 @@ export function AccountForm({
                 onChange={(e) => {
                   if (form.contact_data) {
                     form.contact_data.email = e.currentTarget.value;
+                    if (!form.contact_data.email) {
+                      form.contact_data.email = undefined
+                    }
                     updateForm(structuredClone(form));
                   }
                 }}
@@ -220,12 +225,15 @@ export function AccountForm({
                 class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
                 name="phone"
                 id="phone"
-                disabled={purpose !== "create"}
+                disabled={purpose === "show"}
                 value={form.contact_data?.phone ?? ""}
                 data-error={!!errors?.contact_data?.phone && form.contact_data?.phone !== undefined}
                 onChange={(e) => {
                   if (form.contact_data) {
                     form.contact_data.phone = e.currentTarget.value;
+                    if (!form.contact_data.email) {
+                      form.contact_data.email = undefined
+                    }
                     updateForm(structuredClone(form));
                   }
                 }}
@@ -240,44 +248,45 @@ export function AccountForm({
           </div>
 
 
-          <div class="sm:col-span-5">
-            <label
-              class="block text-sm font-medium leading-6 text-gray-900"
-              for="cashout"
-            >
-              {i18n.str`Cashout IBAN`}
-              {purpose !== "show" && <b style={{ color: "red" }}> *</b>}
-            </label>
-            <div class="mt-2">
-              <input
-                type="text"
-                ref={focus && purpose === "update" ? doAutoFocus : undefined}
-                data-error={!!errors?.cashout_payto_uri && form.cashout_payto_uri !== undefined}
-                class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
-                name="cashout"
-                id="cashout"
-                disabled={purpose === "show"}
-                value={form.cashout_payto_uri ?? ""}
-                onChange={(e) => {
-                  form.cashout_payto_uri = e.currentTarget.value as PaytoString;
-                  updateForm(structuredClone(form));
-                }}
-                autocomplete="off"
-              />
-              <ShowInputErrorLabel
-                message={errors?.cashout_payto_uri}
-                isDirty={form.cashout_payto_uri !== undefined}
-              />
+          {!noCashout &&
+            <div class="sm:col-span-5">
+              <label
+                class="block text-sm font-medium leading-6 text-gray-900"
+                for="cashout"
+              >
+                {i18n.str`Cashout IBAN`}
+                {purpose !== "show" && <b style={{ color: "red" }}> *</b>}
+              </label>
+              <div class="mt-2">
+                <input
+                  type="text"
+                  ref={focus && purpose === "update" ? doAutoFocus : undefined}
+                  data-error={!!errors?.cashout_payto_uri && form.cashout_payto_uri !== undefined}
+                  class="block w-full disabled:bg-gray-100 rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 data-[error=true]:ring-red-500 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
+                  name="cashout"
+                  id="cashout"
+                  disabled={purpose === "show"}
+                  value={form.cashout_payto_uri ?? ""}
+                  onChange={(e) => {
+                    form.cashout_payto_uri = e.currentTarget.value as PaytoString;
+                    if (!form.cashout_payto_uri) {
+                      form.cashout_payto_uri= undefined
+                    }
+                    updateForm(structuredClone(form));
+                  }}
+                  autocomplete="off"
+                />
+                <ShowInputErrorLabel
+                  message={errors?.cashout_payto_uri}
+                  isDirty={form.cashout_payto_uri !== undefined}
+                />
+              </div>
+              <p class="mt-2 text-sm text-gray-500" >
+                <i18n.Translate>account number where the money is going to be sent when doing cashouts</i18n.Translate>
+              </p>
             </div>
-            <p class="mt-2 text-sm text-gray-500" >
-              <i18n.Translate>account number where the money is going to be sent when doing cashouts</i18n.Translate>
-            </p>
-          </div>
-          <div class="sm:col-span-5">
-            <pre>
-              {JSON.stringify(errors, undefined, 2)}
-            </pre>
-          </div>
+          }
+
         </div>
       </div>
       {children}