chore: Improve typing of front end routes to fix type errors

Signed-off-by: Sebastian Malton <sebastian@malton.name>

packages/core/src/common/front-end-routing/front-end-route-injection-token.ts

@@ -2,19 +2,85 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
-import { getInjectionToken } from "@ogre-tools/injectable";
+import { isFunction, isString } from "@k8slens/utilities";
+import type { DiContainerForInjection, Injectable } from "@ogre-tools/injectable";
+import { getInjectable, getInjectionToken } from "@ogre-tools/injectable";
 import type { IComputedValue } from "mobx";
+import { computed } from "mobx";
+import type { Simplify } from "type-fest";
 import type { LensRendererExtension } from "../../extensions/lens-renderer-extension";
 
-export const frontEndRouteInjectionToken = getInjectionToken<Route<unknown>>({
+declare const emptyObjectSymbol: unique symbol;
+
+export interface EmptyObject {[emptyObjectSymbol]?: never}
+
+export const frontEndRouteInjectionToken = getInjectionToken<Route<string>>({
   id: "front-end-route-injection-token",
 });
 
-export interface Route<TParameter = void> {
+type InferParamFromPart<Part extends string> =
-  path: string;
+  Part extends `:${infer Name}?`
+    ? { [key in Name]?: string }
+    : Part extends `:${infer Name}`
+      ? { [key in Name]: string }
+      : EmptyObject;
+
+export type HelperInferParamFromPath<Path extends string> =
+  Path extends `/${infer First}/${infer Tail}`
+    ? InferParamFromPart<First> & HelperInferParamFromPath<`/${Tail}`>
+    : Path extends `/${infer First}`
+      ? InferParamFromPart<First>
+      : EmptyObject;
+
+export type InferParamFromPath<Path extends string> = keyof Simplify<Omit<HelperInferParamFromPath<Path>, typeof emptyObjectSymbol>> extends never
+  ? EmptyObject
+  : Simplify<Omit<HelperInferParamFromPath<Path>, typeof emptyObjectSymbol>>;
+
+export type ParametersFromRouteInjectable<RouteInjectable> =
+  RouteInjectable extends Injectable<Route<infer Path extends string>, Route<string>, void>
+    ? InferParamFromPath<Path>
+    : never;
+
+export type RouteFromInjectable<RouteInjectable> =
+  RouteInjectable extends Injectable<Route<infer Path extends string>, Route<string>, void>
+    ? Route<Path>
+    : never;
+
+export interface Route<Path extends string> {
+  id: string;
+  path: Path;
   clusterFrame: boolean;
   isEnabled: IComputedValue<boolean>;
   extension?: LensRendererExtension;
-
-  readonly parameterSignature?: TParameter;
 }
+
+export interface RouteOptions<Path extends string> {
+  id: string;
+  path: Path | ((di: DiContainerForInjection) => Path);
+  clusterFrame: boolean;
+  /**
+   * defaults to `true`
+   */
+  isEnabled?: IComputedValue<boolean> | ((di: DiContainerForInjection) => IComputedValue<boolean>);
+  extension?: LensRendererExtension;
+}
+
+export const getFrontEndRouteInjectable = <Path extends string>({
+  id,
+  path,
+  isEnabled,
+  ...rest
+}: RouteOptions<Path>) => getInjectable({
+    id,
+    instantiate: (di) => ({
+      ...rest,
+      id,
+      path: isString(path)
+        ? path
+        : path(di),
+      isEnabled: isFunction(isEnabled)
+        ? isEnabled(di)
+        : isEnabled ?? computed(() => true),
+    }),
+    injectionToken: frontEndRouteInjectionToken,
+  });

packages/core/src/common/front-end-routing/navigate-to-route-injection-token.ts

@@ -2,9 +2,10 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
+import type { Injectable } from "@ogre-tools/injectable";
 import { getInjectionToken } from "@ogre-tools/injectable";
 import type { HasRequiredKeys } from "type-fest";
-import type { Route } from "./front-end-route-injection-token";
+import type { InferParamFromPath, Route } from "./front-end-route-injection-token";
 
 export type NavigateWithParameterOptions<TParameters extends object> = (
   HasRequiredKeys<TParameters> extends true
@@ -12,32 +13,29 @@ export type NavigateWithParameterOptions<TParameters extends object> = (
     : { parameters?: TParameters }
 );
 
-export type NavigateWithParameterOptionsForRoute<TRoute> = (
-  TRoute extends Route<infer Params extends object>
-    ? NavigateWithParameterOptions<Params>
-    : { parameters?: undefined }
-);
-
 export interface BaseNavigateToRouteOptions {
   query?: Record<string, string>;
   fragment?: string;
   withoutAffectingBackButton?: boolean;
 }
 
-export type NavigateToRouteOptions<TRoute> = (
+export type NavigateToRouteOptions<Path extends string> = (
-  TRoute extends Route<void>
+  HasRequiredKeys<InferParamFromPath<Path>> extends true
-    ? ([] | [options: BaseNavigateToRouteOptions])
+    ? ([options: BaseNavigateToRouteOptions & { parameters: InferParamFromPath<Path> }])
-    : TRoute extends Route<infer Params extends object>
+    : ([] | [options: BaseNavigateToRouteOptions & { parameters?: InferParamFromPath<Path> }])
-      ? HasRequiredKeys<Params> extends true
-        ? [options: BaseNavigateToRouteOptions & { parameters: Params }]
-        : ([] | [options: BaseNavigateToRouteOptions & { parameters?: Params }])
-      : ([] | [options: BaseNavigateToRouteOptions])
 );
 
 export interface NavigateToRoute {
-  <Route>(route: Route, ...options: NavigateToRouteOptions<Route>): void;
+  <Path extends string>(route: Route<Path>, ...options: NavigateToRouteOptions<Path>): void;
 }
 
+export type NavigateToSpecificRoute<InjectableRoute> =
+  InjectableRoute extends Injectable<Route<infer Path>, Route<string>, void>
+    ? HasRequiredKeys<InferParamFromPath<Path>> extends true
+      ? (parameters: InferParamFromPath<Path>) => void
+      : (parameters?: InferParamFromPath<Path>) => void
+    : never;
+
 export const navigateToRouteInjectionToken = getInjectionToken<NavigateToRoute>(
   { id: "navigate-to-route-injection-token" },
 );

packages/core/src/common/front-end-routing/routes/add-cluster/add-cluster-route.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
 
-const addClusterRouteInjectable = getInjectable({
+const addClusterRouteInjectable = getFrontEndRouteInjectable({
   id: "add-cluster-route",
-
-  instantiate: () => ({
   path: "/add-cluster",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default addClusterRouteInjectable;

packages/core/src/common/front-end-routing/routes/catalog/catalog-route.injectable.ts

@@ -2,26 +2,15 @@
  * 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 type { ParametersFromRouteInjectable } from "../../front-end-route-injection-token";
-import { computed } from "mobx";
+import { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
-import type { Route } from "../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
 
-export interface CatalogPathParameters {
+export type CatalogPathParameters = ParametersFromRouteInjectable<typeof catalogRouteInjectable>;
-  group?: string;
-  kind?: string;
-}
 
-const catalogRouteInjectable = getInjectable({
+const catalogRouteInjectable = getFrontEndRouteInjectable({
   id: "catalog-route",
-
-  instantiate: (): Route<CatalogPathParameters> => ({
   path: "/catalog/:group?/:kind?",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default catalogRouteInjectable;

packages/core/src/common/front-end-routing/routes/catalog/navigate-to-catalog.injectable.ts

@@ -16,9 +16,7 @@ const navigateToCatalogInjectable = getInjectable({
     const navigateToRoute = di.inject(navigateToRouteInjectionToken);
     const catalogRoute = di.inject(catalogRouteInjectable);
 
-    return (parameters) => navigateToRoute(catalogRoute, {
+    return (parameters) => navigateToRoute(catalogRoute, { parameters });
-      parameters,
-    });
   },
 });
 

packages/core/src/common/front-end-routing/routes/cluster-view/cluster-view-route.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
 
-const clusterViewRouteInjectable = getInjectable({
+const clusterViewRouteInjectable = getFrontEndRouteInjectable({
   id: "cluster-view-route",
-
-  instantiate: () => ({
   path: "/cluster/:clusterId",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default clusterViewRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster-view/navigate-to-cluster-view.injectable.ts

@@ -15,8 +15,7 @@ const navigateToClusterViewInjectable = getInjectable({
     const navigateToRoute = di.inject(navigateToRouteInjectionToken);
     const route = di.inject(clusterViewRouteInjectable);
 
-    return (clusterId) =>
+    return (clusterId) => navigateToRoute(route, { parameters: { clusterId }});
-      navigateToRoute(route, { parameters: { clusterId }});
   },
 });
 

packages/core/src/common/front-end-routing/routes/cluster/config/config-maps/config-maps-route.injectable.ts

@@ -2,21 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const configMapsRouteInjectable = getInjectable({
+const configMapsRouteInjectable = getFrontEndRouteInjectable({
   id: "config-maps-route",
-  instantiate: (di) => ({
   path: "/configmaps",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "configmaps",
     group: "",
   }),
-  }),
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default configMapsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/horizontal-pod-autoscalers/horizontal-pod-autoscalers-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const horizontalPodAutoscalersRouteInjectable = getInjectable({
+const horizontalPodAutoscalersRouteInjectable = getFrontEndRouteInjectable({
   id: "horizontal-pod-autoscalers-route",
-
-  instantiate: (di) => ({
   path: "/hpa",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "horizontalpodautoscalers",
     group: "autoscaling",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default horizontalPodAutoscalersRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/leases/leases-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const leasesRouteInjectable = getInjectable({
+const leasesRouteInjectable = getFrontEndRouteInjectable({
   id: "leases",
-
-  instantiate: (di) => ({
   path: "/leases",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "leases",
     group: "coordination.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default leasesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/limit-ranges/limit-ranges-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const limitRangesRouteInjectable = getInjectable({
+const limitRangesRouteInjectable = getFrontEndRouteInjectable({
   id: "limit-ranges-route",
-
-  instantiate: (di) => ({
   path: "/limitranges",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "limitranges",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default limitRangesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/mutating-webhook-configurations/mutating-webhook-configurations-route.injectable.ts

@@ -2,25 +2,17 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
-import {
+import { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-  shouldShowResourceInjectionToken,
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-} from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
-import { getInjectable } from "@ogre-tools/injectable";
 
-const mutatingWebhookConfigurationsRouteInjectable = getInjectable({
+const mutatingWebhookConfigurationsRouteInjectable = getFrontEndRouteInjectable({
   id: "mutatingwebhookconfigurations",
-
-  instantiate: (di) => ({
   path: "/mutatingwebhookconfigurations",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "mutatingwebhookconfigurations",
     group: "admissionregistration.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default mutatingWebhookConfigurationsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/pod-disruption-budgets/pod-disruption-budgets-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const podDisruptionBudgetsRouteInjectable = getInjectable({
+const podDisruptionBudgetsRouteInjectable = getFrontEndRouteInjectable({
   id: "pod-disruption-budgets-route",
-
-  instantiate: (di) => ({
   path: "/poddisruptionbudgets",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "poddisruptionbudgets",
     group: "policy",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default podDisruptionBudgetsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/priority-classes/priority-classes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const priorityClassesRouteInjectable = getInjectable({
+const priorityClassesRouteInjectable = getFrontEndRouteInjectable({
   id: "priority-classes-route",
-
-  instantiate: (di) => ({
   path: "/priorityclasses",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "priorityclasses",
     group: "scheduling.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default priorityClassesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/resource-quotas/resource-quotas-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const resourceQuotasRouteInjectable = getInjectable({
+const resourceQuotasRouteInjectable = getFrontEndRouteInjectable({
   id: "resource-quotas-route",
-
-  instantiate: (di) => ({
   path: "/resourcequotas",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "resourcequotas",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default resourceQuotasRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/runtime-classes/runtime-classes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const runtimeClassesRouteInjectable = getInjectable({
+const runtimeClassesRouteInjectable = getFrontEndRouteInjectable({
   id: "runtime-classes-route",
-
-  instantiate: (di) => ({
   path: "/runtimeclasses",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "runtimeclasses",
     group: "node.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default runtimeClassesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/secrets/secrets-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const secretsRouteInjectable = getInjectable({
+const secretsRouteInjectable = getFrontEndRouteInjectable({
   id: "secrets-route",
-
-  instantiate: (di) => ({
   path: "/secrets",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "secrets",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default secretsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/validating-webhook-configurations/validating-webhook-configurations-route.injectable.ts

@@ -3,22 +3,16 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { getInjectable } from "@ogre-tools/injectable";
 
-const validatingWebhookConfigurationsRouteInjectable = getInjectable({
+const validatingWebhookConfigurationsRouteInjectable = getFrontEndRouteInjectable({
   id: "validatingwebhookconfigurations",
-
-  instantiate: (di) => ({
   path: "/validatingwebhookconfigurations",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "validatingwebhookconfigurations",
     group: "admissionregistration.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default validatingWebhookConfigurationsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/config/vertical-pod-autoscalers/vertical-pod-autoscalers-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const verticalPodAutoscalersRouteInjectable = getInjectable({
+const verticalPodAutoscalersRouteInjectable = getFrontEndRouteInjectable({
   id: "vertical-pod-autoscalers-route",
-
-  instantiate: (di) => ({
   path: "/vpa",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "verticalpodautoscalers",
     group: "autoscaling.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default verticalPodAutoscalersRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/custom-resources/custom-resources-route.injectable.ts

@@ -2,26 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { computed } from "mobx";
-import type { Route } from "../../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../../front-end-route-injection-token";
 
-export interface CustomResourcesPathParameters {
+const customResourcesRouteInjectable = getFrontEndRouteInjectable({
-  group: string;
-  name: string;
-}
-
-const customResourcesRouteInjectable = getInjectable({
   id: "custom-resources-route",
-
+  path: "/crd/:group?/:name?",
-  instantiate: (): Route<CustomResourcesPathParameters> => ({
-    path: "/crd/:group/:name",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default customResourcesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/custom-resources/navigate-to-custom-resources.injectable.ts

@@ -4,10 +4,9 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { navigateToRouteInjectionToken } from "../../../navigate-to-route-injection-token";
-import type { CustomResourcesPathParameters } from "./custom-resources-route.injectable";
 import customResourcesRouteInjectable from "./custom-resources-route.injectable";
 
-export type NavigateToCustomResources = (parameters: CustomResourcesPathParameters) => void;
+export type NavigateToCustomResources = NavigateToSpecificRoute<typeof customResourcesRouteInjectable>;
 
 const navigateToCustomResourcesInjectable = getInjectable({
   id: "navigate-to-custom-resources",

packages/core/src/common/front-end-routing/routes/cluster/events/events-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../front-end-route-injection-token";
 
-const eventsRouteInjectable = getInjectable({
+const eventsRouteInjectable = getFrontEndRouteInjectable({
   id: "events-route",
-
-  instantiate: (di) => ({
   path: "/events",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "events",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default eventsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/helm/charts/helm-charts-route.injectable.ts

@@ -2,26 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { computed } from "mobx";
-import type { Route } from "../../../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
 
-export interface HelmChartsPathParameters {
+const helmChartsRouteInjectable = getFrontEndRouteInjectable({
-  repo?: string;
-  chartName?: string;
-}
-
-const helmChartsRouteInjectable = getInjectable({
   id: "helm-charts-route",
-
-  instantiate: (): Route<HelmChartsPathParameters> => ({
   path: "/helm/charts/:repo?/:chartName?",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default helmChartsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/helm/charts/navigate-to-helm-charts.injectable.ts

@@ -3,11 +3,11 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { getInjectable } from "@ogre-tools/injectable";
-import type { HelmChartsPathParameters } from "./helm-charts-route.injectable";
 import helmChartsRouteInjectable from "./helm-charts-route.injectable";
+import type { NavigateToSpecificRoute } from "../../../../navigate-to-route-injection-token";
 import { navigateToRouteInjectionToken } from "../../../../navigate-to-route-injection-token";
 
-export type NavigateToHelmCharts = (parameters?: HelmChartsPathParameters) => void;
+export type NavigateToHelmCharts = NavigateToSpecificRoute<typeof helmChartsRouteInjectable>;
 
 const navigateToHelmChartsInjectable = getInjectable({
   id: "navigate-to-helm-charts",
@@ -16,10 +16,7 @@ const navigateToHelmChartsInjectable = getInjectable({
     const navigateToRoute = di.inject(navigateToRouteInjectionToken);
     const route = di.inject(helmChartsRouteInjectable);
 
-    return (parameters) =>
+    return (parameters) => navigateToRoute(route, { parameters });
-      navigateToRoute(route, {
-        parameters,
-      });
   },
 });
 

packages/core/src/common/front-end-routing/routes/cluster/helm/releases/helm-releases-route.injectable.ts

@@ -2,26 +2,17 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { computed } from "mobx";
-import type { Route } from "../../../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
 
 export interface HelmReleasesPathParameters {
   namespace?: string;
   name?: string;
 }
 
-const helmReleasesRouteInjectable = getInjectable({
+const helmReleasesRouteInjectable = getFrontEndRouteInjectable({
   id: "helm-releases-route",
-
-  instantiate: (): Route<HelmReleasesPathParameters> => ({
   path: "/helm/releases/:namespace?/:name?",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default helmReleasesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/namespaces/namespaces-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../front-end-route-injection-token";
 
-const namespacesRouteInjectable = getInjectable({
+const namespacesRouteInjectable = getFrontEndRouteInjectable({
   id: "namespaces-route",
-
-  instantiate: (di) => ({
   path: "/namespaces",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "namespaces",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default namespacesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/endpoints/endpoints-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const endpointsRouteInjectable = getInjectable({
+const endpointsRouteInjectable = getFrontEndRouteInjectable({
   id: "endpoints-route",
-
-  instantiate: (di) => ({
   path: "/endpoints",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "endpoints",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default endpointsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/ingress-class/ingress-classes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
 import { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
 
-const ingressClassesRouteInjectable = getInjectable({
+const ingressClassesRouteInjectable = getFrontEndRouteInjectable({
   id: "ingress-classes-route",
-
-  instantiate: (di) => ({
   path: "/ingress-classes",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "ingressclasses",
     group: "networking.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default ingressClassesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/ingresses/ingresses-route.injectable.ts

@@ -2,18 +2,15 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
 import { computedOr } from "@k8slens/utilities";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const ingressesRouteInjectable = getInjectable({
+const ingressesRouteInjectable = getFrontEndRouteInjectable({
   id: "ingresses-route",
-
-  instantiate: (di) => ({
   path: "/ingresses",
   clusterFrame: true,
-    isEnabled: computedOr(
+  isEnabled: (di) => computedOr(
     di.inject(shouldShowResourceInjectionToken, {
       apiName: "ingresses",
       group: "networking.k8s.io",
@@ -23,9 +20,6 @@ const ingressesRouteInjectable = getInjectable({
       group: "extensions",
     }),
   ),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default ingressesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/network-policies/network-policies-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const networkPoliciesRouteInjectable = getInjectable({
+const networkPoliciesRouteInjectable = getFrontEndRouteInjectable({
   id: "network-policies-route",
-
-  instantiate: (di) => ({
   path: "/network-policies",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "networkpolicies",
     group: "networking.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default networkPoliciesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/port-forwards/navigate-to-port-forwards.injectable.ts

@@ -3,11 +3,11 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { getInjectable } from "@ogre-tools/injectable";
-import type { PortForwardsPathParameters } from "./port-forwards-route.injectable";
 import portForwardsRouteInjectable from "./port-forwards-route.injectable";
+import type { NavigateToSpecificRoute } from "../../../../navigate-to-route-injection-token";
 import { navigateToRouteInjectionToken } from "../../../../navigate-to-route-injection-token";
 
-export type NavigateToPortForwards = (parameters?: PortForwardsPathParameters) => void;
+export type NavigateToPortForwards = NavigateToSpecificRoute<typeof portForwardsRouteInjectable>;
 
 const navigateToPortForwardsInjectable = getInjectable({
   id: "navigate-to-port-forwards",
@@ -16,8 +16,7 @@ const navigateToPortForwardsInjectable = getInjectable({
     const navigateToRoute = di.inject(navigateToRouteInjectionToken);
     const route = di.inject(portForwardsRouteInjectable);
 
-    return (parameters) =>
+    return (parameters) => navigateToRoute(route, { parameters });
-      navigateToRoute(route, { parameters });
   },
 });
 

packages/core/src/common/front-end-routing/routes/cluster/network/port-forwards/port-forwards-route.injectable.ts

@@ -2,25 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { computed } from "mobx";
-import type { Route } from "../../../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
 
-export interface PortForwardsPathParameters {
+const portForwardsRouteInjectable = getFrontEndRouteInjectable({
-  forwardPort?: string;
-}
-
-const portForwardsRouteInjectable = getInjectable({
   id: "port-forwards-route",
-
-  instantiate: (): Route<PortForwardsPathParameters> => ({
   path: "/port-forwards/:forwardPort?",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default portForwardsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/network/services/services-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const servicesRouteInjectable = getInjectable({
+const servicesRouteInjectable = getFrontEndRouteInjectable({
   id: "services-route",
-
-  instantiate: (di) => ({
   path: "/services",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "services",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default servicesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/nodes/nodes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../front-end-route-injection-token";
 
-const nodesRouteInjectable = getInjectable({
+const nodesRouteInjectable = getFrontEndRouteInjectable({
   id: "nodes-route",
-
-  instantiate: (di) => ({
   path: "/nodes",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "nodes",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default nodesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/overview/cluster-overview-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../front-end-route-injection-token";
 
-const clusterOverviewRouteInjectable = getInjectable({
+const clusterOverviewRouteInjectable = getFrontEndRouteInjectable({
   id: "cluster-overview-route",
-
-  instantiate: (di) => ({
   path: "/overview",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "nodes",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default clusterOverviewRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/storage/persistent-volume-claims/persistent-volume-claims-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const persistentVolumeClaimsRouteInjectable = getInjectable({
+const persistentVolumeClaimsRouteInjectable = getFrontEndRouteInjectable({
   id: "persistent-volume-claims-route",
-
-  instantiate: (di) => ({
   path: "/persistent-volume-claims",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "persistentvolumeclaims",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default persistentVolumeClaimsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/storage/persistent-volumes/persistent-volumes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const persistentVolumesRouteInjectable = getInjectable({
+const persistentVolumesRouteInjectable = getFrontEndRouteInjectable({
   id: "persistent-volumes-route",
-
-  instantiate: (di) => ({
   path: "/persistent-volumes",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "persistentvolumes",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default persistentVolumesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/storage/storage-classes/storage-classes-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const storageClassesRouteInjectable = getInjectable({
+const storageClassesRouteInjectable = getFrontEndRouteInjectable({
   id: "storage-classes-route",
-
-  instantiate: (di) => ({
   path: "/storage-classes",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "storageclasses",
     group: "storage.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default storageClassesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/cluster-role-bindings/cluster-role-bindings-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const clusterRoleBindingsRouteInjectable = getInjectable({
+const clusterRoleBindingsRouteInjectable = getFrontEndRouteInjectable({
   id: "cluster-role-bindings-route",
-
-  instantiate: (di) => ({
   path: "/cluster-role-bindings",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "clusterrolebindings",
     group: "rbac.authorization.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default clusterRoleBindingsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/cluster-roles/cluster-roles-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const clusterRolesRouteInjectable = getInjectable({
+const clusterRolesRouteInjectable = getFrontEndRouteInjectable({
   id: "cluster-roles-route",
-
-  instantiate: (di) => ({
   path: "/cluster-roles",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "clusterroles",
     group: "rbac.authorization.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default clusterRolesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/pod-security-policies/pod-security-policies-route.injectable.ts

@@ -2,25 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const podSecurityPoliciesRouteInjectable = getInjectable({
+const podSecurityPoliciesRouteInjectable = getFrontEndRouteInjectable({
   id: "pod-security-policies-route",
-
-  instantiate: (di) => {
-    return {
   path: "/pod-security-policies",
   clusterFrame: true,
-      isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "podsecuritypolicies",
     group: "policy",
   }),
-    };
-  },
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default podSecurityPoliciesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/role-bindings/role-bindings-route.injectable.ts

@@ -2,25 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const roleBindingsRouteInjectable = getInjectable({
+const roleBindingsRouteInjectable = getFrontEndRouteInjectable({
   id: "role-bindings-route",
-
-  instantiate: (di) => {
-    return {
   path: "/role-bindings",
   clusterFrame: true,
-      isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "rolebindings",
     group: "rbac.authorization.k8s.io",
   }),
-    };
-  },
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default roleBindingsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/roles/roles-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const rolesRouteInjectable = getInjectable({
+const rolesRouteInjectable = getFrontEndRouteInjectable({
   id: "roles-route",
-
-  instantiate: (di) => ({
   path: "/roles",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "roles",
     group: "rbac.authorization.k8s.io",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default rolesRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/user-management/service-accounts/service-accounts-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const serviceAccountsRouteInjectable = getInjectable({
+const serviceAccountsRouteInjectable = getFrontEndRouteInjectable({
   id: "service-accounts-route",
-
-  instantiate: (di) => ({
   path: "/service-accounts",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "serviceaccounts",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default serviceAccountsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/cron-jobs/cron-jobs-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const cronJobsRouteInjectable = getInjectable({
+const cronJobsRouteInjectable = getFrontEndRouteInjectable({
   id: "cron-jobs-route",
-
-  instantiate: (di) => ({
   path: "/cronjobs",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "cronjobs",
     group: "batch",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default cronJobsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/daemonsets/daemonsets-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const daemonsetsRouteInjectable = getInjectable({
+const daemonsetsRouteInjectable = getFrontEndRouteInjectable({
   id: "daemonsets-route",
-
-  instantiate: (di) => ({
   path: "/daemonsets",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "daemonsets",
     group: "apps",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default daemonsetsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/deployments/deployments-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const deploymentsRouteInjectable = getInjectable({
+const deploymentsRouteInjectable = getFrontEndRouteInjectable({
   id: "deployments-route",
-
-  instantiate: (di) => ({
   path: "/deployments",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "deployments",
     group: "apps",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default deploymentsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/jobs/jobs-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const jobsRouteInjectable = getInjectable({
+const jobsRouteInjectable = getFrontEndRouteInjectable({
   id: "jobs-route",
-
-  instantiate: (di) => ({
   path: "/jobs",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "jobs",
     group: "batch",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default jobsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/overview/workloads-overview-route.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
 
-const workloadsOverviewRouteInjectable = getInjectable({
+const workloadsOverviewRouteInjectable = getFrontEndRouteInjectable({
   id: "workloads-overview-route",
-
-  instantiate: () => ({
   path: "/workloads",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default workloadsOverviewRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/pods/pods-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const podsRouteInjectable = getInjectable({
+const podsRouteInjectable = getFrontEndRouteInjectable({
   id: "pods-route",
-
-  instantiate: (di) => ({
   path: "/pods",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "pods",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default podsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/replicasets/replicasets-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const replicasetsRouteInjectable = getInjectable({
+const replicasetsRouteInjectable = getFrontEndRouteInjectable({
   id: "replicasets-route",
-
-  instantiate: (di) => ({
   path: "/replicasets",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "replicasets",
     group: "apps",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default replicasetsRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/replication-controllers/route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const replicationControllersRouteInjectable = getInjectable({
+const replicationControllersRouteInjectable = getFrontEndRouteInjectable({
   id: "replication-controllers-route",
-
-  instantiate: (di) => ({
   path: "/replication-controllers",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "replicationcontrollers",
     group: "", // core
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default replicationControllersRouteInjectable;

packages/core/src/common/front-end-routing/routes/cluster/workloads/statefulsets/statefulsets-route.injectable.ts

@@ -2,23 +2,17 @@
  * 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 { shouldShowResourceInjectionToken } from "../../../../../../features/cluster/showing-kube-resources/common/allowed-resources-injection-token";
-import { frontEndRouteInjectionToken } from "../../../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../front-end-route-injection-token";
 
-const statefulsetsRouteInjectable = getInjectable({
+const statefulsetsRouteInjectable = getFrontEndRouteInjectable({
   id: "statefulsets-route",
-
-  instantiate: (di) => ({
   path: "/statefulsets",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "statefulsets",
     group: "apps",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default statefulsetsRouteInjectable;

packages/core/src/common/front-end-routing/routes/entity-settings/entity-settings-route.injectable.ts

@@ -2,25 +2,16 @@
  * 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 { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
-import { computed } from "mobx";
-import type { Route } from "../../front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
 
 export interface EntitySettingsPathParameters {
   entityId: string;
 }
 
-const entitySettingsRouteInjectable = getInjectable({
+const entitySettingsRouteInjectable = getFrontEndRouteInjectable({
   id: "entity-settings-route",
-
-  instantiate: (): Route<EntitySettingsPathParameters> => ({
   path: "/entity/:entityId/settings",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default entitySettingsRouteInjectable;

packages/core/src/common/front-end-routing/routes/extensions/extensions-route.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
 
-const extensionsRouteInjectable = getInjectable({
+const extensionsRouteInjectable = getFrontEndRouteInjectable({
   id: "extensions-route",
-
-  instantiate: () => ({
   path: "/extensions",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default extensionsRouteInjectable;

packages/core/src/common/front-end-routing/routes/welcome/default-welcome-route.injectable.ts

@@ -2,25 +2,19 @@
  * 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 welcomeRouteConfigInjectable from "./welcome-route-config.injectable";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
 
-const defaultWelcomeRouteInjectable = getInjectable({
+const defaultWelcomeRouteInjectable = getFrontEndRouteInjectable({
   id: "default-welcome-route",
-
-  instantiate: (di) => {
-    const welcomeRoute = di.inject(welcomeRouteConfigInjectable);
-
-    return {
   path: "/welcome",
   clusterFrame: false,
-      isEnabled: computed(() => welcomeRoute === "/welcome"),
+  isEnabled: (di) => {
-    };
+    const welcomeRoute = di.inject(welcomeRouteConfigInjectable);
-  },
 
-  injectionToken: frontEndRouteInjectionToken,
+    return computed(() => welcomeRoute === "/welcome");
+  },
 });
 
 export default defaultWelcomeRouteInjectable;

packages/core/src/common/front-end-routing/routes/welcome/welcome-route.injectable.ts

@@ -2,25 +2,13 @@
  * 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 welcomeRouteConfigInjectable from "./welcome-route-config.injectable";
-import { frontEndRouteInjectionToken } from "../../front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../front-end-route-injection-token";
 
-const welcomeRouteInjectable = getInjectable({
+const welcomeRouteInjectable = getFrontEndRouteInjectable({
   id: "welcome-route",
-
+  path: (di) => di.inject(welcomeRouteConfigInjectable),
-  instantiate: (di) => {
-    const welcomeRoute = di.inject(welcomeRouteConfigInjectable);
-
-    return {
-      path: welcomeRoute,
   clusterFrame: false,
-      isEnabled: computed(() => true),
-    };
-  },
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default welcomeRouteInjectable;

packages/core/src/extensions/lens-renderer-extension.ts

@@ -50,7 +50,7 @@ import type { PageParamInit } from "./renderer-api/navigation";
 interface LensRendererExtensionDependencies extends LensExtensionDependencies {
   navigateToRoute: NavigateToRoute;
   getExtensionPageParameters: GetExtensionPageParameters;
-  readonly routes: IComputedValue<Route<unknown>[]>;
+  readonly routes: IComputedValue<Route<string>[]>;
   readonly entityRegistry: CatalogEntityRegistry;
   readonly categoryRegistry: CatalogCategoryRegistry;
 }

packages/core/src/features/cluster/kube-object-menu/extension-api/disable-kube-object-menu-items-when-cluster-is-not-relevant.test.tsx

@@ -9,8 +9,8 @@ import type { ApplicationBuilder } from "../../../../renderer/components/test-ut
 import type { KubernetesCluster } from "../../../../common/catalog-entities";
 import { getApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getInjectable } from "@ogre-tools/injectable";
-import { frontEndRouteInjectionToken } from "../../../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../common/front-end-routing/front-end-route-injection-token";
-import { computed, runInAction } from "mobx";
+import { runInAction } from "mobx";
 import React from "react";
 import { navigateToRouteInjectionToken } from "../../../../common/front-end-routing/navigate-to-route-injection-token";
 import { routeSpecificComponentInjectionToken } from "../../../../renderer/routes/route-specific-component-injection-token";
@@ -115,16 +115,10 @@ describe("disable kube object menu items when cluster is not relevant", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "test-route",
-
-  instantiate: () => ({
   path: "/test-route",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/cluster/kube-object-menu/extension-api/reactively-hide-kube-object-menu-item.test.tsx

@@ -6,7 +6,7 @@ import type { RenderResult } from "@testing-library/react";
 import type { ApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getInjectable } from "@ogre-tools/injectable";
-import { frontEndRouteInjectionToken } from "../../../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../common/front-end-routing/front-end-route-injection-token";
 import type { IObservableValue } from "mobx";
 import { observable, runInAction, computed } from "mobx";
 import React from "react";
@@ -83,16 +83,10 @@ describe("reactively hide kube object menu item", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "test-route",
-
-  instantiate: () => ({
   path: "/test-route",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/cluster/kube-object-status-icon/extension-api/disable-kube-object-statuses-when-cluster-is-not-relevant.test.tsx

@@ -9,8 +9,8 @@ import type { ApplicationBuilder } from "../../../../renderer/components/test-ut
 import type { KubernetesCluster } from "../../../../common/catalog-entities";
 import { getApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getInjectable } from "@ogre-tools/injectable";
-import { frontEndRouteInjectionToken } from "../../../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../common/front-end-routing/front-end-route-injection-token";
-import { computed, runInAction } from "mobx";
+import { runInAction } from "mobx";
 import React from "react";
 import { navigateToRouteInjectionToken } from "../../../../common/front-end-routing/navigate-to-route-injection-token";
 import { routeSpecificComponentInjectionToken } from "../../../../renderer/routes/route-specific-component-injection-token";
@@ -116,16 +116,10 @@ describe("disable kube object statuses when cluster is not relevant", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "test-route",
-
-  instantiate: () => ({
   path: "/test-route",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/cluster/kube-object-status-icon/extension-api/reactively-hide-kube-object-status.test.tsx

@@ -6,7 +6,7 @@ import type { RenderResult } from "@testing-library/react";
 import type { ApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../../../renderer/components/test-utils/get-application-builder";
 import { getInjectable } from "@ogre-tools/injectable";
-import { frontEndRouteInjectionToken } from "../../../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../../common/front-end-routing/front-end-route-injection-token";
 import type { IObservableValue } from "mobx";
 import { observable, runInAction, computed } from "mobx";
 import React from "react";
@@ -88,16 +88,10 @@ describe("reactively hide kube object status", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "test-route",
-
-  instantiate: () => ({
   path: "/test-route",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/cluster/kube-object-status-icon/show-status-for-a-kube-object.test.tsx

@@ -8,7 +8,7 @@ import type { DiContainer } from "@ogre-tools/injectable";
 import { getInjectable } from "@ogre-tools/injectable";
 import type { IAtom } from "mobx";
 import { runInAction, createAtom, computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
 import { routeSpecificComponentInjectionToken } from "../../../renderer/routes/route-specific-component-injection-token";
 import type { ApplicationBuilder } from "../../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../../renderer/components/test-utils/get-application-builder";
@@ -262,16 +262,10 @@ describe("show status for a kube object", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "test-route",
-
-  instantiate: () => ({
   path: "/test-route",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const rerenderParentFor = (atom: IAtom) => () => {

packages/core/src/features/cluster/sidebar-and-tab-navigation-for-core.test.tsx

@@ -12,7 +12,7 @@ import { sidebarItemInjectionToken } from "@k8slens/cluster-sidebar";
 import { computed, runInAction } from "mobx";
 import { noop } from "lodash/fp";
 import routeIsActiveInjectable from "../../renderer/routes/route-is-active.injectable";
-import { frontEndRouteInjectionToken } from "../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../common/front-end-routing/front-end-route-injection-token";
 import type { ApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import writeJsonFileInjectable from "../../common/fs/write-json-file.injectable";
@@ -324,16 +324,10 @@ const someChildSidebarItemInjectable = getInjectable({
   injectionToken: sidebarItemInjectionToken,
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "some-route-injectable-id",
-
-  instantiate: () => ({
   path: "/some-child-page",
   clusterFrame: true,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/cluster/visibility-of-sidebar-items.test.tsx

@@ -8,7 +8,7 @@ import { sidebarItemInjectionToken } from "@k8slens/cluster-sidebar";
 import { runInAction } from "mobx";
 import { routeSpecificComponentInjectionToken } from "../../renderer/routes/route-specific-component-injection-token";
 import React from "react";
-import { frontEndRouteInjectionToken } from "../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../common/front-end-routing/front-end-route-injection-token";
 import type { ApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import { navigateToRouteInjectionToken } from "../../common/front-end-routing/navigate-to-route-injection-token";
@@ -68,19 +68,14 @@ describe("cluster - visibility of sidebar items", () => {
   });
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "some-route-injectable-id",
-
-  instantiate: (di) => ({
   path: "/some-child-page",
   clusterFrame: true,
-    isEnabled: di.inject(shouldShowResourceInjectionToken, {
+  isEnabled: (di) => di.inject(shouldShowResourceInjectionToken, {
     apiName: "namespaces",
     group: "",
   }),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/navigating-between-routes.test.tsx

@@ -5,12 +5,12 @@
 import type { DiContainer } from "@ogre-tools/injectable";
 import { getInjectable } from "@ogre-tools/injectable";
 import React from "react";
-import { computed, runInAction } from "mobx";
+import { runInAction } from "mobx";
 import type { RenderResult } from "@testing-library/react";
 import { routeSpecificComponentInjectionToken } from "../renderer/routes/route-specific-component-injection-token";
 import { observer } from "mobx-react";
-import type { Route } from "../common/front-end-routing/front-end-route-injection-token";
+import type { RouteFromInjectable } from "../common/front-end-routing/front-end-route-injection-token";
-import { frontEndRouteInjectionToken } from "../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../common/front-end-routing/front-end-route-injection-token";
 import type { ApplicationBuilder } from "../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../renderer/components/test-utils/get-application-builder";
 import currentRouteInjectable from "../renderer/routes/current-route.injectable";
@@ -44,7 +44,7 @@ describe("navigating between routes", () => {
     });
 
     describe("when navigating to route", () => {
-      let route: Route;
+      let route: RouteFromInjectable<typeof testRouteWithoutPathParametersInjectable>;
 
       beforeEach(() => {
         const navigateToRoute = windowDi.inject(navigateToRouteInjectionToken);
@@ -77,7 +77,7 @@ describe("navigating between routes", () => {
       });
 
       it("does not have path parameters", () => {
-        const pathParameters = windowDi.inject(routePathParametersInjectable, route);
+        const pathParameters = windowDi.inject(routePathParametersInjectable)(route);
 
         expect(pathParameters.get()).toEqual({});
       });
@@ -120,10 +120,7 @@ describe("navigating between routes", () => {
     });
 
     describe("when navigating to route with path parameters", () => {
-      let route: Route<{
+      let route: RouteFromInjectable<typeof routeWithOptionalPathParametersInjectable>;
-        someParameter?: string | undefined;
-        someOtherParameter?: string | undefined;
-      }>;
 
       beforeEach(() => {
         route = windowDi.inject(routeWithOptionalPathParametersInjectable);
@@ -157,7 +154,7 @@ describe("navigating between routes", () => {
       });
 
       it("knows path parameters", () => {
-        const pathParameters = windowDi.inject(routePathParametersInjectable, route);
+        const pathParameters = windowDi.inject(routePathParametersInjectable)(route);
 
         expect(pathParameters.get()).toEqual({
           someParameter: "some-value",
@@ -167,10 +164,7 @@ describe("navigating between routes", () => {
     });
 
     describe("when navigating to route without path parameters", () => {
-      let route: Route<{
+      let route: RouteFromInjectable<typeof routeWithOptionalPathParametersInjectable>;
-        someParameter?: string | undefined;
-        someOtherParameter?: string | undefined;
-      }>;
 
       beforeEach(() => {
         route = windowDi.inject(routeWithOptionalPathParametersInjectable);
@@ -193,7 +187,7 @@ describe("navigating between routes", () => {
       });
 
       it("knows path parameters", () => {
-        const pathParameters = windowDi.inject(routePathParametersInjectable, route);
+        const pathParameters = windowDi.inject(routePathParametersInjectable)(route);
 
         expect(pathParameters.get()).toEqual({
           someParameter: undefined,
@@ -204,15 +198,10 @@ describe("navigating between routes", () => {
   });
 });
 
-const testRouteWithoutPathParametersInjectable = getInjectable({
+const testRouteWithoutPathParametersInjectable = getFrontEndRouteInjectable({
   id: "some-route",
-  injectionToken: frontEndRouteInjectionToken,
-
-  instantiate: (): Route<void> => ({
   path: "/some-path",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
 });
 
 const testRouteWithoutPathParametersComponentInjectable = getInjectable({
@@ -226,15 +215,10 @@ const testRouteWithoutPathParametersComponentInjectable = getInjectable({
   injectionToken: routeSpecificComponentInjectionToken,
 });
 
-const routeWithOptionalPathParametersInjectable = getInjectable({
+const routeWithOptionalPathParametersInjectable = getFrontEndRouteInjectable({
   id: "some-route",
-  injectionToken: frontEndRouteInjectionToken,
-
-  instantiate: (): Route<{ someParameter?: string; someOtherParameter?: string }> => ({
   path: "/some-path/:someParameter?/:someOtherParameter?",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
 });
 
 const routeWithOptionalPathParametersComponentInjectable = getInjectable({
@@ -242,7 +226,7 @@ const routeWithOptionalPathParametersComponentInjectable = getInjectable({
 
   instantiate: (di) => {
     const route = di.inject(routeWithOptionalPathParametersInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
+    const pathParameters = di.inject(routePathParametersInjectable)(route);
 
     return {
       route,

packages/core/src/features/preferences/closing-preferences.test.tsx

@@ -8,8 +8,8 @@ import type { RenderResult } from "@testing-library/react";
 import type { ApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import { getApplicationBuilder } from "../../renderer/components/test-utils/get-application-builder";
 import currentPathInjectable from "../../renderer/routes/current-path.injectable";
-import { frontEndRouteInjectionToken } from "../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../common/front-end-routing/front-end-route-injection-token";
-import { computed, runInAction } from "mobx";
+import { runInAction } from "mobx";
 import React from "react";
 import { routeSpecificComponentInjectionToken } from "../../renderer/routes/route-specific-component-injection-token";
 import { observableHistoryInjectionToken, searchParamsOptions } from "@k8slens/routing";
@@ -210,16 +210,10 @@ describe("preferences - closing-preferences", () => {
   });
 });
 
-const testFrontPageRouteInjectable = getInjectable({
+const testFrontPageRouteInjectable = getFrontEndRouteInjectable({
   id: "some-front-page",
-
-  instantiate: () => ({
   path: "/some-front-page",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testFrontPageRouteComponentInjectable = getInjectable({
@@ -233,16 +227,10 @@ const testFrontPageRouteComponentInjectable = getInjectable({
   injectionToken: routeSpecificComponentInjectionToken,
 });
 
-const testRouteInjectable = getInjectable({
+const testRouteInjectable = getFrontEndRouteInjectable({
   id: "some-page",
-
-  instantiate: () => ({
   path: "/some-page",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 const testRouteComponentInjectable = getInjectable({

packages/core/src/features/preferences/common/preferences-route-for-legacy-extensions.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../../common/front-end-routing/front-end-route-injection-token";
 
-const preferencesRouteForLegacyExtensionsInjectable = getInjectable({
+const preferencesRouteForLegacyExtensionsInjectable = getFrontEndRouteInjectable({
   id: "preferences-route-for-legacy-extensions",
-
-  instantiate: () => ({
   path: "/preferences/extension/:extensionId/:preferenceTabId?",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default preferencesRouteForLegacyExtensionsInjectable;

packages/core/src/features/preferences/common/preferences-route.injectable.ts

@@ -2,20 +2,12 @@
  * 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 { getFrontEndRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
-import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../../common/front-end-routing/front-end-route-injection-token";
 
-const preferencesRouteInjectable = getInjectable({
+const preferencesRouteInjectable = getFrontEndRouteInjectable({
   id: "preferences-route",
-
-  instantiate: () => ({
   path: "/preferences/:preferenceTabId?",
   clusterFrame: false,
-    isEnabled: computed(() => true),
-  }),
-
-  injectionToken: frontEndRouteInjectionToken,
 });
 
 export default preferencesRouteInjectable;

packages/core/src/features/preferences/renderer/preference-items/current-preference-tab-id.injectable.ts

@@ -14,19 +14,13 @@ const currentPreferenceTabIdInjectable = getInjectable({
   instantiate: (di) => {
     const preferencesRoute = di.inject(preferencesRouteInjectable);
     const preferencesRouteForLegacyExtensions = di.inject(preferencesRouteForLegacyExtensionsInjectable);
+    const routePathParameters = di.inject(routePathParametersInjectable);
 
-    const nonLegacyRoutePathParameters = di.inject(
+    const nonLegacyRoutePathParameters = routePathParameters(preferencesRoute);
-      routePathParametersInjectable,
+    const legacyRoutePathParameters = routePathParameters(preferencesRouteForLegacyExtensions);
-      preferencesRoute,
-    );
-
-    const legacyRoutePathParameters = di.inject(
-      routePathParametersInjectable,
-      preferencesRouteForLegacyExtensions,
-    );
 
     return computed(() => {
-      const nonLegacyPreferenceTabId = nonLegacyRoutePathParameters.get().preferenceTabId;
+      const nonLegacyPreferenceTabId = nonLegacyRoutePathParameters.get()?.preferenceTabId;
 
       if (nonLegacyPreferenceTabId) {
         return nonLegacyPreferenceTabId;
@@ -34,7 +28,7 @@ const currentPreferenceTabIdInjectable = getInjectable({
 
       const legacyParameters = legacyRoutePathParameters.get();
 
-      if (legacyParameters.extensionId) {
+      if (legacyParameters?.extensionId) {
         if (legacyParameters.preferenceTabId) {
           return `extension-${legacyParameters.extensionId}-${legacyParameters.preferenceTabId}`;
         }

packages/core/src/features/welcome/setting-welcome-page.test.tsx

@@ -15,7 +15,7 @@ import type { Route } from "../../common/front-end-routing/front-end-route-injec
 describe("setting-welcome-page", () => {
   let builder: ApplicationBuilder;
   let rendered : RenderResult;
-  let welcomeRoute: Route;
+  let welcomeRoute: Route<string>;
 
   beforeEach(() => {
     builder = getApplicationBuilder();

packages/core/src/main/navigate-to-route/navigate-to-route.injectable.ts

@@ -4,6 +4,7 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { navigateToUrlInjectionToken } from "../../common/front-end-routing/navigate-to-url-injection-token";
+import type { NavigateToRoute } from "../../common/front-end-routing/navigate-to-route-injection-token";
 import { navigateToRouteInjectionToken } from "../../common/front-end-routing/navigate-to-route-injection-token";
 import { buildURL } from "@k8slens/utilities";
 
@@ -13,15 +14,15 @@ const navigateToRouteInjectable = getInjectable({
   instantiate: (di) => {
     const navigateToUrl = di.inject(navigateToUrlInjectionToken);
 
-    return async (route, options) => {
+    return ((route, options) => {
       const url = buildURL(route.path, {
         params: options?.parameters as object,
         query: options?.query,
         fragment: options?.fragment,
       });
 
-      await navigateToUrl(url, options);
+      void navigateToUrl(url, options);
-    };
+    }) as NavigateToRoute;
   },
 
   injectionToken: navigateToRouteInjectionToken,

packages/core/src/renderer/components/catalog/catalog-route-parameters.injectable.ts

@@ -1,24 +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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import catalogRouteInjectable from "../../../common/front-end-routing/routes/catalog/catalog-route.injectable";
-
-const catalogRouteParametersInjectable = getInjectable({
-  id: "catalog-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(catalogRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      group: computed(() => pathParameters.get().group),
-      kind: computed(() => pathParameters.get().kind),
-    };
-  },
-});
-
-export default catalogRouteParametersInjectable;

packages/core/src/renderer/components/catalog/catalog.tsx

@@ -6,7 +6,7 @@
 import styles from "./catalog.module.scss";
 
 import type { IComputedValue } from "mobx";
-import { action, computed, makeObservable, observable, reaction, runInAction, when } from "mobx";
+import { action, computed, observable, reaction, runInAction, when } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import React from "react";
 import type { CatalogCategory, CatalogCategoryRegistry, CatalogEntity } from "../../../common/catalog";
@@ -39,7 +39,6 @@ import showErrorNotificationInjectable from "../notifications/show-error-notific
 import { browseCatalogTab } from "./catalog-browse-tab";
 import catalogEntityStoreInjectable from "./catalog-entity-store.injectable";
 import catalogPreviousActiveTabStorageInjectable from "./catalog-previous-active-tab-storage/catalog-previous-active-tab-storage.injectable";
-import catalogRouteParametersInjectable from "./catalog-route-parameters.injectable";
 import type { CategoryColumns, GetCategoryColumnsParams } from "./columns/get.injectable";
 import getCategoryColumnsInjectable from "./columns/get.injectable";
 import type { CustomCategoryViewComponents } from "./custom-views";
@@ -51,6 +50,12 @@ import type { ShowEntityDetails } from "./entity-details/show.injectable";
 import showEntityDetailsInjectable from "./entity-details/show.injectable";
 import type { Hotbar } from "../../../features/hotbar/storage/common/hotbar";
 import activeHotbarInjectable from "../../../features/hotbar/storage/common/active.injectable";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type catalogRouteInjectable from "../../../common/front-end-routing/routes/catalog/catalog-route.injectable";
+
+export interface CatalogProps {
+  params: ParametersFromRouteInjectable<typeof catalogRouteInjectable>;
+}
 
 interface Dependencies {
   catalogPreviousActiveTabStorage: StorageLayer<string | null>;
@@ -60,10 +65,6 @@ interface Dependencies {
   emitEvent: EmitAppEvent;
   showEntityDetails: ShowEntityDetails;
   onCatalogEntityListClick: OnCatalogEntityListClick;
-  routeParameters: {
-    group: IComputedValue<string>;
-    kind: IComputedValue<string>;
-  };
   navigateToCatalog: NavigateToCatalog;
   catalogCategoryRegistry: CatalogCategoryRegistry;
   visitEntityContextMenu: VisitEntityContextMenu;
@@ -75,28 +76,19 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedCatalog extends React.Component<Dependencies> {
+class NonInjectedCatalog extends React.Component<Dependencies & CatalogProps> {
   private readonly menuItems = observable.array<CatalogEntityContextMenu>();
-  @observable activeTab: string | undefined = undefined;
+  readonly activeTab = observable.box<string>();
 
-  constructor(props: Dependencies) {
+  readonly routeActiveTab = computed(() => {
-    super(props);
+    const { params: { group, kind }, catalogPreviousActiveTabStorage } = this.props;
-    makeObservable(this);
-  }
 
-  @computed
+    if (group && kind) {
-  get routeActiveTab(): string {
+      return `${group}/${kind}`;
-    const { routeParameters: { group, kind }, catalogPreviousActiveTabStorage } = this.props;
-
-    const dereferencedGroup = group.get();
-    const dereferencedKind = kind.get();
-
-    if (dereferencedGroup && dereferencedKind) {
-      return `${dereferencedGroup}/${dereferencedKind}`;
     }
 
     return catalogPreviousActiveTabStorage.get() || browseCatalogTab;
-  }
+  });
 
   componentDidMount() {
     const {
@@ -109,8 +101,8 @@ class NonInjectedCatalog extends React.Component<Dependencies> {
 
     disposeOnUnmount(this, [
       catalogEntityStore.watch(),
-      reaction(() => this.routeActiveTab, (routeTab) => {
+      reaction(() => this.routeActiveTab.get(), (routeTab) => {
-        catalogPreviousActiveTabStorage.set(this.routeActiveTab);
+        catalogPreviousActiveTabStorage.set(routeTab);
 
         void (async () => {
           try {
@@ -122,7 +114,7 @@ class NonInjectedCatalog extends React.Component<Dependencies> {
             const item = catalogCategoryRegistry.filteredItems.find(i => i.getId() === routeTab);
 
             runInAction(() => {
-              this.activeTab = routeTab;
+              this.activeTab.set(routeTab);
               catalogEntityStore.activeCategory.set(item);
             });
           } catch (error) {
@@ -141,14 +133,14 @@ class NonInjectedCatalog extends React.Component<Dependencies> {
         const currentCategory = catalogEntityStore.activeCategory.get();
         const someCategory = categories[0];
 
-        if (this.routeActiveTab === browseCatalogTab || !someCategory) {
+        if (this.routeActiveTab.get() === browseCatalogTab || !someCategory) {
           return;
         }
 
         const currentCategoryShouldBeShown = Boolean(categories.find(item => item.getId() === someCategory.getId()));
 
         if (!currentCategory || !currentCategoryShouldBeShown) {
-          this.activeTab = someCategory.getId();
+          this.activeTab.set(someCategory.getId());
           this.props.catalogEntityStore.activeCategory.set(someCategory);
         }
       }),
@@ -296,7 +288,7 @@ class NonInjectedCatalog extends React.Component<Dependencies> {
       <MainLayout
         sidebar={(
           <CatalogMenu
-            activeTab={this.activeTab}
+            activeTab={this.activeTab.get()}
             onItemClick={this.onTabChange}
           />
         )}
@@ -318,14 +310,13 @@ class NonInjectedCatalog extends React.Component<Dependencies> {
   }
 }
 
-export const Catalog = withInjectables<Dependencies>(NonInjectedCatalog, {
+export const Catalog = withInjectables<Dependencies, CatalogProps>(NonInjectedCatalog, {
   getProps: (di, props) => ({
     ...props,
     catalogEntityStore: di.inject(catalogEntityStoreInjectable),
     catalogPreviousActiveTabStorage: di.inject(catalogPreviousActiveTabStorageInjectable),
     getCategoryColumns: di.inject(getCategoryColumnsInjectable),
     customCategoryViews: di.inject(customCategoryViewsInjectable),
-    routeParameters: di.inject(catalogRouteParametersInjectable),
     navigateToCatalog: di.inject(navigateToCatalogInjectable),
     emitEvent: di.inject(emitAppEventInjectable),
     activeHotbar: di.inject(activeHotbarInjectable),

packages/core/src/renderer/components/cluster-manager/cluster-view-route-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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import clusterViewRouteInjectable from "../../../common/front-end-routing/routes/cluster-view/cluster-view-route.injectable";
-
-const clusterViewRouteParametersInjectable = getInjectable({
-  id: "cluster-view-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(clusterViewRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      clusterId: computed(() => pathParameters.get().clusterId),
-    };
-  },
-});
-
-export default clusterViewRouteParametersInjectable;

packages/core/src/renderer/components/cluster-manager/cluster-view.tsx

@@ -5,16 +5,13 @@
 
 import "./cluster-view.scss";
 import React from "react";
-import type { IComputedValue } from "mobx";
+import { computed, reaction } from "mobx";
-import { computed, makeObservable, reaction } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { ClusterStatus } from "./cluster-status";
 import type { ClusterFrameHandler } from "./cluster-frame-handler";
-import type { Cluster } from "../../../common/cluster/cluster";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import type { NavigateToCatalog } from "../../../common/front-end-routing/routes/catalog/navigate-to-catalog.injectable";
 import navigateToCatalogInjectable from "../../../common/front-end-routing/routes/catalog/navigate-to-catalog.injectable";
-import clusterViewRouteParametersInjectable from "./cluster-view-route-parameters.injectable";
 import clusterFrameHandlerInjectable from "./cluster-frame-handler.injectable";
 import type { CatalogEntityRegistry } from "../../api/catalog/entity/registry";
 import catalogEntityRegistryInjectable from "../../api/catalog/entity/registry.injectable";
@@ -22,10 +19,14 @@ import type { RequestClusterActivation } from "../../../features/cluster/activat
 import requestClusterActivationInjectable from "../../../features/cluster/activation/renderer/request-activation.injectable";
 import type { GetClusterById } from "../../../features/cluster/storage/common/get-by-id.injectable";
 import getClusterByIdInjectable from "../../../features/cluster/storage/common/get-by-id.injectable";
-import type { StrictReactNode } from "@k8slens/utilities";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type clusterViewRouteInjectable from "../../../common/front-end-routing/routes/cluster-view/cluster-view-route.injectable";
+
+export interface ClusterViewProps {
+  params: ParametersFromRouteInjectable<typeof clusterViewRouteInjectable>;
+}
 
 interface Dependencies {
-  clusterId: IComputedValue<string>;
   clusterFrames: ClusterFrameHandler;
   navigateToCatalog: NavigateToCatalog;
   entityRegistry: CatalogEntityRegistry;
@@ -34,34 +35,27 @@ interface Dependencies {
 }
 
 @observer
-class NonInjectedClusterView extends React.Component<Dependencies> {
+class NonInjectedClusterView extends React.Component<Dependencies & ClusterViewProps> {
-  constructor(props: Dependencies) {
-    super(props);
-    makeObservable(this);
-  }
-
   get clusterId() {
-    return this.props.clusterId.get();
+    return this.props.params.clusterId;
   }
 
-  @computed get cluster(): Cluster | undefined {
+  readonly cluster = computed(() => this.props.getClusterById(this.clusterId));
-    return this.props.getClusterById(this.clusterId);
-  }
 
   private readonly isViewLoaded = computed(() => this.props.clusterFrames.hasLoadedView(this.clusterId), {
     keepAlive: true,
     requiresReaction: true,
   });
 
-  @computed get isReady(): boolean {
+  readonly isReady = computed(() => {
-    const { cluster } = this;
+    const cluster = this.cluster.get();
 
     if (!cluster) {
       return false;
     }
 
     return cluster.ready.get() && cluster.available.get() && this.isViewLoaded.get();
-  }
+  });
 
   componentDidMount() {
     this.bindEvents();
@@ -94,8 +88,9 @@ class NonInjectedClusterView extends React.Component<Dependencies> {
     ]);
   }
 
-  renderStatus(): StrictReactNode {
+  renderStatus() {
-    const { cluster, isReady } = this;
+    const cluster = this.cluster.get();
+    const isReady = this.isReady.get();
 
     if (cluster && !isReady) {
       return <ClusterStatus cluster={cluster} className="box center"/>;
@@ -113,9 +108,9 @@ class NonInjectedClusterView extends React.Component<Dependencies> {
   }
 }
 
-export const ClusterView = withInjectables<Dependencies>(NonInjectedClusterView, {
+export const ClusterView = withInjectables<Dependencies, ClusterViewProps>(NonInjectedClusterView, {
-  getProps: (di) => ({
+  getProps: (di, props) => ({
-    ...di.inject(clusterViewRouteParametersInjectable),
+    ...props,
     navigateToCatalog: di.inject(navigateToCatalogInjectable),
     clusterFrames: di.inject(clusterFrameHandlerInjectable),
     entityRegistry: di.inject(catalogEntityRegistryInjectable),

packages/core/src/renderer/components/config-leases/leases.tsx

@@ -7,9 +7,7 @@ import "./leases.scss";
 
 import * as React from "react";
 import { observer } from "mobx-react";
-import type { Lease } from "@k8slens/kube-object";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
@@ -25,14 +23,12 @@ enum columnId {
   age = "age",
 }
 
-export type LeaseProps = KubeObjectDetailsProps<Lease>;
-
 interface Dependencies {
   leaseStore: LeaseStore;
 }
 
 @observer
-class NonInjectedLease extends React.Component<LeaseProps & Dependencies> {
+class NonInjectedLease extends React.Component<Dependencies> {
   render() {
     const { leaseStore } = this.props;
 
@@ -76,7 +72,7 @@ class NonInjectedLease extends React.Component<LeaseProps & Dependencies> {
   }
 }
 
-export const Leases = withInjectables<Dependencies, LeaseProps>(NonInjectedLease, {
+export const Leases = withInjectables<Dependencies>(NonInjectedLease, {
   getProps: (di, props) => ({
     ...props,
     leaseStore: di.inject(leaseStoreInjectable),

packages/core/src/renderer/components/config-pod-disruption-budgets/pod-disruption-budgets.tsx

@@ -7,9 +7,7 @@ import "./pod-disruption-budgets.scss";
 
 import * as React from "react";
 import { observer } from "mobx-react";
-import type { PodDisruptionBudget } from "@k8slens/kube-object";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
@@ -28,14 +26,12 @@ enum columnId {
   age = "age",
 }
 
-export type PodDisruptionBudgetsProps = KubeObjectDetailsProps<PodDisruptionBudget>;
-
 interface Dependencies {
   podDisruptionBudgetStore: PodDisruptionBudgetStore;
 }
 
 @observer
-class NonInjectedPodDisruptionBudgets extends React.Component<PodDisruptionBudgetsProps & Dependencies> {
+class NonInjectedPodDisruptionBudgets extends React.Component<Dependencies> {
   render() {
     return (
       <SiblingsInTabLayout>
@@ -86,7 +82,7 @@ class NonInjectedPodDisruptionBudgets extends React.Component<PodDisruptionBudge
   }
 }
 
-export const PodDisruptionBudgets = withInjectables<Dependencies, PodDisruptionBudgetsProps>(NonInjectedPodDisruptionBudgets, {
+export const PodDisruptionBudgets = withInjectables<Dependencies>(NonInjectedPodDisruptionBudgets, {
   getProps: (di, props) => ({
     ...props,
     podDisruptionBudgetStore: di.inject(podDisruptionBudgetStoreInjectable),

packages/core/src/renderer/components/config-priority-classes/priority-classes.tsx

@@ -7,16 +7,13 @@ import "./priority-classes.scss";
 
 import * as React from "react";
 import { observer } from "mobx-react";
-import type { PriorityClass } from "@k8slens/kube-object";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import priorityClassStoreInjectable from "./store.injectable";
 import type { PriorityClassStore } from "./store";
-import autoBindReact from "auto-bind/react";
 
 enum columnId {
   name = "name",
@@ -25,19 +22,12 @@ enum columnId {
   age = "age",
 }
 
-export type PriorityClassesProps = KubeObjectDetailsProps<PriorityClass>;
-
 interface Dependencies {
   priorityClassStore: PriorityClassStore;
 }
 
 @observer
-class NonInjectedPriorityClasses extends React.Component<PriorityClassesProps & Dependencies> {
+class NonInjectedPriorityClasses extends React.Component<Dependencies> {
-  constructor(props: PriorityClassesProps & Dependencies) {
-    super(props);
-    autoBindReact(this);
-  }
-
   render() {
     const { priorityClassStore } = this.props;
 
@@ -78,7 +68,7 @@ class NonInjectedPriorityClasses extends React.Component<PriorityClassesProps &
   }
 }
 
-export const PriorityClasses = withInjectables<Dependencies, PriorityClassesProps>(NonInjectedPriorityClasses, {
+export const PriorityClasses = withInjectables<Dependencies>(NonInjectedPriorityClasses, {
   getProps: (di, props) => ({
     ...props,
     priorityClassStore: di.inject(priorityClassStoreInjectable),

packages/core/src/renderer/components/config-runtime-classes/runtime-classes.tsx

@@ -7,16 +7,13 @@ import "./runtime-classes.scss";
 
 import * as React from "react";
 import { observer } from "mobx-react";
-import type { RuntimeClass } from "@k8slens/kube-object";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import runtimeClassStoreInjectable from "./store.injectable";
 import type { RuntimeClassStore } from "./store";
-import autoBindReact from "auto-bind/react";
 
 enum columnId {
   name = "name",
@@ -24,19 +21,12 @@ enum columnId {
   age = "age",
 }
 
-export type RuntimeClassesProps = KubeObjectDetailsProps<RuntimeClass>;
-
 interface Dependencies {
   runtimeClassStore: RuntimeClassStore;
 }
 
 @observer
-class NonInjectedRuntimeClasses extends React.Component<RuntimeClassesProps & Dependencies> {
+class NonInjectedRuntimeClasses extends React.Component<Dependencies> {
-  constructor(props: RuntimeClassesProps & Dependencies) {
-    super(props);
-    autoBindReact(this);
-  }
-
   render() {
     const { runtimeClassStore } = this.props;
 
@@ -74,7 +64,7 @@ class NonInjectedRuntimeClasses extends React.Component<RuntimeClassesProps & De
   }
 }
 
-export const RuntimeClasses = withInjectables<Dependencies, RuntimeClassesProps>(NonInjectedRuntimeClasses, {
+export const RuntimeClasses = withInjectables<Dependencies>(NonInjectedRuntimeClasses, {
   getProps: (di, props) => ({
     ...props,
     runtimeClassStore: di.inject(runtimeClassStoreInjectable),

packages/core/src/renderer/components/custom-resources/route-parameters.injectable.ts

@@ -1,24 +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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import customResourcesRouteInjectable from "../../../common/front-end-routing/routes/cluster/custom-resources/custom-resources-route.injectable";
-
-const customResourcesRouteParametersInjectable = getInjectable({
-  id: "custom-resources-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(customResourcesRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      group: computed(() => pathParameters.get().group),
-      name: computed(() => pathParameters.get().name),
-    };
-  },
-});
-
-export default customResourcesRouteParametersInjectable;

packages/core/src/renderer/components/custom-resources/view.tsx

@@ -8,19 +8,19 @@ import "./view.scss";
 import React from "react";
 import { observer } from "mobx-react";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
-import type { IComputedValue } from "mobx";
+import { computed } from "mobx";
-import { computed, makeObservable } from "mobx";
 import type { ApiManager } from "../../../common/k8s-api/api-manager";
 import { formatJSONValue, safeJSONPathValue } from "@k8slens/utilities";
 import { TabLayout } from "../layout/tab-layout-2";
 import { withInjectables } from "@ogre-tools/injectable-react";
-import customResourcesRouteParametersInjectable from "./route-parameters.injectable";
 import { KubeObjectAge } from "../kube-object/age";
 import type { CustomResourceDefinitionStore } from "../custom-resource-definitions/store";
 import apiManagerInjectable from "../../../common/k8s-api/api-manager/manager.injectable";
 import customResourceDefinitionStoreInjectable from "../custom-resource-definitions/store.injectable";
 import { NamespaceSelectBadge } from "../namespaces/namespace-select-badge";
 import type { TableCellProps } from "@k8slens/list-layout";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type customResourcesRouteInjectable from "../../../common/front-end-routing/routes/cluster/custom-resources/custom-resources-route.injectable";
 
 enum columnId {
   name = "name",
@@ -29,29 +29,29 @@ enum columnId {
 }
 
 interface Dependencies {
-  group: IComputedValue<string>;
-  name: IComputedValue<string>;
   apiManager: ApiManager;
   customResourceDefinitionStore: CustomResourceDefinitionStore;
 }
 
+export interface CustomResourcesProps {
+  params: ParametersFromRouteInjectable<typeof customResourcesRouteInjectable>;
+}
+
 @observer
-class NonInjectedCustomResources extends React.Component<Dependencies> {
+class NonInjectedCustomResources extends React.Component<Dependencies & CustomResourcesProps> {
-  constructor(props: Dependencies) {
+  readonly crd = computed(() => {
-    super(props);
+    if (this.props.params.group && this.props.params.name) {
-    makeObservable(this);
+      return this.props.customResourceDefinitionStore.getByGroup(this.props.params.group, this.props.params.name);
     }
 
-  @computed get crd() {
+    return undefined;
-    return this.props.customResourceDefinitionStore.getByGroup(this.props.group.get(), this.props.name.get());
+  });
-  }
 
-  @computed get store() {
+  readonly store = computed(() => this.props.apiManager.getStore(this.crd.get()?.getResourceApiBase()));
-    return this.props.apiManager.getStore(this.crd?.getResourceApiBase());
-  }
 
   render() {
-    const { crd, store } = this;
+    const crd = this.crd.get();
+    const store = this.store.get();
 
     if (!crd || !store) {
       return null;
@@ -132,9 +132,9 @@ class NonInjectedCustomResources extends React.Component<Dependencies> {
   }
 }
 
-export const CustomResources = withInjectables<Dependencies>(NonInjectedCustomResources, {
+export const CustomResources = withInjectables<Dependencies, CustomResourcesProps>(NonInjectedCustomResources, {
-  getProps: (di) => ({
+  getProps: (di, props) => ({
-    ...di.inject(customResourcesRouteParametersInjectable),
+    ...props,
     apiManager: di.inject(apiManagerInjectable),
     customResourceDefinitionStore: di.inject(customResourceDefinitionStoreInjectable),
   }),

packages/core/src/renderer/components/entity-settings/current-entity.injectable.ts

@@ -4,16 +4,26 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { computed } from "mobx";
+import entitySettingsRouteInjectable from "../../../common/front-end-routing/routes/entity-settings/entity-settings-route.injectable";
 import catalogEntityRegistryInjectable from "../../api/catalog/entity/registry.injectable";
-import entitySettingsRouteParametersInjectable from "./route-parameters.injectable";
+import routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
 
 const currentCatalogEntityForSettingsInjectable = getInjectable({
   id: "current-catalog-entity-for-settings",
   instantiate: (di) => {
-    const { entityId } = di.inject(entitySettingsRouteParametersInjectable);
+    const route = di.inject(entitySettingsRouteInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable)(route);
     const catalogEntityRegistry = di.inject(catalogEntityRegistryInjectable);
 
-    return computed(() => catalogEntityRegistry.getById(entityId.get()));
+    return computed(() => {
+      const params = pathParameters.get();
+
+      if (!params) {
+        return undefined;
+      }
+
+      return catalogEntityRegistry.getById(params.entityId);
+    });
   },
 });
 

packages/core/src/renderer/components/entity-settings/route-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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import entitySettingsRouteInjectable from "../../../common/front-end-routing/routes/entity-settings/entity-settings-route.injectable";
-
-const entitySettingsRouteParametersInjectable = getInjectable({
-  id: "entity-settings-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(entitySettingsRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      entityId: computed(() => pathParameters.get().entityId),
-    };
-  },
-});
-
-export default entitySettingsRouteParametersInjectable;

packages/core/src/renderer/components/events/events.tsx

@@ -32,6 +32,8 @@ import type { GetDetailsUrl } from "../kube-detail-params/get-details-url.inject
 import getDetailsUrlInjectable from "../kube-detail-params/get-details-url.injectable";
 import { NamespaceSelectBadge } from "../namespaces/namespace-select-badge";
 import type { KubeEventApi } from "@k8slens/kube-api";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type eventsRouteInjectable from "../../../common/front-end-routing/routes/cluster/events/events-route.injectable";
 
 enum columnId {
   message = "message",
@@ -48,6 +50,7 @@ export interface EventsProps extends Partial<KubeObjectListLayoutProps<KubeEvent
   className?: IClassName;
   compact?: boolean;
   compactLimit?: number;
+  params?: ParametersFromRouteInjectable<typeof eventsRouteInjectable>;
 }
 
 const defaultProps: Partial<EventsProps> = {

packages/core/src/renderer/components/helm-charts/helm-charts-route-parameters.injectable.ts

@@ -1,24 +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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import helmChartsRouteInjectable from "../../../common/front-end-routing/routes/cluster/helm/charts/helm-charts-route.injectable";
-
-const helmChartsRouteParametersInjectable = getInjectable({
-  id: "helm-charts-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(helmChartsRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      chartName: computed(() => pathParameters.get().chartName),
-      repo: computed(() => pathParameters.get().repo),
-    };
-  },
-});
-
-export default helmChartsRouteParametersInjectable;

packages/core/src/renderer/components/helm-charts/helm-charts.tsx

@@ -14,13 +14,14 @@ import type { IComputedValue } from "mobx";
 import type { IAsyncComputed } from "@ogre-tools/injectable-react";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
-import helmChartsRouteParametersInjectable from "./helm-charts-route-parameters.injectable";
 import type { NavigateToHelmCharts } from "../../../common/front-end-routing/routes/cluster/helm/charts/navigate-to-helm-charts.injectable";
 import navigateToHelmChartsInjectable from "../../../common/front-end-routing/routes/cluster/helm/charts/navigate-to-helm-charts.injectable";
 import { HelmChartIcon } from "./icon";
 import helmChartsInjectable from "./helm-charts/helm-charts.injectable";
 import selectedHelmChartInjectable from "./helm-charts/selected-helm-chart.injectable";
 import { noop } from "lodash";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type helmChartsRouteInjectable from "../../../common/front-end-routing/routes/cluster/helm/charts/helm-charts-route.injectable";
 
 enum columnId {
   name = "name",
@@ -31,17 +32,17 @@ enum columnId {
 }
 
 interface Dependencies {
-  routeParameters: {
-    chartName: IComputedValue<string>;
-    repo: IComputedValue<string>;
-  };
   navigateToHelmCharts: NavigateToHelmCharts;
   charts: IAsyncComputed<HelmChart[]>;
   selectedChart: IComputedValue<HelmChart | undefined>;
 }
 
+export interface HelmChartsProps {
+  params: ParametersFromRouteInjectable<typeof helmChartsRouteInjectable>;
+}
+
 @observer
-class NonInjectedHelmCharts extends Component<Dependencies> {
+class NonInjectedHelmCharts extends Component<Dependencies & HelmChartsProps> {
   onDetails = (chart: HelmChart) => {
     if (chart === this.props.selectedChart.get()) {
       this.hideDetails();
@@ -144,9 +145,9 @@ class NonInjectedHelmCharts extends Component<Dependencies> {
   }
 }
 
-export const HelmCharts = withInjectables<Dependencies>(NonInjectedHelmCharts, {
+export const HelmCharts = withInjectables<Dependencies, HelmChartsProps>(NonInjectedHelmCharts, {
-  getProps: (di) => ({
+  getProps: (di, props) => ({
-    routeParameters: di.inject(helmChartsRouteParametersInjectable),
+    ...props,
     navigateToHelmCharts: di.inject(navigateToHelmChartsInjectable),
     charts: di.inject(helmChartsInjectable),
     selectedChart: di.inject(selectedHelmChartInjectable),

packages/core/src/renderer/components/helm-charts/helm-charts/selected-helm-chart.injectable.ts

@@ -4,31 +4,31 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { computed } from "mobx";
-import helmChartsRouteParametersInjectable from "../helm-charts-route-parameters.injectable";
+import helmChartsRouteInjectable from "../../../../common/front-end-routing/routes/cluster/helm/charts/helm-charts-route.injectable";
+import routePathParametersInjectable from "../../../routes/route-path-parameters.injectable";
 import helmChartsInjectable from "./helm-charts.injectable";
 
 const selectedHelmChartInjectable = getInjectable({
   id: "selected-helm-chart",
 
   instantiate: (di) => {
-    const { chartName, repo } = di.inject(helmChartsRouteParametersInjectable);
+    const route = di.inject(helmChartsRouteInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable)(route);
     const helmCharts = di.inject(helmChartsInjectable);
 
     return computed(() => {
-      const dereferencedChartName = chartName.get();
+      const { chartName, repo } = pathParameters.get() ?? {};
-      const deferencedRepository = repo.get();
 
-      if (!dereferencedChartName || !deferencedRepository) {
+      if (!chartName || !repo) {
         return undefined;
       }
 
       return helmCharts.value
         .get()
-        .find(
+        .find((chart) => (
-          (chart) =>
+          chart.getName() === chartName
-            chart.getName() === dereferencedChartName &&
+          && chart.getRepository() === repo
-            chart.getRepository() === deferencedRepository,
+        ));
-        );
     });
   },
 });

packages/core/src/renderer/components/helm-releases/helm-releases-route-parameters.injectable.ts

@@ -1,24 +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 helmReleasesRouteInjectable from "../../../common/front-end-routing/routes/cluster/helm/releases/helm-releases-route.injectable";
-import routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-
-const helmReleasesRouteParametersInjectable = getInjectable({
-  id: "helm-releases-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(helmReleasesRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      namespace: computed(() => pathParameters.get().namespace),
-      name: computed(() => pathParameters.get().name),
-    };
-  },
-});
-
-export default helmReleasesRouteParametersInjectable;

packages/core/src/renderer/components/helm-releases/release-details/target-helm-release.injectable.ts

@@ -4,21 +4,32 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { computed } from "mobx";
-import helmReleasesRouteParametersInjectable from "../helm-releases-route-parameters.injectable";
+import helmReleasesRouteInjectable from "../../../../common/front-end-routing/routes/cluster/helm/releases/helm-releases-route.injectable";
+import routePathParametersInjectable from "../../../routes/route-path-parameters.injectable";
 
-export interface TargetHelmRelease { name: string; namespace: string }
+export interface TargetHelmRelease {
+  name: string;
+  namespace: string;
+}
 
 const targetHelmReleaseInjectable = getInjectable({
   id: "target-helm-release",
 
   instantiate: (di) => {
-    const routeParameters = di.inject(helmReleasesRouteParametersInjectable);
+    const route = di.inject(helmReleasesRouteInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable)(route);
 
     return computed((): TargetHelmRelease | undefined => {
-      const name = routeParameters.name.get();
+      const { name, namespace } = pathParameters.get() ?? {};
-      const namespace = routeParameters.namespace.get();
 
-      return name && namespace ? { name, namespace } : undefined;
+      if (name && namespace) {
+        return {
+          name,
+          namespace,
+        };
+      }
+
+      return undefined;
     });
   },
 });

packages/core/src/renderer/components/helm-releases/releases.tsx

@@ -6,7 +6,7 @@
 import "../item-object-list/item-list-layout.scss";
 import "./releases.scss";
 
-import React, { Component } from "react";
+import React from "react";
 import type { HelmRelease } from "../../../common/k8s-api/endpoints/helm-releases.api";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import type { ItemListStore } from "../item-object-list";
@@ -20,10 +20,12 @@ import type { RemovableHelmRelease } from "./removable-releases";
 import type { IComputedValue } from "mobx";
 import releasesInjectable from "./releases.injectable";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
-import helmReleasesRouteParametersInjectable from "./helm-releases-route-parameters.injectable";
 import type { NavigateToHelmReleases } from "../../../common/front-end-routing/routes/cluster/helm/releases/navigate-to-helm-releases.injectable";
 import navigateToHelmReleasesInjectable from "../../../common/front-end-routing/routes/cluster/helm/releases/navigate-to-helm-releases.injectable";
 import { NamespaceSelectBadge } from "../namespaces/namespace-select-badge";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type helmReleasesRouteInjectable from "../../../common/front-end-routing/routes/cluster/helm/releases/helm-releases-route.injectable";
+import { observer } from "mobx-react";
 
 enum columnId {
   name = "name",
@@ -39,11 +41,15 @@ enum columnId {
 interface Dependencies {
   releases: IComputedValue<RemovableHelmRelease[]>;
   releasesArePending: IComputedValue<boolean>;
-  namespace: IComputedValue<string>;
   navigateToHelmReleases: NavigateToHelmReleases;
 }
 
-class NonInjectedHelmReleases extends Component<Dependencies> {
+export interface HelmReleasesProps {
+  params: ParametersFromRouteInjectable<typeof helmReleasesRouteInjectable>;
+}
+
+@observer
+class NonInjectedHelmReleases extends React.Component<Dependencies & HelmReleasesProps> {
   onDetails = (item: HelmRelease) => {
     this.showDetails(item);
   };
@@ -206,11 +212,11 @@ class NonInjectedHelmReleases extends Component<Dependencies> {
   }
 }
 
-export const HelmReleases = withInjectables<Dependencies>(NonInjectedHelmReleases, {
+export const HelmReleases = withInjectables<Dependencies, HelmReleasesProps>(NonInjectedHelmReleases, {
-  getProps: (di) => ({
+  getProps: (di, props) => ({
+    ...props,
     releases: di.inject(removableReleasesInjectable),
     releasesArePending: di.inject(releasesInjectable).pending,
     navigateToHelmReleases: di.inject(navigateToHelmReleasesInjectable),
-    ...di.inject(helmReleasesRouteParametersInjectable),
   }),
 });

packages/core/src/renderer/components/network-port-forwards/port-forwards-route-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 routePathParametersInjectable from "../../routes/route-path-parameters.injectable";
-import portForwardsRouteInjectable from "../../../common/front-end-routing/routes/cluster/network/port-forwards/port-forwards-route.injectable";
-
-const portForwardsRouteParametersInjectable = getInjectable({
-  id: "port-forwards-route-parameters",
-
-  instantiate: (di) => {
-    const route = di.inject(portForwardsRouteInjectable);
-    const pathParameters = di.inject(routePathParametersInjectable, route);
-
-    return {
-      forwardPort: computed(() => pathParameters.get().forwardPort),
-    };
-  },
-});
-
-export default portForwardsRouteParametersInjectable;

packages/core/src/renderer/components/network-port-forwards/port-forwards.tsx

@@ -14,12 +14,12 @@ import { PortForwardDetails } from "./port-forward-details";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import portForwardStoreInjectable from "../../port-forward/port-forward-store/port-forward-store.injectable";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
-import type { IComputedValue } from "mobx";
+import { computed } from "mobx";
-import { computed, makeObservable } from "mobx";
-import portForwardsRouteParametersInjectable from "./port-forwards-route-parameters.injectable";
 import type { NavigateToPortForwards } from "../../../common/front-end-routing/routes/cluster/network/port-forwards/navigate-to-port-forwards.injectable";
 import navigateToPortForwardsInjectable from "../../../common/front-end-routing/routes/cluster/network/port-forwards/navigate-to-port-forwards.injectable";
 import { NamespaceSelectBadge } from "../namespaces/namespace-select-badge";
+import type { ParametersFromRouteInjectable } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type portForwardsRouteInjectable from "../../../common/front-end-routing/routes/cluster/network/port-forwards/port-forwards-route.injectable";
 
 enum columnId {
   name = "name",
@@ -33,38 +33,33 @@ enum columnId {
 
 interface Dependencies {
   portForwardStore: PortForwardStore;
-  forwardPort: IComputedValue<string>;
   navigateToPortForwards: NavigateToPortForwards;
 }
 
-@observer
+export interface PortForwardsProps {
-class NonInjectedPortForwards extends React.Component<Dependencies> {
+  params: ParametersFromRouteInjectable<typeof portForwardsRouteInjectable>;
-  constructor(props: Dependencies) {
-    super(props);
-
-    makeObservable(this);
 }
 
+@observer
+class NonInjectedPortForwards extends React.Component<Dependencies & PortForwardsProps> {
   componentDidMount() {
-
     disposeOnUnmount(this, [
       this.props.portForwardStore.watch(),
     ]);
   }
 
-  @computed
+  readonly selectedPortForward = computed(() => {
-  get selectedPortForward() {
+    const forwardPort = this.props.params.forwardPort;
-    const forwardPort = this.props.forwardPort.get();
 
     if (!forwardPort) {
       return undefined;
     }
 
     return this.props.portForwardStore.getById(forwardPort);
-  }
+  });
 
   onDetails = (item: PortForwardItem) => {
-    if (item === this.selectedPortForward) {
+    if (item === this.selectedPortForward.get()) {
       this.hideDetails();
     } else {
       this.showDetails(item);
@@ -97,6 +92,8 @@ class NonInjectedPortForwards extends React.Component<Dependencies> {
 
 
   render() {
+    const selectedPortForward = this.selectedPortForward.get();
+
     return (
       <SiblingsInTabLayout>
         <ItemListLayout<PortForwardItem, false>
@@ -149,12 +146,12 @@ class NonInjectedPortForwards extends React.Component<Dependencies> {
           customizeRemoveDialog={selectedItems => ({
             message: this.renderRemoveDialogMessage(selectedItems),
           })}
-          detailsItem={this.selectedPortForward}
+          detailsItem={selectedPortForward}
           onDetails={this.onDetails}
         />
-        {this.selectedPortForward && (
+        {selectedPortForward && (
           <PortForwardDetails
-            portForward={this.selectedPortForward}
+            portForward={selectedPortForward}
             hideDetails={this.hideDetails}
           />
         )}
@@ -163,10 +160,10 @@ class NonInjectedPortForwards extends React.Component<Dependencies> {
   }
 }
 
-export const PortForwards = withInjectables<Dependencies>(NonInjectedPortForwards, {
+export const PortForwards = withInjectables<Dependencies, PortForwardsProps>(NonInjectedPortForwards, {
-  getProps: (di) => ({
+  getProps: (di, props) => ({
+    ...props,
     portForwardStore: di.inject(portForwardStoreInjectable),
-    ...di.inject(portForwardsRouteParametersInjectable),
     navigateToPortForwards: di.inject(navigateToPortForwardsInjectable),
   }),
 });

packages/core/src/renderer/components/test-utils/get-application-builder.tsx

@@ -32,8 +32,7 @@ import assert from "assert";
 import { openMenu } from "react-select-event";
 import userEvent from "@testing-library/user-event";
 import lensProxyPortInjectable from "../../../main/lens-proxy/lens-proxy-port.injectable";
-import type { Route } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type { NavigateToRoute } from "../../../common/front-end-routing/navigate-to-route-injection-token";
-import type { NavigateToRouteOptions } from "../../../common/front-end-routing/navigate-to-route-injection-token";
 import { navigateToRouteInjectionToken } from "../../../common/front-end-routing/navigate-to-route-injection-token";
 import type { LensMainExtension } from "../../../extensions/lens-main-extension";
 import type { LensExtension } from "../../../extensions/lens-extension";
@@ -153,7 +152,7 @@ export interface ApplicationBuilder {
   preferences: {
     close: () => void;
     navigate: () => void;
-    navigateTo: <T>(route: Route<T>, params: NavigateToRouteOptions<Route<T>>) => void;
+    navigateTo: NavigateToRoute;
     navigation: {
       click: (id: string) => void;
     };
@@ -503,13 +502,12 @@ export const getApplicationBuilder = () => {
         navigateToPreferences();
       },
 
-      navigateTo: (route, params) => {
+      navigateTo: ((...args) => {
         const windowDi = builder.applicationWindow.only.di;
-
         const navigateToRoute = windowDi.inject(navigateToRouteInjectionToken);
 
-        navigateToRoute(route, params);
+        navigateToRoute(...args);
-      },
+      }) as NavigateToRoute,
 
       navigation: {
         click: (pathId: string) => {
@@ -562,6 +560,7 @@ export const getApplicationBuilder = () => {
         windowDi.override(activeKubernetesClusterInjectable, () => computed(() => catalogEntityFromCluster(cluster)));
 
         // TODO: Figure out a way to remove this stub.
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-return
         windowDi.override(namespaceStoreInjectable, () => ({
           isLoaded: true,
           get contextNamespaces() {
@@ -580,7 +579,8 @@ export const getApplicationBuilder = () => {
           isSelectedAll: () => false,
           getTotalCount: () => namespaceItems.length,
           isSelected: () => false,
-        } as Partial<NamespaceStore> as NamespaceStore));
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        } as Partial<NamespaceStore> as any));
       });
 
       await builder.beforeApplicationStart(({ mainDi }) => {

packages/core/src/renderer/frames/cluster-frame/cluster-frame-layout-child-component.injectable.tsx

@@ -14,27 +14,29 @@ import { computed } from "mobx";
 import currentRouteComponentInjectable from "../../routes/current-route-component.injectable";
 import { Redirect } from "react-router";
 import startUrlInjectable from "./start-url.injectable";
-import currentPathInjectable from "../../routes/current-path.injectable";
 import { observer } from "mobx-react";
 import { withInjectables } from "@ogre-tools/injectable-react";
+import type { InferParamFromPath } from "../../../common/front-end-routing/front-end-route-injection-token";
+import type { MatchedRoute } from "../../routes/matching-route.injectable";
+import matchingRouteInjectable from "../../routes/matching-route.injectable";
 
 interface Dependencies {
-  currentRouteComponent: IComputedValue<React.ElementType<object> | undefined>;
+  currentRouteComponent: IComputedValue<React.ComponentType<{ params: InferParamFromPath<string> }> | undefined>;
   startUrl: IComputedValue<string>;
-  currentPath: IComputedValue<string>;
+  matchedRoute: IComputedValue<MatchedRoute | undefined>;
 }
 
 const NonInjectedClusterFrameLayout = observer((props: Dependencies) => {
   const Component = props.currentRouteComponent.get();
   const starting = props.startUrl.get();
-  const current = props.currentPath.get();
+  const matchedRoute = props.matchedRoute.get();
 
   return (
     <MainLayout sidebar={<Sidebar />} footer={<Dock />}>
-      {Component ? (
+      {(Component && matchedRoute) ? (
-        <Component />
+        <Component params={matchedRoute.pathParameters} />
       ) : // NOTE: this check is to prevent an infinite loop
-        starting !== current ? (
+        starting !== matchedRoute?.route.path ? (
           <Redirect to={starting} />
         ) : (
           <div className={styles.centering}>
@@ -53,7 +55,7 @@ const ClusterFrameLayout = withInjectables<Dependencies>(NonInjectedClusterFrame
     ...props,
     currentRouteComponent: di.inject(currentRouteComponentInjectable),
     startUrl: di.inject(startUrlInjectable),
-    currentPath: di.inject(currentPathInjectable),
+    matchedRoute: di.inject(matchingRouteInjectable),
   }),
 });
 

packages/core/src/renderer/navigation/matched-cluster-id.injectable.ts

@@ -3,15 +3,18 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { getInjectable } from "@ogre-tools/injectable";
-import clusterViewRouteParametersInjectable from "../components/cluster-manager/cluster-view-route-parameters.injectable";
+import { computed } from "mobx";
+import clusterViewRouteInjectable from "../../common/front-end-routing/routes/cluster-view/cluster-view-route.injectable";
+import routePathParametersInjectable from "../routes/route-path-parameters.injectable";
 
 const matchedClusterIdInjectable = getInjectable({
   id: "matched-cluster-id",
 
   instantiate: (di) => {
-    const routeParameters = di.inject(clusterViewRouteParametersInjectable);
+    const route = di.inject(clusterViewRouteInjectable);
+    const pathParameters = di.inject(routePathParametersInjectable)(route);
 
-    return routeParameters.clusterId;
+    return computed(() => pathParameters.get()?.clusterId);
   },
 });
 

packages/core/src/renderer/navigation/page-param.ts

@@ -36,8 +36,6 @@ export type PageParamDeclaration<Value> = (
   ? StringPageParamDeclaration<Value>
   : Value extends Array<infer InnerValue>
     ? ArrayPageParamDeclaration<InnerValue>
-    : Value extends unknown
-      ? FallthroughPageParamDeclaration
     : DefaultPageParamDeclaration<Value>
 );
 

packages/core/src/renderer/routes/current-route.injectable.ts

@@ -15,7 +15,7 @@ const currentRouteInjectable = getInjectable({
     return computed(() => {
       const match = matchingRoute.get();
 
-      if (match && match.route.isEnabled.get()) {
+      if (match?.route.isEnabled.get()) {
         return match.route;
       }
 

packages/core/src/renderer/routes/extension-route-registrator.injectable.tsx

@@ -15,7 +15,7 @@ import extensionPageParametersInjectable from "./extension-page-parameters.injec
 import { getRouteSpecificComponentInjectable } from "./route-specific-component-injection-token";
 import type { IComputedValue } from "mobx";
 import { computed } from "mobx";
-import { frontEndRouteInjectionToken } from "../../common/front-end-routing/front-end-route-injection-token";
+import { getFrontEndRouteInjectable } from "../../common/front-end-routing/front-end-route-injection-token";
 import { getExtensionRoutePath } from "./for-extension";
 import extensionShouldBeEnabledForClusterFrameInjectable from "../extension-loader/extension-should-be-enabled-for-cluster-frame.injectable";
 import type { PageRegistration } from "./page-registration";
@@ -65,17 +65,12 @@ export default extensionRouteRegistratorInjectable;
 const toRouteInjectableFor = (di: DiContainerForInjection, extension: LensRendererExtension) => (
   (clusterFrame: boolean, getIsEnabled: (registration: PageRegistration) => IComputedValue<boolean>) => (
     (registration: PageRegistration) => {
-      const routeInjectable = getInjectable({
+      const routeInjectable = getFrontEndRouteInjectable({
         id: `route-${registration.id ?? ""}-for-extension-${extension.sanitizedExtensionId}`,
-
-        instantiate: () => ({
         path: getExtensionRoutePath(extension, registration.id),
         clusterFrame,
         isEnabled: getIsEnabled(registration),
         extension,
-        }),
-
-        injectionToken: frontEndRouteInjectionToken,
       });
 
       const normalizedParams = di.inject(extensionPageParametersInjectable, {

packages/core/src/renderer/routes/matching-route.injectable.ts

@@ -4,10 +4,15 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import routesInjectable from "./routes.injectable";
-import { matches } from "lodash/fp";
 import { computed } from "mobx";
 import { matchPath } from "react-router";
 import currentPathInjectable from "./current-path.injectable";
+import type { InferParamFromPath, Route } from "../../common/front-end-routing/front-end-route-injection-token";
+
+export interface MatchedRoute {
+  route: Route<string>;
+  pathParameters: InferParamFromPath<string>;
+}
 
 const matchingRouteInjectable = getInjectable({
   id: "matching-route",
@@ -16,21 +21,22 @@ const matchingRouteInjectable = getInjectable({
     const routes = di.inject(routesInjectable);
     const currentPath = di.inject(currentPathInjectable);
 
-    return computed(() => {
+    return computed((): MatchedRoute | undefined => {
-      const matchedRoutes = routes.get().map((route) => {
+      for (const route of routes.get()) {
         const match = matchPath(currentPath.get(), {
           path: route.path,
           exact: true,
         });
 
+        if (match) {
           return {
             route,
-          isMatching: !!match,
+            pathParameters: match.params,
-          pathParameters: match ? match.params : {},
           };
-      });
+        }
+      }
 
-      return matchedRoutes.find(matches({ isMatching: true }));
+      return undefined;
     });
   },
 });