merchant-backoffice

commit 0d59f0ec9bbcd28ff3e528cc8afe69262e9a37cb
parent 9128d984cefe1a337a63f5f02493d53ededc6ede
Author: Sebastian <sebasjm@gmail.com>
Date:   Wed,  3 Mar 2021 14:35:41 -0300

login modal should be sent on update

Diffstat:
M
packages/frontend/src/components/auth/index.tsx
 | 
32
+++++++++++++++-----------------

1 file changed, 15 insertions(+), 17 deletions(-)
diff --git a/packages/frontend/src/components/auth/index.tsx b/packages/frontend/src/components/auth/index.tsx
@@ -22,7 +22,7 @@
 import { h, VNode } from "preact";
 import { useMessageTemplate } from "preact-messages";
 import { useContext, useState } from "preact/hooks";
-import { BackendContext } from "../../context/backend";
+import { useBackendContext } from "../../context/backend";
 import { Notification } from "../../utils/types";
 
 interface Props {
@@ -31,16 +31,14 @@ interface Props {
 }
 
 export function LoginModal({ onConfirm, withMessage }: Props): VNode {
-  const backend = useContext(BackendContext)
+  const backend = useBackendContext()
   const [token, setToken] = useState(backend.token || '')
   const [url, setURL] = useState(backend.url)
-  // const [updatingToken, setUpdatingToken] = useState(false)
-  // const toggleUpdatingToken = (): void => setUpdatingToken(v => !v)
   const i18n = useMessageTemplate()
 
   return <div class="columns is-centered">
     <div class="column is-two-thirds " >
-      <div class="modal-card" style={{width:'100%',margin:0 }}>
+      <div class="modal-card" style={{ width: '100%', margin: 0 }}>
         {withMessage && <div class={withMessage.type === 'ERROR' ? "notification is-danger" : "notification is-info"}>
           <div class="columns is-vcentered">
             <div class="column is-12">
@@ -51,10 +49,10 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
             </div>
           </div>
         </div>}
-        <header class="modal-card-head" style={{border: '1px solid', borderBottom: 0}}>
+        <header class="modal-card-head" style={{ border: '1px solid', borderBottom: 0 }}>
           <p class="modal-card-title">{i18n`Login required`}</p>
         </header>
-        <section class="modal-card-body" style={{border: '1px solid', borderTop: 0, borderBottom: 0}}>
+        <section class="modal-card-body" style={{ border: '1px solid', borderTop: 0, borderBottom: 0 }}>
           {i18n`Please enter your auth token. Token should have "secret-token:" and start with Bearer or ApiKey`}
           <div class="field is-horizontal">
             <div class="field-label is-normal">
@@ -63,7 +61,11 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
             <div class="field-body">
               <div class="field">
                 <p class="control is-expanded">
-                  <input class="input" type="text" placeholder="set new url" name="id" value={url} onInput={(e): void => setURL(e?.currentTarget.value)} />
+                  <input class="input" type="text" placeholder="set new url" name="id"
+                    value={url}
+                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, token ? token : undefined) : null}
+                    onInput={(e): void => setURL(e?.currentTarget.value)}
+                  />
                 </p>
               </div>
             </div>
@@ -73,15 +75,13 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
               <label class="label">Token</label>
             </div>
             <div class="field-body">
-              {/* <div class="field has-addons">
-              <label class="b-checkbox checkbox">
-                <input type="checkbox" checked={updatingToken} onClick={toggleUpdatingToken} />
-                <span class="check" />
-              </label> */}
-
               <div class="field">
                 <p class="control is-expanded">
-                  <input class="input" type="text" placeholder={"set new token"} name="id" value={token} onInput={(e): void => setToken(e?.currentTarget.value)} />
+                  <input class="input" type="text" placeholder={"set new token"} name="token"
+                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, token ? token : undefined) : null}
+                    value={token} 
+                    onInput={(e): void => setToken(e?.currentTarget.value)}
+                  />
                 </p>
               </div>
             </div>
@@ -95,6 +95,4 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
       </div>
     </div>
   </div>
-
-  // </div>
 }
 \ No newline at end of file