Turn on strict mode in tsconfig.json, some helpful lints, and required cleanup where strictness necessitates it (#5195)

* Turn on strict mode in tsconfig.json - Add route, clusterRoute, and payloadValidatedClusterRoute helper functions to improve types with backend routes - Turn on the following new lints: - react/jsx-first-prop-new-line - react/jsx-wrap-multilines - react/jsx-one-expression-per-line - react/jsx-max-props-per-line - react/jsx-indent - react/jsx-indent-props Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix build Signed-off-by: Sebastian Malton <sebastian@malton.name> * Replace KubeObject scope strings with enum Signed-off-by: Sebastian Malton <sebastian@malton.name> * Revert package.json version changes Signed-off-by: Sebastian Malton <sebastian@malton.name> * revert move hostedCluster(Id) Signed-off-by: Sebastian Malton <sebastian@malton.name> * change some type param names to be not single letters Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove copy-extension-themes Signed-off-by: Sebastian Malton <sebastian@malton.name> * add new make clean action Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix build to not use webpack for generating types Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object-menu.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * revert move fileNameMigration to index Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix ref logic error Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix log-resource-selector.test.tsx tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-store.test.ts test by overriding createStorage to not touch file system Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster.test.ts tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube=api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fixed hotbar-store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kubeconfig-manager.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster-role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pods.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix delete-cluster-dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix daemonset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix replicaset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix statefulsets/dialog/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix replicasets/scale-dialog/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployments.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployments/scale/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cronjob.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix stateful-set.api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix deployment.api.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix api-manager.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix statefulset.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix job.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pods.store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix scroll-spy.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix hotbar-remove-command.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog-entity-registry.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix welcome.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix verify-that-all-routes-have-route-component.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix pod-tolerations.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * better fix for previous 3 fixes, plus also select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object-menu.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix app-paths.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-tabs.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix isReactNode typing Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sub-title.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix drawer.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix list-layout.tsx and header.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix error-boundary.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix upgrade-chart/store.ts and dock-tab.store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix install-chart/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix edit-resource/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix create-resource/store.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix namespace-select.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix namespace-select-filter.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix crd-list.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix wrong types for extensions Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix circular dependency Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix circular dependency on catalogCategoryRegistry Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix api-kube Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type errors, most <Select /> errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * fixing more type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * some more fixing type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * convert all KubeApis to injectable with legacy global backups Signed-off-by: Sebastian Malton <sebastian@malton.name> * factor out into a common file all the exports Signed-off-by: Sebastian Malton <sebastian@malton.name> * convert all KubeObjectStores to injectable with legacy global backups Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unused legacy KubeApi globals Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix bad previous commit Signed-off-by: Sebastian Malton <sebastian@malton.name> * more crash fixing Signed-off-by: Sebastian Malton <sebastian@malton.name> * try and fix behavioural tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sidebar-and-tab-navigation-for-core.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix sidebar-and-tab-navigation-for-extensions.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * Make ThemeStore non-singleton and fix navigation-to-terminal-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * extensions.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix catalog-entity-registry.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix log-resource-selector.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-tabs.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix delete-cluster-dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-kubernetes-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-editor-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-proxy-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-using-application-menu.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-application-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix dock-store.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix select.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix hotbar-remove-command.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix cluster-role-bindings/__tests__/dialog.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-extension-specific-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-telemetry-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix closing-preferences.test.tsx Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-editor-preferences.test.ts Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix navigation-to-proxy-preferences.test.ts - Fix other type errors too Signed-off-by: Sebastian Malton <sebastian@malton.name> * final tweaks Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add more tsconfig files, fix bug in <Catalog> - Make all of history, navigation injectable Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type errors Signed-off-by: Sebastian Malton <sebastian@malton.name> * Convert all of kube-details-params/ and navigate/ to injectable - This fixes a runtime error that was encountered during testing Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix runtime errors on renderer - remove all static uses of `createPageParam` (and then removed the legacy global) - Made LensRendererExtension and LensMainExtension just used dependencies and not the getLegacyDi - Fixed circular dep in extension-loader Signed-off-by: Sebastian Malton <sebastian@malton.name> * Move registerStore calls to after injectMany Signed-off-by: Sebastian Malton <sebastian@malton.name> * replace all the rest of the legacy uses of apiManager Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix stack overflow and cycles in DI Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix NamespaceSelectFilter not opening Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix WizardStep and AddNamespaceDialog Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix KubeApi's not being registered Signed-off-by: Sebastian Malton <sebastian@malton.name> * cleanup WindowManager Signed-off-by: Sebastian Malton <sebastian@malton.name> * Proper fix for Wizard, fix NamespaceStore.subscribe Signed-off-by: Sebastian Malton <sebastian@malton.name> * Rewrite withTooltip to be more type correct - Fixes mobx related "too many recursive actions" error - Change all the uses of withTooltips to be functional components Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add e2e test to cover kube api registration Signed-off-by: Sebastian Malton <sebastian@malton.name> * cleanup internal-commands Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove cast in <Animate> Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix command-palette e2e test Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix type error after rebase Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix test name Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix code to help CodeQL scanner Signed-off-by: Sebastian Malton <sebastian@malton.name> * update intree extension lock files Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix build-extensions picking wrong @types/react Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix tests from rebase Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix type error Signed-off-by: Sebastian Malton <sebastian@malton.name> * Make KubeconfigSyncManager more injectable Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix crash in test mode for Dialog Signed-off-by: Sebastian Malton <sebastian@malton.name> * make Select snapshots deterministic Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix new type error Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix kube-object.store.test.ts typing Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix merge build issues Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix snapshots after merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix lint after merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * reexport BaseKubeJsonApiObjectMetadata Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typo in terminalSpawningPool Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove duplicate license header Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typo to waitUntilDefined Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove iter use from getLegacyGlobalDiForExtensionApi Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove complex createStorage override Signed-off-by: Sebastian Malton <sebastian@malton.name> * override logger with mocks only when needed for tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove specialized overrideStore flags for getDiForUnitTesting Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unnecessary | undefined types from the exactOptionalFieldTypes experiment Signed-off-by: Sebastian Malton <sebastian@malton.name> * use more descriptive name for local test mocks Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove unnecessary addition to 'make clean' target Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove oddity of KubeObjectStore.getById(undefined) being allowed Signed-off-by: Sebastian Malton <sebastian@malton.name> * rename KubeObject.getDescriptor in favour of name without fundemental JS meaning Signed-off-by: Sebastian Malton <sebastian@malton.name> * Simplify legacyRegisterApi when working in behaviour unit tests - Don't emit within main environment as there should be no auto registering there Signed-off-by: Sebastian Malton <sebastian@malton.name> * change confusing variable name in ReactiveDuration Signed-off-by: Sebastian Malton <sebastian@malton.name> * make visitor pattern more explicit for Entity contextMenuOpen Signed-off-by: Sebastian Malton <sebastian@malton.name> * toggleDetails -> toggleKubeDetailsPane is more specific Signed-off-by: Sebastian Malton <sebastian@malton.name> * remove outdated comment Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix bug where LensExtension dependencies are not set Signed-off-by: Sebastian Malton <sebastian@malton.name> * Fix tests from the revert of react 18 Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix more tests from merge Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix typings with new is-compatible-extension tests Signed-off-by: Sebastian Malton <sebastian@malton.name> * more type fixing Signed-off-by: Sebastian Malton <sebastian@malton.name> * Revert in-tree extension versions Signed-off-by: Sebastian Malton <sebastian@malton.name> * Improve name of guarding injectable for stores and apis - New name better implies that it is just a guard state and does not do anything Signed-off-by: Sebastian Malton <sebastian@malton.name> * Add helper for <Select>.isMulti for storing in a Set<Value> Signed-off-by: Sebastian Malton <sebastian@malton.name> * fix is-compatible-extension.test.ts types Signed-off-by: Sebastian Malton <sebastian@malton.name>
2025-05-20 05:10:56 +00:00 · 2022-05-16 07:17:57 -04:00
1 parent 381d77c633
commit dfcb7c3330
@@ -0,0 +1,23 @@
+/**
+ * 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 observableHistoryInjectable from "./observable-history.injectable";
+import type { PageParamDependencies, PageParamInit } from "./page-param";
+import { PageParam } from "./page-param";
+
+export type CreatePageParam = <Value = string>(init: PageParamInit<Value>) => PageParam<Value>;
+
+const createPageParamInjectable = getInjectable({
+  id: "create-page-param",
+  instantiate: (di): CreatePageParam => {
+    const deps: PageParamDependencies = {
+      history: di.inject(observableHistoryInjectable),
+    };
+
+    return (init) => new PageParam(deps, init);
+  },
+});
+
+export default createPageParamInjectable;
@@ -1,39 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import type { LocationDescriptor } from "history";
-import { createPath } from "history";
-import type { RouteProps } from "react-router";
-import { matchPath } from "react-router";
-import { navigation } from "./history";
-import type { PageParamInit } from "./page-param";
-import { PageParam } from "./page-param";
-
-/**
- * @deprecated use `di.inject(navigateInjectable)` instead
- */
-export function navigate(location: LocationDescriptor) {
-  const currentLocation = createPath(navigation.location);
-
-  navigation.push(location);
-
-  const newLocation = createPath(navigation.location);
-
-  if (currentLocation === newLocation) {
-    navigation.goBack(); // prevent sequences of same url in history
-  }
-}
-
-export function createPageParam<V = string>(init: PageParamInit<V>) {
-  return new PageParam<V>(init, navigation);
-}
-
-export function matchRoute<P>(route: string | string[] | RouteProps) {
-  return matchPath<P>(navigation.location.pathname, route);
-}
-
-export function isActiveRoute(route: string | string[] | RouteProps): boolean {
-  return !!matchRoute(route);
-}
@@ -3,11 +3,11 @@
 * Licensed under MIT License. See LICENSE in root directory for more information.
 */
 import { getInjectable } from "@ogre-tools/injectable";
-import { history } from "./history";
+import { createBrowserHistory } from "history";

 const historyInjectable = getInjectable({
  id: "history",
-  instantiate: () => history,
+  instantiate: () => createBrowserHistory(),
 });

 export default historyInjectable;
@@ -1,35 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import { ipcRenderer } from "electron";
-import { createBrowserHistory, createMemoryHistory } from "history";
-import type { ObservableSearchParamsOptions } from "mobx-observable-history";
-import { createObservableHistory } from "mobx-observable-history";
-import logger from "../../main/logger";
-
-export const searchParamsOptions: ObservableSearchParamsOptions = {
-  skipEmpty: true, // skip empty params, e.g. "?x=&y2=" will be "?y=2"
-  joinArrays: false, // join multiple params with same name, e.g. "?x=1&x=2" => "?x=1,2"
-  joinArraysWith: ",", // param values splitter, applicable only with {joinArrays:true}
-};
-
-/**
- * @deprecated: Switch to using di.inject(historyInjectable)
- */
-export const history = ipcRenderer ? createBrowserHistory() : createMemoryHistory();
-
-/**
- * @deprecated: Switch to using di.inject(observableHistoryInjectable)
- */
-export const navigation = createObservableHistory(history, {
-  searchParams: searchParamsOptions,
-});
-
-navigation.listen((location, action) => {
-  const isClusterView = !process.isMainFrame;
-  const domain = global.location.href;
-
-  logger.debug(`[NAVIGATION]: ${action}-ing. Current is now:`, { isClusterView, domain, location });
-});
@@ -3,8 +3,27 @@
 * Licensed under MIT License. See LICENSE in root directory for more information.
 */

-// Navigation (renderer)
+import { asLegacyGlobalFunctionForExtensionApi } from "../../extensions/as-legacy-globals-for-extension-api/as-legacy-global-function-for-extension-api";
+import { asLegacyGlobalForExtensionApi } from "../../extensions/as-legacy-globals-for-extension-api/as-legacy-global-object-for-extension-api";
+import matchRouteInjectable from "./match-route.injectable";
+import navigateInjectable from "./navigate.injectable";
+import observableHistoryInjectable from "./observable-history.injectable";
+
+export { searchParamsOptions } from "./search-params";
+
+/**
+ * @deprecated use `di.inject(observableHistoryInjectable)` instead
+ */
+export const navigation = asLegacyGlobalForExtensionApi(observableHistoryInjectable);
+
+/**
+ * @deprecated use `di.inject(navigateInjectable)` instead
+ */
+export const navigate = asLegacyGlobalFunctionForExtensionApi(navigateInjectable);
+
+/**
+ * @deprecated use `di.inject(matchRouteInjectable)` instead
+ */
+export const matchRoute = asLegacyGlobalFunctionForExtensionApi(matchRouteInjectable);

-export * from "./history";
-export * from "./helpers";
 export * from "./page-param";
@@ -0,0 +1,20 @@
+/**
+ * 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 { RouteProps } from "react-router";
+import matchRouteInjectable from "./match-route.injectable";
+
+export type IsRouteActive = (route: string | string[] | RouteProps) => boolean;
+
+const isActiveRouteInjectable = getInjectable({
+  id: "is-active-route",
+  instantiate: (di): IsRouteActive => {
+    const matchRoute = di.inject(matchRouteInjectable);
+
+    return (route) => Boolean(matchRoute(route));
+  },
+});
+
+export default isActiveRouteInjectable;
@@ -0,0 +1,21 @@
+/**
+ * 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 { match, RouteProps } from "react-router";
+import { matchPath } from "react-router";
+import observableHistoryInjectable from "./observable-history.injectable";
+
+export type MatchRoute = <Params>(route: string | string[] | RouteProps) => match<Params> | null;
+
+const matchRouteInjectable = getInjectable({
+  id: "match-route",
+  instantiate: (di): MatchRoute => {
+    const observableHistory = di.inject(observableHistoryInjectable);
+
+    return (route) => matchPath(observableHistory.location.pathname, route);
+  },
+});
+
+export default matchRouteInjectable;
@@ -4,13 +4,29 @@
 */
 import { getInjectable } from "@ogre-tools/injectable";
 import type { LocationDescriptor } from "history";
-import { navigate } from "./helpers";
+import { action } from "mobx";
+import observableHistoryInjectable from "./observable-history.injectable";
+import { createPath } from "history";

-export type Navigate = (desc: LocationDescriptor) => void;
+export type Navigate = (location: LocationDescriptor) => void;

 const navigateInjectable = getInjectable({
  id: "navigate",
-  instantiate: (): Navigate => (desc) => navigate(desc),
+  instantiate: (di): Navigate => {
+    const observableHistory = di.inject(observableHistoryInjectable);
+
+    return action((location) => {
+      const currentLocation = createPath(observableHistory.location);
+
+      observableHistory.push(location);
+
+      const newLocation = createPath(observableHistory.location);
+
+      if (currentLocation === newLocation) {
+        observableHistory.goBack(); // prevent sequences of same url in history
+      }
+    });
+  },
 });

 export default navigateInjectable;
@@ -3,13 +3,29 @@
 * Licensed under MIT License. See LICENSE in root directory for more information.
 */
 import { getInjectable } from "@ogre-tools/injectable";
-
-import { navigation as observableHistory } from "./history";
+import { createObservableHistory } from "mobx-observable-history";
+import loggerInjectable from "../../common/logger.injectable";
+import { searchParamsOptions } from "./search-params";
+import historyInjectable from "./history.injectable";

 const observableHistoryInjectable = getInjectable({
  id: "observable-history",
-  causesSideEffects: true,
-  instantiate: () => observableHistory,
+  instantiate: (di) => {
+    const history = di.inject(historyInjectable);
+    const logger = di.inject(loggerInjectable);
+    const navigation =  createObservableHistory(history, {
+      searchParams: searchParamsOptions,
+    });
+
+    navigation.listen((location, action) => {
+      const isClusterView = !process.isMainFrame;
+      const domain = global.location.href;
+
+      logger.debug(`[NAVIGATION]: ${action}-ing. Current is now:`, { isClusterView, domain, location });
+    });
+
+    return navigation;
+  },
 });

 export default observableHistoryInjectable;
@@ -7,19 +7,23 @@
 import { action, makeObservable } from "mobx";
 import type { ObservableHistory } from "mobx-observable-history";

-export interface PageParamInit<V = any> {
+export interface PageParamInit<Value = any> {
  name: string;
-  defaultValue?: V; // multi-values param must be defined with array-value, e.g. []
-  parse?(value: string | string[]): V; // from URL
-  stringify?(value: V): string | string[]; // to URL
+  defaultValue?: Value; // multi-values param must be defined with array-value, e.g. []
+  parse?(value: string | string[]): Value; // from URL
+  stringify?(value: Value): string | string[]; // to URL
+}
+
+export interface PageParamDependencies {
+  readonly history: ObservableHistory<unknown>;
 }

 // TODO: write tests
-export class PageParam<V = any> {
+export class PageParam<Value = any> {
  readonly name: string;
  readonly isMulti: boolean;

-  constructor(private init: PageParamInit<V>, private history: ObservableHistory) {
+  constructor(protected readonly dependencies: PageParamDependencies, private init: PageParamInit<Value>) {
    makeObservable(this);
    const { name, defaultValue } = init;

@@ -28,11 +32,11 @@ export class PageParam<V = any> {
  }

  // should be a getter since `init.defaultValue` could be a getter too
-  get defaultValue(): V | undefined {
+  get defaultValue(): Value | undefined {
    return this.init.defaultValue;
  }

-  parse(values: string | string[]): V {
+  parse(values: string | string[]): Value {
    const { parse } = this.init;

    if (parse) {
@@ -40,10 +44,10 @@ export class PageParam<V = any> {
    }

    // return as-is ("string"-value based params)
-    return values as any as V;
+    return values as unknown as Value;
  }

-  stringify(value: V = this.get()): string[] {
+  stringify(value: Value = this.get()): string[] {
    const { stringify } = this.init;

    if (stringify) {
@@ -53,15 +57,17 @@ export class PageParam<V = any> {
    return [value].flat().map(String);
  }

-  get(): V {
-    return this.parse(this.getRaw()) ?? this.defaultValue;
+  get(): Value {
+    // TODO: cleanup
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    return this.parse(this.getRaw()) ?? this.defaultValue!;
  }

  @action
-  set(value: V, { mergeGlobals = true, replaceHistory = false } = {}): void {
+  set(value: Value, { mergeGlobals = true, replaceHistory = false } = {}): void {
    const search = this.toString({ mergeGlobals, value });

-    this.history.merge({ search }, replaceHistory);
+    this.dependencies.history.merge({ search }, replaceHistory);
  }

  /**
@@ -75,10 +81,10 @@ export class PageParam<V = any> {
    if (this.isMulti) {
      this.clear();
      values.forEach(value => {
-        this.history.searchParams.append(this.name, value);
+        this.dependencies.history.searchParams.append(this.name, value);
      });
    } else {
-      this.history.searchParams.set(this.name, values[0]);
+      this.dependencies.history.searchParams.set(this.name, values[0]);
    }
  }

@@ -86,21 +92,21 @@ export class PageParam<V = any> {
   * Get stringified raw value(s) from `document.location.search`
   */
  getRaw(): string | string[] {
-    const values: string[] = this.history.searchParams.getAll(this.name);
+    const values: string[] = this.dependencies.history.searchParams.getAll(this.name);

    return this.isMulti ? values : values[0];
  }

  @action
  clear() {
-    this.history.searchParams.delete(this.name);
+    this.dependencies.history.searchParams.delete(this.name);
  }

  toString({ mergeGlobals = true, value = this.get() } = {}): string {
    let searchParams = new URLSearchParams();

    if (mergeGlobals) {
-      searchParams = new URLSearchParams(this.history.searchParams);
+      searchParams = new URLSearchParams(this.dependencies.history.searchParams);
      searchParams.delete(this.name);
    }

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import type { ObservableSearchParamsOptions } from "mobx-observable-history";
+
+export const searchParamsOptions: ObservableSearchParamsOptions = {
+  skipEmpty: true, // skip empty params, e.g. "?x=&y2=" will be "?y=2"
+  joinArrays: false, // join multiple params with same name, e.g. "?x=1&x=2" => "?x=1,2"
+  joinArraysWith: ",", // param values splitter, applicable only with {joinArrays:true}
+};