make the managment login intention explicit

7 files changed, 77 insertions, 27 deletions

diff --git a/packages/frontend/src/ApplicationReadyRoutes.tsx b/packages/frontend/src/ApplicationReadyRoutes.tsx
index d9bd75d..37a4caf 100644
--- a/packages/frontend/src/ApplicationReadyRoutes.tsx
+++ b/packages/frontend/src/ApplicationReadyRoutes.tsx
@@ -29,23 +29,30 @@ import { NotYetReadyAppMenu, Menu, NotificationCard } from './components/menu';
 import { useTranslator } from './i18n';
 import { createHashHistory } from 'history';
 import { useState } from 'preact/hooks';
-import { CreateStockNoRestock } from './components/form/InputStock.stories';
 
+/**
+ * We know that we are connection to a merchant backend because we have 
+ * succeeded with a /config request but we should check for credentials 
+ * and management control before continue
+ *  
+ * @returns Application or Login form with an error
+ */
 export function ApplicationReadyRoutes(): VNode {
   const i18n = useTranslator();
-  const { url: backendURL, changeBackend, updateToken, clearAllTokens } = useBackendContext();
+  const { url: backendURL, managementIntended, changeBackend, updateToken, clearAllTokens } = useBackendContext();
 
-  const updateLoginStatus = (url: string, token?: string) => {
-    changeBackend(url);
+  const updateLoginStatus = (url: string, management: boolean, token?: string) => {
+    changeBackend(url, management);
     if (token) updateToken(token);
   };
-  const result = useBackendInstancesTestForAdmin()
 
   const clearTokenAndGoToRoot = () => {
     clearAllTokens();
     route('/')
   }
 
+  const result = useBackendInstancesTestForAdmin()
+
   if (result.clientError && result.isUnauthorized) {
     return <Fragment>
       <NotYetReadyAppMenu title="Login" onLogout={clearTokenAndGoToRoot} />
@@ -62,10 +69,25 @@ export function ApplicationReadyRoutes(): VNode {
 
   if (result.loading) return <NotYetReadyAppMenu title="Loading..." />
 
-  let admin = true;
+  let admin = managementIntended;
   let instanceNameByBackendURL;
 
   if (!result.ok) {
+
+    if (managementIntended) {
+      return <Fragment>
+        <NotYetReadyAppMenu title="Login" onLogout={clearTokenAndGoToRoot} />
+        <NotificationCard notification={{
+          message: i18n`Couldn't access the server`,
+          description: i18n`You ask for management but seems that this is not the default instance of the backend`,
+          type: 'ERROR'
+        }}
+        />
+        <LoginPage onConfirm={updateLoginStatus} />
+      </Fragment>
+    }
+    admin = false
+
     const path = new URL(backendURL).pathname
     const match = INSTANCE_ID_LOOKUP.exec(path)
     if (!match || !match[1]) {
@@ -84,10 +106,12 @@ export function ApplicationReadyRoutes(): VNode {
       </Fragment>
     }
 
-    admin = false
     instanceNameByBackendURL = match[1]
   }
 
+  /**
+   * We are using router to take information from the URL parameters
+   */
   const history = createHashHistory()
   return <Router history={history}>
     <Route default component={DefaultMainRoute} clearTokenAndGoToRoot={clearTokenAndGoToRoot} admin={admin} instanceNameByBackendURL={instanceNameByBackendURL} />
diff --git a/packages/frontend/src/InstanceRoutes.tsx b/packages/frontend/src/InstanceRoutes.tsx
index 2914f5f..5acca16 100644
--- a/packages/frontend/src/InstanceRoutes.tsx
+++ b/packages/frontend/src/InstanceRoutes.tsx
@@ -102,8 +102,8 @@ export function InstanceRoutes({ id, admin, setInstanceName }: Props): VNode {
       updateDefaultToken(token)
     }
   }
-  const updateLoginStatus = (url: string, token?: string) => {
-    changeBackend(url);
+  const updateLoginStatus = (url: string, magement: boolean, token?: string) => {
+    changeBackend(url, magement);
     if (!token) return
     changeToken(token)
   };
@@ -303,8 +303,8 @@ export function Redirect({ to }: { to: string }): null {
 function AdminInstanceUpdatePage({ id, ...rest }: { id: string } & InstanceUpdatePageProps) {
   const [token, changeToken] = useBackendInstanceToken(id);
   const { changeBackend } = useBackendContext();
-  const updateLoginStatus = (url: string, token?: string) => {
-    changeBackend(url);
+  const updateLoginStatus = (url: string, management: boolean, token?: string) => {
+    changeBackend(url, management);
     if (token)
     changeToken(token);
   };
diff --git a/packages/frontend/src/components/exception/login.tsx b/packages/frontend/src/components/exception/login.tsx
index fca81ae..6b83879 100644
--- a/packages/frontend/src/components/exception/login.tsx
+++ b/packages/frontend/src/components/exception/login.tsx
@@ -28,7 +28,7 @@ import { Notification } from "../../utils/types";
 
 interface Props {
   withMessage?: Notification;
-  onConfirm: (backend: string, token?: string) => void;
+  onConfirm: (backend: string, management: boolean, token?: string) => void;
 }
 
 function getTokenValuePart(t?: string): string | undefined {
@@ -44,7 +44,8 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
   const { admin, token: instanceToken } = useInstanceContext()
   const currentToken = getTokenValuePart(!admin ? baseToken : instanceToken || '')
   const [token, setToken] = useState(currentToken)
-  
+  const [management, setManagement] = useState(false)
+
   const [url, setURL] = useState(backendUrl)
   const i18n = useTranslator()
 
@@ -65,7 +66,7 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
                 <p class="control is-expanded">
                   <input class="input" type="text" placeholder="set new url" name="id"
                     value={url}
-                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, token ? `secret-token:${token}` : undefined) : null}
+                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, management, token ? `secret-token:${token}` : undefined) : null}
                     onInput={(e): void => setURL(e?.currentTarget.value)}
                   />
                 </p>
@@ -80,18 +81,38 @@ export function LoginModal({ onConfirm, withMessage }: Props): VNode {
               <div class="field">
                 <p class="control is-expanded">
                   <input class="input" type="text" placeholder={"set new access token"} name="token"
-                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, token ? `secret-token:${token}` : undefined) : null}
-                    value={token} 
+                    onKeyPress={e => e.keyCode === 13 ? onConfirm(url, management, token ? `secret-token:${token}` : undefined) : null}
+                    value={token}
                     onInput={(e): void => setToken(e?.currentTarget.value)}
                   />
                 </p>
               </div>
             </div>
           </div>
+          <div class="field is-horizontal">
+            <div class="field-label is-normal">
+              <label class="label"><Translate>Management</Translate></label>
+            </div>
+            <div class="field-body">
+              <div class="field">
+                <p class="control is-expanded">
+                  <label class="b-checkbox checkbox">
+                    <input type="checkbox"
+                      class="input"
+                      checked={management}
+                      placeholder={"asdsad"}
+                      name="management"
+                      onChange={() => setManagement(v => !v)} />
+                    <span class="check" />
+                  </label>
+                </p>
+              </div>
+            </div>
+          </div>
         </section>
         <footer class="modal-card-foot " style={{ justifyContent: 'flex-end', border: '1px solid', borderTop: 0 }} >
           <button class="button is-info" onClick={(): void => {
-            onConfirm(url, token ? `secret-token:${token}` : undefined);
+            onConfirm(url, management, token ? `secret-token:${token}` : undefined);
           }} ><Translate>Confirm</Translate></button>
         </footer>
       </div>
diff --git a/packages/frontend/src/context/backend.ts b/packages/frontend/src/context/backend.ts
index 1a7cd72..aeb1c81 100644
--- a/packages/frontend/src/context/backend.ts
+++ b/packages/frontend/src/context/backend.ts
@@ -27,7 +27,8 @@ interface BackendContextType {
   url: string;
   token?: string;
   triedToLog: boolean;
-  changeBackend: (url: string) => void;
+  managementIntended: boolean;
+  changeBackend: (url: string, management: boolean) => void;
   resetBackend: () => void;
   clearAllTokens: () => void;
   addTokenCleaner: (c: () => void) => void;
@@ -38,6 +39,7 @@ const BackendContext = createContext<BackendContextType>({
   url: '',
   token: undefined,
   triedToLog: false,
+  managementIntended: false,
   changeBackend: () => null,
   resetBackend: () => null,
   clearAllTokens: () => null,
@@ -46,7 +48,7 @@ const BackendContext = createContext<BackendContextType>({
 })
 
 export function useBackendContextState(defaultUrl?:string): BackendContextType {
-  const [url, triedToLog, changeBackend, resetBackend] = useBackendURL(defaultUrl);
+  const [url, triedToLog, management, changeBackend, resetBackend] = useBackendURL(defaultUrl);
   const [token, _updateToken] = useBackendDefaultToken();
   const updateToken = (t?:string) => {
     _updateToken(t)
@@ -66,7 +68,7 @@ export function useBackendContextState(defaultUrl?:string): BackendContextType {
     resetBackend()
   }
 
-  return { url, token, triedToLog, changeBackend, updateToken, resetBackend, clearAllTokens, addTokenCleaner: addTokenCleanerMemo }
+  return { url, token, triedToLog, managementIntended: management, changeBackend, updateToken, resetBackend, clearAllTokens, addTokenCleaner: addTokenCleanerMemo }
 }
 
 export const BackendContextProvider = ({children, defaultUrl}:{children:any, defaultUrl?:string}):VNode => {
diff --git a/packages/frontend/src/hooks/index.ts b/packages/frontend/src/hooks/index.ts
index 19d672a..46b3222 100644
--- a/packages/frontend/src/hooks/index.ts
+++ b/packages/frontend/src/hooks/index.ts
@@ -28,19 +28,22 @@ const calculateRootPath = () => {
   return rootPath
 }
 
-export function useBackendURL(url?: string): [string, boolean, StateUpdater<string>, () => void] {
+export function useBackendURL(url?: string): [string, boolean, boolean, (url:string, m:boolean) => void, () => void] {
   const [value, setter] = useNotNullLocalStorage('backend-url', url || calculateRootPath())
+  const [mngmt, setMngmt] = useLocalStorage('backend-management')
   const [triedToLog, setTriedToLog] = useLocalStorage('tried-login')
 
-  const checkedSetter = (v: ValueOrFunction<string>) => {
+  const checkedSetter = (v: string, m: boolean) => {
     setTriedToLog('yes')
-    return setter(p => (v instanceof Function ? v(p) : v).replace(/\/$/, ''))
+    setMngmt(m ? 'yes' : 'no')
+    return setter(v.replace(/\/$/, ''))
   }
 
   const resetBackend = () => {
+    setMngmt(undefined)
     setTriedToLog(undefined)
   }
-  return [value, !!triedToLog, checkedSetter, resetBackend]
+  return [value, !!triedToLog, mngmt === 'yes', checkedSetter, resetBackend]
 }
 
 export function useBackendDefaultToken(): [string | undefined, StateUpdater<string | undefined>] {
diff --git a/packages/frontend/src/index.tsx b/packages/frontend/src/index.tsx
index 0a77533..0dee1fe 100644
--- a/packages/frontend/src/index.tsx
+++ b/packages/frontend/src/index.tsx
@@ -51,8 +51,8 @@ function ApplicationStatusRoutes(): VNode {
   const result = useBackendConfig();
   const i18n = useTranslator()
 
-  const updateLoginInfoAndGoToRoot = (url: string, token?: string) => {
-    changeBackend(url)
+  const updateLoginInfoAndGoToRoot = (url: string, management: boolean, token?: string) => {
+    changeBackend(url, management)
     if (token) updateToken(token)
     route('/')
   }
diff --git a/packages/frontend/src/paths/login/index.tsx b/packages/frontend/src/paths/login/index.tsx
index acad7fe..44ab9b1 100644
--- a/packages/frontend/src/paths/login/index.tsx
+++ b/packages/frontend/src/paths/login/index.tsx
@@ -22,7 +22,7 @@ import { h, VNode } from "preact";
 import { LoginModal } from '../../components/exception/login';
 
 interface Props {
-  onConfirm: (url: string, token?: string) => void;
+  onConfirm: (url: string, management: boolean, token?: string) => void;
 }
 export default function LoginPage({ onConfirm }: Props): VNode {
   return <LoginModal onConfirm={onConfirm} />