@teambit/envs 0.0.568 → 0.0.572

package/components/env-console/env-console.tsx

@@ -0,0 +1,30 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Box, Text } from 'ink';
+import React, { useEffect, useState } from 'react';
+
+import { EnvRuntime } from '../../runtime';
+
+export type EnvConsoleProps = {
+  runtime: EnvRuntime;
+};
+
+export function EnvConsole() {
+  const [counter, setCounter] = useState(0);
+
+  useEffect(() => {
+    const timer = setInterval(() => {
+      setCounter((previousCounter) => previousCounter + 1);
+    }, 100);
+
+    return () => {
+      clearInterval(timer);
+    };
+  }, []);
+
+  return (
+    <Box>
+      <Text color="green">{counter} tests passed</Text>
+    </Box>
+  );
+}

package/components/env-console/index.ts

@@ -0,0 +1 @@
+export { EnvConsole } from './env-console';

package/components/env-overview/env-overview.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import { Text, Newline } from 'ink';
+import { EnvDefinition } from '../../env-definition';
+
+export type EnvOverviewProps = {
+  envDef: EnvDefinition;
+};
+
+/**
+ * renders an env overview in the terminal.
+ */
+export function EnvOverview({ envDef }: EnvOverviewProps) {
+  return (
+    <Text>
+      <Text bold underline>
+        Environment: {envDef.id}
+      </Text>
+      <Newline />
+    </Text>
+  );
+}

package/components/env-overview/index.ts

@@ -0,0 +1 @@
+export { EnvOverview } from './env-overview';

package/components/index.ts

@@ -0,0 +1 @@
+export { EnvConsole } from './env-console';

package/context/context.ts

@@ -0,0 +1,54 @@
+import { EnvDefinition } from '../env-definition';
+
+import { EnvRuntime, Runtime } from '../runtime';
+
+export type ServiceMap<T> = {
+  [env: string]: T;
+};
+
+export class ExecutionContext {
+  constructor(
+    /**
+     * upper scope of all environment contexts.
+     */
+    readonly upper: Runtime,
+
+    /**
+     * runtime instance of the environment.
+     */
+    readonly envRuntime: EnvRuntime,
+
+    /**
+     * components applied in the execution context.
+     */
+    public components = envRuntime.components
+  ) {}
+
+  relatedContexts: string[] = [];
+
+  /**
+   * extension ID of the environment
+   */
+  get id() {
+    return this.envRuntime.id;
+  }
+
+  /**
+   * environment instance.
+   */
+  get env(): any {
+    return this.envRuntime.env;
+  }
+
+  get envDefinition(): EnvDefinition {
+    return new EnvDefinition(this.id, this.env);
+  }
+
+  apply<T>(name: string, args: any[]): T {
+    if (!this.env[name]) {
+      throw new Error(`method ${name} not implemented`);
+    }
+
+    return this.env[name].apply(this.env, ...args);
+  }
+}

package/context/index.ts

@@ -0,0 +1 @@
+export { ExecutionContext } from './context';

package/envs.cmd.tsx

@@ -0,0 +1,87 @@
+import React from 'react';
+import { Text, Newline } from 'ink';
+import { CLITable } from '@teambit/cli-table';
+import { Command } from '@teambit/cli';
+import { ComponentMain, ComponentFactory, Component } from '@teambit/component';
+import { EnvsMain } from './environments.main.runtime';
+import { EnvOverview } from './components/env-overview';
+
+export class EnvsCmd implements Command {
+  name = 'envs [name]';
+  alias = 'env';
+  shortDescription = 'show all component envs';
+  description = 'show all components envs';
+  options = [];
+  group = 'development';
+
+  constructor(private envs: EnvsMain, private componentAspect: ComponentMain) {}
+
+  async showEnv(id: string, host: ComponentFactory) {
+    const component = await host.get(await host.resolveComponentId(id));
+    if (!component) throw new Error(`component for env ${id} was not found`);
+    const env = this.envs.getEnv(component);
+    const envRuntime = await this.envs.createEnvironment([component]);
+    const envExecutionContext = envRuntime.getEnvExecutionContext();
+    const services = this.envs.getServices(env);
+    const allP = services.services.map(async ([serviceId, service]) => {
+      if (service.render)
+        return (
+          <Text>
+            <Text bold underline color="cyan">
+              {serviceId}
+            </Text>
+            <Newline />
+            <Newline />
+            {await service.render(env, envExecutionContext)}
+          </Text>
+        );
+      return (
+        <Text key={serviceId}>
+          <Text bold underline>
+            {serviceId}
+          </Text>
+        </Text>
+      );
+    });
+
+    const all = await Promise.all(allP);
+
+    return (
+      <Text>
+        <EnvOverview envDef={env} />
+        {all.map((item) => item)}
+      </Text>
+    );
+  }
+
+  async render([name]: [string]): Promise<JSX.Element> {
+    const host = await this.componentAspect.getHost();
+    // TODO: think what to do re this line with gilad.
+    if (!host) throw new Error('error: workspace not found');
+    if (name) return this.showEnv(name, host);
+    const components = await host.list();
+    // TODO: refactor to a react table
+    return <Text>{this.getTable(components)}</Text>;
+  }
+
+  private getTable(components: Component[]) {
+    const tableData = components.map((component) => {
+      const env = this.envs.getDescriptor(component);
+      return {
+        component: component.id.toString(),
+        env: env ? env.id : 'N/A',
+      };
+    });
+
+    const header = [
+      {
+        value: 'component',
+      },
+      {
+        value: 'env',
+      },
+    ];
+    const table = CLITable.fromObject(header, tableData);
+    return table.render();
+  }
+}

package/exceptions/env-not-configured-for-component.ts

@@ -0,0 +1,10 @@
+import { BitError } from '@teambit/bit-error';
+
+export class EnvNotConfiguredForComponent extends BitError {
+  constructor(id: string, componentId?: string) {
+    const suffix = componentId ? ` for the component ${componentId}` : '';
+    super(`environment with ID: "${id}" is not configured as extension${suffix}.
+you probably need to add this environment as a key to your variant in the workspace.jsonc. for example, "your-variant": { "${id}": {} }
+`);
+  }
+}

package/exceptions/env-not-found-in-runtime.ts

@@ -0,0 +1,7 @@
+import { BitError } from '@teambit/bit-error';
+
+export class EnvNotFoundInRuntime extends BitError {
+  constructor(private id: string) {
+    super(`environment with ID: ${id} was not found configured to any of your components`);
+  }
+}

package/exceptions/env-not-found.ts

@@ -0,0 +1,12 @@
+import { BitError } from '@teambit/bit-error';
+
+export class EnvNotFound extends BitError {
+  constructor(private id: string, private componentId?: string) {
+    super(getMessage(id, componentId));
+  }
+}
+
+function getMessage(id: string, componentId?: string): string {
+  const compIdDetails = componentId ? `configured on component ${componentId}` : '';
+  return `environment with ID: ${id} ${compIdDetails} was not found`;
+}

package/exceptions/index.ts

@@ -0,0 +1,3 @@
+export { EnvNotFoundInRuntime } from './env-not-found-in-runtime';
+export { EnvNotFound } from './env-not-found';
+export { EnvNotConfiguredForComponent } from './env-not-configured-for-component';

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/envs",
-  "version": "0.0.568",
+  "version": "0.0.572",
   "homepage": "https://bit.dev/teambit/envs/envs",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.envs",
     "name": "envs",
-    "version": "0.0.568"
+    "version": "0.0.572"
   },
   "dependencies": {
     "@teambit/harmony": "0.2.11",
@@ -16,23 +16,23 @@
     "p-map-series": "2.1.0",
     "@babel/runtime": "7.12.18",
     "core-js": "^3.0.0",
-    "@teambit/component": "0.0.568",
-    "@teambit/builder": "0.0.568",
-    "@teambit/bundler": "0.0.568",
-    "@teambit/compiler": "0.0.568",
-    "@teambit/dependency-resolver": "0.0.568",
-    "@teambit/elements": "0.0.21",
-    "@teambit/formatter": "0.0.119",
-    "@teambit/linter": "0.0.568",
-    "@teambit/pkg": "0.0.568",
-    "@teambit/schema": "0.0.568",
-    "@teambit/tester": "0.0.568",
-    "@teambit/webpack": "0.0.568",
-    "@teambit/graphql": "0.0.568",
-    "@teambit/cli": "0.0.394",
-    "@teambit/logger": "0.0.480",
-    "@teambit/cli-table": "0.0.17",
-    "@teambit/bit-error": "0.0.380"
+    "@teambit/component": "0.0.572",
+    "@teambit/builder": "0.0.572",
+    "@teambit/bundler": "0.0.572",
+    "@teambit/compiler": "0.0.572",
+    "@teambit/dependency-resolver": "0.0.572",
+    "@teambit/elements": "0.0.25",
+    "@teambit/formatter": "0.0.123",
+    "@teambit/linter": "0.0.572",
+    "@teambit/pkg": "0.0.572",
+    "@teambit/schema": "0.0.572",
+    "@teambit/tester": "0.0.572",
+    "@teambit/webpack": "0.0.572",
+    "@teambit/graphql": "0.0.572",
+    "@teambit/cli": "0.0.395",
+    "@teambit/logger": "0.0.483",
+    "@teambit/cli-table": "0.0.18",
+    "@teambit/bit-error": "0.0.381"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -42,10 +42,10 @@
     "@types/jest": "^26.0.0",
     "@types/react-dom": "^17.0.5",
     "@types/node": "12.20.4",
-    "@teambit/envs.aspect-docs.envs": "0.0.114"
+    "@teambit/envs.aspect-docs.envs": "0.0.117"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.180",
+    "@teambit/legacy": "1.0.181",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -73,27 +73,12 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.180",
+        "@teambit/legacy": "1.0.181",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }
     }
   },
-  "files": [
-    "dist",
-    "!dist/tsconfig.tsbuildinfo",
-    "**/*.md",
-    "**/*.mdx",
-    "**/*.js",
-    "**/*.json",
-    "**/*.sass",
-    "**/*.scss",
-    "**/*.less",
-    "**/*.css",
-    "**/*.css",
-    "**/*.jpeg",
-    "**/*.gif"
-  ],
   "private": false,
   "engines": {
     "node": ">=12.22.0"

package/runtime/env-runtime.ts

@@ -0,0 +1,25 @@
+import { Component } from '@teambit/component';
+
+import { Environment } from '../environment';
+
+/**
+ * env runtime is an instance which represent the given env in a
+ */
+export class EnvRuntime {
+  constructor(
+    /**
+     * ID of the wrapping extension.
+     */
+    readonly id: string,
+
+    /**
+     * environment
+     */
+    readonly env: Environment,
+
+    /**
+     * components to be loaded in the environment
+     */
+    readonly components: Component[]
+  ) {}
+}

package/runtime/envs-execution-result.ts

@@ -0,0 +1,46 @@
+import { flatten } from 'lodash';
+
+import { ServiceExecutionResult } from '../services';
+import { EnvResult } from './runtime';
+
+export class EnvsExecutionResult<T extends ServiceExecutionResult> {
+  constructor(readonly results: EnvResult<T>[]) {}
+
+  hasErrors() {
+    return Boolean(this.errors.length);
+  }
+
+  /**
+   * execution errors.
+   */
+  get errors(): Error[] {
+    return flatten(this.results.map((envResult) => this.getErrorsOfEnv(envResult)));
+  }
+
+  getErrorsOfEnv(envResult: EnvResult<T>): Error[] {
+    const execError = envResult.error;
+    const errors = envResult.data ? envResult.data.errors || [] : [];
+    if (execError) errors.push(execError);
+    return errors;
+  }
+
+  /**
+   * if only one error is found, throw it. otherwise, summarize the errors per env and throw the
+   * output
+   */
+  throwErrorsIfExist() {
+    if (!this.errors || !this.errors.length) return;
+    if (this.errors.length === 1 && this.errors[0] instanceof Error) throw this.errors[0];
+    const errorsPerEnvs = this.results.map((envResult) => this.getEnvErrorsAsString(envResult));
+    const errorOutput = errorsPerEnvs.join('\n\n');
+    throw new Error(errorOutput);
+  }
+
+  getEnvErrorsAsString(envResult: EnvResult<T>): string {
+    const errors = this.getErrorsOfEnv(envResult);
+    if (!errors.length) return '';
+    const title = `found ${errors.length} error(s) for ${envResult.env.id}`;
+    const errorsStr = errors.map((error) => `${error.message}\n${error.stack}`).join('\n');
+    return `${title}\n${errorsStr}`;
+  }
+}

package/runtime/index.ts

@@ -0,0 +1,2 @@
+export { Runtime } from './runtime';
+export { EnvRuntime } from './env-runtime';

package/runtime/runtime.ts

@@ -0,0 +1,97 @@
+import { Logger } from '@teambit/logger';
+import { ComponentID } from '@teambit/component';
+import mapSeries from 'p-map-series';
+import { EnvNotFoundInRuntime } from '../exceptions';
+import { ExecutionContext } from '../context';
+import { EnvService, ServiceExecutionResult } from '../services';
+import { EnvRuntime } from './env-runtime';
+import { EnvsExecutionResult } from './envs-execution-result';
+
+export interface EnvResult<T extends ServiceExecutionResult> {
+  env: EnvRuntime;
+  data?: T;
+  error?: Error;
+}
+
+export class Runtime {
+  constructor(
+    /**
+     * runtime instances of the environments.
+     */
+    readonly runtimeEnvs: EnvRuntime[],
+
+    private logger: Logger
+  ) {}
+
+  /**
+   * execute a service on a specific env.
+   */
+  runEnv<T>(
+    envRuntimeId: string,
+    service: EnvService<T>,
+    options?: { [key: string]: any }
+  ): Promise<EnvsExecutionResult<T>> {
+    const envRuntime = this.runtimeEnvs.find((runtime) => {
+      const id = ComponentID.fromString(runtime.id);
+      const withoutVersion = id._legacy.toStringWithoutVersion();
+      return withoutVersion === envRuntimeId;
+    });
+    if (!envRuntime) throw new EnvNotFoundInRuntime(envRuntimeId);
+    return this.run(service, options, [envRuntime]);
+  }
+
+  /**
+   * execute a service once for all environments.
+   */
+  async runOnce<T>(service: EnvService<T>, options?: { [key: string]: any }): Promise<any> {
+    if (!service.runOnce) throw new Error('a service must implement `runOnce()` in order to be executed');
+    const envsExecutionContext = this.getEnvExecutionContext();
+    const serviceResult = await service.runOnce(envsExecutionContext, options);
+    return serviceResult;
+  }
+
+  getEnvExecutionContext(): ExecutionContext[] {
+    const envsExecutionContext = this.runtimeEnvs.map((env) => new ExecutionContext(this, env));
+    return envsExecutionContext;
+  }
+
+  /**
+   * execute a service on each one of the environments.
+   */
+  async run<T>(
+    /**
+     * environment service to execute.
+     */
+    service: EnvService<T>,
+
+    /**
+     * options to proxy to the service upon execution.
+     */
+    options?: { [key: string]: any },
+    runtimes?: EnvRuntime[]
+  ): Promise<EnvsExecutionResult<T>> {
+    if (!service.run) throw new Error('a service must implement `run()` in order to be executed');
+    const errors: Error[] = [];
+    const contexts: EnvResult<T>[] = await mapSeries(runtimes || this.runtimeEnvs, async (env) => {
+      try {
+        // @ts-ignore
+        const serviceResult = await service.run(new ExecutionContext(this, env), options);
+
+        return {
+          env,
+          data: serviceResult,
+        };
+      } catch (err: any) {
+        this.logger.error(err.message, err);
+        this.logger.consoleFailure(`service ${service.name} env ${env.id} has failed. ${err.message}`);
+        errors.push(err);
+        return {
+          env,
+          error: err,
+        };
+      }
+    });
+
+    return new EnvsExecutionResult(contexts);
+  }
+}

package/services/concrete-service.ts

@@ -0,0 +1,8 @@
+/**
+ * please do not use this.
+ * @deprecated
+ */
+export interface ConcreteService {
+  getPackageJsonProps?: () => Record<string, any>;
+  dependencies?: () => any;
+}

package/services/index.ts

@@ -0,0 +1,3 @@
+export { Service as EnvService, ServiceExecutionResult } from './service';
+export { ConcreteService } from './concrete-service';
+export { ServiceHandler } from './service-handler';

package/services/service-handler.ts

@@ -0,0 +1,6 @@
+/**
+ * definition of the service handler.
+ */
+export interface ServiceHandler {
+  identifier: string;
+}

package/services/service.ts

@@ -0,0 +1,52 @@
+import { Component } from '@teambit/component';
+import { Environment } from '../environment';
+
+export type EnvContext = {
+  components: Component[];
+};
+
+export interface ServiceExecutionResult {
+  errors?: Error[];
+}
+
+/**
+ * services allows to reuse and standardize services for development environments.
+ * examples for services can be: `linting`, `compilation`, `build`, and others which offer
+ * standard services to environments such as `react`, `angular` and `vue` and different compositions of each for
+ * more concrete needs.
+ *
+ * `TData` - type of data returned by the service handler.
+ * `TOpts` is the type of options passed to the environment through execution.
+ * `TExecResponse` is the execution result of the service.
+ */
+export interface Service<TExecResponse extends ServiceExecutionResult, TData = {}, TOpts = {}> {
+  /**
+   * name of the service. (e.g. `compile`, `test`, etc.)
+   */
+  name?: string;
+
+  /**
+   * description of the env.
+   */
+  description?: string;
+
+  /**
+   * create a string to describe to service in the env cli.
+   */
+  render?(env: Environment, context: EnvContext[]): JSX.Element | Promise<JSX.Element>;
+
+  /**
+   * get service data from an environment.
+   */
+  getDescriptor?(environment: Environment, context?: EnvContext[]): TData | undefined | Promise<TData | undefined>;
+
+  /**
+   * executes a service on a subset of components.
+   */
+  run?(context: EnvContext, options?: TOpts): Promise<TExecResponse>;
+
+  /**
+   *
+   */
+  runOnce?(context: EnvContext[], options?: TOpts): Promise<any>;
+}

package/types/asset.d.ts

@@ -0,0 +1,29 @@
+declare module '*.png' {
+  const value: any;
+  export = value;
+}
+declare module '*.svg' {
+  import type { FunctionComponent, SVGProps } from 'react';
+
+  export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
+  const src: string;
+  export default src;
+}
+
+// @TODO Gilad
+declare module '*.jpg' {
+  const value: any;
+  export = value;
+}
+declare module '*.jpeg' {
+  const value: any;
+  export = value;
+}
+declare module '*.gif' {
+  const value: any;
+  export = value;
+}
+declare module '*.bmp' {
+  const value: any;
+  export = value;
+}

package/types/style.d.ts

@@ -0,0 +1,42 @@
+declare module '*.module.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.module.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.mdx' {
+  const component: any;
+  export default component;
+}