Upgrade to Electron 14.2.4 (#4625)

Co-authored-by: Sebastian Malton <sebastian@malton.name>
Co-authored-by: Jim Ehrismann <jehrismann@mirantis.com>

src/renderer/api/catalog-entity-registry.ts

@@ -4,7 +4,7 @@
  */
 
 import { computed, observable, makeObservable, action } from "mobx";
-import { catalogEntityRunListener, ipcRendererOn } from "../../common/ipc";
+import { ipcRendererOn } from "../../common/ipc";
 import { CatalogCategory, CatalogEntity, CatalogEntityData, catalogCategoryRegistry, CatalogCategoryRegistry, CatalogEntityKindData } from "../../common/catalog";
 import "../../common/catalog-entities";
 import type { Cluster } from "../../common/cluster/cluster";
@@ -14,7 +14,7 @@ import { once } from "lodash";
 import logger from "../../common/logger";
 import { CatalogRunEvent } from "../../common/catalog/catalog-run-event";
 import { ipcRenderer } from "electron";
-import { CatalogIpcEvents } from "../../common/ipc/catalog";
+import { catalogInitChannel, catalogItemsChannel, catalogEntityRunListener } from "../../common/ipc/catalog";
 import { navigate } from "../navigation";
 import { isMainFrame } from "process";
 
@@ -79,12 +79,12 @@ export class CatalogEntityRegistry {
   }
 
   init() {
-    ipcRendererOn(CatalogIpcEvents.ITEMS, (event, items: (CatalogEntityData & CatalogEntityKindData)[]) => {
+    ipcRendererOn(catalogItemsChannel, (event, items: (CatalogEntityData & CatalogEntityKindData)[]) => {
       this.updateItems(items);
     });
 
     // Make sure that we get items ASAP and not the next time one of them changes
-    ipcRenderer.send(CatalogIpcEvents.INIT);
+    ipcRenderer.send(catalogInitChannel);
 
     if (isMainFrame) {
       ipcRendererOn(catalogEntityRunListener, (event, id: string) => {

src/renderer/components/+extensions/extensions.tsx

@@ -27,12 +27,11 @@ import enableExtensionInjectable from "./enable-extension/enable-extension.injec
 import disableExtensionInjectable from "./disable-extension/disable-extension.injectable";
 import confirmUninstallExtensionInjectable from "./confirm-uninstall-extension/confirm-uninstall-extension.injectable";
 import installFromInputInjectable from "./install-from-input/install-from-input.injectable";
-import installFromSelectFileDialogInjectable from "./install-from-select-file-dialog/install-from-select-file-dialog.injectable";
+import installFromSelectFileDialogInjectable from "./install-from-select-file-dialog.injectable";
 import type { LensExtensionId } from "../../../extensions/lens-extension";
 import installOnDropInjectable from "./install-on-drop/install-on-drop.injectable";
 import { supportedExtensionFormats } from "./supported-extension-formats";
-import extensionInstallationStateStoreInjectable
-  from "../../../extensions/extension-installation-state-store/extension-installation-state-store.injectable";
+import extensionInstallationStateStoreInjectable from "../../../extensions/extension-installation-state-store/extension-installation-state-store.injectable";
 import type { ExtensionInstallationStateStore } from "../../../extensions/extension-installation-state-store/extension-installation-state-store";
 
 interface Dependencies {
@@ -107,22 +106,15 @@ class NonInjectedExtensions extends React.Component<Dependencies> {
   }
 }
 
-export const Extensions = withInjectables<Dependencies>(
-  NonInjectedExtensions,
-  {
-    getProps: (di) => ({
-      userExtensions: di.inject(userExtensionsInjectable),
-      enableExtension: di.inject(enableExtensionInjectable),
-      disableExtension: di.inject(disableExtensionInjectable),
-      confirmUninstallExtension: di.inject(confirmUninstallExtensionInjectable),
-      installFromInput: di.inject(installFromInputInjectable),
-      installOnDrop: di.inject(installOnDropInjectable),
-
-      installFromSelectFileDialog: di.inject(
-        installFromSelectFileDialogInjectable,
-      ),
-
-      extensionInstallationStateStore: di.inject(extensionInstallationStateStoreInjectable),
-    }),
-  },
-);
+export const Extensions = withInjectables<Dependencies>(NonInjectedExtensions, {
+  getProps: (di) => ({
+    userExtensions: di.inject(userExtensionsInjectable),
+    enableExtension: di.inject(enableExtensionInjectable),
+    disableExtension: di.inject(disableExtensionInjectable),
+    confirmUninstallExtension: di.inject(confirmUninstallExtensionInjectable),
+    installFromInput: di.inject(installFromInputInjectable),
+    installOnDrop: di.inject(installOnDropInjectable),
+    installFromSelectFileDialog: di.inject(installFromSelectFileDialogInjectable),
+    extensionInstallationStateStore: di.inject(extensionInstallationStateStoreInjectable),
+  }),
+});

src/renderer/components/+extensions/install-from-select-file-dialog.injectable.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
+import { requestOpenFilePickingDialog } from "../../ipc";
+import { supportedExtensionFormats } from "./supported-extension-formats";
+import attemptInstallsInjectable from "./attempt-installs/attempt-installs.injectable";
+import directoryForDownloadsInjectable from "../../../common/app-paths/directory-for-downloads/directory-for-downloads.injectable";
+import { bind } from "../../utils";
+
+interface Dependencies {
+  attemptInstalls: (filePaths: string[]) => Promise<void>
+  directoryForDownloads: string
+}
+
+async function installFromSelectFileDialog({ attemptInstalls, directoryForDownloads }: Dependencies) {
+  const { canceled, filePaths } = await requestOpenFilePickingDialog({
+    defaultPath: directoryForDownloads,
+    properties: ["openFile", "multiSelections"],
+    message: `Select extensions to install (formats: ${supportedExtensionFormats.join(", ")}), `,
+    buttonLabel: "Use configuration",
+    filters: [{ name: "tarball", extensions: supportedExtensionFormats }],
+  });
+
+  if (!canceled) {
+    await attemptInstalls(filePaths);
+  }
+}
+
+const installFromSelectFileDialogInjectable = getInjectable({
+  instantiate: (di) => bind(installFromSelectFileDialog, null, {
+    attemptInstalls: di.inject(attemptInstallsInjectable),
+    directoryForDownloads: di.inject(directoryForDownloadsInjectable),
+  }),
+  lifecycle: lifecycleEnum.singleton,
+});
+
+export default installFromSelectFileDialogInjectable;

src/renderer/components/+extensions/install-from-select-file-dialog/install-from-select-file-dialog.injectable.ts

@@ -1,20 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
-import { installFromSelectFileDialog } from "./install-from-select-file-dialog";
-import attemptInstallsInjectable from "../attempt-installs/attempt-installs.injectable";
-import directoryForDownloadsInjectable from "../../../../common/app-paths/directory-for-downloads/directory-for-downloads.injectable";
-
-const installFromSelectFileDialogInjectable = getInjectable({
-  instantiate: (di) =>
-    installFromSelectFileDialog({
-      attemptInstalls: di.inject(attemptInstallsInjectable),
-      directoryForDownloads: di.inject(directoryForDownloadsInjectable),
-    }),
-
-  lifecycle: lifecycleEnum.singleton,
-});
-
-export default installFromSelectFileDialogInjectable;

src/renderer/components/+extensions/install-from-select-file-dialog/install-from-select-file-dialog.ts

@@ -1,29 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-import { dialog } from "../../../remote-helpers";
-import { supportedExtensionFormats } from "../supported-extension-formats";
-
-interface Dependencies {
-  attemptInstalls: (filePaths: string[]) => Promise<void>
-  directoryForDownloads: string
-}
-
-export const installFromSelectFileDialog =
-  ({ attemptInstalls, directoryForDownloads }: Dependencies) =>
-    async () => {
-      const { canceled, filePaths } = await dialog.showOpenDialog({
-        defaultPath: directoryForDownloads,
-        properties: ["openFile", "multiSelections"],
-        message: `Select extensions to install (formats: ${supportedExtensionFormats.join(
-          ", ",
-        )}), `,
-        buttonLabel: "Use configuration",
-        filters: [{ name: "tarball", extensions: supportedExtensionFormats }],
-      });
-
-      if (!canceled) {
-        await attemptInstalls(filePaths);
-      }
-    };

src/renderer/components/+preferences/add-helm-repo-dialog.tsx

@@ -19,7 +19,7 @@ import { SubTitle } from "../layout/sub-title";
 import { Icon } from "../icon";
 import { Notifications } from "../notifications";
 import { HelmRepo, HelmRepoManager } from "../../../main/helm/helm-repo-manager";
-import { dialog } from "../../remote-helpers";
+import { requestOpenFilePickingDialog } from "../../ipc";
 
 interface Props extends Partial<DialogProps> {
   onAddRepo: Function
@@ -73,7 +73,7 @@ export class AddHelmRepoDialog extends React.Component<Props> {
   }
 
   async selectFileDialog(type: FileType, fileFilter: FileFilter) {
-    const { canceled, filePaths } = await dialog.showOpenDialog({
+    const { canceled, filePaths } = await requestOpenFilePickingDialog({
       defaultPath: this.getFilePath(type),
       properties: ["openFile", "showHiddenFiles"],
       message: `Select file`,

src/renderer/components/+workloads-pods/__tests__/pod-tolerations.test.tsx

@@ -10,8 +10,7 @@ import type { IToleration } from "../../../../common/k8s-api/workload-kube-objec
 import { PodTolerations } from "../pod-tolerations";
 import { getDiForUnitTesting } from "../../../getDiForUnitTesting";
 import { DiRender, renderFor } from "../../test-utils/renderFor";
-import directoryForLensLocalStorageInjectable
-  from "../../../../common/directory-for-lens-local-storage/directory-for-lens-local-storage.injectable";
+import directoryForLensLocalStorageInjectable from "../../../../common/directory-for-lens-local-storage/directory-for-lens-local-storage.injectable";
 
 jest.mock("electron", () => ({
   app: {

src/renderer/components/activate-entity-command/activate-entity-command.tsx

@@ -7,7 +7,8 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import { computed, IComputedValue } from "mobx";
 import { observer } from "mobx-react";
 import React from "react";
-import { broadcastMessage, catalogEntityRunListener } from "../../../common/ipc";
+import { broadcastMessage } from "../../../common/ipc";
+import { catalogEntityRunListener } from "../../../common/ipc/catalog";
 import type { CatalogEntity } from "../../api/catalog-entity";
 import { catalogEntityRegistry } from "../../api/catalog-entity-registry";
 import commandOverlayInjectable from "../command-palette/command-overlay.injectable";

src/renderer/components/cluster-manager/cluster-status.tsx

@@ -8,8 +8,7 @@ import styles from "./cluster-status.module.scss";
 import { computed, observable, makeObservable } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import React from "react";
-import { clusterActivateHandler } from "../../../common/cluster-ipc";
-import { ipcRendererOn, requestMain } from "../../../common/ipc";
+import { ipcRendererOn } from "../../../common/ipc";
 import type { Cluster } from "../../../common/cluster/cluster";
 import { cssNames, IClassName } from "../../utils";
 import { Button } from "../button";
@@ -19,6 +18,7 @@ import { navigate } from "../../navigation";
 import { entitySettingsURL } from "../../../common/routes";
 import type { KubeAuthUpdate } from "../../../common/cluster-types";
 import { catalogEntityRegistry } from "../../api/catalog-entity-registry";
+import { requestClusterActivation } from "../../ipc";
 
 interface Props {
   className?: IClassName;
@@ -60,7 +60,7 @@ export class ClusterStatus extends React.Component<Props> {
     this.isReconnecting = true;
 
     try {
-      await requestMain(clusterActivateHandler, this.cluster.id, true);
+      await requestClusterActivation(this.cluster.id, true);
     } catch (error) {
       this.authOutput.push({
         message: error.toString(),

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

@@ -12,11 +12,10 @@ import { ClusterStatus } from "./cluster-status";
 import { ClusterFrameHandler } from "./lens-views";
 import type { Cluster } from "../../../common/cluster/cluster";
 import { ClusterStore } from "../../../common/cluster-store/cluster-store";
-import { requestMain } from "../../../common/ipc";
-import { clusterActivateHandler } from "../../../common/cluster-ipc";
 import { catalogEntityRegistry } from "../../api/catalog-entity-registry";
 import { navigate } from "../../navigation";
 import { catalogURL, ClusterViewRouteParams } from "../../../common/routes";
+import { requestClusterActivation } from "../../ipc";
 
 interface Props extends RouteComponentProps<ClusterViewRouteParams> {
 }
@@ -58,7 +57,7 @@ export class ClusterView extends React.Component<Props> {
       reaction(() => this.clusterId, async (clusterId) => {
         ClusterFrameHandler.getInstance().setVisibleCluster(clusterId);
         ClusterFrameHandler.getInstance().initView(clusterId);
-        requestMain(clusterActivateHandler, clusterId, false); // activate and fetch cluster's state from main
+        requestClusterActivation(clusterId, false); // activate and fetch cluster's state from main
         catalogEntityRegistry.activeEntity = clusterId;
       }, {
         fireImmediately: true,

src/renderer/components/cluster-manager/lens-views.ts

@@ -5,7 +5,7 @@
 
 import { action, IReactionDisposer, makeObservable, observable, when } from "mobx";
 import logger from "../../../main/logger";
-import { clusterVisibilityHandler } from "../../../common/cluster-ipc";
+import { clusterVisibilityHandler } from "../../../common/ipc/cluster";
 import { ClusterStore } from "../../../common/cluster-store/cluster-store";
 import type { ClusterId } from "../../../common/cluster-types";
 import { getClusterFrameUrl, Singleton } from "../../utils";

src/renderer/components/delete-cluster-dialog/delete-cluster-dialog.tsx

@@ -12,8 +12,6 @@ import { Button } from "../button";
 import type { KubeConfig } from "@kubernetes/client-node";
 import type { Cluster } from "../../../common/cluster/cluster";
 import { saveKubeconfig } from "./save-config";
-import { requestMain } from "../../../common/ipc";
-import { clusterClearDeletingHandler, clusterDeleteHandler, clusterSetDeletingHandler } from "../../../common/cluster-ipc";
 import { Notifications } from "../notifications";
 import { HotbarStore } from "../../../common/hotbar-store";
 import { boundMethod } from "autobind-decorator";
@@ -21,6 +19,7 @@ import { Dialog } from "../dialog";
 import { Icon } from "../icon";
 import { Select } from "../select";
 import { Checkbox } from "../checkbox";
+import { requestClearClusterAsDeleting, requestDeleteCluster, requestSetClusterAsDeleting } from "../../ipc";
 
 type DialogState = {
   isOpen: boolean,
@@ -87,18 +86,18 @@ export class DeleteClusterDialog extends React.Component {
   async onDelete() {
     const { cluster, config } = dialogState;
 
-    await requestMain(clusterSetDeletingHandler, cluster.id);
+    await requestSetClusterAsDeleting(cluster.id);
     this.removeContext();
     this.changeCurrentContext();
 
     try {
       await saveKubeconfig(config, cluster.kubeConfigPath);
       HotbarStore.getInstance().removeAllHotbarItems(cluster.id);
-      await requestMain(clusterDeleteHandler, cluster.id);
+      await requestDeleteCluster(cluster.id);
     } catch(error) {
       Notifications.error(`Cannot remove cluster, failed to process config file. ${error}`);
     } finally {
-      await requestMain(clusterClearDeletingHandler, cluster.id);
+      await requestClearClusterAsDeleting(cluster.id);
     }
 
     this.onClose();

src/renderer/components/layout/top-bar/top-bar-win-linux.test.tsx

@@ -7,18 +7,17 @@ import React from "react";
 import { fireEvent } from "@testing-library/react";
 import "@testing-library/jest-dom/extend-expect";
 import { TopBar } from "./top-bar";
-import { IpcMainWindowEvents } from "../../../../main/window-manager";
-import { broadcastMessage } from "../../../../common/ipc";
 import * as vars from "../../../../common/vars";
 import { getDiForUnitTesting } from "../../../getDiForUnitTesting";
 import { DiRender, renderFor } from "../../test-utils/renderFor";
-import directoryForUserDataInjectable
-  from "../../../../common/app-paths/directory-for-user-data/directory-for-user-data.injectable";
+import directoryForUserDataInjectable from "../../../../common/app-paths/directory-for-user-data/directory-for-user-data.injectable";
 import mockFs from "mock-fs";
+import { emitOpenAppMenuAsContextMenu, requestWindowAction } from "../../../ipc";
 
 const mockConfig = vars as { isWindows: boolean; isLinux: boolean };
 
 jest.mock("../../../../common/ipc");
+jest.mock("../../../ipc");
 
 jest.mock("../../../../common/vars", () => {
   const SemVer = require("semver").SemVer;
@@ -33,23 +32,6 @@ jest.mock("../../../../common/vars", () => {
   };
 });
 
-const mockMinimize = jest.fn();
-const mockMaximize = jest.fn();
-const mockUnmaximize = jest.fn();
-const mockClose = jest.fn();
-
-jest.mock("@electron/remote", () => {
-  return {
-    getCurrentWindow: () => ({
-      minimize: () => mockMinimize(),
-      maximize: () => mockMaximize(),
-      unmaximize: () => mockUnmaximize(),
-      close: () => mockClose(),
-      isMaximized: () => false,
-    }),
-  };
-});
-
 describe("<TopBar/> in Windows and Linux", () => {
   let render: DiRender;
 
@@ -104,15 +86,15 @@ describe("<TopBar/> in Windows and Linux", () => {
     const close = getByTestId("window-close");
 
     fireEvent.click(menu);
-    expect(broadcastMessage).toHaveBeenCalledWith(IpcMainWindowEvents.OPEN_CONTEXT_MENU);
+    expect(emitOpenAppMenuAsContextMenu).toHaveBeenCalledWith();
 
     fireEvent.click(minimize);
-    expect(mockMinimize).toHaveBeenCalled();
+    expect(requestWindowAction).toHaveBeenCalledWith("minimize");
 
     fireEvent.click(maximize);
-    expect(mockMaximize).toHaveBeenCalled();
+    expect(requestWindowAction).toHaveBeenCalledWith("toggle-maximize");
 
     fireEvent.click(close);
-    expect(mockClose).toHaveBeenCalled();
+    expect(requestWindowAction).toHaveBeenCalledWith("close");
   });
 });

src/renderer/components/layout/top-bar/top-bar.test.tsx

@@ -12,8 +12,7 @@ import type { ConfigurableDependencyInjectionContainer } from "@ogre-tools/injec
 import { DiRender, renderFor } from "../../test-utils/renderFor";
 import topBarItemsInjectable from "./top-bar-items/top-bar-items.injectable";
 import { computed } from "mobx";
-import directoryForUserDataInjectable
-  from "../../../../common/app-paths/directory-for-user-data/directory-for-user-data.injectable";
+import directoryForUserDataInjectable from "../../../../common/app-paths/directory-for-user-data/directory-for-user-data.injectable";
 import mockFs from "mock-fs";
 
 jest.mock("../../../../common/vars", () => {
@@ -27,6 +26,9 @@ jest.mock("../../../../common/vars", () => {
   };
 });
 
+const goBack = jest.fn();
+const goForward = jest.fn();
+
 jest.mock(
   "electron",
   () => ({
@@ -42,6 +44,25 @@ jest.mock(
           }
         },
       ),
+      invoke: jest.fn(
+        (channel: string, action: string) => {
+          console.log("channel", channel, action);
+
+          if (channel !== "window:window-action") return;
+
+          switch(action) {
+            case "back": {
+              goBack();
+              break;
+            }
+
+            case "forward": {
+              goForward();
+              break;
+            }
+          }
+        },
+      ),
     },
   }),
 );
@@ -50,24 +71,6 @@ jest.mock("../../+catalog", () => ({
   previousActiveTab: jest.fn(),
 }));
 
-const goBack = jest.fn();
-const goForward = jest.fn();
-
-jest.mock("@electron/remote", () => {
-  return {
-    webContents: {
-      getAllWebContents: () => {
-        return [{
-          getType: () => "window",
-          goBack,
-          goForward,
-        }];
-      },
-    },
-    getCurrentWindow: () => jest.fn(),
-  };
-});
-
 describe("<TopBar/>", () => {
   let di: ConfigurableDependencyInjectionContainer;
   let render: DiRender;

src/renderer/components/layout/top-bar/top-bar.tsx

@@ -4,22 +4,22 @@
  */
 
 import styles from "./top-bar.module.scss";
-import React, { useEffect, useMemo, useRef } from "react";
+import React, { useEffect, useRef } from "react";
 import { observer } from "mobx-react";
 import type { IComputedValue } from "mobx";
 import { Icon } from "../../icon";
-import { webContents, getCurrentWindow } from "@electron/remote";
 import { observable } from "mobx";
-import { broadcastMessage, ipcRendererOn } from "../../../../common/ipc";
+import { ipcRendererOn } from "../../../../common/ipc";
 import { watchHistoryState } from "../../../remote-helpers/history-updater";
 import { isActiveRoute, navigate } from "../../../navigation";
 import { catalogRoute, catalogURL } from "../../../../common/routes";
-import { IpcMainWindowEvents } from "../../../../main/window-manager";
 import { isLinux, isWindows } from "../../../../common/vars";
 import { cssNames } from "../../../utils";
 import topBarItemsInjectable from "./top-bar-items/top-bar-items.injectable";
 import { withInjectables } from "@ogre-tools/injectable-react";
 import type { TopBarRegistration } from "./top-bar-registration";
+import { emitOpenAppMenuAsContextMenu, requestWindowAction } from "../../../ipc";
+import { WindowAction } from "../../../../common/ipc/window";
 
 interface Props extends React.HTMLAttributes<any> {}
 
@@ -40,10 +40,9 @@ ipcRendererOn("history:can-go-forward", (event, state: boolean) => {
 
 const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies) => {
   const elem = useRef<HTMLDivElement>();
-  const window = useMemo(() => getCurrentWindow(), []);
 
-  const openContextMenu = () => {
-    broadcastMessage(IpcMainWindowEvents.OPEN_CONTEXT_MENU);
+  const openAppContextMenu = () => {
+    emitOpenAppMenuAsContextMenu();
   };
 
   const goHome = () => {
@@ -51,11 +50,11 @@ const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies)
   };
 
   const goBack = () => {
-    webContents.getAllWebContents().find((webContent) => webContent.getType() === "window")?.goBack();
+    requestWindowAction(WindowAction.GO_BACK);
   };
 
   const goForward = () => {
-    webContents.getAllWebContents().find((webContent) => webContent.getType() === "window")?.goForward();
+    requestWindowAction(WindowAction.GO_FORWARD);
   };
 
   const windowSizeToggle = (evt: React.MouseEvent) => {
@@ -68,34 +67,30 @@ const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies)
   };
 
   const minimizeWindow = () => {
-    window.minimize();
+    requestWindowAction(WindowAction.MINIMIZE);
   };
 
   const toggleMaximize = () => {
-    if (window.isMaximized()) {
-      window.unmaximize();
-    } else {
-      window.maximize();
-    }
+    requestWindowAction(WindowAction.TOGGLE_MAXIMIZE);
   };
 
   const closeWindow = () => {
-    window.close();
+    requestWindowAction(WindowAction.CLOSE);
   };
 
-  useEffect(() => {
-    const disposer = watchHistoryState();
-
-    return () => disposer();
-  }, []);
+  useEffect(() => watchHistoryState(), []);
 
   return (
     <div className={styles.topBar} onDoubleClick={windowSizeToggle} ref={elem} {...rest}>
       <div className={styles.tools}>
         {(isWindows || isLinux) && (
           <div className={styles.winMenu}>
-            <div onClick={openContextMenu} data-testid="window-menu">
-              <svg width="12" height="12" viewBox="0 0 12 12" shapeRendering="crispEdges"><path fill="currentColor" d="M0,8.5h12v1H0V8.5z"/><path fill="currentColor" d="M0,5.5h12v1H0V5.5z"/><path fill="currentColor" d="M0,2.5h12v1H0V2.5z"/></svg>
+            <div onClick={openAppContextMenu} data-testid="window-menu">
+              <svg width="12" height="12" viewBox="0 0 12 12" shapeRendering="crispEdges">
+                <path fill="currentColor" d="M0,8.5h12v1H0V8.5z"/>
+                <path fill="currentColor" d="M0,5.5h12v1H0V5.5z"/>
+                <path fill="currentColor" d="M0,2.5h12v1H0V2.5z"/>
+              </svg>
             </div>
           </div>
         )}
@@ -127,12 +122,19 @@ const NonInjectedTopBar = (({ items, children, ...rest }: Props & Dependencies)
         {(isWindows || isLinux) && (
           <div className={cssNames(styles.windowButtons, { [styles.linuxButtons]: isLinux })}>
             <div className={styles.minimize} data-testid="window-minimize" onClick={minimizeWindow}>
-              <svg shapeRendering="crispEdges" viewBox="0 0 12 12"><rect fill="currentColor" width="10" height="1" x="1" y="9"></rect></svg></div>
+              <svg shapeRendering="crispEdges" viewBox="0 0 12 12">
+                <rect fill="currentColor" width="10" height="1" x="1" y="9" />
+              </svg>
+            </div>
             <div className={styles.maximize} data-testid="window-maximize" onClick={toggleMaximize}>
-              <svg shapeRendering="crispEdges" viewBox="0 0 12 12"><rect width="9" height="9" x="1.5" y="1.5" fill="none" stroke="currentColor"></rect></svg>
+              <svg shapeRendering="crispEdges" viewBox="0 0 12 12">
+                <rect width="9" height="9" x="1.5" y="1.5" fill="none" stroke="currentColor" />
+              </svg>
             </div>
             <div className={styles.close} data-testid="window-close" onClick={closeWindow}>
-              <svg shapeRendering="crispEdges" viewBox="0 0 12 12"><polygon fill="currentColor" points="11 1.576 6.583 6 11 10.424 10.424 11 6 6.583 1.576 11 1 10.424 5.417 6 1 1.576 1.576 1 6 5.417 10.424 1"></polygon></svg>
+              <svg shapeRendering="crispEdges" viewBox="0 0 12 12">
+                <polygon fill="currentColor" points="11 1.576 6.583 6 11 10.424 10.424 11 6 6.583 1.576 11 1 10.424 5.417 6 1 1.576 1.576 1 6 5.417 10.424 1" />
+              </svg>
             </div>
           </div>
         )}
@@ -162,7 +164,6 @@ const renderRegisteredItems = (items: TopBarRegistration[]) => (
 export const TopBar = withInjectables(observer(NonInjectedTopBar), {
   getProps: (di, props) => ({
     items: di.inject(topBarItemsInjectable),
-
     ...props,
   }),
 });

src/renderer/components/path-picker/path-picker.tsx

@@ -3,11 +3,12 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-import { FileFilter, OpenDialogOptions, remote } from "electron";
+import type { FileFilter, OpenDialogOptions } from "electron";
 import { observer } from "mobx-react";
 import React from "react";
 import { cssNames } from "../../utils";
 import { Button } from "../button";
+import { requestOpenFilePickingDialog } from "../../ipc";
 
 export interface PathPickOpts {
   label: string;
@@ -29,8 +30,8 @@ export interface PathPickerProps extends PathPickOpts {
 export class PathPicker extends React.Component<PathPickerProps> {
   static async pick(opts: PathPickOpts) {
     const { onPick, onCancel, label, ...dialogOptions } = opts;
-    const { dialog, BrowserWindow } = remote;
-    const { canceled, filePaths } = await dialog.showOpenDialog(BrowserWindow.getFocusedWindow(), {
+
+    const { canceled, filePaths } = await requestOpenFilePickingDialog({
       message: label,
       ...dialogOptions,
     });

src/renderer/frames/cluster-frame/cluster-frame.tsx

@@ -71,7 +71,6 @@ class NonInjectedClusterFrame extends React.Component<Dependencies> {
       this.props.subscribeStores([
         this.props.namespaceStore,
       ]),
-
       watchHistoryState(),
     ]);
   }

src/renderer/frames/cluster-frame/init-cluster-frame/init-cluster-frame.ts

@@ -6,8 +6,6 @@ import type { Cluster } from "../../../../common/cluster/cluster";
 import type { CatalogEntityRegistry } from "../../../api/catalog-entity-registry";
 import logger from "../../../../main/logger";
 import { Terminal } from "../../../components/dock/terminal/terminal";
-import { requestMain } from "../../../../common/ipc";
-import { clusterSetFrameIdHandler } from "../../../../common/cluster-ipc";
 import type { KubernetesCluster } from "../../../../common/catalog-entities";
 import { Notifications } from "../../../components/notifications";
 import type { AppEvent } from "../../../../common/app-event-bus/event-bus";
@@ -16,6 +14,7 @@ import { when } from "mobx";
 import { unmountComponentAtNode } from "react-dom";
 import type { ClusterFrameContext } from "../../../cluster-frame-context/cluster-frame-context";
 import { KubeObjectStore } from "../../../../common/k8s-api/kube-object.store";
+import { requestSetClusterFrameId } from "../../../ipc";
 
 interface Dependencies {
   hostedCluster: Cluster;
@@ -42,7 +41,7 @@ export const initClusterFrame =
       );
 
       await Terminal.preloadFonts();
-      await requestMain(clusterSetFrameIdHandler, hostedCluster.id);
+      await requestSetClusterFrameId(hostedCluster.id);
       await hostedCluster.whenReady; // cluster.activate() is done at this point
 
       catalogEntityRegistry.activeEntity = hostedCluster.id;

src/renderer/frames/root-frame/init-root-frame/init-root-frame.ts

@@ -3,12 +3,13 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { delay } from "../../../../common/utils";
-import { broadcastMessage, BundledExtensionsLoaded } from "../../../../common/ipc";
-import { registerIpcListeners } from "../../../ipc";
+import { broadcastMessage } from "../../../../common/ipc";
+import { registerIpcListeners } from "../../../ipc/register-listeners";
 import logger from "../../../../common/logger";
 import { unmountComponentAtNode } from "react-dom";
 import type { ExtensionLoading } from "../../../../extensions/extension-loader";
 import type { CatalogEntityRegistry } from "../../../api/catalog-entity-registry";
+import { bundledExtensionsLoaded } from "../../../../common/ipc/extension-handling";
 
 interface Dependencies {
   loadExtensions: () => Promise<ExtensionLoading[]>;
@@ -50,7 +51,7 @@ export const initRootFrame =
 
         await Promise.race([bundledExtensionsFinished, timeout]);
       } finally {
-        ipcRenderer.send(BundledExtensionsLoaded);
+        ipcRenderer.send(bundledExtensionsLoaded);
       }
 
       lensProtocolRouterRenderer.init();

src/renderer/hooks/index.ts

@@ -8,3 +8,4 @@
 export * from "./useOnUnmount";
 export * from "./useInterval";
 export * from "./useMutationObserver";
+export * from "./use-toggle";

src/renderer/hooks/use-toggle.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { useState } from "react";
+
+export function useToggle(initial: boolean): [value: boolean, toggle: () => void] {
+  const [val, setVal] = useState(initial);
+
+  return [val, () => setVal(!val)];
+}

src/renderer/ipc/index.ts

@@ -0,0 +1,83 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { ipcRenderer, OpenDialogOptions } from "electron";
+import { clusterActivateHandler, clusterClearDeletingHandler, clusterDeleteHandler, clusterDisconnectHandler, clusterKubectlApplyAllHandler, clusterKubectlDeleteAllHandler, clusterSetDeletingHandler, clusterSetFrameIdHandler, clusterStates } from "../../common/ipc/cluster";
+import type { ClusterId, ClusterState } from "../../common/cluster-types";
+import { windowActionHandleChannel, windowLocationChangedChannel, windowOpenAppMenuAsContextMenuChannel, type WindowAction } from "../../common/ipc/window";
+import { openFilePickingDialogChannel } from "../../common/ipc/dialog";
+import { extensionDiscoveryStateChannel, extensionLoaderFromMainChannel } from "../../common/ipc/extension-handling";
+import type { InstalledExtension } from "../../extensions/extension-discovery/extension-discovery";
+import type { LensExtensionId } from "../../extensions/lens-extension";
+import { toJS } from "../utils";
+import type { Location } from "history";
+
+function requestMain(channel: string, ...args: any[]) {
+  return ipcRenderer.invoke(channel, ...args.map(toJS));
+}
+
+function emitToMain(channel: string, ...args: any[]) {
+  return ipcRenderer.send(channel, ...args.map(toJS));
+}
+
+export function emitOpenAppMenuAsContextMenu(): void {
+  emitToMain(windowOpenAppMenuAsContextMenuChannel);
+}
+
+export function emitWindowLocationChanged(location: Location): void {
+  emitToMain(windowLocationChangedChannel, location);
+}
+
+export function requestWindowAction(type: WindowAction): Promise<void> {
+  return requestMain(windowActionHandleChannel, type);
+}
+
+export function requestOpenFilePickingDialog(opts: OpenDialogOptions): Promise<{ canceled: boolean; filePaths: string[]; }> {
+  return requestMain(openFilePickingDialogChannel, opts);
+}
+
+export function requestSetClusterFrameId(clusterId: ClusterId): Promise<void> {
+  return requestMain(clusterSetFrameIdHandler, clusterId);
+}
+
+export function requestClusterActivation(clusterId: ClusterId, force?: boolean): Promise<void> {
+  return requestMain(clusterActivateHandler, clusterId, force);
+}
+
+export function requestClusterDisconnection(clusterId: ClusterId, force?: boolean): Promise<void> {
+  return requestMain(clusterDisconnectHandler, clusterId, force);
+}
+
+export function requestSetClusterAsDeleting(clusterId: ClusterId): Promise<void> {
+  return requestMain(clusterSetDeletingHandler, clusterId);
+}
+
+export function requestClearClusterAsDeleting(clusterId: ClusterId): Promise<void> {
+  return requestMain(clusterClearDeletingHandler, clusterId);
+}
+
+export function requestDeleteCluster(clusterId: ClusterId): Promise<void> {
+  return requestMain(clusterDeleteHandler, clusterId);
+}
+
+export function requestInitialClusterStates(): Promise<{ id: string, state: ClusterState }[]> {
+  return requestMain(clusterStates);
+}
+
+export function requestKubectlApplyAll(clusterId: ClusterId, resources: string[], kubectlArgs: string[]): Promise<{ stderr?: string; stdout?: string }> {
+  return requestMain(clusterKubectlApplyAllHandler, clusterId, resources, kubectlArgs);
+}
+
+export function requestKubectlDeleteAll(clusterId: ClusterId, resources: string[], kubectlArgs: string[]): Promise<{ stderr?: string; stdout?: string }> {
+  return requestMain(clusterKubectlDeleteAllHandler, clusterId, resources, kubectlArgs);
+}
+
+export function requestInitialExtensionDiscovery(): Promise<{ isLoaded: boolean }> {
+  return requestMain(extensionDiscoveryStateChannel);
+}
+
+export function requestExtensionLoaderInitialState(): Promise<[LensExtensionId, InstalledExtension][]> {
+  return requestMain(extensionLoaderFromMainChannel);
+}

src/renderer/ipc/register-listeners.tsx

@@ -5,7 +5,7 @@
 
 import React from "react";
 import { ipcRenderer, IpcRendererEvent } from "electron";
-import { areArgsUpdateAvailableFromMain, UpdateAvailableChannel, onCorrect, UpdateAvailableFromMain, BackchannelArg, ClusterListNamespaceForbiddenChannel, isListNamespaceForbiddenArgs, ListNamespaceForbiddenArgs, HotbarTooManyItems, ipcRendererOn, AutoUpdateChecking, AutoUpdateNoUpdateAvailable } from "../../common/ipc";
+import { areArgsUpdateAvailableFromMain, UpdateAvailableChannel, onCorrect, UpdateAvailableFromMain, BackchannelArg, ipcRendererOn, AutoUpdateChecking, AutoUpdateNoUpdateAvailable } from "../../common/ipc";
 import { Notifications, notificationsStore } from "../components/notifications";
 import { Button } from "../components/button";
 import { isMac } from "../../common/vars";
@@ -13,6 +13,8 @@ import { ClusterStore } from "../../common/cluster-store/cluster-store";
 import { navigate } from "../navigation";
 import { entitySettingsURL } from "../../common/routes";
 import { defaultHotbarCells } from "../../common/hotbar-types";
+import { type ListNamespaceForbiddenArgs, clusterListNamespaceForbiddenChannel, isListNamespaceForbiddenArgs } from "../../common/ipc/cluster";
+import { hotbarTooManyItemsChannel } from "../../common/ipc/hotbar";
 
 function sendToBackchannel(backchannel: string, notificationId: string, data: BackchannelArg): void {
   notificationsStore.remove(notificationId);
@@ -127,13 +129,13 @@ export function registerIpcListeners() {
   });
   onCorrect({
     source: ipcRenderer,
-    channel: ClusterListNamespaceForbiddenChannel,
+    channel: clusterListNamespaceForbiddenChannel,
     listener: ListNamespacesForbiddenHandler,
     verifier: isListNamespaceForbiddenArgs,
   });
   onCorrect({
     source: ipcRenderer,
-    channel: HotbarTooManyItems,
+    channel: hotbarTooManyItemsChannel,
     listener: HotbarTooManyItemsHandler,
     verifier: (args: unknown[]): args is [] => args.length === 0,
   });

src/renderer/remote-helpers/dialog.ts

@@ -1,10 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import { dialogShowOpenDialogHandler, requestMain } from "../../common/ipc";
-
-export async function showOpenDialog(options: Electron.OpenDialogOptions): Promise<Electron.OpenDialogReturnValue> {
-  return requestMain(dialogShowOpenDialogHandler, options);
-}

src/renderer/remote-helpers/history-updater.ts

@@ -3,32 +3,10 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 
-import { webContents } from "@electron/remote";
 import { reaction } from "mobx";
-import { broadcastMessage } from "../../common/ipc";
+import { emitWindowLocationChanged } from "../ipc";
 import { navigation } from "../navigation";
 
 export function watchHistoryState() {
-  return reaction(() => navigation.location, () => {
-    const getAllWebContents = webContents.getAllWebContents();
-
-    const canGoBack = getAllWebContents.some((webContent) => {
-      if (webContent.getType() === "window") {
-        return webContent.canGoBack();
-      }
-
-      return false;
-    });
-
-    const canGoForward = getAllWebContents.some((webContent) => {
-      if (webContent.getType() === "window") {
-        return webContent.canGoForward();
-      }
-
-      return false;
-    });
-
-    broadcastMessage("history:can-go-back", canGoBack);
-    broadcastMessage("history:can-go-forward", canGoForward);
-  });
+  return reaction(() => navigation.location, emitWindowLocationChanged);
 }

src/renderer/remote-helpers/index.ts

@@ -1,8 +0,0 @@
-/**
- * Copyright (c) OpenLens Authors. All rights reserved.
- * Licensed under MIT License. See LICENSE in root directory for more information.
- */
-
-import * as dialog from "./dialog";
-
-export { dialog };