fix(envs) - load envs of envs before loading the envs

scopes/workspace/install/install.main.runtime.ts

@@ -6,7 +6,7 @@ import { CompilerMain, CompilerAspect, CompilationInitiator } from '@teambit/com
 import { CLIMain, CommandList, CLIAspect, MainRuntime } from '@teambit/cli';
 import chalk from 'chalk';
 import { WorkspaceAspect, Workspace, ComponentConfigFile } from '@teambit/workspace';
-import { compact, mapValues, omit, uniq, intersection, groupBy } from 'lodash';
+import { compact, mapValues, omit, uniq, intersection } from 'lodash';
 import { ProjectManifest } from '@pnpm/types';
 import { GenerateResult, GeneratorAspect, GeneratorMain } from '@teambit/generator';
 import { componentIdToPackageName } from '@teambit/pkg.modules.component-package-name';
@@ -487,20 +487,34 @@ export class InstallMain {
         // This is a bug in the flow and should be fixed.
         // skipDeps: true,
       });
-      // This is a very special case which we need to compile our envs before loading them correctly.
-      const grouped = groupBy(aspects, (aspectDef) => {
-        return aspectDef.component?.id.toStringWithoutVersion() === 'bitdev.general/envs/bit-env';
-      });
-      await this.reloadAspects(grouped.true || []);
-      const otherEnvs = grouped.false || [];
+
       await Promise.all(
-        otherEnvs.map(async (aspectDef) => {
+        aspects.map(async (aspectDef) => {
           const id = aspectDef.component?.id;
           if (!id) return;
           await this.workspace.clearComponentCache(id);
         })
       );
-      await this.reloadAspects(grouped.false || []);
+      await this.reloadAspects(aspects || []);
+
+      // Keeping this here for now, it was removed as part of #9138 as now that we load envs of envs
+      // correctly first it seems to be not needed anymore.
+      // But there might be cases where it will be needed. So keeping it here for now.
+
+      // This is a very special case which we need to compile our envs before loading them correctly.
+      //   const grouped = groupBy(aspects, (aspectDef) => {
+      //     return aspectDef.component?.id.toStringWithoutVersion() === 'bitdev.general/envs/bit-env';
+      //   });
+      //   await this.reloadAspects(grouped.true || []);
+      //   const otherEnvs = grouped.false || [];
+      //   await Promise.all(
+      //     otherEnvs.map(async (aspectDef) => {
+      //       const id = aspectDef.component?.id;
+      //       if (!id) return;
+      //       await this.workspace.clearComponentCache(id);
+      //     })
+      //   );
+      //   await this.reloadAspects(grouped.false || []);
     }
   }
 

scopes/workspace/workspace/workspace-component/workspace-component-loader.ts

@@ -154,8 +154,13 @@ export class WorkspaceComponentLoader {
     components.forEach((comp) => {
       this.saveInCache(comp, { loadExtensions: true, executeLoadSlot: true });
     });
+    const idsWithEmptyStrs = ids.map((id) => id.toString());
+    const requestedComponents = components.filter(
+      (comp) =>
+        idsWithEmptyStrs.includes(comp.id.toString()) || idsWithEmptyStrs.includes(comp.id.toStringWithoutVersion())
+    );
     this.logger.profile(`getMany-${callId}`);
-    return { components, invalidComponents };
+    return { components: requestedComponents, invalidComponents };
   }
 
   private async getAndLoadSlotOrdered(
@@ -271,10 +276,22 @@ export class WorkspaceComponentLoader {
       };
     });
 
+    const layeredEnvsFromTheList = this.regroupEnvsIdsFromTheList(groupedByIsEnvOfWsComps.true, envsIdsOfWsComps);
+    const layeredEnvsGroups = layeredEnvsFromTheList.map((ids) => {
+      return {
+        ids,
+        core: false,
+        aspects: true,
+        seeders: true,
+        envs: true,
+      };
+    });
+
     const groupsToHandle = [
       // Always load first core envs
       { ids: groupedByIsCoreEnvs.true || [], core: true, aspects: true, seeders: true, envs: true },
-      { ids: groupedByIsEnvOfWsComps.true || [], core: false, aspects: true, seeders: false, envs: true },
+      // { ids: groupedByIsEnvOfWsComps.true || [], core: false, aspects: true, seeders: false, envs: true },
+      ...layeredEnvsGroups,
       { ids: extsNotFromTheList || [], core: false, aspects: true, seeders: false, envs: false },
       ...layeredExtGroups,
       { ids: groupedByIsExtOfAnother.false || [], core: false, aspects: false, seeders: true, envs: false },
@@ -296,6 +313,43 @@ export class WorkspaceComponentLoader {
     return compact(groupsByWsScope);
   }
 
+  /**
+   * This function will get a list of envs ids and will regroup them into two groups:
+   * 1. envs that are envs of envs from the group
+   * 2. other envs (envs which are just envs of regular components of the workspace)
+   * For Example:
+   * envsIds: [ReactEnv, NodeEnv, BitEnv]
+   * The env of ReactEnv and NodeEnv is BitEnv
+   * The result will be:
+   * [ [BitEnv], [ReactEnv, NodeEnv] ]
+   *
+   * At the moment this function is not recursive, in the future we might want to make it recursive
+   * @param envIds
+   * @param envsIdsOfWsComps
+   * @returns
+   */
+  private regroupEnvsIdsFromTheList(envIds: ComponentID[] = [], envsIdsOfWsComps: Set<string>): Array<ComponentID[]> {
+    const envsOfEnvs = new Set<string>();
+    envIds.forEach((envId) => {
+      const idStr = envId.toString();
+      const fromCache = this.componentsExtensionsCache.get(idStr);
+      if (!fromCache || !fromCache.extensions) {
+        return;
+      }
+      const envOfEnvId = fromCache.envId;
+      if (envOfEnvId && !envsIdsOfWsComps.has(idStr)) {
+        envsOfEnvs.add(envOfEnvId);
+      }
+    });
+    const existingEnvsOfEnvs = envIds.filter(
+      (id) => envsOfEnvs.has(id.toString()) || envsOfEnvs.has(id.toStringWithoutVersion())
+    );
+    const notExistingEnvsOfEnvs = envIds.filter(
+      (id) => !envsOfEnvs.has(id.toString()) && !envsOfEnvs.has(id.toStringWithoutVersion())
+    );
+    return [existingEnvsOfEnvs, notExistingEnvsOfEnvs];
+  }
+
   private regroupExtIdsFromTheList(ids: ComponentID[]): Array<ComponentID[]> {
     // TODO: implement this function
     // this should handle a case when you have: