From e8c94abc0bf2e737f0522f4417ed24c4c949d460 Mon Sep 17 00:00:00 2001 From: Gabriel Date: Tue, 25 Apr 2023 11:18:54 +0200 Subject: [PATCH] feature @k8slens/routing Signed-off-by: Gabriel --- package-lock.json | 61 +++++++++++++++++++ packages/core/package.json | 1 + .../preferences/closing-preferences.test.tsx | 3 +- .../close-preferences.injectable.ts | 2 +- ...or-general-entity-navigation.injectable.ts | 2 +- .../active-tabs.injectable.ts | 2 +- .../src/renderer/components/dialog/dialog.tsx | 2 +- .../src/renderer/components/drawer/drawer.tsx | 2 +- .../error-boundary/error-boundary.tsx | 2 +- .../get-details-url.injectable.ts | 2 +- .../show-details.injectable.ts | 2 +- .../components/layout/setting-layout.tsx | 2 +- .../renderer/components/layout/tab-layout.tsx | 2 +- .../test-utils/get-application-builder.tsx | 2 +- .../cluster-frame/cluster-frame.test.tsx | 2 +- ...uting-react-application-hoc.injectable.tsx | 2 +- .../create-page-param.injectable.ts | 2 +- .../history.global-override-for-injectable.ts | 2 +- .../navigation/match-route.injectable.ts | 2 +- .../navigation/navigate.injectable.ts | 2 +- ...setup-logging-for-navigation.injectable.ts | 2 +- .../watch-history-state.injectable.ts | 2 +- .../routes/current-path.injectable.ts | 2 +- .../routes/navigate-to-url.injectable.ts | 2 +- .../routes/query-parameters.injectable.ts | 2 +- packages/open-lens/src/renderer/index.ts | 2 + packages/routing/.eslintrc.json | 6 ++ packages/routing/.swcrc | 19 ++++++ packages/routing/README.md | 16 +++++ packages/routing/index.ts | 9 +++ packages/routing/jest.config.js | 4 ++ packages/routing/package.json | 54 ++++++++++++++++ packages/routing/src/feature.ts | 19 ++++++ .../src}/history.injectable.ts | 4 +- .../src}/observable-history.injectable.ts | 8 +-- .../src}/search-params.ts | 0 packages/routing/tailwind.config.js | 28 +++++++++ packages/routing/tsconfig.json | 4 ++ packages/routing/webpack.config.js | 1 + 39 files changed, 251 insertions(+), 32 deletions(-) create mode 100644 packages/routing/.eslintrc.json create mode 100644 packages/routing/.swcrc create mode 100644 packages/routing/README.md create mode 100644 packages/routing/index.ts create mode 100644 packages/routing/jest.config.js create mode 100644 packages/routing/package.json create mode 100644 packages/routing/src/feature.ts rename packages/{core/src/renderer/navigation => routing/src}/history.injectable.ts (82%) rename packages/{core/src/renderer/navigation => routing/src}/observable-history.injectable.ts (70%) rename packages/{core/src/renderer/navigation => routing/src}/search-params.ts (100%) create mode 100644 packages/routing/tailwind.config.js create mode 100644 packages/routing/tsconfig.json create mode 100644 packages/routing/webpack.config.js diff --git a/package-lock.json b/package-lock.json index 1ee3d18cb5..e6005300a9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3979,6 +3979,10 @@ "resolved": "packages/resource-templates", "link": true }, + "node_modules/@k8slens/routing": { + "resolved": "packages/routing", + "link": true + }, "node_modules/@k8slens/run-many": { "resolved": "packages/utility-features/run-many", "link": true @@ -36188,6 +36192,7 @@ "@k8slens/messaging": "^1.0.0-alpha.1", "@k8slens/messaging-for-main": "^1.0.0-alpha.1", "@k8slens/messaging-for-renderer": "^1.0.0-alpha.1", + "@k8slens/routing": "^1.0.0-alpha.5", "@k8slens/run-many": "^1.0.0-alpha.1", "@k8slens/startable-stoppable": "^1.0.0-alpha.1", "@k8slens/test-utils": "^1.0.0-alpha.1", @@ -37190,6 +37195,62 @@ "version": "1.0.0-alpha.0", "license": "MIT" }, + "packages/routing": { + "name": "@k8slens/routing", + "version": "1.0.0-alpha.5", + "license": "MIT", + "devDependencies": { + "@async-fn/jest": "^1.6.4", + "@k8slens/eslint-config": "6.5.0-alpha.1", + "@k8slens/react-testing-library-discovery": "^1.0.0-alpha.3", + "@testing-library/react": "^12.1.5", + "@testing-library/user-event": "^13.5.0" + }, + "peerDependencies": { + "@k8slens/feature-core": "^6.5.0-alpha.0", + "@k8slens/react-application": "^1.0.0-alpha.0", + "@ogre-tools/fp": "^15.3.1", + "@ogre-tools/injectable": "^15.3.1", + "@ogre-tools/injectable-extension-for-auto-registration": "^15.3.0", + "@ogre-tools/injectable-react": "^15.3.0", + "auto-bind": "^4.0.0", + "history": "^4.10.1", + "lodash": "^4.17.21", + "mobx": "^6.8.0", + "mobx-observable-history": "^2.0.3", + "mobx-react": "^7.6.0", + "react": "^17", + "react-dom": "^17.0.2" + } + }, + "packages/routing/node_modules/@k8slens/eslint-config": { + "version": "6.5.0-alpha.1", + "resolved": "https://registry.npmjs.org/@k8slens/eslint-config/-/eslint-config-6.5.0-alpha.1.tgz", + "integrity": "sha512-6DdfKe/iafX85GBK/UlKgz29FOIOp/UVS03bFGLyw7Vmm7pauB0FEHTAdbr3g1qG/Zcn6nxhOM3uqQyRY/uEyA==", + "dev": true, + "bin": { + "lens-lint": "bin/lint" + }, + "peerDependencies": { + "@typescript-eslint/eslint-plugin": ">= 5", + "@typescript-eslint/parser": ">= 5", + "eslint": ">= 7", + "eslint-config-airbnb-typescript": ">= 17", + "eslint-config-prettier": ">= 8", + "eslint-config-react-app": "^7.0.1", + "eslint-plugin-import": ">= 2", + "eslint-plugin-jest": ">= 27", + "eslint-plugin-jsx-a11y": ">= 6", + "eslint-plugin-no-unsanitized": ">= 4.0.2", + "eslint-plugin-prettier": ">= 4", + "eslint-plugin-react-hooks": ">= 4", + "eslint-plugin-security": ">= 1.6.0", + "eslint-plugin-simple-import-sort": ">= 7", + "eslint-plugin-unused-imports": ">= 2", + "eslint-plugin-xss": ">= 0.1.12", + "prettier": ">= 2" + } + }, "packages/semver": { "name": "@k8slens/semver", "version": "6.5.0-alpha.4", diff --git a/packages/core/package.json b/packages/core/package.json index 1d229011b2..2b3fe7e222 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -315,6 +315,7 @@ "@k8slens/application": "^6.5.0-alpha.0", "@k8slens/application-for-electron-main": "^6.5.0-alpha.0", "@k8slens/button": "^1.0.0-alpha.0", + "@k8slens/routing": "^1.0.0-alpha.5", "@k8slens/cluster-settings": "^6.5.0-alpha.1", "@k8slens/kubectl-versions": "^1.0.0-alpha.0", "@k8slens/legacy-extensions": "^1.0.0-alpha.0", diff --git a/packages/core/src/features/preferences/closing-preferences.test.tsx b/packages/core/src/features/preferences/closing-preferences.test.tsx index fe902093df..7d518cb632 100644 --- a/packages/core/src/features/preferences/closing-preferences.test.tsx +++ b/packages/core/src/features/preferences/closing-preferences.test.tsx @@ -12,13 +12,12 @@ import { frontEndRouteInjectionToken } from "../../common/front-end-routing/fron import { computed, runInAction } from "mobx"; import React from "react"; import { routeSpecificComponentInjectionToken } from "../../renderer/routes/route-specific-component-injection-token"; -import observableHistoryInjectable from "../../renderer/navigation/observable-history.injectable"; +import { observableHistoryInjectable, searchParamsOptions } from "@k8slens/routing"; import { createMemoryHistory } from "history"; import { createObservableHistory } from "mobx-observable-history"; import navigateToFrontPageInjectable from "../../common/front-end-routing/navigate-to-front-page.injectable"; import { navigateToRouteInjectionToken } from "../../common/front-end-routing/navigate-to-route-injection-token"; import { preferenceItemInjectionToken } from "./renderer/preference-items/preference-item-injection-token"; -import { searchParamsOptions } from "../../renderer/navigation/search-params"; describe("preferences - closing-preferences", () => { let builder: ApplicationBuilder; diff --git a/packages/core/src/features/preferences/renderer/close-preferences/close-preferences.injectable.ts b/packages/core/src/features/preferences/renderer/close-preferences/close-preferences.injectable.ts index 57860c2f28..48db2d31cf 100644 --- a/packages/core/src/features/preferences/renderer/close-preferences/close-preferences.injectable.ts +++ b/packages/core/src/features/preferences/renderer/close-preferences/close-preferences.injectable.ts @@ -3,7 +3,7 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import observableHistoryInjectable from "../../../../renderer/navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import navigateToFrontPageInjectable from "../../../../common/front-end-routing/navigate-to-front-page.injectable"; const closePreferencesInjectable = getInjectable({ diff --git a/packages/core/src/renderer/api/helpers/watch-for-general-entity-navigation.injectable.ts b/packages/core/src/renderer/api/helpers/watch-for-general-entity-navigation.injectable.ts index 70b7a61eae..67bd3dd823 100644 --- a/packages/core/src/renderer/api/helpers/watch-for-general-entity-navigation.injectable.ts +++ b/packages/core/src/renderer/api/helpers/watch-for-general-entity-navigation.injectable.ts @@ -7,7 +7,7 @@ import { reaction, when } from "mobx"; import type { GeneralEntity } from "../../../common/catalog-entities"; import generalCategoryInjectable from "../../../common/catalog/categories/general.injectable"; import isActiveRouteInjectable from "../../navigation/is-route-active.injectable"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import type { Disposer } from "@k8slens/utilities"; import { disposer } from "@k8slens/utilities"; import catalogEntityRegistryInjectable from "../catalog/entity/registry.injectable"; diff --git a/packages/core/src/renderer/components/+entity-settings/active-tabs.injectable.ts b/packages/core/src/renderer/components/+entity-settings/active-tabs.injectable.ts index 82f8ad6985..57347f16dc 100644 --- a/packages/core/src/renderer/components/+entity-settings/active-tabs.injectable.ts +++ b/packages/core/src/renderer/components/+entity-settings/active-tabs.injectable.ts @@ -6,7 +6,7 @@ import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable"; import { action } from "mobx"; import { byOrderNumber } from "../../../common/utils/composable-responsibilities/orderable/orderable"; import type { CatalogEntity } from "../../api/catalog-entity"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import type { RegisteredEntitySetting } from "./extension-registrator.injectable"; import catalogEntitySettingItemsInjectable from "./settings.injectable"; diff --git a/packages/core/src/renderer/components/dialog/dialog.tsx b/packages/core/src/renderer/components/dialog/dialog.tsx index 765d9b7317..7ddefe7468 100644 --- a/packages/core/src/renderer/components/dialog/dialog.tsx +++ b/packages/core/src/renderer/components/dialog/dialog.tsx @@ -13,7 +13,7 @@ import { Animate } from "../animate"; import { cssNames, noop, stopPropagation } from "@k8slens/utilities"; import type { ObservableHistory } from "mobx-observable-history"; import { withInjectables } from "@ogre-tools/injectable-react"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import requestAnimationFrameInjectable from "../animate/request-animation-frame.injectable"; // todo: refactor + handle animation-end in props.onClose()? diff --git a/packages/core/src/renderer/components/drawer/drawer.tsx b/packages/core/src/renderer/components/drawer/drawer.tsx index 5959c0c098..b56b3378a1 100644 --- a/packages/core/src/renderer/components/drawer/drawer.tsx +++ b/packages/core/src/renderer/components/drawer/drawer.tsx @@ -16,7 +16,7 @@ import { Animate } from "../animate"; import { ResizeDirection, ResizeGrowthDirection, ResizeSide, ResizingAnchor } from "../resizing-anchor"; import drawerStorageInjectable, { defaultDrawerWidth } from "./drawer-storage/drawer-storage.injectable"; import { withInjectables } from "@ogre-tools/injectable-react"; -import historyInjectable from "../../navigation/history.injectable"; +import { historyInjectable } from "@k8slens/routing"; import type { History } from "history"; import type { StorageLayer } from "../../utils/storage-helper"; diff --git a/packages/core/src/renderer/components/error-boundary/error-boundary.tsx b/packages/core/src/renderer/components/error-boundary/error-boundary.tsx index 6621923cfe..de4462ee14 100644 --- a/packages/core/src/renderer/components/error-boundary/error-boundary.tsx +++ b/packages/core/src/renderer/components/error-boundary/error-boundary.tsx @@ -13,7 +13,7 @@ import { issuesTrackerUrl, forumsUrl } from "../../../common/vars"; import type { SingleOrMany } from "@k8slens/utilities"; import type { ObservableHistory } from "mobx-observable-history"; import { withInjectables } from "@ogre-tools/injectable-react"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; export interface ErrorBoundaryProps { children?: SingleOrMany; diff --git a/packages/core/src/renderer/components/kube-detail-params/get-details-url.injectable.ts b/packages/core/src/renderer/components/kube-detail-params/get-details-url.injectable.ts index e11e9e5d05..46735dbadc 100644 --- a/packages/core/src/renderer/components/kube-detail-params/get-details-url.injectable.ts +++ b/packages/core/src/renderer/components/kube-detail-params/get-details-url.injectable.ts @@ -3,7 +3,7 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import kubeDetailsUrlParamInjectable from "./kube-details-url.injectable"; import kubeSelectedUrlParamInjectable from "./kube-selected-url.injectable"; diff --git a/packages/core/src/renderer/components/kube-detail-params/show-details.injectable.ts b/packages/core/src/renderer/components/kube-detail-params/show-details.injectable.ts index c91198fd78..b8195f25a6 100644 --- a/packages/core/src/renderer/components/kube-detail-params/show-details.injectable.ts +++ b/packages/core/src/renderer/components/kube-detail-params/show-details.injectable.ts @@ -3,7 +3,7 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import getDetailsUrlInjectable from "./get-details-url.injectable"; /** diff --git a/packages/core/src/renderer/components/layout/setting-layout.tsx b/packages/core/src/renderer/components/layout/setting-layout.tsx index 09ceba9a5d..c18532d375 100644 --- a/packages/core/src/renderer/components/layout/setting-layout.tsx +++ b/packages/core/src/renderer/components/layout/setting-layout.tsx @@ -12,7 +12,7 @@ import { cssNames } from "@k8slens/utilities"; import { CloseButton } from "./close-button"; import { getLegacyGlobalDiForExtensionApi } from "../../../extensions/as-legacy-globals-for-extension-api/legacy-global-di-for-extension-api"; import navigateToCatalogInjectable from "../../../common/front-end-routing/routes/catalog/navigate-to-catalog.injectable"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; export interface SettingLayoutProps extends React.DOMAttributes { className?: IClassName; diff --git a/packages/core/src/renderer/components/layout/tab-layout.tsx b/packages/core/src/renderer/components/layout/tab-layout.tsx index d91a31d5e8..05e9b9b02c 100644 --- a/packages/core/src/renderer/components/layout/tab-layout.tsx +++ b/packages/core/src/renderer/components/layout/tab-layout.tsx @@ -15,7 +15,7 @@ import { Tab, Tabs } from "../tabs"; import { ErrorBoundary } from "../error-boundary"; import type { ObservableHistory } from "mobx-observable-history"; import { withInjectables } from "@ogre-tools/injectable-react"; -import observableHistoryInjectable from "../../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import type { Navigate } from "../../navigation/navigate.injectable"; import navigateInjectable from "../../navigation/navigate.injectable"; diff --git a/packages/core/src/renderer/components/test-utils/get-application-builder.tsx b/packages/core/src/renderer/components/test-utils/get-application-builder.tsx index cee9ddc0f2..cd471c59e2 100644 --- a/packages/core/src/renderer/components/test-utils/get-application-builder.tsx +++ b/packages/core/src/renderer/components/test-utils/get-application-builder.tsx @@ -24,7 +24,7 @@ import navigateToHelmChartsInjectable from "../../../common/front-end-routing/ro import hostedClusterInjectable from "../../cluster-frame-context/hosted-cluster.injectable"; import { Cluster } from "../../../common/cluster/cluster"; import type { NamespaceStore } from "../+namespaces/store"; -import historyInjectable from "../../navigation/history.injectable"; +import { historyInjectable } from "@k8slens/routing"; import type { MinimalTrayMenuItem } from "../../../main/tray/electron-tray/electron-tray.injectable"; import electronTrayInjectable from "../../../main/tray/electron-tray/electron-tray.injectable"; import { getDiForUnitTesting as getRendererDi } from "../../getDiForUnitTesting"; diff --git a/packages/core/src/renderer/frames/cluster-frame/cluster-frame.test.tsx b/packages/core/src/renderer/frames/cluster-frame/cluster-frame.test.tsx index e3ce80e13a..1d68aa6466 100644 --- a/packages/core/src/renderer/frames/cluster-frame/cluster-frame.test.tsx +++ b/packages/core/src/renderer/frames/cluster-frame/cluster-frame.test.tsx @@ -12,7 +12,7 @@ import { DiContextProvider } from "@ogre-tools/injectable-react"; import { Router } from "react-router"; import { DefaultProps } from "../../mui-base-theme"; import { ClusterFrame } from "./cluster-frame"; -import historyInjectable from "../../navigation/history.injectable"; +import { historyInjectable } from "@k8slens/routing"; import { computed } from "mobx"; import { Cluster } from "../../../common/cluster/cluster"; import subscribeStoresInjectable from "../../kube-watch-api/subscribe-stores.injectable"; diff --git a/packages/core/src/renderer/frames/routing-react-application-hoc.injectable.tsx b/packages/core/src/renderer/frames/routing-react-application-hoc.injectable.tsx index 6853b0eaed..5af32c330c 100644 --- a/packages/core/src/renderer/frames/routing-react-application-hoc.injectable.tsx +++ b/packages/core/src/renderer/frames/routing-react-application-hoc.injectable.tsx @@ -4,7 +4,7 @@ */ import { getInjectable } from "@ogre-tools/injectable"; import { Router } from "react-router"; -import historyInjectable from "../navigation/history.injectable"; +import { historyInjectable } from "@k8slens/routing"; import React from "react"; import { diff --git a/packages/core/src/renderer/navigation/create-page-param.injectable.ts b/packages/core/src/renderer/navigation/create-page-param.injectable.ts index 19b96d9b88..01c2088c43 100644 --- a/packages/core/src/renderer/navigation/create-page-param.injectable.ts +++ b/packages/core/src/renderer/navigation/create-page-param.injectable.ts @@ -3,7 +3,7 @@ * 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 { observableHistoryInjectable } from "@k8slens/routing"; import type { PageParamDependencies, PageParamInit } from "./page-param"; import { PageParam } from "./page-param"; diff --git a/packages/core/src/renderer/navigation/history.global-override-for-injectable.ts b/packages/core/src/renderer/navigation/history.global-override-for-injectable.ts index cc3587d12a..cb3545a16e 100644 --- a/packages/core/src/renderer/navigation/history.global-override-for-injectable.ts +++ b/packages/core/src/renderer/navigation/history.global-override-for-injectable.ts @@ -5,6 +5,6 @@ import { createMemoryHistory } from "history"; import { getGlobalOverride } from "@k8slens/test-utils"; -import historyInjectable from "./history.injectable"; +import { historyInjectable } from "@k8slens/routing"; export default getGlobalOverride(historyInjectable, () => createMemoryHistory()); diff --git a/packages/core/src/renderer/navigation/match-route.injectable.ts b/packages/core/src/renderer/navigation/match-route.injectable.ts index 44518c3e09..7d4e4c6e72 100644 --- a/packages/core/src/renderer/navigation/match-route.injectable.ts +++ b/packages/core/src/renderer/navigation/match-route.injectable.ts @@ -5,7 +5,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import type { match, RouteProps } from "react-router"; import { matchPath } from "react-router"; -import observableHistoryInjectable from "./observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; export type MatchRoute = (route: string | string[] | RouteProps) => match | null; diff --git a/packages/core/src/renderer/navigation/navigate.injectable.ts b/packages/core/src/renderer/navigation/navigate.injectable.ts index 01995b0b94..3eb9d2a9c5 100644 --- a/packages/core/src/renderer/navigation/navigate.injectable.ts +++ b/packages/core/src/renderer/navigation/navigate.injectable.ts @@ -5,7 +5,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import type { LocationDescriptor } from "history"; import { action } from "mobx"; -import observableHistoryInjectable from "./observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import { createPath } from "history"; export type Navigate = (location: LocationDescriptor) => void; diff --git a/packages/core/src/renderer/navigation/setup-logging-for-navigation.injectable.ts b/packages/core/src/renderer/navigation/setup-logging-for-navigation.injectable.ts index b56eb979a2..e7d978a48f 100644 --- a/packages/core/src/renderer/navigation/setup-logging-for-navigation.injectable.ts +++ b/packages/core/src/renderer/navigation/setup-logging-for-navigation.injectable.ts @@ -5,7 +5,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import loggerInjectable from "../../common/logger.injectable"; import { beforeFrameStartsSecondInjectionToken } from "../before-frame-starts/tokens"; -import observableHistoryInjectable from "./observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; const setupLoggingForNavigationInjectable = getInjectable({ id: "setup-logging-for-navigation", diff --git a/packages/core/src/renderer/remote-helpers/watch-history-state.injectable.ts b/packages/core/src/renderer/remote-helpers/watch-history-state.injectable.ts index f878b7d20c..3fbbecf576 100644 --- a/packages/core/src/renderer/remote-helpers/watch-history-state.injectable.ts +++ b/packages/core/src/renderer/remote-helpers/watch-history-state.injectable.ts @@ -6,7 +6,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import { emitWindowLocationChanged } from "../ipc"; import { reaction } from "mobx"; -import observableHistoryInjectable from "../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; const watchHistoryStateInjectable = getInjectable({ id: "watch-history-state", diff --git a/packages/core/src/renderer/routes/current-path.injectable.ts b/packages/core/src/renderer/routes/current-path.injectable.ts index 4ca6d64e8f..3dcca9e81e 100644 --- a/packages/core/src/renderer/routes/current-path.injectable.ts +++ b/packages/core/src/renderer/routes/current-path.injectable.ts @@ -4,7 +4,7 @@ */ import { getInjectable } from "@ogre-tools/injectable"; import { computed } from "mobx"; -import observableHistoryInjectable from "../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; const currentPathInjectable = getInjectable({ id: "current-path", diff --git a/packages/core/src/renderer/routes/navigate-to-url.injectable.ts b/packages/core/src/renderer/routes/navigate-to-url.injectable.ts index 616bfb6431..6901769a25 100644 --- a/packages/core/src/renderer/routes/navigate-to-url.injectable.ts +++ b/packages/core/src/renderer/routes/navigate-to-url.injectable.ts @@ -3,7 +3,7 @@ * Licensed under MIT License. See LICENSE in root directory for more information. */ import { getInjectable } from "@ogre-tools/injectable"; -import observableHistoryInjectable from "../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; import { runInAction } from "mobx"; import type { NavigateToUrl } from "../../common/front-end-routing/navigate-to-url-injection-token"; import { navigateToUrlInjectionToken } from "../../common/front-end-routing/navigate-to-url-injection-token"; diff --git a/packages/core/src/renderer/routes/query-parameters.injectable.ts b/packages/core/src/renderer/routes/query-parameters.injectable.ts index 2faf4b67b9..105ad9e790 100644 --- a/packages/core/src/renderer/routes/query-parameters.injectable.ts +++ b/packages/core/src/renderer/routes/query-parameters.injectable.ts @@ -5,7 +5,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import { computed } from "mobx"; import { parse as parseQueryString } from "query-string"; -import observableHistoryInjectable from "../navigation/observable-history.injectable"; +import { observableHistoryInjectable } from "@k8slens/routing"; const queryParametersInjectable = getInjectable({ id: "query-parameters", diff --git a/packages/open-lens/src/renderer/index.ts b/packages/open-lens/src/renderer/index.ts index 5e7c2f0776..4b289ec1a2 100644 --- a/packages/open-lens/src/renderer/index.ts +++ b/packages/open-lens/src/renderer/index.ts @@ -20,6 +20,7 @@ import { registerInjectableReact } from "@ogre-tools/injectable-react"; import { messagingFeatureForRenderer } from "@k8slens/messaging-for-renderer"; import { keyboardShortcutsFeature } from "@k8slens/keyboard-shortcuts"; import { reactApplicationFeature } from "@k8slens/react-application"; +import { routingFeature } from "@k8slens/routing"; const environment = "renderer"; @@ -38,6 +39,7 @@ runInAction(() => { messagingFeatureForRenderer, keyboardShortcutsFeature, reactApplicationFeature, + routingFeature, metricsFeature ); diff --git a/packages/routing/.eslintrc.json b/packages/routing/.eslintrc.json new file mode 100644 index 0000000000..b15115cb69 --- /dev/null +++ b/packages/routing/.eslintrc.json @@ -0,0 +1,6 @@ +{ + "extends": "@k8slens/eslint-config/eslint", + "parserOptions": { + "project": "./tsconfig.json" + } +} diff --git a/packages/routing/.swcrc b/packages/routing/.swcrc new file mode 100644 index 0000000000..4dd5c11a89 --- /dev/null +++ b/packages/routing/.swcrc @@ -0,0 +1,19 @@ +{ + "module": { + "type": "commonjs" + }, + "jsc": { + "parser": { + "syntax": "typescript", + "tsx": true, + "decorators": true, + "dynamicImport": false + }, + "transform": { + "legacyDecorator": true, + "decoratorMetadata": true + }, + "target": "es2019" + } +} + diff --git a/packages/routing/README.md b/packages/routing/README.md new file mode 100644 index 0000000000..fae391dd5b --- /dev/null +++ b/packages/routing/README.md @@ -0,0 +1,16 @@ +# @k8slens/routing + +This package contains stuff related to creating Lens-applications. + +# Usage + +```bash +$ npm install @k8slens/routing +``` + +```typescript +import { observableHistoryInjectable } from "@k8slens/routing"; +import { searchParamsOptions } from "@k8slens/routing"; +``` + +## Extendability diff --git a/packages/routing/index.ts b/packages/routing/index.ts new file mode 100644 index 0000000000..3169cfad61 --- /dev/null +++ b/packages/routing/index.ts @@ -0,0 +1,9 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ + +export { historyInjectable } from "./src/history.injectable"; +export { observableHistoryInjectable } from "./src/observable-history.injectable"; +export { searchParamsOptions } from "./src/search-params"; +export { routingFeature } from "./src/feature"; diff --git a/packages/routing/jest.config.js b/packages/routing/jest.config.js new file mode 100644 index 0000000000..9499351d14 --- /dev/null +++ b/packages/routing/jest.config.js @@ -0,0 +1,4 @@ +const { configForReact } = + require("@k8slens/jest").monorepoPackageConfig(__dirname); + +module.exports = configForReact; diff --git a/packages/routing/package.json b/packages/routing/package.json new file mode 100644 index 0000000000..d6cc28892c --- /dev/null +++ b/packages/routing/package.json @@ -0,0 +1,54 @@ +{ + "name": "@k8slens/routing", + "private": false, + "version": "1.0.0-alpha.5", + "description": "Highly extendable routing in the Lens.", + "type": "commonjs", + "files": [ + "dist" + ], + "publishConfig": { + "access": "public", + "registry": "https://registry.npmjs.org/" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/lensapp/lens.git" + }, + "main": "dist/index.js", + "types": "dist/index.d.ts", + "author": { + "name": "OpenLens Authors", + "email": "info@k8slens.dev" + }, + "license": "MIT", + "homepage": "https://github.com/lensapp/lens", + "scripts": { + "build": "webpack", + "lint": "lens-lint", + "lint:fix": "lens-lint --fix" + }, + "peerDependencies": { + "@k8slens/feature-core": "^6.5.0-alpha.0", + "@k8slens/react-application": "^1.0.0-alpha.0", + "@ogre-tools/fp": "^15.3.1", + "@ogre-tools/injectable": "^15.3.1", + "@ogre-tools/injectable-extension-for-auto-registration": "^15.3.0", + "@ogre-tools/injectable-react": "^15.3.0", + "history": "^4.10.1", + "mobx-observable-history": "^2.0.3", + "auto-bind": "^4.0.0", + "lodash": "^4.17.21", + "mobx": "^6.8.0", + "mobx-react": "^7.6.0", + "react": "^17", + "react-dom": "^17.0.2" + }, + "devDependencies": { + "@async-fn/jest": "^1.6.4", + "@k8slens/eslint-config": "6.5.0-alpha.1", + "@k8slens/react-testing-library-discovery": "^1.0.0-alpha.3", + "@testing-library/react": "^12.1.5", + "@testing-library/user-event": "^13.5.0" + } +} diff --git a/packages/routing/src/feature.ts b/packages/routing/src/feature.ts new file mode 100644 index 0000000000..a934c53fca --- /dev/null +++ b/packages/routing/src/feature.ts @@ -0,0 +1,19 @@ +import { getFeature } from "@k8slens/feature-core"; +import { autoRegister } from "@ogre-tools/injectable-extension-for-auto-registration"; +import { reactApplicationFeature } from "@k8slens/react-application"; + +export const routingFeature = getFeature({ + id: "routing", + + register: (di) => { + autoRegister({ + di, + targetModule: module, + getRequireContexts: () => [ + require.context("./", true, /\.injectable\.(ts|tsx)$/), + ], + }); + }, + + dependencies: [reactApplicationFeature], +}); diff --git a/packages/core/src/renderer/navigation/history.injectable.ts b/packages/routing/src/history.injectable.ts similarity index 82% rename from packages/core/src/renderer/navigation/history.injectable.ts rename to packages/routing/src/history.injectable.ts index 63f725dc28..c7706bcdd8 100644 --- a/packages/core/src/renderer/navigation/history.injectable.ts +++ b/packages/routing/src/history.injectable.ts @@ -6,9 +6,7 @@ import { getInjectable } from "@ogre-tools/injectable"; import { createBrowserHistory } from "history"; import type { History } from "history"; -const historyInjectable = getInjectable({ +export const historyInjectable = getInjectable({ id: "history", instantiate: (): History => createBrowserHistory(), }); - -export default historyInjectable; diff --git a/packages/core/src/renderer/navigation/observable-history.injectable.ts b/packages/routing/src/observable-history.injectable.ts similarity index 70% rename from packages/core/src/renderer/navigation/observable-history.injectable.ts rename to packages/routing/src/observable-history.injectable.ts index c813c675fd..85fe3d31f1 100644 --- a/packages/core/src/renderer/navigation/observable-history.injectable.ts +++ b/packages/routing/src/observable-history.injectable.ts @@ -5,19 +5,17 @@ import { getInjectable } from "@ogre-tools/injectable"; import { createObservableHistory } from "mobx-observable-history"; import { searchParamsOptions } from "./search-params"; -import historyInjectable from "./history.injectable"; +import { historyInjectable } from "./history.injectable"; -const observableHistoryInjectable = getInjectable({ +export const observableHistoryInjectable = getInjectable({ id: "observable-history", instantiate: (di) => { const history = di.inject(historyInjectable); - const navigation = createObservableHistory(history, { + const navigation = createObservableHistory(history, { searchParams: searchParamsOptions, }); return navigation; }, }); - -export default observableHistoryInjectable; diff --git a/packages/core/src/renderer/navigation/search-params.ts b/packages/routing/src/search-params.ts similarity index 100% rename from packages/core/src/renderer/navigation/search-params.ts rename to packages/routing/src/search-params.ts diff --git a/packages/routing/tailwind.config.js b/packages/routing/tailwind.config.js new file mode 100644 index 0000000000..0feb6790ac --- /dev/null +++ b/packages/routing/tailwind.config.js @@ -0,0 +1,28 @@ +/** + * Copyright (c) OpenLens Authors. All rights reserved. + * Licensed under MIT License. See LICENSE in root directory for more information. + */ + +const path = require("path"); + +module.exports = { + content: [path.join(__dirname, "src/**/*.tsx")], + darkMode: "class", + theme: { + fontFamily: { + sans: ["Roboto", "Helvetica", "Arial", "sans-serif"], + }, + extend: { + colors: { + textAccent: "var(--textColorAccent)", + textPrimary: "var(--textColorPrimary)", + textTertiary: "var(--textColorTertiary)", + textDimmed: "var(--textColorDimmed)", + }, + }, + }, + variants: { + extend: {}, + }, + plugins: [], +}; diff --git a/packages/routing/tsconfig.json b/packages/routing/tsconfig.json new file mode 100644 index 0000000000..9e140d79da --- /dev/null +++ b/packages/routing/tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "@k8slens/typescript/config/base.json", + "include": ["**/*.ts", "**/*.tsx"], +} diff --git a/packages/routing/webpack.config.js b/packages/routing/webpack.config.js new file mode 100644 index 0000000000..1cda407f5a --- /dev/null +++ b/packages/routing/webpack.config.js @@ -0,0 +1 @@ +module.exports = require("@k8slens/webpack").configForReact;