From e39d5c488e2e425bd7febf694caadc17d5126401 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Wed, 20 Sep 2023 15:18:36 -0300
Subject: more ui

---
 packages/demobank-ui/src/pages/AdminPage.tsx | 150 ++++++++++++---------------
 1 file changed, 64 insertions(+), 86 deletions(-)

(limited to 'packages/demobank-ui/src/pages/AdminPage.tsx')

diff --git a/packages/demobank-ui/src/pages/AdminPage.tsx b/packages/demobank-ui/src/pages/AdminPage.tsx
index 73a4f9ca3..18462bdc3 100644
--- a/packages/demobank-ui/src/pages/AdminPage.tsx
+++ b/packages/demobank-ui/src/pages/AdminPage.tsx
@@ -14,11 +14,14 @@
  GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 
-import { Amounts, HttpStatusCode, parsePaytoUri } from "@gnu-taler/taler-util";
+import { Amounts, HttpStatusCode, TranslatedString, parsePaytoUri } from "@gnu-taler/taler-util";
 import {
   ErrorType,
   HttpResponsePaginated,
   RequestError,
+  notify,
+  notifyError,
+  notifyInfo,
   useTranslationContext,
 } from "@gnu-taler/web-util/browser";
 import { Fragment, h, VNode } from "preact";
@@ -39,12 +42,10 @@ import {
   validateIBAN,
   WithIntermediate,
 } from "../utils.js";
-import { ErrorBannerFloat } from "./BankFrame.js";
 import { ShowCashoutDetails } from "./BusinessAccount.js";
 import { handleNotOkResult } from "./HomePage.js";
 import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js";
 import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js";
-import { ErrorMessage, notifyInfo } from "../hooks/notification.js";
 
 const charset =
   "abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ";
@@ -362,6 +363,7 @@ function AdminAccount({ onRegister }: { onRegister: () => void }): VNode {
         onSuccess={() => {
           notifyInfo(i18n.str`Wire transfer created!`);
         }}
+        onCancel={undefined}
       />
     </Fragment>
   );
@@ -414,7 +416,6 @@ export function UpdateAccountPassword({
   const { changePassword } = useAdminAccountAPI();
   const [password, setPassword] = useState<string | undefined>();
   const [repeat, setRepeat] = useState<string | undefined>();
-  const [error, saveError] = useState<ErrorMessage | undefined>();
 
   if (!result.ok) {
     if (result.loading || result.type === ErrorType.TIMEOUT) {
@@ -431,8 +432,8 @@ export function UpdateAccountPassword({
     repeat: !repeat
       ? i18n.str`required`
       : password !== repeat
-      ? i18n.str`password doesn't match`
-      : undefined,
+        ? i18n.str`password doesn't match`
+        : undefined,
   });
 
   return (
@@ -442,9 +443,6 @@ export function UpdateAccountPassword({
           <i18n.Translate>Update password for {account}</i18n.Translate>
         </h1>
       </div>
-      {error && (
-        <ErrorBannerFloat error={error} onClear={() => saveError(undefined)} />
-      )}
 
       <div style={{ maxWidth: 600, overflowX: "hidden", margin: "auto" }}>
         <form class="pure-form">
@@ -507,15 +505,11 @@ export function UpdateAccountPassword({
                     onUpdateSuccess();
                   } catch (error) {
                     if (error instanceof RequestError) {
-                      saveError(buildRequestErrorMessage(i18n, error.cause));
+                      notify(buildRequestErrorMessage(i18n, error.cause));
                     } else {
-                      saveError({
-                        title: i18n.str`Operation failed, please report`,
-                        description:
-                          error instanceof Error
-                            ? error.message
-                            : JSON.stringify(error),
-                      });
+                      notifyError(i18n.str`Operation failed, please report`, (error instanceof Error
+                        ? error.message
+                        : JSON.stringify(error)) as TranslatedString)
                     }
                   }
                 }}
@@ -540,7 +534,6 @@ function CreateNewAccount({
   const [submitAccount, setSubmitAccount] = useState<
     SandboxBackend.Circuit.CircuitAccountData | undefined
   >();
-  const [error, saveError] = useState<ErrorMessage | undefined>();
   return (
     <div>
       <div>
@@ -548,9 +541,6 @@ function CreateNewAccount({
           <i18n.Translate>New account</i18n.Translate>
         </h1>
       </div>
-      {error && (
-        <ErrorBannerFloat error={error} onClear={() => saveError(undefined)} />
-      )}
 
       <div style={{ maxWidth: 600, overflowX: "hidden", margin: "auto" }}>
         <AccountForm
@@ -587,39 +577,38 @@ function CreateNewAccount({
                   if (!submitAccount) return;
                   try {
                     const account: SandboxBackend.Circuit.CircuitAccountRequest =
-                      {
-                        cashout_address: submitAccount.cashout_address,
-                        contact_data: submitAccount.contact_data,
-                        internal_iban: submitAccount.iban,
-                        name: submitAccount.name,
-                        username: submitAccount.username,
-                        password: randomPassword(),
-                      };
+                    {
+                      cashout_address: submitAccount.cashout_address,
+                      contact_data: submitAccount.contact_data,
+                      internal_iban: submitAccount.iban,
+                      name: submitAccount.name,
+                      username: submitAccount.username,
+                      password: randomPassword(),
+                    };
 
                     await createAccount(account);
                     onCreateSuccess(account.password);
                   } catch (error) {
                     if (error instanceof RequestError) {
-                      saveError(
+                      notify(
                         buildRequestErrorMessage(i18n, error.cause, {
                           onClientError: (status) =>
                             status === HttpStatusCode.Forbidden
                               ? i18n.str`The rights to perform the operation are not sufficient`
                               : status === HttpStatusCode.BadRequest
-                              ? i18n.str`Input data was invalid`
-                              : status === HttpStatusCode.Conflict
-                              ? i18n.str`At least one registration detail was not available`
-                              : undefined,
+                                ? i18n.str`Input data was invalid`
+                                : status === HttpStatusCode.Conflict
+                                  ? i18n.str`At least one registration detail was not available`
+                                  : undefined,
                         }),
                       );
                     } else {
-                      saveError({
-                        title: i18n.str`Operation failed, please report`,
-                        description:
-                          error instanceof Error
-                            ? error.message
-                            : JSON.stringify(error),
-                      });
+                      notifyError(
+                        i18n.str`Operation failed, please report`,
+                        (error instanceof Error
+                          ? error.message
+                          : JSON.stringify(error)) as TranslatedString
+                      )
                     }
                   }
                 }}
@@ -654,7 +643,6 @@ export function ShowAccountDetails({
   const [submitAccount, setSubmitAccount] = useState<
     SandboxBackend.Circuit.CircuitAccountData | undefined
   >();
-  const [error, saveError] = useState<ErrorMessage | undefined>();
 
   if (!result.ok) {
     if (result.loading || result.type === ErrorType.TIMEOUT) {
@@ -673,9 +661,6 @@ export function ShowAccountDetails({
           <i18n.Translate>Business account details</i18n.Translate>
         </h1>
       </div>
-      {error && (
-        <ErrorBannerFloat error={error} onClear={() => saveError(undefined)} />
-      )}
       <div style={{ maxWidth: 600, overflowX: "hidden", margin: "auto" }}>
         <AccountForm
           template={result.data}
@@ -740,24 +725,23 @@ export function ShowAccountDetails({
                         onUpdateSuccess();
                       } catch (error) {
                         if (error instanceof RequestError) {
-                          saveError(
+                          notify(
                             buildRequestErrorMessage(i18n, error.cause, {
                               onClientError: (status) =>
                                 status === HttpStatusCode.Forbidden
                                   ? i18n.str`The rights to change the account are not sufficient`
                                   : status === HttpStatusCode.NotFound
-                                  ? i18n.str`The username was not found`
-                                  : undefined,
+                                    ? i18n.str`The username was not found`
+                                    : undefined,
                             }),
                           );
                         } else {
-                          saveError({
-                            title: i18n.str`Operation failed, please report`,
-                            description:
-                              error instanceof Error
-                                ? error.message
-                                : JSON.stringify(error),
-                          });
+                          notifyError(
+                            i18n.str`Operation failed, please report`,
+                            (error instanceof Error
+                              ? error.message
+                              : JSON.stringify(error)) as TranslatedString
+                          )
                         }
                       }
                     }
@@ -788,7 +772,6 @@ function RemoveAccount({
   const { i18n } = useTranslationContext();
   const result = useAccountDetails(account);
   const { deleteAccount } = useAdminAccountAPI();
-  const [error, saveError] = useState<ErrorMessage | undefined>();
 
   if (!result.ok) {
     if (result.loading || result.type === ErrorType.TIMEOUT) {
@@ -812,7 +795,8 @@ function RemoveAccount({
           <i18n.Translate>Remove account: {account}</i18n.Translate>
         </h1>
       </div>
-      {!isBalanceEmpty && (
+      {/* {FXME: SHOW WARNING} */}
+      {/* {!isBalanceEmpty && (
         <ErrorBannerFloat
           error={{
             title: i18n.str`Can't delete the account`,
@@ -820,10 +804,7 @@ function RemoveAccount({
           }}
           onClear={() => saveError(undefined)}
         />
-      )}
-      {error && (
-        <ErrorBannerFloat error={error} onClear={() => saveError(undefined)} />
-      )}
+      )} */}
 
       <p>
         <div style={{ display: "flex", justifyContent: "space-between" }}>
@@ -852,26 +833,23 @@ function RemoveAccount({
                   onUpdateSuccess();
                 } catch (error) {
                   if (error instanceof RequestError) {
-                    saveError(
+                    notify(
                       buildRequestErrorMessage(i18n, error.cause, {
                         onClientError: (status) =>
                           status === HttpStatusCode.Forbidden
                             ? i18n.str`The administrator specified a institutional username`
                             : status === HttpStatusCode.NotFound
-                            ? i18n.str`The username was not found`
-                            : status === HttpStatusCode.PreconditionFailed
-                            ? i18n.str`Balance was not zero`
-                            : undefined,
+                              ? i18n.str`The username was not found`
+                              : status === HttpStatusCode.PreconditionFailed
+                                ? i18n.str`Balance was not zero`
+                                : undefined,
                       }),
                     );
                   } else {
-                    saveError({
-                      title: i18n.str`Operation failed, please report`,
-                      description:
-                        error instanceof Error
+                    notifyError(i18n.str`Operation failed, please report`,
+                      (error instanceof Error
                           ? error.message
-                          : JSON.stringify(error),
-                    });
+                          : JSON.stringify(error)) as TranslatedString);
                   }
                 }
               }}
@@ -915,31 +893,31 @@ function AccountForm({
       cashout_address: !newForm.cashout_address
         ? i18n.str`required`
         : !parsed
-        ? i18n.str`does not follow the pattern`
-        : !parsed.isKnown || parsed.targetType !== "iban"
-        ? i18n.str`only "IBAN" target are supported`
-        : !IBAN_REGEX.test(parsed.iban)
-        ? i18n.str`IBAN should have just uppercased letters and numbers`
-        : validateIBAN(parsed.iban, i18n),
+          ? i18n.str`does not follow the pattern`
+          : !parsed.isKnown || parsed.targetType !== "iban"
+            ? i18n.str`only "IBAN" target are supported`
+            : !IBAN_REGEX.test(parsed.iban)
+              ? i18n.str`IBAN should have just uppercased letters and numbers`
+              : validateIBAN(parsed.iban, i18n),
       contact_data: undefinedIfEmpty({
         email: !newForm.contact_data?.email
           ? i18n.str`required`
           : !EMAIL_REGEX.test(newForm.contact_data.email)
-          ? i18n.str`it should be an email`
-          : undefined,
+            ? i18n.str`it should be an email`
+            : undefined,
         phone: !newForm.contact_data?.phone
           ? i18n.str`required`
           : !newForm.contact_data.phone.startsWith("+")
-          ? i18n.str`should start with +`
-          : !REGEX_JUST_NUMBERS_REGEX.test(newForm.contact_data.phone)
-          ? i18n.str`phone number can't have other than numbers`
-          : undefined,
+            ? i18n.str`should start with +`
+            : !REGEX_JUST_NUMBERS_REGEX.test(newForm.contact_data.phone)
+              ? i18n.str`phone number can't have other than numbers`
+              : undefined,
       }),
       iban: !newForm.iban
         ? undefined //optional field
         : !IBAN_REGEX.test(newForm.iban)
-        ? i18n.str`IBAN should have just uppercased letters and numbers`
-        : validateIBAN(newForm.iban, i18n),
+          ? i18n.str`IBAN should have just uppercased letters and numbers`
+          : validateIBAN(newForm.iban, i18n),
       name: !newForm.name ? i18n.str`required` : undefined,
       username: !newForm.username ? i18n.str`required` : undefined,
     });
-- 
cgit v1.2.3

