Add auto-update notifications and confirmation (#1941)

* add auto-update notifications and confirmation

* Show single update notification (#1985)

* Moving notification icons to top (#1987)

* Switch to EventEmitter (producer&consumer) model

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

* move type enforced ipc methods to seperate file, add unit tests

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
Signed-off-by: Sebastian Malton <sebastian@malton.name>

src/renderer/ipc/index.tsx

@@ -0,0 +1,61 @@
+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 } from "../components/button";
+import { isMac } from "../../common/vars";
+import * as uuid from "uuid";
+
+function sendToBackchannel(backchannel: string, notificationId: string, data: BackchannelArg): void {
+  notificationsStore.remove(notificationId);
+  ipcRenderer.send(backchannel, data);
+}
+
+function RenderYesButtons(props: { backchannel: string, notificationId: string }) {
+  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(props.backchannel, props.notificationId, { doUpdate: true, now: true })} />;
+  }
+
+  return (
+    <>
+      <Button light label="Yes, now" onClick={() => sendToBackchannel(props.backchannel, props.notificationId, { doUpdate: true, now: true })} />
+      <Button active outlined label="Yes, later" onClick={() => sendToBackchannel(props.backchannel, props.notificationId, { doUpdate: true, now: false })} />
+    </>
+  );
+}
+
+function UpdateAvailableHandler(event: IpcRendererEvent, ...[backchannel, updateInfo]: UpdateAvailableFromMain): void {
+  const notificationId = uuid.v4();
+
+  Notifications.info(
+    (
+      <>
+        <b>Update Available</b>
+        <p>Version {updateInfo.version} of Lens IDE is now available. Would you like to update?</p>
+        <div className="flex gaps row align-left box grow">
+          <RenderYesButtons backchannel={backchannel} notificationId={notificationId} />
+          <Button active outlined label="No" onClick={() => sendToBackchannel(backchannel, notificationId, { doUpdate: false })} />
+        </div>
+      </>
+    ), {
+      id: notificationId,
+      onClose() {
+        sendToBackchannel(backchannel, notificationId, { doUpdate: false });
+      }
+    }
+  );
+}
+
+export function registerIpcHandlers() {
+  onCorrect({
+    source: ipcRenderer,
+    channel: UpdateAvailableChannel,
+    listener: UpdateAvailableHandler,
+    verifier: areArgsUpdateAvailableFromMain,
+  });
+}