refactored for the simplified logic for injecting many instances PR

Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com>

src/renderer/components/status-bar/status-bar-item-injection-token.ts

@@ -5,14 +5,11 @@
 import { getInjectionToken } from "@ogre-tools/injectable";
 import type { IComputedValue } from "mobx";
 import type React from "react";
-import type { LensRendererExtension } from "../../../extensions/lens-renderer-extension";
 
 export interface StatusBarItem {
   component: React.ComponentType<any>;
   position: "left" | "right";
   visible: IComputedValue<boolean>;
-
-  extension?: LensRendererExtension;
 }
 
 export const statusBarItemInjectionToken = getInjectionToken<StatusBarItem>({

src/renderer/components/status-bar/status-bar-item-registrator.injectable.tsx

@@ -2,8 +2,6 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
-import { pipeline } from "@ogre-tools/fp";
-import { flatMap } from "lodash/fp";
 import type { Injectable } from "@ogre-tools/injectable";
 import { getInjectable } from "@ogre-tools/injectable";
 import { computed } from "mobx";
@@ -12,21 +10,18 @@ import type { LensRendererExtension } from "../../../extensions/lens-renderer-ex
 import type { StatusBarItem } from "./status-bar-item-injection-token";
 import { statusBarItemInjectionToken } from "./status-bar-item-injection-token";
 import type { StatusBarRegistration } from "./status-bar-registration";
-import * as uuid from "uuid";
 import React from "react";
+import getRandomIdInjectable from "../../../common/utils/get-random-id.injectable";
 
 const statusBarItemRegistratorInjectable = getInjectable({
   id: "status-bar-item-registrator",
 
-  instantiate: (di) => (extension, installationCounter) => {
+  instantiate: (di) => (extension) => {
     const rendererExtension = extension as LensRendererExtension;
+    const getRandomId = di.inject(getRandomIdInjectable);
 
-    pipeline(
+    return rendererExtension.statusBarItems.flatMap(
-      rendererExtension.statusBarItems,
+      toItemInjectableFor(rendererExtension, getRandomId),
-
-      flatMap(toItemInjectablesFor(rendererExtension, installationCounter)),
-
-      (injectables) => di.register(...injectables),
     );
   },
 
@@ -35,9 +30,9 @@ const statusBarItemRegistratorInjectable = getInjectable({
 
 export default statusBarItemRegistratorInjectable;
 
-const toItemInjectablesFor = (extension: LensRendererExtension, installationCounter: number) => {
+const toItemInjectableFor = (extension: LensRendererExtension, getRandomId: () => string) => {
-  const _toItemInjectables = () => (registration: StatusBarRegistration): Injectable<StatusBarItem, StatusBarItem, void>[] => {
+  const _toItemInjectable = () => (registration: StatusBarRegistration): Injectable<StatusBarItem, StatusBarItem, void>[] => {
-    const id = `${uuid.v4()}-status-bar-item-for-extension-${extension.sanitizedExtensionId}-instance-${installationCounter}`;
+    const id = `${getRandomId()}-status-bar-item-for-extension-${extension.sanitizedExtensionId}`;
     let component: React.ComponentType;
     let position: "left" | "right";
 
@@ -56,7 +51,7 @@ const toItemInjectablesFor = (extension: LensRendererExtension, installationCoun
           </>
         );
     } else if (registration.components) {
-      const { position: pos, Item } = registration.components;
+      const { position: pos = "right", Item } = registration.components;
 
       if (pos !== "left" && pos !== "right") {
         throw new TypeError("StatusBarRegistration.components.position must be either 'right' or 'left'");
@@ -83,7 +78,7 @@ const toItemInjectablesFor = (extension: LensRendererExtension, installationCoun
 
   };
 
-  return _toItemInjectables();
+  return _toItemInjectable();
 };
 
 

src/renderer/components/status-bar/status-bar-items.injectable.tsx

@@ -8,6 +8,7 @@ import { computed } from "mobx";
 import type { StatusBarItemProps } from "./status-bar-registration";
 import type { StatusBarItem } from "./status-bar-item-injection-token";
 import { statusBarItemInjectionToken } from "./status-bar-item-injection-token";
+import { computedInjectManyInjectable } from "@ogre-tools/injectable-extension-for-mobx";
 
 export interface StatusBarItems {
   right: React.ComponentType<StatusBarItemProps>[];
@@ -15,7 +16,7 @@ export interface StatusBarItems {
 }
 
 interface Dependencies {
-  registrations: StatusBarItem[];
+  registrations: IComputedValue<StatusBarItem[]>;
 }
 
 function getStatusBarItems({ registrations }: Dependencies): IComputedValue<StatusBarItems> {
@@ -25,17 +26,21 @@ function getStatusBarItems({ registrations }: Dependencies): IComputedValue<Stat
       right: [],
     };
 
-    for (const registration of registrations) {
+    for (const registration of registrations.get()) {
       if (!registration || typeof registration !== "object") {
         continue;
       }
 
-      const { position = "right", component } = registration;
+      const { position = "right", component, visible } = registration;
 
       if (position !== "left" && position !== "right") {
         throw new TypeError("StatusBarRegistration.components.position must be either 'right' or 'left'");
       }
 
+      if (!visible) {
+        continue;
+      }
+
       res[position].push(component);
     }
 
@@ -49,9 +54,15 @@ function getStatusBarItems({ registrations }: Dependencies): IComputedValue<Stat
 const statusBarItemsInjectable = getInjectable({
   id: "status-bar-items",
 
-  instantiate: (di) => getStatusBarItems({
+  instantiate: (di) => {
-    registrations: di.injectMany(statusBarItemInjectionToken),
+    const computedInjectMany = di.inject(
-  }),
+      computedInjectManyInjectable,
+    );
+
+    return getStatusBarItems({
+      registrations: computedInjectMany(statusBarItemInjectionToken),
+    });
+  },
 
 });