-factor out walletwithdraw into function

1 files changed, 39 insertions, 23 deletions

diff --git a/packages/bank/src/pages/home/index.tsx b/packages/bank/src/pages/home/index.tsx
index 38d048a..39b834a 100644
--- a/packages/bank/src/pages/home/index.tsx
+++ b/packages/bank/src/pages/home/index.tsx
@@ -909,6 +909,7 @@ function BankFrame(Props: any): VNode {
     </Fragment>);
 }
 
+
 function PaytoWireTransfer(Props: any): VNode {
   const currency = useContext(CurrencyContext);
   const [pageState, pageStateSetter] = useContext(PageContext); // NOTE: used for go-back button?
@@ -1228,33 +1229,15 @@ function OpenPayTab(evt: MouseEvent, tabName: string) {
 }
 
 
-
-/**
- * Let the user choose a payment option,
- * then specify the details trigger the action.
- */
-function PaymentOptions(Props: any): VNode {
+function WalletWithdraw(Props: any): VNode {
   const { backendState, pageStateSetter } = Props;
   const currency = useContext(CurrencyContext);
   const i18n = useTranslator();
   let submitAmount = '5.00'; // must match the first <select> child.
   // const amountRegex = "^[0-9]+(\.[0-9]+)?$"; // currently unused
 
-  return (<article>
-    <div class="payments">
-      <div class="tab">
-        <button class="tablinks"
-          onClick={(e: MouseEvent): void => {OpenPayTab(e, 'charge-wallet')}}>
-          {i18n`Charge Taler wallet`}
-        </button>
-        <button class="tablinks"
-          onClick={(e: MouseEvent): void => {OpenPayTab(e, 'wire-transfer')}}>
-          {i18n`Wire to bank account`}
-        </button>
-      </div>
-      <div id='charge-wallet' class='tabcontent'>
-        <h3>{i18n`Charge Taler wallet`}</h3>
-        {/* FIXME: Amount entry does not work nicely yet */}
+  /* FIXME: Amount entry does not work nicely yet */
+  return (
         <div id="reserve-form"
           class="pure-form"
           name="tform">
@@ -1304,11 +1287,44 @@ function PaymentOptions(Props: any): VNode {
             }} />
           </p>
         </div>
+  )
+}
+
+
+/**
+ * Let the user choose a payment option,
+ * then specify the details trigger the action.
+ */
+function PaymentOptions(Props: any): VNode {
+  const { backendState, pageStateSetter } = Props;
+  const currency = useContext(CurrencyContext);
+  const i18n = useTranslator();
+  let submitAmount = '5.00'; // must match the first <select> child.
+  // const amountRegex = "^[0-9]+(\.[0-9]+)?$"; // currently unused
+
+  return (<article>
+    <div class="payments">
+      <div class="tab">
+        <button class="tablinks"
+          onClick={(e: MouseEvent): void => {OpenPayTab(e, 'charge-wallet')}}>
+          {i18n`Charge Taler wallet`}
+        </button>
+        <button class="tablinks"
+          onClick={(e: MouseEvent): void => {OpenPayTab(e, 'wire-transfer')}}>
+          {i18n`Wire to bank account`}
+        </button>
+      </div>
+      <div id='charge-wallet' class='tabcontent'>
+        <h3>{i18n`Charge Taler wallet`}</h3>
+        <WalletWithdraw
+           backendState={backendState}
+           pageStateSetter={pageStateSetter} />
       </div>
       <div id='wire-transfer' class='tabcontent'>
         <h3>{i18n`Wire to bank account`}</h3>
-        {/* FIXME: turn into button!? */}
-        <PaytoWireTransfer backendState={backendState} />
+        <PaytoWireTransfer
+           backendState={backendState}
+           pageStateSetter={pageStateSetter} />
       </div>
     </div>
   </article>);