Add lens:// protocol handling with a routing mechanism (#1949)

- Add lens:// protocol handling with a routing mechanism

- document the methods in an extension guide

- remove handlers when an extension is deactivated or removed

- make sure that the found extension when routing a request is currently enabled (as a backup)

- added documentation about the above behaviour to the guide

- tweaked the naming convention so that it is clearer that the router uses extension names as not IDs (which currently are folder paths)

- Convert the extension API to use an array for registering handlers

- switch design to execute both main and renderer handlers simultaneously, without any overlap checking

- change open to be a dev dep

- improve docs, export types for extensions, skip integration tests

- switch to event emitting renderer being ready

- Add logging and fix renderer:loaded send to main

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

src/renderer/lens-app.tsx

@@ -12,12 +12,15 @@ 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 { LensProtocolRouterRenderer } from "./protocol-handler/router";
 import { registerIpcHandlers } from "./ipc";
+import { ipcRenderer } from "electron";
 
 @observer
 export class LensApp extends React.Component {
   static async init() {
     extensionLoader.loadOnClusterManagerRenderer();
+    LensProtocolRouterRenderer.getInstance<LensProtocolRouterRenderer>().init();
     window.addEventListener("offline", () => {
       broadcastMessage("network:offline");
     });
@@ -26,6 +29,7 @@ export class LensApp extends React.Component {
     });
 
     registerIpcHandlers();
+    ipcRenderer.send("renderer:loaded");
   }
 
   render() {

src/renderer/navigation/index.ts

@@ -1,8 +1,10 @@
 // Navigation (renderer)
 
 import { bindEvents } from "./events";
+import { bindProtocolHandlers } from "./protocol-handlers";
 
 export * from "./history";
 export * from "./helpers";
 
 bindEvents();
+bindProtocolHandlers();

src/renderer/navigation/protocol-handlers.ts

@@ -0,0 +1,10 @@
+import { LensProtocolRouterRenderer } from "../protocol-handler/router";
+import { navigate } from "./helpers";
+
+export function bindProtocolHandlers() {
+  const lprr = LensProtocolRouterRenderer.getInstance<LensProtocolRouterRenderer>();
+
+  lprr.addInternalHandler("/preferences", () => {
+    navigate("/preferences");
+  });
+}

src/renderer/protocol-handler/index.ts

@@ -0,0 +1 @@
+export * from "./router.ts";

src/renderer/protocol-handler/router.ts

@@ -0,0 +1,40 @@
+import { ipcRenderer } from "electron";
+import * as proto from "../../common/protocol-handler";
+import logger from "../../main/logger";
+import Url from "url-parse";
+import { autobind } from "../utils";
+
+export class LensProtocolRouterRenderer extends proto.LensProtocolRouter {
+  /**
+   * This function is needed to be called early on in the renderers lifetime.
+   */
+  public init(): void {
+    ipcRenderer
+      .on(proto.ProtocolHandlerInternal, this.ipcInternalHandler)
+      .on(proto.ProtocolHandlerExtension, this.ipcExtensionHandler);
+  }
+
+  @autobind()
+  private ipcInternalHandler(event: Electron.IpcRendererEvent, ...args: any[]): void {
+    if (args.length !== 1) {
+      return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args });
+    }
+
+    const [rawUrl] = args;
+    const url = new Url(rawUrl, true);
+
+    this._routeToInternal(url);
+  }
+
+  @autobind()
+  private ipcExtensionHandler(event: Electron.IpcRendererEvent, ...args: any[]): void {
+    if (args.length !== 1) {
+      return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args });
+    }
+
+    const [rawUrl] = args;
+    const url = new Url(rawUrl, true);
+
+    this._routeToExtension(url);
+  }
+}

src/renderer/utils/index.ts

@@ -1,7 +1,5 @@
 // Common usage utils & helpers
 
-export const isElectron = !!navigator.userAgent.match(/Electron/);
-
 export * from "../../common/utils";
 
 export * from "./cssVar";