[taler-merchant-backoffice] branch master updated (77c3574 -> 93541e1)

[gnunet]

This is an automated email from the git hooks/post-receive script.

ms pushed a change to branch master
in repository merchant-backoffice.

    from 77c3574  extracting currency from balance
     new 6e66ec7  wire transfer: amount as separate field too
     new 93541e1  Show IBAN after login.

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 packages/bank/src/pages/home/index.tsx | 108 ++++++++++++++++++++++-----------
 1 file changed, 74 insertions(+), 34 deletions(-)

diff --git a/packages/bank/src/pages/home/index.tsx 
b/packages/bank/src/pages/home/index.tsx
index f72cd63..d56e1d2 100644
--- a/packages/bank/src/pages/home/index.tsx
+++ b/packages/bank/src/pages/home/index.tsx
@@ -24,10 +24,15 @@ import "../../scss/main.scss";
  * - Many strings need to be i18n-wrapped.
  */
 
+/***********
+ * Globals *
+ **********/
+
+
 /************
  * Contexts *
  ***********/
-var CurrencyContext = createContext(null);
+var CurrencyContext = createContext<any>(null);
 
 /**********************************************
  * Type definitions for states and API calls. *
@@ -45,9 +50,14 @@ interface BackendStateType {
 
 /**
  * Request body of POST /transactions.
+ *
+ * If the amount appears twice: both as a Payto parameter and
+ * in the JSON dedicate field, the one on the Payto URI takes
+ * precedence.
  */
 interface TransactionRequestType {
   paytoUri: string;
+  amount?: string;
 }
 
 /**
@@ -91,23 +101,29 @@ interface AccountStateType {
   /* FIXME: Need history here.  */
 }
 
-/************
- * Contexts *
- ***********/
-const currencyContext = createContext<string>()
-
-
 /************
  * Helpers. *
  ***********/
 
+/**
+ * Extract IBAN from a Payto URI.
+ */
+function getIbanFromPayto(url: string): string {
+  const pathSplit = new URL(url).pathname.split("/");
+  var lastIndex = pathSplit.length - 1;
+  // Happens if the path ends with "/".
+  if (pathSplit[lastIndex] === "") lastIndex--;
+  const iban = pathSplit[lastIndex];
+  return iban;
+}
+
 /**
  * Parse amount.
  */
 function parseAmount(val: string): Amount {
   const format = /^[A-Z]+:[0-9]+(\.[0-9]+)?$/;
   if (!format.test(val))
-    throw Error("Backend gave invalid amount", val)
+    throw Error(`Backend gave invalid amount: ${val}.`)
   const amountSplit = val.split(":");
   return {value: amountSplit[1], currency: amountSplit[0]}
 }
@@ -646,6 +662,45 @@ async function registrationCall(
  * Functional components. *
  *************************/
 
+function PaytoWireTransfer(Props: any): VNode {
+  const {backendState, pageStateSetter} = Props;
+  const currency = useContext(CurrencyContext);
+  const i18n = useTranslator();
+  const amountRegex = "^[0-9]+(\.[0-9]+)?$";
+  var transactionData: TransactionRequestType;
+
+  return <div>
+    <input
+      type="text"
+      placeholder="amount"
+      pattern={amountRegex}
+      onInput={(e): void => {
+        transactionData = {
+          ...transactionData,
+          amount: e.currentTarget.value,
+        };
+      }} />
+    <label>{currency}</label> 
+    <input
+      type="text"
+      placeholder="payto address" // changing this breaks tests.
+      required
+      onInput={(e): void => {
+        transactionData = {
+          ...transactionData,
+          paytoUri: e.currentTarget.value,
+        };
+      }} />
+    <button onClick={() => {
+      createTransactionCall(
+        transactionData,
+        backendState,
+        pageStateSetter
+      ); 
+    }}>{i18n`Create wire transfer`}</button>
+  </div>
+}
+
 /**
  * Let user choose a amount and submit the withdtawal.
  */
@@ -653,8 +708,9 @@ function TalerWithdrawal(Props: any): VNode {
   const {backendState, pageStateSetter} = Props;
   const currency = useContext(CurrencyContext);
   const i18n = useTranslator();
-  const amountRegex = "^[0-9]+(\.[0-9]+)?$";
   var submitAmount = ""; // without currency.
+  const amountRegex = "^[0-9]+(\.[0-9]+)?$";
+
   var submitButton = <button
     onClick={() => {
       console.log("Maybe valid amount", submitAmount);
@@ -672,8 +728,7 @@ function TalerWithdrawal(Props: any): VNode {
       )}}>{i18n`Charge Taler wallet`}
     </button>;
 
-  return <Fragment>
-    <label>{currency}</label> 
+  return <div>
     <input
       type="text"
       placeholder="amount"
@@ -682,8 +737,9 @@ function TalerWithdrawal(Props: any): VNode {
       onInput={(e): void => {
         submitAmount = e.currentTarget.value
       }} />
-      { submitButton }
-  </Fragment>
+    <label>{currency}</label> 
+    { submitButton }
+  </div>
 }
 
 /**
@@ -888,6 +944,7 @@ function Account(Props: any): VNode {
   }
   const balance = parseAmount(data.balance.amount)
   return (<Fragment>
+    <p>Hello {accountLabel}, {getIbanFromPayto(data.paytoUri)}.</p>
     <p>Your balance is {`${balance.value} ${balance.currency}`}.</p>
     <div>
       <span>{i18n`Last transactions:`}</span> { txsPages }
@@ -1026,7 +1083,6 @@ export function BankHome(): VNode {
       return <p>Error: waiting for details...</p>;
     }
 
-    var transactionData: TransactionRequestType;
     return (
       <SWRWithCredentials
         username={backendState.username}
@@ -1092,26 +1148,10 @@ export function BankHome(): VNode {
            { /**
               * Profile page is pristine: offer the wire transfer form.
               */
-              !pageState.withdrawalInProgress && !pageState.transferOutcome && 
<Fragment>
-               <p>Please, include the 'amount' query parameter.</p>
-               <input
-                  type="text"
-                  placeholder="payto address" // changing this breaks tests.
-                  required
-                  onInput={(e): void => {
-                    transactionData = {
-                      ...transactionData,
-                      paytoUri: e.currentTarget.value,
-                    };
-                  }} />
-               <button onClick={() => {
-                  createTransactionCall(
-                   transactionData,
-                    backendState,
-                    pageStateSetter
-                 ); 
-               }}>{i18n`Create wire transfer`}</button>
-             </Fragment>
+              !pageState.withdrawalInProgress &&
+               !pageState.transferOutcome &&
+                 <PaytoWireTransfer pageStateSetter={pageStateSetter}
+                                    backendState={backendState} />
            }
           </Account>
           { /* The user is logged in: offer to log out.  */ }

-- 
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.