add auto-update notifications and confirmation

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

Show single update notification (#1985)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

Moving notification icons to top (#1987)

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

Switch to EventEmitter (producer&consumer) model

- Main now broadcasts messages whenever updates are available and waits
  for the first response back

- Add `onCorrect` and `onceCorrect` to ipc module for typechecking ipc
  messages

- Correctly port styling from 3.6

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

package.json

@@ -212,6 +212,7 @@
     "mobx-observable-history": "^1.0.3",
     "mobx-react": "^6.2.2",
     "mock-fs": "^4.12.0",
+    "moment": "^2.26.0",
     "node-pty": "^0.9.0",
     "npm": "^6.14.8",
     "openid-client": "^3.15.2",
@@ -321,7 +322,6 @@
     "jest-mock-extended": "^1.0.10",
     "make-plural": "^6.2.2",
     "mini-css-extract-plugin": "^0.9.0",
-    "moment": "^2.26.0",
     "node-loader": "^0.6.0",
     "node-sass": "^4.14.1",
     "nodemon": "^2.0.4",

src/common/ipc.ts

@@ -1,85 +0,0 @@
-// Inter-process communications (main <-> renderer)
-// https://www.electronjs.org/docs/api/ipc-main
-// https://www.electronjs.org/docs/api/ipc-renderer
-
-import { ipcMain, ipcRenderer, webContents, remote } from "electron";
-import { toJS } from "mobx";
-import logger from "../main/logger";
-import { ClusterFrameInfo, clusterFrameMap } from "./cluster-frames";
-
-const subFramesChannel = "ipc:get-sub-frames";
-
-export function handleRequest(channel: string, listener: (...args: any[]) => any) {
-  ipcMain.handle(channel, listener);
-}
-
-export async function requestMain(channel: string, ...args: any[]) {
-  return ipcRenderer.invoke(channel, ...args);
-}
-
-function getSubFrames(): ClusterFrameInfo[] {
-  return toJS(Array.from(clusterFrameMap.values()), { recurseEverything: true });
-}
-
-export async function broadcastMessage(channel: string, ...args: any[]) {
-  const views = (webContents || remote?.webContents)?.getAllWebContents();
-
-  if (!views) return;
-
-  if (ipcRenderer) {
-    ipcRenderer.send(channel, ...args);
-  } else {
-    ipcMain.emit(channel, ...args);
-  }
-
-  for (const view of views) {
-    const type = view.getType();
-
-    logger.silly(`[IPC]: broadcasting "${channel}" to ${type}=${view.id}`, { args });
-    view.send(channel, ...args);
-
-    try {
-      const subFrames: ClusterFrameInfo[] = ipcRenderer
-        ? await requestMain(subFramesChannel)
-        : getSubFrames();
-
-      for (const frameInfo of subFrames) {
-        view.sendToFrame([frameInfo.processId, frameInfo.frameId], channel, ...args);
-      }
-    } catch (error) {
-      logger.error("[IPC]: failed to send IPC message", { error });
-    }
-  }
-}
-
-export function subscribeToBroadcast(channel: string, listener: (...args: any[]) => any) {
-  if (ipcRenderer) {
-    ipcRenderer.on(channel, listener);
-  } else {
-    ipcMain.on(channel, listener);
-  }
-
-  return listener;
-}
-
-export function unsubscribeFromBroadcast(channel: string, listener: (...args: any[]) => any) {
-  if (ipcRenderer) {
-    ipcRenderer.off(channel, listener);
-  } else {
-    ipcMain.off(channel, listener);
-  }
-}
-
-export function unsubscribeAllFromBroadcast(channel: string) {
-  if (ipcRenderer) {
-    ipcRenderer.removeAllListeners(channel);
-  } else {
-    ipcMain.removeAllListeners(channel);
-  }
-}
-
-export function bindBroadcastHandlers() {
-  handleRequest(subFramesChannel, () => {
-    return getSubFrames();
-  });
-}

src/common/ipc/index.ts

@@ -0,0 +1,2 @@
+export * from "./ipc";
+export * from "./update-available";

src/common/ipc/ipc.ts

@@ -0,0 +1,146 @@
+// Inter-process communications (main <-> renderer)
+// https://www.electronjs.org/docs/api/ipc-main
+// https://www.electronjs.org/docs/api/ipc-renderer
+
+import { ipcMain, ipcRenderer, webContents, remote } from "electron";
+import { toJS } from "mobx";
+import { EventEmitter } from "ws";
+import logger from "../../main/logger";
+import { ClusterFrameInfo, clusterFrameMap } from "../cluster-frames";
+
+const subFramesChannel = "ipc:get-sub-frames";
+
+export type HandlerEvent<EM extends EventEmitter> = Parameters<Parameters<EM["on"]>[1]>[0];
+export type EventListener<E extends EventEmitter, T extends any[]> = (event: HandlerEvent<E>, ...args: T) => any;
+
+export function handleRequest(channel: string, listener: (event: Electron.IpcMainInvokeEvent, ...args: any[]) => any) {
+  ipcMain.handle(channel, listener);
+}
+
+export async function requestMain(channel: string, ...args: any[]) {
+  return ipcRenderer.invoke(channel, ...args);
+}
+
+/**
+ * Adds a listener to `source` that waits for the first IPC message with the correct
+ * argument data is sent.
+ * @param channel The channel to be listened on
+ * @param listener The function for the channel to be called if the args of the correct type
+ * @param verifier The function to be called to verify that the args are the correct type
+ */
+export function onceCorrect<
+  EM extends EventEmitter,
+  T extends any[],
+  L extends (event: HandlerEvent<EM>, ...args: T) => any
+>(
+  source: EM,
+  channel: string | symbol,
+  listener: L,
+  verifier: (args: unknown[]) => args is T
+): void {
+  function handler(event: HandlerEvent<EM>, ...args: unknown[]): void {
+    if (verifier(args)) {
+      source.removeListener(channel, handler); // remove immediately
+
+      Promise.resolve(listener(event, ...args)) // might return a promise
+        .catch(error => logger.error("[IPC]: channel once handler threw error", { channel, error }));
+    } else {
+      logger.error("[IPC]: channel was sent to with invalid data", { channel, args });
+    }
+  }
+
+  source.on(channel, handler);
+}
+
+/**
+ * Adds a listener to `source` that checks to verify the arguments before calling the handler.
+ * @param channel The channel to be listened on
+ * @param listener The function for the channel to be called if the args of the correct type
+ * @param verifier The function to be called to verify that the args are the correct type
+ */
+export function onCorrect<
+  EM extends EventEmitter,
+  T extends any[],
+  L extends (event: HandlerEvent<EM>, ...args: T) => any
+>(
+  source: EM,
+  channel: string | symbol,
+  listener: L,
+  verifier: (args: unknown[]) => args is T
+): void {
+  source.on(channel, (event, ...args: unknown[]) => {
+    if (verifier(args)) {
+      Promise.resolve(listener(event, ...args)) // might return a promise
+        .catch(error => logger.error("[IPC]: channel on handler threw error", { channel, error }));
+    } else {
+      logger.error("[IPC]: channel was sent to with invalid data", { channel, args });
+    }
+  });
+}
+
+function getSubFrames(): ClusterFrameInfo[] {
+  return toJS(Array.from(clusterFrameMap.values()), { recurseEverything: true });
+}
+
+export async function broadcastMessage(channel: string, ...args: any[]) {
+  const views = (webContents || remote?.webContents)?.getAllWebContents();
+
+  if (!views) return;
+
+  if (ipcRenderer) {
+    ipcRenderer.send(channel, ...args);
+  } else {
+    ipcMain.emit(channel, ...args);
+  }
+
+  for (const view of views) {
+    const type = view.getType();
+
+    logger.silly(`[IPC]: broadcasting "${channel}" to ${type}=${view.id}`, { args });
+    view.send(channel, ...args);
+
+    try {
+      const subFrames: ClusterFrameInfo[] = ipcRenderer
+        ? await requestMain(subFramesChannel)
+        : getSubFrames();
+
+      for (const frameInfo of subFrames) {
+        view.sendToFrame([frameInfo.processId, frameInfo.frameId], channel, ...args);
+      }
+    } catch (error) {
+      logger.error("[IPC]: failed to send IPC message", { error });
+    }
+  }
+}
+
+export function subscribeToBroadcast(channel: string, listener: (...args: any[]) => any) {
+  if (ipcRenderer) {
+    ipcRenderer.on(channel, listener);
+  } else {
+    ipcMain.on(channel, listener);
+  }
+
+  return listener;
+}
+
+export function unsubscribeFromBroadcast(channel: string, listener: (...args: any[]) => any) {
+  if (ipcRenderer) {
+    ipcRenderer.off(channel, listener);
+  } else {
+    ipcMain.off(channel, listener);
+  }
+}
+
+export function unsubscribeAllFromBroadcast(channel: string) {
+  if (ipcRenderer) {
+    ipcRenderer.removeAllListeners(channel);
+  } else {
+    ipcMain.removeAllListeners(channel);
+  }
+}
+
+export function bindBroadcastHandlers() {
+  handleRequest(subFramesChannel, () => {
+    return getSubFrames();
+  });
+}

src/common/ipc/update-available/index.ts

@@ -0,0 +1,48 @@
+import { UpdateInfo } from "electron-updater";
+
+export const UpdateAvailableChannel = "update-available";
+export const AutoUpdateLogPrefix = "[UPDATE-CHECKER]";
+
+/**
+ * [<back-channel>, <update-info>]
+ */
+export type UpdateAvailableFromMain = [string, UpdateInfo];
+
+export function areArgsUpdateAvailableFromMain(args: unknown[]): args is UpdateAvailableFromMain {
+  if (args.length !== 2) {
+    return false;
+  }
+
+  if (typeof args[0] !== "string") {
+    return false;
+  }
+
+  if (typeof args[1] !== "object" || args[1] === null) {
+    // TODO: improve this checking
+    return false;
+  }
+
+  return true;
+}
+
+export type BackchannelArg = {
+  doUpdate: false;
+} | {
+  doUpdate: true;
+  now: boolean;
+};
+
+export type UpdateAvailableToBackchannel = [BackchannelArg];
+
+export function areArgsUpdateAvailableToBackchannel(args: unknown[]): args is UpdateAvailableToBackchannel {
+  if (args.length !== 1) {
+    return false;
+  }
+
+  if (typeof args[0] !== "object" || args[0] === null) {
+    // TODO: improve this checking
+    return false;
+  }
+
+  return true;
+}

src/common/utils/delay.ts

@@ -1,6 +1,8 @@
-// Create async delay for provided timeout in milliseconds
-
-export async function delay(timeoutMs = 1000) {
-  if (!timeoutMs) return;
-  await new Promise(resolve => setTimeout(resolve, timeoutMs));
+/**
+ * Return a promise that will be resolved after at least `timeout` ms have
+ * passed
+ * @param timeout The number of milliseconds before resolving
+ */
+export function delay(timeout = 1000): Promise<void> {
+  return new Promise(resolve => setTimeout(resolve, timeout));
 }

src/common/utils/index.ts

@@ -18,3 +18,4 @@ export * from "./openExternal";
 export * from "./downloadFile";
 export * from "./escapeRegExp";
 export * from "./tar";
+export * from "./delay";

src/main/app-updater.ts

@@ -1,20 +1,71 @@
-import { autoUpdater } from "electron-updater";
+import { autoUpdater, UpdateInfo } from "electron-updater";
 import logger from "./logger";
+import { isDevelopment, isTestEnv } from "../common/vars";
+import { delay } from "../common/utils";
+import { areArgsUpdateAvailableToBackchannel, AutoUpdateLogPrefix, broadcastMessage, onceCorrect, UpdateAvailableChannel, UpdateAvailableToBackchannel } from "../common/ipc";
+import * as uuid from "uuid";
+import { ipcMain } from "electron";
 
-export class AppUpdater {
-  static readonly defaultUpdateIntervalMs = 1000 * 60 * 60 * 24; // once a day
-
-  static checkForUpdates() {
-    return autoUpdater.checkForUpdatesAndNotify();
-  }
-
-  constructor(protected updateInterval = AppUpdater.defaultUpdateIntervalMs) {
-    autoUpdater.logger = logger;
-  }
-
-  public start() {
-    setInterval(AppUpdater.checkForUpdates, this.updateInterval);
-
-    return AppUpdater.checkForUpdates();
+function handleAutoUpdateBackChannel(event: Electron.IpcMainEvent, ...[arg]: UpdateAvailableToBackchannel) {
+  if (arg.doUpdate) {
+    if (arg.now) {
+      logger.info(`${AutoUpdateLogPrefix}: User chose to update now`);
+      autoUpdater.downloadUpdate()
+        .then(() => autoUpdater.quitAndInstall())
+        .catch(error => logger.error(`${AutoUpdateLogPrefix}: Failed to download or install update`, { error }));
+    } else {
+      logger.info(`${AutoUpdateLogPrefix}: User chose to update on quit`);
+      autoUpdater.autoInstallOnAppQuit = true;
+      autoUpdater.downloadUpdate()
+        .catch(error => logger.error(`${AutoUpdateLogPrefix}: Failed to download update`, { error }));
+    }
+  } else {
+    logger.info(`${AutoUpdateLogPrefix}: User chose not to update`);
+  }
+}
+
+/**
+ * starts the automatic update checking
+ * @param interval milliseconds between interval to check on, defaults to 24h
+ */
+export function startUpdateChecking(interval = 1000 * 60 * 60 * 24): void {
+  if (isDevelopment || isTestEnv) {
+    return;
+  }
+
+  autoUpdater.logger = logger;
+  autoUpdater.autoDownload = false;
+  autoUpdater.autoInstallOnAppQuit = false;
+
+  autoUpdater
+    .on("update-available", (args: UpdateInfo) => {
+      try {
+        // use a UUID so that this back-channel is harder to discover
+        const backchannel = uuid.v4();
+
+        // make sure that the handler is in place before broadcasting (prevent race-condition)
+        onceCorrect(ipcMain, backchannel, handleAutoUpdateBackChannel, areArgsUpdateAvailableToBackchannel);
+        logger.info(`${AutoUpdateLogPrefix}: broadcasting update available`, { backchannel, version: args.version });
+        broadcastMessage(UpdateAvailableChannel, backchannel, args);
+      } catch (error) {
+        logger.error(`${AutoUpdateLogPrefix}: broadcasting failed`, { error });
+      }
+    });
+
+  async function helper() {
+    while (true) {
+      await checkForUpdates();
+      await delay(interval);
+    }
+  }
+
+  helper();
+}
+
+export async function checkForUpdates(): Promise<void> {
+  try {
+    await autoUpdater.checkForUpdates();
+  } catch (error) {
+    logger.error(`${AutoUpdateLogPrefix}: failed with an error`, { error: String(error) });
   }
 }

src/main/index.ts

@@ -10,7 +10,6 @@ import path from "path";
 import { LensProxy } from "./lens-proxy";
 import { WindowManager } from "./window-manager";
 import { ClusterManager } from "./cluster-manager";
-import { AppUpdater } from "./app-updater";
 import { shellSync } from "./shell-sync";
 import { getFreePort } from "./port";
 import { mangleProxyEnv } from "./proxy-env";
@@ -27,6 +26,7 @@ import type { LensExtensionId } from "../extensions/lens-extension";
 import { installDeveloperTools } from "./developer-tools";
 import { filesystemProvisionerStore } from "./extension-filesystem";
 import { bindBroadcastHandlers } from "../common/ipc";
+import { startUpdateChecking } from "./app-updater";
 
 const workingDir = path.join(app.getPath("appData"), appName);
 let proxyPort: number;
@@ -70,10 +70,6 @@ app.on("ready", async () => {
     app.exit();
   });
 
-  const updater = new AppUpdater();
-
-  updater.start();
-
   registerFileProtocol("static", __static);
 
   await installDeveloperTools();
@@ -112,6 +108,7 @@ app.on("ready", async () => {
   extensionLoader.init();
   extensionDiscovery.init();
   windowManager = WindowManager.getInstance<WindowManager>(proxyPort);
+  windowManager.whenLoaded.then(() => startUpdateChecking());
 
   // call after windowManager to see splash earlier
   try {

src/main/tray.ts

@@ -1,9 +1,9 @@
 import path from "path";
 import packageInfo from "../../package.json";
-import { dialog, Menu, NativeImage, Tray } from "electron";
+import { Menu, NativeImage, Tray } from "electron";
 import { autorun } from "mobx";
 import { showAbout } from "./menu";
-import { AppUpdater } from "./app-updater";
+import { checkForUpdates } from "./app-updater";
 import { WindowManager } from "./window-manager";
 import { clusterStore } from "../common/cluster-store";
 import { workspaceStore } from "../common/workspace-store";
@@ -112,16 +112,8 @@ function createTrayMenu(windowManager: WindowManager): Menu {
     {
       label: "Check for updates",
       async click() {
-        const result = await AppUpdater.checkForUpdates();
-
-        if (!result) {
-          const browserWindow = await windowManager.ensureMainWindow();
-
-          dialog.showMessageBoxSync(browserWindow, {
-            message: "No updates available",
-            type: "info",
-          });
-        }
+        await checkForUpdates();
+        await windowManager.ensureMainWindow();
       },
     },
     { type: "separator" },

src/main/window-manager.ts

@@ -1,5 +1,5 @@
 import type { ClusterId } from "../common/cluster-store";
-import { observable } from "mobx";
+import { observable, when } from "mobx";
 import { app, BrowserWindow, dialog, shell, webContents } from "electron";
 import windowStateKeeper from "electron-window-state";
 import { appEventBus } from "../common/event-bus";
@@ -15,6 +15,9 @@ export class WindowManager extends Singleton {
   protected windowState: windowStateKeeper.State;
   protected disposers: Record<string, Function> = {};
 
+  @observable mainViewInitiallyLoaded = false;
+  whenLoaded = when(() => this.mainViewInitiallyLoaded);
+
   @observable activeClusterId: ClusterId;
 
   constructor(protected proxyPort: number) {
@@ -91,6 +94,7 @@ export class WindowManager extends Singleton {
       setTimeout(() => {
         appEventBus.emit({ name: "app", action: "start" });
       }, 1000);
+      this.mainViewInitiallyLoaded = true;
     } catch (err) {
       dialog.showErrorBox("ERROR!", err.toString());
     }

src/renderer/components/button/button-panel.scss

@@ -0,0 +1,3 @@
+.ButtonPannel button:not(:last-of-type) {
+    margin-right: $margin;
+}

src/renderer/components/button/button-panel.tsx

@@ -0,0 +1,13 @@
+import "./button-panel.scss";
+import React from "react";
+
+export function ButtonPannel(props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) {
+  return (
+    <>
+      <br />
+      <div className="ButtonPannel flex row align-right box grow">
+        {props.children}
+      </div>
+    </>
+  );
+}

src/renderer/components/button/button.scss

@@ -21,10 +21,16 @@
   &.primary {
     background: $buttonPrimaryBackground;
   }
+
   &.accent {
     background: $buttonAccentBackground;
   }
 
+  &.light {
+    background-color: white;
+    color: #505050;
+  }
+
   &.plain {
     color: inherit;
     background: transparent;
@@ -45,6 +51,7 @@
   &.outlined {
     color: inherit;
     background: transparent;
+    border: 1px solid;
 
     &.active,
     &:focus {

src/renderer/components/button/button.tsx

@@ -8,6 +8,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<any>, TooltipDecorator
   waiting?: boolean;
   primary?: boolean;
   accent?: boolean;
+  light?: boolean;
   plain?: boolean;
   outlined?: boolean;
   hidden?: boolean;
@@ -24,13 +25,16 @@ export class Button extends React.PureComponent<ButtonProps, {}> {
   private button: HTMLButtonElement;
 
   render() {
-    const { className, waiting, label, primary, accent, plain, hidden, active, big, round, outlined, tooltip, children, ...props } = this.props;
-    const btnProps = props as Partial<ButtonProps>;
+    const {
+      className, waiting, label, primary, accent, plain, hidden, active, big,
+      round, outlined, tooltip, light, children, ...props
+    } = this.props;
+    const btnProps: Partial<ButtonProps> = props;
 
     if (hidden) return null;
 
     btnProps.className = cssNames("Button", className, {
-      waiting, primary, accent, plain, active, big, round, outlined
+      waiting, primary, accent, plain, active, big, round, outlined, light,
     });
 
     const btnContent: ReactNode = (

src/renderer/components/button/index.ts

@@ -1 +1,2 @@
 export * from "./button";
+export * from "./button-panel";

src/renderer/components/notifications/notifications.scss

@@ -42,5 +42,9 @@
         box-shadow: 0 0 20px $boxShadow;
       }
     }
+
+    .close {
+      margin-top: -2px;
+    }
   }
 }

src/renderer/components/notifications/notifications.store.tsx

@@ -18,6 +18,7 @@ export interface Notification {
   message: NotificationMessage;
   status?: NotificationStatus;
   timeout?: number; // auto-hiding timeout in milliseconds, 0 = no hide
+  onClose?(): void; // additonal logic on when the notification times out or is closed by the "x"
 }
 
 @autobind()

src/renderer/components/notifications/notifications.tsx

@@ -72,23 +72,26 @@ export class Notifications extends React.Component {
     return (
       <div className="Notifications flex column align-flex-end" ref={e => this.elem = e}>
         {notifications.map(notification => {
-          const { id, status } = notification;
+          const { id, status, onClose } = notification;
           const msgText = this.getMessage(notification);
 
           return (
             <Animate key={id}>
               <div
-                className={cssNames("notification flex align-center", status)}
+                className={cssNames("notification flex", status)}
                 onMouseLeave={() => addAutoHideTimer(id)}
                 onMouseEnter={() => removeAutoHideTimer(id)}>
-                <div className="box center">
+                <div className="box">
                   <Icon material="info_outline"/>
                 </div>
                 <div className="message box grow">{msgText}</div>
-                <div className="box center">
+                <div className="box">
                   <Icon
                     material="close" className="close"
-                    onClick={prevDefault(() => remove(id))}
+                    onClick={prevDefault(() => {
+                      remove(id);
+                      onClose?.();
+                    })}
                   />
                 </div>
               </div>

src/renderer/ipc/index.tsx

@@ -0,0 +1,57 @@
+import React from "react";
+import { ipcRenderer, IpcRendererEvent } from "electron";
+import { areArgsUpdateAvailableFromMain, UpdateAvailableChannel, onCorrect, UpdateAvailableFromMain, BackchannelArg } from "../../common/ipc";
+import { Notifications, notificationsStore } from "../components/notifications";
+import { Button, ButtonPannel } from "../components/button";
+import { isMac } from "../../common/vars";
+import * as uuid from "uuid";
+
+function UpdateAvailableHandler(event: IpcRendererEvent, ...[backchannel, updateInfo]: UpdateAvailableFromMain): void {
+  const notificationId = uuid.v4();
+
+  function sendToBackchannel(data: BackchannelArg): void {
+    notificationsStore.remove(notificationId);
+    console.log("sending to backchanel", { backchannel, data });
+    ipcRenderer.send(backchannel, data);
+  }
+
+  function renderYesButtons() {
+    if (isMac) {
+      /**
+       * auto-updater's "installOnQuit" is not applicable for macOS as per their docs.
+       *
+       * See: https://github.com/electron-userland/electron-builder/blob/master/packages/electron-updater/src/AppUpdater.ts#L27-L32
+       */
+      return <Button light label="Yes" onClick={() => sendToBackchannel({ doUpdate: true, now: true })} />;
+    }
+
+    return (
+      <>
+        <Button light label="Yes, now" onClick={() => sendToBackchannel({ doUpdate: true, now: true })} />
+        <Button primary outlined label="Yes, later" onClick={() => sendToBackchannel({ doUpdate: true, now: false })} />
+      </>
+    );
+  }
+
+  Notifications.info(
+    (
+      <>
+        <b>Update Available</b>
+        <p>Version {updateInfo.version} of Lens IDE is now available. Would you like to update?</p>
+        <ButtonPannel>
+          {renderYesButtons()}
+          <Button primary outlined label="No" onClick={() => sendToBackchannel({ doUpdate: false })} />
+        </ButtonPannel>
+      </>
+    ), {
+      id: notificationId,
+      onClose() {
+        sendToBackchannel({ doUpdate: false });
+      }
+    }
+  );
+}
+
+export function registerIpcHandlers() {
+  onCorrect(ipcRenderer, UpdateAvailableChannel, UpdateAvailableHandler, areArgsUpdateAvailableFromMain);
+}

src/renderer/lens-app.tsx

@@ -12,6 +12,7 @@ import { ConfirmDialog } from "./components/confirm-dialog";
 import { extensionLoader } from "../extensions/extension-loader";
 import { broadcastMessage } from "../common/ipc";
 import { CommandContainer } from "./components/command-palette/command-container";
+import { registerIpcHandlers } from "./ipc";
 
 @observer
 export class LensApp extends React.Component {
@@ -23,6 +24,8 @@ export class LensApp extends React.Component {
     window.addEventListener("online", () => {
       broadcastMessage("network:online");
     });
+
+    registerIpcHandlers();
   }
 
   render() {

src/renderer/themes/theme-vars.scss

@@ -92,10 +92,6 @@ $terminalBrightMagenta: var(--terminalBrightMagenta);
 $terminalBrightCyan: var(--terminalBrightCyan);
 $terminalBrightWhite: var(--terminalBrightWhite);
 
-// Logs
-$logsBackground: var(--logsBackground);
-$logRowHoverBackground: var(--logRowHoverBackground);
-
 // Dialogs
 $dialogTextColor: var(--dialogTextColor);
 $dialogBackground: var(--dialogBackground);
@@ -131,4 +127,4 @@ $selectOptionHoveredColor: var(--selectOptionHoveredColor);
 $lineProgressBackground: var(--lineProgressBackground);
 $radioActiveBackground: var(--radioActiveBackground);
 $menuActiveBackground: var(--menuActiveBackground);
-$menuSelectedOptionBgc: var(--menuSelectedOptionBgc);
+$menuSelectedOptionBgc: var(--menuSelectedOptionBgc);