From c59f9a2556731ad95ab8bd7eefe7fa8a41629834 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Tue, 20 Dec 2022 17:45:24 -0300
Subject: use translation context from web-utils, don't use match react-router
 since is broken

---
 .../src/components/menu/index.tsx                  | 99 ++++++++++------------
 1 file changed, 47 insertions(+), 52 deletions(-)

(limited to 'packages/merchant-backoffice-ui/src/components/menu/index.tsx')

diff --git a/packages/merchant-backoffice-ui/src/components/menu/index.tsx b/packages/merchant-backoffice-ui/src/components/menu/index.tsx
index 23935ec98..ccbd9442f 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/index.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/index.tsx
@@ -15,7 +15,6 @@
  */
 
 import { ComponentChildren, Fragment, h, VNode } from "preact";
-import Match from "preact-router/match";
 import { useEffect, useState } from "preact/hooks";
 import { AdminPaths } from "../../AdminRoutes.js";
 import { InstancePaths } from "../../InstanceRoutes.js";
@@ -58,6 +57,7 @@ function getAdminTitle(path: string, instance: string) {
 
 interface MenuProps {
   title?: string;
+  path: string;
   instance: string;
   admin?: boolean;
   onLogout?: () => void;
@@ -81,64 +81,59 @@ export function Menu({
   onLogout,
   title,
   instance,
+  path,
   admin,
   setInstanceName,
 }: MenuProps): VNode {
   const [mobileOpen, setMobileOpen] = useState(false);
 
+  const titleWithSubtitle = title
+    ? title
+    : !admin
+    ? getInstanceTitle(path, instance)
+    : getAdminTitle(path, instance);
+  const adminInstance = instance === "default";
+  const mimic = admin && !adminInstance;
   return (
-    <Match>
-      {({ path }: any) => {
-        const titleWithSubtitle = title
-          ? title
-          : !admin
-          ? getInstanceTitle(path, instance)
-          : getAdminTitle(path, instance);
-        const adminInstance = instance === "default";
-        const mimic = admin && !adminInstance;
-        return (
-          <WithTitle title={titleWithSubtitle}>
-            <div
-              class={mobileOpen ? "has-aside-mobile-expanded" : ""}
-              onClick={() => setMobileOpen(false)}
-            >
-              <NavigationBar
-                onMobileMenu={() => setMobileOpen(!mobileOpen)}
-                title={titleWithSubtitle}
-              />
-
-              {onLogout && (
-                <Sidebar
-                  onLogout={onLogout}
-                  admin={admin}
-                  mimic={mimic}
-                  instance={instance}
-                  mobile={mobileOpen}
-                />
-              )}
-
-              {mimic && (
-                <nav class="level">
-                  <div class="level-item has-text-centered has-background-warning">
-                    <p class="is-size-5">
-                      You are viewing the instance <b>"{instance}"</b>.{" "}
-                      <a
-                        href="#/instances"
-                        onClick={(e) => {
-                          setInstanceName("default");
-                        }}
-                      >
-                        go back
-                      </a>
-                    </p>
-                  </div>
-                </nav>
-              )}
+    <WithTitle title={titleWithSubtitle}>
+      <div
+        class={mobileOpen ? "has-aside-mobile-expanded" : ""}
+        onClick={() => setMobileOpen(false)}
+      >
+        <NavigationBar
+          onMobileMenu={() => setMobileOpen(!mobileOpen)}
+          title={titleWithSubtitle}
+        />
+
+        {onLogout && (
+          <Sidebar
+            onLogout={onLogout}
+            admin={admin}
+            mimic={mimic}
+            instance={instance}
+            mobile={mobileOpen}
+          />
+        )}
+
+        {mimic && (
+          <nav class="level">
+            <div class="level-item has-text-centered has-background-warning">
+              <p class="is-size-5">
+                You are viewing the instance <b>&quot;{instance}&quot;</b>.{" "}
+                <a
+                  href="#/instances"
+                  onClick={(e) => {
+                    setInstanceName("default");
+                  }}
+                >
+                  go back
+                </a>
+              </p>
             </div>
-          </WithTitle>
-        );
-      }}
-    </Match>
+          </nav>
+        )}
+      </div>
+    </WithTitle>
   );
 }
 
-- 
cgit v1.2.3