Reorganize stuff to prevent circular dependencies

Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>

src/behaviours/navigating-between-routes.test.tsx

@@ -16,8 +16,8 @@ import { getApplicationBuilder } from "../renderer/components/test-utils/get-app
 import currentRouteInjectable from "../renderer/routes/current-route.injectable";
 import currentPathInjectable from "../renderer/routes/current-path.injectable";
 import queryParametersInjectable from "../renderer/routes/query-parameters.injectable";
-import currentPathParametersInjectable from "../renderer/routes/current-path-parameters.injectable";
 import { navigateToRouteInjectionToken } from "../common/front-end-routing/navigate-to-route-injection-token";
+import routePathParametersInjectable from "../renderer/routes/route-path-parameters.injectable";
 
 describe("navigating between routes", () => {
   let rendererDi: DiContainer;
@@ -73,7 +73,7 @@ describe("navigating between routes", () => {
       });
 
       it("does not have path parameters", () => {
-        const pathParameters = rendererDi.inject(currentPathParametersInjectable);
+        const pathParameters = rendererDi.inject(routePathParametersInjectable, route);
 
         expect(pathParameters.get()).toEqual({});
       });
@@ -101,7 +101,6 @@ describe("navigating between routes", () => {
 
   describe("given route with optional path parameters", () => {
     beforeEach(async () => {
-
       applicationBuilder.beforeApplicationStart(({ rendererDi }) => {
         rendererDi.register(routeWithOptionalPathParametersInjectable);
         rendererDi.register(routeWithOptionalPathParametersComponentInjectable);
@@ -146,7 +145,7 @@ describe("navigating between routes", () => {
       });
 
       it("knows path parameters", () => {
-        const pathParameters = rendererDi.inject(currentPathParametersInjectable);
+        const pathParameters = rendererDi.inject(routePathParametersInjectable, route);
 
         expect(pathParameters.get()).toEqual({
           someParameter: "some-value",
@@ -179,7 +178,7 @@ describe("navigating between routes", () => {
       });
 
       it("knows path parameters", () => {
-        const pathParameters = rendererDi.inject(currentPathParametersInjectable);
+        const pathParameters = rendererDi.inject(routePathParametersInjectable, route);
 
         expect(pathParameters.get()).toEqual({
           someParameter: undefined,
@@ -227,10 +226,11 @@ const routeWithOptionalPathParametersComponentInjectable = getInjectable({
   id: "some-route-component",
 
   instantiate: (di) => {
-    const pathParameters = di.inject(currentPathParametersInjectable);
+    const route = di.inject(routeWithOptionalPathParametersInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable, route);
 
     return {
-      route: di.inject(routeWithOptionalPathParametersInjectable),
+      route,
 
       Component: observer(() => (
         <pre>{JSON.stringify(pathParameters.get(), null, 2)}</pre>

src/renderer/components/+custom-resources/sidebar-items-for-definition-groups.injectable.ts

@@ -8,10 +8,10 @@ import crdListRouteInjectable from "../../../common/front-end-routing/routes/clu
 import customResourceDefinitionsInjectable from "./custom-resources.injectable";
 import { groupBy, matches, noop, some, toPairs } from "lodash/fp";
 import customResourcesRouteInjectable from "../../../common/front-end-routing/routes/cluster/custom-resources/custom-resources/custom-resources-route.injectable";
-import currentPathParametersInjectable from "../../routes/current-path-parameters.injectable";
 import type { SidebarItemRegistration } from "../layout/sidebar-items.injectable";
 import routeIsActiveInjectable from "../../routes/route-is-active.injectable";
 import navigateToCustomResourcesInjectable from "../../../common/front-end-routing/routes/cluster/custom-resources/custom-resources/navigate-to-custom-resources.injectable";
+import routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
 
 const sidebarItemsForDefinitionGroupsInjectable = getInjectable({
   id: "sidebar-items-for-definition-groups",
@@ -24,7 +24,7 @@ const sidebarItemsForDefinitionGroupsInjectable = getInjectable({
     const crdRoute = di.inject(customResourcesRouteInjectable);
     const crdRouteIsActive = di.inject(routeIsActiveInjectable, crdRoute);
     const crdListRoute = di.inject(crdListRouteInjectable);
-    const pathParameters = di.inject(currentPathParametersInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable, crdRoute);
     const navigateToCustomResources = di.inject(navigateToCustomResourcesInjectable);
 
     return computed((): SidebarItemRegistration[] => {

src/renderer/routes/current-path-parameters.injectable.ts

@@ -1,23 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import { getInjectable } from "@ogre-tools/injectable";
-import { computed } from "mobx";
-import matchingRouteInjectable from "./matching-route.injectable";
-
-const currentPathParametersInjectable = getInjectable({
-  id: "current-path-parameters",
-
-  instantiate: (di) => {
-    const matchingRoute = di.inject(matchingRouteInjectable);
-
-    return computed((): Record<string, string> => {
-      const match = matchingRoute.get();
-
-      return match ? match.pathParameters: {};
-    });
-  },
-});
-
-export default currentPathParametersInjectable;

src/renderer/routes/route-is-active.injectable.ts

@@ -4,16 +4,23 @@
  */
 import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
 import { computed } from "mobx";
-import currentRouteInjectable from "./current-route.injectable";
 import type { Route } from "../../common/front-end-routing/front-end-route-injection-token";
+import currentPathInjectable from "./current-path.injectable";
+import { matchPath } from "react-router-dom";
 
 const routeIsActiveInjectable = getInjectable({
   id: "route-is-active",
 
   instantiate: (di, route: Route<unknown>) => {
-    const currentRoute = di.inject(currentRouteInjectable);
+    const currentPath = di.inject(currentPathInjectable);
 
-    return computed(() => currentRoute.get() === route);
+    return computed(
+      () =>
+        !!matchPath(currentPath.get(), {
+          path: route.path,
+          exact: true,
+        }),
+    );
   },
 
   lifecycle: lifecycleEnum.keyedSingleton({