business account

1 files changed, 68 insertions, 49 deletions

diff --git a/packages/demobank-ui/src/pages/AdminPage.tsx b/packages/demobank-ui/src/pages/AdminPage.tsx
index 9efd37f12..f8efddd80 100644
--- a/packages/demobank-ui/src/pages/AdminPage.tsx
+++ b/packages/demobank-ui/src/pages/AdminPage.tsx
@@ -24,8 +24,8 @@ import { Fragment, h, VNode } from "preact";
 import { useState } from "preact/hooks";
 import { ErrorMessage, usePageContext } from "../context/pageState.js";
 import {
-  useAccountDetails,
-  useAccounts,
+  useBusinessAccountDetails,
+  useBusinessAccounts,
   useAdminAccountAPI,
 } from "../hooks/circuit.js";
 import {
@@ -71,7 +71,7 @@ export function AdminPage({ onLoadNotOk }: Props): VNode {
     }));
   }
 
-  const result = useAccounts({ account });
+  const result = useBusinessAccounts({ account });
   const { i18n } = useTranslationContext();
 
   if (result.loading) return <div />;
@@ -86,6 +86,10 @@ export function AdminPage({ onLoadNotOk }: Props): VNode {
       <ShowAccountDetails
         account={showDetails}
         onLoadNotOk={onLoadNotOk}
+        onChangePassword={() => {
+          setUpdatePassword(showDetails);
+          setShowDetails(undefined);
+        }}
         onUpdateSuccess={() => {
           showInfoMessage(i18n.str`Account updated`);
           setShowDetails(undefined);
@@ -230,7 +234,7 @@ function initializeFromTemplate(
   return initial as any;
 }
 
-function UpdateAccountPassword({
+export function UpdateAccountPassword({
   account,
   onClear,
   onUpdateSuccess,
@@ -242,7 +246,7 @@ function UpdateAccountPassword({
   account: string;
 }): VNode {
   const { i18n } = useTranslationContext();
-  const result = useAccountDetails(account);
+  const result = useBusinessAccountDetails(account);
   const { changePassword } = useAdminAccountAPI();
   const [password, setPassword] = useState<string | undefined>();
   const [repeat, setRepeat] = useState<string | undefined>();
@@ -268,7 +272,7 @@ function UpdateAccountPassword({
     <div>
       <div>
         <h1 class="nav welcome-text">
-          <i18n.Translate>Admin panel</i18n.Translate>
+          <i18n.Translate>Update password for {account}</i18n.Translate>
         </h1>
       </div>
       {error && (
@@ -277,10 +281,6 @@ function UpdateAccountPassword({
 
       <form class="pure-form">
         <fieldset>
-          <label for="username">{i18n.str`Username`}</label>
-          <input name="username" type="text" readOnly value={account} />
-        </fieldset>
-        <fieldset>
           <label>{i18n.str`Password`}</label>
           <input
             type="password"
@@ -366,7 +366,7 @@ function CreateNewAccount({
     <div>
       <div>
         <h1 class="nav welcome-text">
-          <i18n.Translate>Admin panel</i18n.Translate>
+          <i18n.Translate>New account</i18n.Translate>
         </h1>
       </div>
       {error && (
@@ -428,19 +428,21 @@ function CreateNewAccount({
   );
 }
 
-function ShowAccountDetails({
+export function ShowAccountDetails({
   account,
   onClear,
   onUpdateSuccess,
   onLoadNotOk,
+  onChangePassword,
 }: {
   onLoadNotOk: <T, E>(error: HttpResponsePaginated<T, E>) => VNode;
-  onClear: () => void;
+  onClear?: () => void;
+  onChangePassword: () => void;
   onUpdateSuccess: () => void;
   account: string;
 }): VNode {
   const { i18n } = useTranslationContext();
-  const result = useAccountDetails(account);
+  const result = useBusinessAccountDetails(account);
   const { updateAccount } = useAdminAccountAPI();
   const [update, setUpdate] = useState(false);
   const [submitAccount, setSubmitAccount] = useState<
@@ -459,7 +461,7 @@ function ShowAccountDetails({
     <div>
       <div>
         <h1 class="nav welcome-text">
-          <i18n.Translate>Admin panel</i18n.Translate>
+          <i18n.Translate>Business account details</i18n.Translate>
         </h1>
       </div>
       {error && (
@@ -474,42 +476,59 @@ function ShowAccountDetails({
       <p>
         <div style={{ display: "flex", justifyContent: "space-between" }}>
           <div>
-            <input
-              class="pure-button"
-              type="submit"
-              value={i18n.str`Close`}
-              onClick={async (e) => {
-                e.preventDefault();
-                onClear();
-              }}
-            />
+            {onClear ? (
+              <input
+                class="pure-button"
+                type="submit"
+                value={i18n.str`Close`}
+                onClick={async (e) => {
+                  e.preventDefault();
+                  onClear();
+                }}
+              />
+            ) : undefined}
           </div>
-          <div>
-            <input
-              id="select-exchange"
-              class="pure-button pure-button-primary content"
-              disabled={update && !submitAccount}
-              type="submit"
-              value={update ? i18n.str`Confirm` : i18n.str`Update`}
-              onClick={async (e) => {
-                e.preventDefault();
-
-                if (!update) {
-                  setUpdate(true);
-                } else {
-                  if (!submitAccount) return;
-                  try {
-                    await updateAccount(account, {
-                      cashout_address: submitAccount.cashout_address,
-                      contact_data: submitAccount.contact_data,
-                    });
-                    onUpdateSuccess();
-                  } catch (error) {
-                    handleError(error, saveError, i18n);
+          <div style={{ display: "flex" }}>
+            <div>
+              <input
+                id="select-exchange"
+                class="pure-button pure-button-primary content"
+                disabled={update && !submitAccount}
+                type="submit"
+                value={i18n.str`Change password`}
+                onClick={async (e) => {
+                  e.preventDefault();
+                  onChangePassword();
+                }}
+              />
+            </div>
+            <div>
+              <input
+                id="select-exchange"
+                class="pure-button pure-button-primary content"
+                disabled={update && !submitAccount}
+                type="submit"
+                value={update ? i18n.str`Confirm` : i18n.str`Update`}
+                onClick={async (e) => {
+                  e.preventDefault();
+
+                  if (!update) {
+                    setUpdate(true);
+                  } else {
+                    if (!submitAccount) return;
+                    try {
+                      await updateAccount(account, {
+                        cashout_address: submitAccount.cashout_address,
+                        contact_data: submitAccount.contact_data,
+                      });
+                      onUpdateSuccess();
+                    } catch (error) {
+                      handleError(error, saveError, i18n);
+                    }
                   }
-                }
-              }}
-            />
+                }}
+              />
+            </div>
           </div>
         </div>
       </p>