1 files changed, 27 insertions, 25 deletions
diff --git a/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx b/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
index a9b9618bb..adc47b216 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
@@ -19,12 +19,14 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 
-import { useMerchantApiContext, useTranslationContext } from "@gnu-taler/web-util/browser";
-import { Fragment, h, VNode } from "preact";
-import { useConfigContext } from "../../context/config.js";
+import {
+  useMerchantApiContext,
+  useTranslationContext,
+} from "@gnu-taler/web-util/browser";
+import { Fragment, VNode, h } from "preact";
+import { useSessionContext } from "../../context/session.js";
 import { useInstanceKYCDetails } from "../../hooks/instance.js";
 import { LangSelector } from "./LangSelector.js";
-import { useSessionState } from "../../hooks/session.js";
 
 // const GIT_HASH = typeof __GIT_HASH__ !== "undefined" ? __GIT_HASH__ : undefined;
 const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined;
@@ -33,20 +35,21 @@ interface Props {
   mobile?: boolean;
 }
 
-export function Sidebar({
-  mobile,
-}: Props): VNode {
-  const config = useConfigContext();
-  // const { url: backendURL } = useBackendContext()
+export function Sidebar({ mobile }: Props): VNode {
   const { i18n } = useTranslationContext();
   const kycStatus = useInstanceKYCDetails();
   const needKYC = kycStatus.ok && kycStatus.data.type === "redirect";
-  const { state, logOut } = useSessionState();
-  const { url } = useMerchantApiContext();
-  const isLoggedIn = state.status === "loggedIn" || state.status === "impersonate"
-  const hasToken = isLoggedIn && state.token !== undefined
+  const { state, logOut } = useSessionContext();
+  const isLoggedIn = state.status === "loggedIn";
+  const hasToken = isLoggedIn && state.token !== undefined;
+  const backendURL = state.backendUrl;
+  const { config } = useMerchantApiContext();
+
   return (
-    <aside class="aside is-placed-left is-expanded" style={{ overflowY: "scroll" }}>
+    <aside
+      class="aside is-placed-left is-expanded"
+      style={{ overflowY: "scroll" }}
+    >
       {mobile && (
         <div
           class="footer"
@@ -187,9 +190,10 @@ export function Sidebar({
         </p>
         <ul class="menu-list">
           <li>
-            <a class="has-icon is-state-info is-hoverable"
+            <a
+              class="has-icon is-state-info is-hoverable"
               onClick={(e): void => {
-                e.preventDefault()
+                e.preventDefault();
               }}
             >
               <span class="icon">
@@ -206,7 +210,7 @@ export function Sidebar({
                 <i class="mdi mdi-web" />
               </span>
               <span class="menu-item-label">
-                {url.hostname}
+                {new URL(backendURL).hostname}
               </span>
             </div>
           </li>
@@ -215,12 +219,10 @@ export function Sidebar({
               <span style={{ width: "3rem" }} class="icon">
                 ID
               </span>
-              <span class="menu-item-label">
-                {state.instance}
-              </span>
+              <span class="menu-item-label">{state.instance}</span>
             </div>
           </li>
-          {state.isAdmin && state.status !== "impersonate" && (
+          {state.isAdmin && (
             <Fragment>
               <p class="menu-label">
                 <i18n.Translate>Instances</i18n.Translate>
@@ -247,12 +249,12 @@ export function Sidebar({
               </li>
             </Fragment>
           )}
-          {hasToken ?
+          {hasToken ? (
             <li>
               <a
                 class="has-icon is-state-info is-hoverable"
                 onClick={(e): void => {
-                  logOut()
+                  logOut();
                   e.preventDefault();
                 }}
               >
@@ -263,8 +265,8 @@ export function Sidebar({
                   <i18n.Translate>Log out</i18n.Translate>
                 </span>
               </a>
-            </li> : undefined
-          }
+            </li>
+          ) : undefined}
         </ul>
       </div>
     </aside>