app/vmui: move the Explore metrics tab closer to Custom panel tab

Updates https://github.com/VictoriaMetrics/VictoriaMetrics/issues/3386

app/vmui/packages/vmui/src/App.tsx

@@ -36,6 +36,10 @@ const App: FC = () => {
               path={router.home}
               element={<CustomPanel/>}
             />
+            <Route
+              path={router.metrics}
+              element={<ExploreMetrics/>}
+            />
             <Route
               path={router.dashboards}
               element={<DashboardsLayout/>}
@@ -52,10 +56,6 @@ const App: FC = () => {
               path={router.trace}
               element={<TracePage/>}
             />
-            <Route
-              path={router.metrics}
-              element={<ExploreMetrics/>}
-            />
             <Route
               path={router.icons}
               element={<PreviewIcons/>}

app/vmui/packages/vmui/src/components/Layout/Header/Header.tsx

@@ -31,6 +31,10 @@ const Header: FC = () => {
       label: routerOptions[router.home].title,
       value: router.home,
     },
+    {
+      label: routerOptions[router.metrics].title,
+      value: router.metrics,
+    },
     {
       label: routerOptions[router.dashboards].title,
       value: router.dashboards,
@@ -47,10 +51,6 @@ const Header: FC = () => {
     {
       label: routerOptions[router.trace].title,
       value: router.trace,
-    },
-    {
-      label: routerOptions[router.metrics].title,
-      value: router.metrics,
     }
   ]), [appModeEnable]);
 

app/vmui/packages/vmui/src/router/index.ts

@@ -1,10 +1,10 @@
 const router = {
   home: "/",
+  metrics: "/metrics",
   dashboards: "/dashboards",
   cardinality: "/cardinality",
   topQueries: "/top-queries",
   trace: "/trace",
-  metrics: "/metrics",
   icons: "/icons"
 };
 
@@ -30,6 +30,12 @@ export const routerOptions: {[key: string]: RouterOptions} = {
     title: "Custom panel",
     ...routerOptionsDefault
   },
+  [router.metrics]: {
+    title: "Explore metrics",
+    header: {
+      timeSelector: true,
+    }
+  },
   [router.dashboards]: {
     title: "Dashboards",
     ...routerOptionsDefault,
@@ -48,12 +54,6 @@ export const routerOptions: {[key: string]: RouterOptions} = {
     title: "Trace analyzer",
     header: {}
   },
-  [router.metrics]: {
-    title: "Explore metrics",
-    header: {
-      timeSelector: true,
-    }
-  },
   [router.icons]: {
     title: "Icons",
     header: {}