From 22da7a97572fd058c8badce133e256f7e3047dca Mon Sep 17 00:00:00 2001 From: Sebastian Malton Date: Mon, 17 May 2021 15:34:27 -0400 Subject: [PATCH] Remove renderer component - Flatten into (old ) - Rename as Signed-off-by: Sebastian Malton --- src/extensions/renderer-api/navigation.ts | 2 +- src/renderer/bootstrap.tsx | 6 +- .../__test__}/bottom-bar.test.tsx | 4 +- .../bottom-bar.scss | 0 .../bottom-bar.tsx | 0 src/renderer/components/bottom-bar/index.ts | 22 ++++++ .../components/{app.tsx => cluster-frame.tsx} | 2 +- .../cluster-manager/cluster-manager.tsx | 68 ------------------- .../cluster-connection-status.scss} | 4 +- .../cluster-connection-status.tsx} | 6 +- .../cluster-view.scss | 0 .../cluster-view.tsx | 4 +- .../index.tsx | 2 +- .../lens-views.ts | 2 +- .../cluster-manager.scss => root-frame.scss} | 2 +- src/renderer/{lens-app.tsx => root-frame.tsx} | 45 ++++++++++-- 16 files changed, 78 insertions(+), 91 deletions(-) rename src/renderer/components/{cluster-manager => bottom-bar/__test__}/bottom-bar.test.tsx (96%) rename src/renderer/components/{cluster-manager => bottom-bar}/bottom-bar.scss (100%) rename src/renderer/components/{cluster-manager => bottom-bar}/bottom-bar.tsx (100%) create mode 100644 src/renderer/components/bottom-bar/index.ts rename src/renderer/components/{app.tsx => cluster-frame.tsx} (99%) delete mode 100644 src/renderer/components/cluster-manager/cluster-manager.tsx rename src/renderer/components/{cluster-manager/cluster-status.scss => cluster-view/cluster-connection-status.scss} (97%) rename src/renderer/components/{cluster-manager/cluster-status.tsx => cluster-view/cluster-connection-status.tsx} (97%) rename src/renderer/components/{cluster-manager => cluster-view}/cluster-view.scss (100%) rename src/renderer/components/{cluster-manager => cluster-view}/cluster-view.tsx (95%) rename src/renderer/components/{cluster-manager => cluster-view}/index.tsx (96%) rename src/renderer/components/{cluster-manager => cluster-view}/lens-views.ts (97%) rename src/renderer/components/{cluster-manager/cluster-manager.scss => root-frame.scss} (98%) rename src/renderer/{lens-app.tsx => root-frame.tsx} (61%) diff --git a/src/extensions/renderer-api/navigation.ts b/src/extensions/renderer-api/navigation.ts index f8a338ac3f..7fc321f620 100644 --- a/src/extensions/renderer-api/navigation.ts +++ b/src/extensions/renderer-api/navigation.ts @@ -25,7 +25,7 @@ import { navigation } from "../../renderer/navigation"; export type { PageParamInit, PageParam } from "../../renderer/navigation/page-param"; export { navigate, isActiveRoute } from "../../renderer/navigation/helpers"; export { hideDetails, showDetails, getDetailsUrl } from "../../renderer/components/kube-object/kube-object-details"; -export type { IURLParams } from "../../common/utils/buildUrl"; +export type { URLParams } from "../../common/utils/buildUrl"; // exporting to extensions-api version of helper without `isSystem` flag export function createPageParam(init: PageParamInit) { diff --git a/src/renderer/bootstrap.tsx b/src/renderer/bootstrap.tsx index 0a59d06928..ae575066e8 100644 --- a/src/renderer/bootstrap.tsx +++ b/src/renderer/bootstrap.tsx @@ -37,8 +37,8 @@ import { ExtensionDiscovery } from "../extensions/extension-discovery"; import { ExtensionLoader } from "../extensions/extension-loader"; import { ExtensionsStore } from "../extensions/extensions-store"; import { FilesystemProvisionerStore } from "../main/extension-filesystem"; -import { App } from "./components/app"; -import { LensApp } from "./lens-app"; +import { ClusterFrame } from "./components/cluster-frame"; +import { RootFrame } from "./root-frame"; import { ThemeStore } from "./theme.store"; import { HelmRepoManager } from "../main/helm/helm-repo-manager"; import { ExtensionInstallationStateStore } from "./components/+extensions/extension-install.store"; @@ -127,4 +127,4 @@ export async function bootstrap(App: AppComponent) { } // run -bootstrap(process.isMainFrame ? LensApp : App); +bootstrap(process.isMainFrame ? RootFrame : ClusterFrame); diff --git a/src/renderer/components/cluster-manager/bottom-bar.test.tsx b/src/renderer/components/bottom-bar/__test__/bottom-bar.test.tsx similarity index 96% rename from src/renderer/components/cluster-manager/bottom-bar.test.tsx rename to src/renderer/components/bottom-bar/__test__/bottom-bar.test.tsx index bf6c11245e..d77549f132 100644 --- a/src/renderer/components/cluster-manager/bottom-bar.test.tsx +++ b/src/renderer/components/bottom-bar/__test__/bottom-bar.test.tsx @@ -29,8 +29,8 @@ jest.mock("electron", () => ({ }, })); -import { BottomBar } from "./bottom-bar"; -import { StatusBarRegistry } from "../../../extensions/registries"; +import { BottomBar } from "../bottom-bar"; +import { StatusBarRegistry } from "../../../../extensions/registries"; describe("", () => { beforeEach(() => { diff --git a/src/renderer/components/cluster-manager/bottom-bar.scss b/src/renderer/components/bottom-bar/bottom-bar.scss similarity index 100% rename from src/renderer/components/cluster-manager/bottom-bar.scss rename to src/renderer/components/bottom-bar/bottom-bar.scss diff --git a/src/renderer/components/cluster-manager/bottom-bar.tsx b/src/renderer/components/bottom-bar/bottom-bar.tsx similarity index 100% rename from src/renderer/components/cluster-manager/bottom-bar.tsx rename to src/renderer/components/bottom-bar/bottom-bar.tsx diff --git a/src/renderer/components/bottom-bar/index.ts b/src/renderer/components/bottom-bar/index.ts new file mode 100644 index 0000000000..bb6858b12b --- /dev/null +++ b/src/renderer/components/bottom-bar/index.ts @@ -0,0 +1,22 @@ +/** + * Copyright (c) 2021 OpenLens Authors + * + * Permission is hereby granted, free of charge, to any person obtaining a copy of + * this software and associated documentation files (the "Software"), to deal in + * the Software without restriction, including without limitation the rights to + * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of + * the Software, and to permit persons to whom the Software is furnished to do so, + * subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS + * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR + * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER + * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN + * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + */ + +export * from "./bottom-bar"; diff --git a/src/renderer/components/app.tsx b/src/renderer/components/cluster-frame.tsx similarity index 99% rename from src/renderer/components/app.tsx rename to src/renderer/components/cluster-frame.tsx index e0dc16a47c..59e09d338e 100755 --- a/src/renderer/components/app.tsx +++ b/src/renderer/components/cluster-frame.tsx @@ -71,7 +71,7 @@ import { namespaceStore } from "./+namespaces/namespace.store"; import * as routes from "../../common/routes"; @observer -export class App extends React.Component { +export class ClusterFrame extends React.Component { static async init() { const frameId = webFrame.routingId; const clusterId = getHostedClusterId(); diff --git a/src/renderer/components/cluster-manager/cluster-manager.tsx b/src/renderer/components/cluster-manager/cluster-manager.tsx deleted file mode 100644 index 4bd14e7805..0000000000 --- a/src/renderer/components/cluster-manager/cluster-manager.tsx +++ /dev/null @@ -1,68 +0,0 @@ -/** - * Copyright (c) 2021 OpenLens Authors - * - * Permission is hereby granted, free of charge, to any person obtaining a copy of - * this software and associated documentation files (the "Software"), to deal in - * the Software without restriction, including without limitation the rights to - * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of - * the Software, and to permit persons to whom the Software is furnished to do so, - * subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS - * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR - * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER - * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN - * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. - */ - -import "./cluster-manager.scss"; - -import React from "react"; -import { Redirect, Route, Switch } from "react-router"; -import { observer } from "mobx-react"; -import { BottomBar } from "./bottom-bar"; -import { Catalog } from "../+catalog"; -import { Preferences } from "../+preferences"; -import { AddCluster } from "../+add-cluster"; -import { ClusterView } from "./cluster-view"; -import { GlobalPageRegistry } from "../../../extensions/registries/page-registry"; -import { Extensions } from "../+extensions"; -import { HotbarMenu } from "../hotbar/hotbar-menu"; -import { EntitySettings } from "../+entity-settings"; -import { Welcome } from "../+welcome"; -import * as routes from "../../../common/routes"; - -@observer -export class ClusterManager extends React.Component { - render() { - return ( -
-
-
- - - - - - - - - { - GlobalPageRegistry.getInstance().getItems() - .map(({ url, components: { Page } }) => ( - - )) - } - - -
- - -
- ); - } -} diff --git a/src/renderer/components/cluster-manager/cluster-status.scss b/src/renderer/components/cluster-view/cluster-connection-status.scss similarity index 97% rename from src/renderer/components/cluster-manager/cluster-status.scss rename to src/renderer/components/cluster-view/cluster-connection-status.scss index d11ac6e496..1909257246 100644 --- a/src/renderer/components/cluster-manager/cluster-status.scss +++ b/src/renderer/components/cluster-view/cluster-connection-status.scss @@ -19,7 +19,7 @@ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ -.ClusterStatus { +.ClusterConnectionStatus { --flex-gap: #{$padding * 2}; position: relative; @@ -39,4 +39,4 @@ --size: 70px; margin: auto; } -} \ No newline at end of file +} diff --git a/src/renderer/components/cluster-manager/cluster-status.tsx b/src/renderer/components/cluster-view/cluster-connection-status.tsx similarity index 97% rename from src/renderer/components/cluster-manager/cluster-status.tsx rename to src/renderer/components/cluster-view/cluster-connection-status.tsx index 565fee6107..d7c8f64970 100644 --- a/src/renderer/components/cluster-manager/cluster-status.tsx +++ b/src/renderer/components/cluster-view/cluster-connection-status.tsx @@ -19,10 +19,10 @@ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ -import type { KubeAuthProxyLog } from "../../../main/kube-auth-proxy"; +import "./cluster-connection-status.scss"; -import "./cluster-status.scss"; import React from "react"; +import type { KubeAuthProxyLog } from "../../../main/kube-auth-proxy"; import { observer } from "mobx-react"; import { ipcRenderer } from "electron"; import { computed, observable } from "mobx"; @@ -41,7 +41,7 @@ interface Props { } @observer -export class ClusterStatus extends React.Component { +export class ClusterConnectionStatus extends React.Component { @observable authOutput: KubeAuthProxyLog[] = []; @observable isReconnecting = false; diff --git a/src/renderer/components/cluster-manager/cluster-view.scss b/src/renderer/components/cluster-view/cluster-view.scss similarity index 100% rename from src/renderer/components/cluster-manager/cluster-view.scss rename to src/renderer/components/cluster-view/cluster-view.scss diff --git a/src/renderer/components/cluster-manager/cluster-view.tsx b/src/renderer/components/cluster-view/cluster-view.tsx similarity index 95% rename from src/renderer/components/cluster-manager/cluster-view.tsx rename to src/renderer/components/cluster-view/cluster-view.tsx index 08d67a5312..e543df2d25 100644 --- a/src/renderer/components/cluster-manager/cluster-view.tsx +++ b/src/renderer/components/cluster-view/cluster-view.tsx @@ -24,7 +24,7 @@ import React from "react"; import { reaction } from "mobx"; import { disposeOnUnmount, observer } from "mobx-react"; import type { RouteComponentProps } from "react-router"; -import { ClusterStatus } from "./cluster-status"; +import { ClusterConnectionStatus } from "./cluster-connection-status"; import { hasLoadedView, initView, lensViews, refreshViews } from "./lens-views"; import type { Cluster } from "../../../main/cluster"; import { ClusterStore } from "../../../common/cluster-store"; @@ -95,7 +95,7 @@ export class ClusterView extends React.Component { return (
{showStatus && ( - + )}
); diff --git a/src/renderer/components/cluster-manager/index.tsx b/src/renderer/components/cluster-view/index.tsx similarity index 96% rename from src/renderer/components/cluster-manager/index.tsx rename to src/renderer/components/cluster-view/index.tsx index c372d23b40..b36d7a0119 100644 --- a/src/renderer/components/cluster-manager/index.tsx +++ b/src/renderer/components/cluster-view/index.tsx @@ -19,4 +19,4 @@ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ -export * from "./cluster-manager"; +export * from "./cluster-view"; diff --git a/src/renderer/components/cluster-manager/lens-views.ts b/src/renderer/components/cluster-view/lens-views.ts similarity index 97% rename from src/renderer/components/cluster-manager/lens-views.ts rename to src/renderer/components/cluster-view/lens-views.ts index 49e535df60..1ff338032e 100644 --- a/src/renderer/components/cluster-manager/lens-views.ts +++ b/src/renderer/components/cluster-view/lens-views.ts @@ -65,7 +65,7 @@ export async function initView(clusterId: ClusterId) { await autoCleanOnRemove(clusterId, iframe); } -export async function autoCleanOnRemove(clusterId: ClusterId, iframe: HTMLIFrameElement) { +async function autoCleanOnRemove(clusterId: ClusterId, iframe: HTMLIFrameElement) { await when(() => { const cluster = ClusterStore.getInstance().getById(clusterId); diff --git a/src/renderer/components/cluster-manager/cluster-manager.scss b/src/renderer/components/root-frame.scss similarity index 98% rename from src/renderer/components/cluster-manager/cluster-manager.scss rename to src/renderer/components/root-frame.scss index 0c7c450f1b..69c1cc9152 100644 --- a/src/renderer/components/cluster-manager/cluster-manager.scss +++ b/src/renderer/components/root-frame.scss @@ -19,7 +19,7 @@ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ -.ClusterManager { +.root-frame { --bottom-bar-height: 22px; display: grid; diff --git a/src/renderer/lens-app.tsx b/src/renderer/root-frame.tsx similarity index 61% rename from src/renderer/lens-app.tsx rename to src/renderer/root-frame.tsx index afec8bfde6..a2f3656d10 100644 --- a/src/renderer/lens-app.tsx +++ b/src/renderer/root-frame.tsx @@ -20,11 +20,20 @@ */ import "../common/system-ca"; +import "./components/root-frame.scss"; + import React from "react"; -import { Route, Router, Switch } from "react-router"; +import { Redirect, Route, Router, Switch } from "react-router"; import { observer } from "mobx-react"; import { history } from "./navigation"; -import { ClusterManager } from "./components/cluster-manager"; +import { Catalog } from "./components/+catalog"; +import { Preferences } from "./components/+preferences"; +import { AddCluster } from "./components/+add-cluster"; +import { ClusterView } from "./components/cluster-view"; +import { GlobalPageRegistry } from "../extensions/registries/page-registry"; +import { Extensions } from "./components/+extensions"; +import { EntitySettings } from "./components/+entity-settings"; +import { Welcome } from "./components/+welcome"; import { ErrorBoundary } from "./components/error-boundary"; import { Notifications } from "./components/notifications"; import { ConfirmDialog } from "./components/confirm-dialog"; @@ -38,9 +47,12 @@ import { IpcRendererNavigationEvents } from "./navigation/events"; import { catalogEntityRegistry } from "./api/catalog-entity-registry"; import { CommandRegistry } from "../extensions/registries"; import { reaction } from "mobx"; +import { HotbarMenu } from "./components/hotbar/hotbar-menu"; +import { BottomBar } from "./components/bottom-bar"; +import * as routes from "../common/routes"; @observer -export class LensApp extends React.Component { +export class RootFrame extends React.Component { static async init() { catalogEntityRegistry.init(); ExtensionLoader.getInstance().loadOnClusterManagerRenderer(); @@ -68,9 +80,30 @@ export class LensApp extends React.Component { return ( - - - +
+
+
+ + + + + + + + + { + GlobalPageRegistry.getInstance() + .getItems() + .map(({ url, components: { Page } }) => ( + + )) + } + + +
+ + +