Add reactive tray icon for when update is available (#5567)

src/main/tray/reactive-tray-menu-items/converters.ts

@@ -0,0 +1,40 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import type { TrayMenuItem } from "../tray-menu-item/tray-menu-item-injection-token";
+
+export function convertToElectronMenuTemplate(trayMenuItems: TrayMenuItem[]): Electron.MenuItemConstructorOptions[] {
+  const toTrayMenuOptions = (parentId: string | null) => (
+    trayMenuItems
+      .filter((item) => item.parentId === parentId)
+      .map((trayMenuItem: TrayMenuItem): Electron.MenuItemConstructorOptions => {
+        if (trayMenuItem.separator) {
+          return { id: trayMenuItem.id, type: "separator" };
+        }
+
+        const childItems = toTrayMenuOptions(trayMenuItem.id);
+
+        return {
+          id: trayMenuItem.id,
+          label: trayMenuItem.label?.get(),
+          enabled: trayMenuItem.enabled.get(),
+          toolTip: trayMenuItem.tooltip,
+
+          ...(childItems.length === 0
+            ? {
+              type: "normal",
+              submenu: toTrayMenuOptions(trayMenuItem.id),
+              click: trayMenuItem.click,
+            }
+            : {
+              type: "submenu",
+              submenu: toTrayMenuOptions(trayMenuItem.id),
+            }),
+
+        };
+      })
+  );
+
+  return toTrayMenuOptions(null);
+}

src/main/tray/reactive-tray-menu-items/reactive-tray-menu-items.injectable.ts

@@ -4,9 +4,9 @@
  */
 import { getInjectable } from "@ogre-tools/injectable";
 import { getStartableStoppable } from "../../../common/utils/get-startable-stoppable";
-import { autorun } from "mobx";
-import trayMenuItemsInjectable from "../tray-menu-item/tray-menu-items.injectable";
+import { reaction } from "mobx";
 import electronTrayInjectable from "../electron-tray/electron-tray.injectable";
+import trayMenuItemsInjectable from "../tray-menu-item/tray-menu-items.injectable";
 
 const reactiveTrayMenuItemsInjectable = getInjectable({
   id: "reactive-tray-menu-items",
@@ -15,9 +15,15 @@ const reactiveTrayMenuItemsInjectable = getInjectable({
     const electronTray = di.inject(electronTrayInjectable);
     const trayMenuItems = di.inject(trayMenuItemsInjectable);
 
-    return getStartableStoppable("reactive-tray-menu-items", () => autorun(() => {
-      electronTray.setMenuItems(trayMenuItems.get());
-    }));
+    return getStartableStoppable("reactive-tray-menu-items", () => (
+      reaction(
+        () => trayMenuItems.get(),
+        electronTray.setMenuItems,
+        {
+          fireImmediately: true,
+        },
+      )
+    ));
   },
 });