@finos/legend-application-studio 26.1.10 → 27.0.0

package/src/components/editor/side-bar/Explorer.tsx

@@ -14,7 +14,13 @@
  * limitations under the License.
  */
 
-import { Fragment, useRef, useEffect, useState, forwardRef } from 'react';
+import React, {
+  Fragment,
+  useRef,
+  useEffect,
+  useState,
+  forwardRef,
+} from 'react';
 import { observer } from 'mobx-react-lite';
 import {
   type TreeNodeContainerProps,
@@ -61,6 +67,7 @@ import { LEGEND_STUDIO_TEST_ID } from '../../../__lib__/LegendStudioTesting.js';
 import {
   ACTIVITY_MODE,
   GRAPH_EDITOR_MODE,
+  PANEL_MODE,
 } from '../../../stores/editor/EditorConfig.js';
 import { getTreeChildNodes } from '../../../stores/editor/utils/PackageTreeUtils.js';
 import type { PackageTreeNodeData } from '../../../stores/editor/utils/TreeUtils.js';
@@ -76,6 +83,7 @@ import {
 import {
   guaranteeNonEmptyString,
   guaranteeNonNullable,
+  guaranteeType,
   isNonNullable,
   toTitleCase,
 } from '@finos/legend-shared';
@@ -102,6 +110,7 @@ import {
   RelationalDatabaseConnection,
   guaranteeRelationalDatabaseConnection,
   extractDependencyGACoordinateFromRootPackageName,
+  type FunctionActivatorConfiguration,
 } from '@finos/legend-graph';
 import { useApplicationStore } from '@finos/legend-application';
 import {
@@ -125,6 +134,7 @@ import {
   CodeEditor,
 } from '@finos/legend-lego/code-editor';
 import { DatabaseBuilder } from '../editor-group/connection-editor/DatabaseBuilder.js';
+import { FunctionEditorState } from '../../../stores/editor/editor-state/element-editor-state/FunctionEditorState.js';
 
 const ElementRenamer = observer(() => {
   const editorStore = useEditorStore();
@@ -513,6 +523,15 @@ const ExplorerContextMenu = observer(
         }
       },
     );
+    const openSQLPlayground = (): void => {
+      if (isRelationalDatabaseConnection(node?.packageableElement)) {
+        editorStore.panelGroupDisplayState.open();
+        editorStore.setActivePanelMode(PANEL_MODE.SQL_PLAYGROUND);
+        editorStore.sqlPlaygroundState.setConnection(
+          guaranteeType(node?.packageableElement, PackageableConnection),
+        );
+      }
+    };
     const removeElement = (): void => {
       if (node) {
         flowResult(
@@ -663,6 +682,50 @@ const ExplorerContextMenu = observer(
         ).catch(applicationStore.alertUnhandledError);
       }
     };
+    const activateFunction = (): void => {
+      if (node?.packageableElement instanceof ConcreteFunctionDefinition) {
+        editorStore.setQuickInputState({
+          title: 'Activate function',
+          placeholder: 'Select an activation...',
+          options: editorStore.graphState.functionActivatorConfigurations.map(
+            (config) => ({
+              value: config,
+              label: (
+                <div
+                  className="function-editor__activator__selector__option"
+                  title={config.description}
+                >
+                  <div className="function-editor__activator__selector__option__name">
+                    {config.name}
+                  </div>
+                  <div className="function-editor__activator__selector__option__description">
+                    {config.description}
+                  </div>
+                </div>
+              ),
+            }),
+          ),
+          getSearchValue: (option: {
+            value: FunctionActivatorConfiguration;
+            label: React.ReactNode;
+          }): string => option.value.name,
+          onSelect: (option: {
+            value: FunctionActivatorConfiguration;
+            label: React.ReactNode;
+          }) => {
+            editorStore.graphEditorMode.openElement(node.packageableElement);
+            editorStore.tabManagerState
+              .getCurrentEditorState(FunctionEditorState)
+              .activatorBuilderState.setCurrentActivatorConfiguration(
+                option.value,
+              );
+          },
+          customization: {
+            rowHeight: 70,
+          },
+        });
+      }
+    };
 
     if (isDependencyProjectRoot()) {
       return (
@@ -722,8 +785,27 @@ const ExplorerContextMenu = observer(
             <MenuContentDivider />
           </>
         )}
+        {node.packageableElement instanceof ConcreteFunctionDefinition && (
+          <>
+            {editorStore.applicationStore.config.options
+              .TEMPORARY__enableFunctionActivatorSupport && (
+              <>
+                <MenuContentItem onClick={activateFunction}>
+                  Activate...
+                </MenuContentItem>
+                <MenuContentDivider />
+              </>
+            )}
+          </>
+        )}
         {isRelationalDatabaseConnection(node.packageableElement) && (
           <>
+            {editorStore.applicationStore.config.options
+              .TEMPORARY__enableRawSQLExecutor && (
+              <MenuContentItem onClick={openSQLPlayground}>
+                Execute SQL...
+              </MenuContentItem>
+            )}
             <MenuContentItem onClick={buildDatabase}>
               Build Database...
             </MenuContentItem>

package/src/components/editor/side-bar/testable/GlobalTestRunner.tsx

@@ -54,7 +54,6 @@ import {
   type GeneratorFn,
   isNonNullable,
   prettyCONSTName,
-  toTitleCase,
 } from '@finos/legend-shared';
 import { observer } from 'mobx-react-lite';
 import { forwardRef, useEffect, useState } from 'react';
@@ -429,23 +428,28 @@ export const GlobalTestRunner = observer(
     const editorStore = useEditorStore();
     const globalTestRunnerState = props.globalTestRunnerState;
     const isDispatchingAction = globalTestRunnerState.isDispatchingAction;
-    const testRunnerTabs = (Object.values(TEST_RUNNER_TABS) as string[])
-      .concat(
-        editorStore.pluginManager
-          .getApplicationPlugins()
-          .flatMap(
-            (plugin) => plugin.getExtraTestRunnerTabClassifiers?.() ?? [],
-          ),
-      )
-      .map((e) => ({
-        value: e,
-        label: prettyCONSTName(e),
-      }));
 
     const [selectedTab, setSelectedTab] = useState(
       TEST_RUNNER_TABS.TEST_RUNNER.valueOf(),
     );
 
+    const extractTestRunnerTabConfigurations = editorStore.pluginManager
+      .getApplicationPlugins()
+      .flatMap((plugin) => plugin.getExtraTestRunnerTabConfigurations?.() ?? [])
+      .filter((configuration) => configuration.renderer(editorStore));
+
+    const testRunnerTabs = (Object.values(TEST_RUNNER_TABS) as string[])
+      .map((e) => ({
+        value: e,
+        label: prettyCONSTName(e),
+      }))
+      .concat(
+        extractTestRunnerTabConfigurations.map((config) => ({
+          value: config.key,
+          label: config.title,
+        })),
+      );
+
     const changeTab = (tab: string): void => {
       setSelectedTab(tab);
     };
@@ -544,7 +548,7 @@ export const GlobalTestRunner = observer(
                     ['panel__header__tab--active']: tab.value === selectedTab,
                   })}
                 >
-                  {toTitleCase(prettyCONSTName(tab.value))}
+                  {tab.label}
                 </div>
               ))}
             </div>
@@ -578,15 +582,9 @@ export const GlobalTestRunner = observer(
           </div>
         );
       } else {
-        const extraTestRunnerTabEditorRenderers = editorStore.pluginManager
-          .getApplicationPlugins()
-          .flatMap(
-            (plugin) => plugin.getExtraTestRunnerTabEditorRenderers?.() ?? [],
-          );
-        for (const editorRenderer of extraTestRunnerTabEditorRenderers) {
-          const editor = editorRenderer(selectedTab, editorStore);
-          if (editor) {
-            return editor;
+        for (const testRunnerTabConfiguration of extractTestRunnerTabConfigurations) {
+          if (testRunnerTabConfiguration.key === selectedTab) {
+            return testRunnerTabConfiguration.renderer(editorStore);
           }
         }
         return (

package/src/stores/LegendStudioApplicationPlugin.ts

@@ -77,10 +77,11 @@ export type TestableMetadataGetter = (
   editorStore: EditorStore,
 ) => TestableMetadata | undefined;
 
-export type TestRunnerTabRenderer = (
-  selectedTab: string,
-  editorStore: EditorStore,
-) => React.ReactNode | undefined;
+export type TestRunnerTabConfiguration = {
+  key: string;
+  title: string;
+  renderer: (editorStore: EditorStore) => React.ReactNode | undefined;
+};
 
 export abstract class LegendStudioApplicationPlugin extends LegendApplicationPlugin {
   /**
@@ -126,14 +127,9 @@ export abstract class LegendStudioApplicationPlugin extends LegendApplicationPlu
   getExtraTestableMetadata?(): TestableMetadataGetter[];
 
   /**
-   * Get the list of the supported classifers for test runner tabs.
-   */
-  getExtraTestRunnerTabClassifiers?(): string[];
-
-  /**
-   * Get the list of renderers for the editor for a test runner tab.
+   * Get the list of configurations for the editor for a test runner tab.
    */
-  getExtraTestRunnerTabEditorRenderers?(): TestRunnerTabRenderer[];
+  getExtraTestRunnerTabConfigurations?(): TestRunnerTabConfiguration[];
 }
 
 export type PureGrammarElementLabeler = (

package/src/stores/editor/EditorStore.ts

@@ -671,6 +671,9 @@ export class EditorStore implements CommandRegistrar {
         },
         {
           tracerService: this.applicationStore.tracerService,
+          TEMPORARY__enableNewServiceRegistrationInputCollectorMechanism:
+            this.applicationStore.config.options
+              .TEMPORARY__enableNewServiceRegistrationInputCollectorMechanism,
         },
       ),
     ]);

package/src/stores/editor/GraphEditFormModeState.ts

@@ -578,7 +578,6 @@ export class GraphEditFormModeState extends GraphEditorMode {
 
   *onLeave(): GeneratorFn<void> {
     this.editorStore.sqlPlaygroundState.setConnection(undefined);
-    return;
   }
 
   *cleanupBeforeEntering(fallbackOptions?: {

package/src/stores/editor/NewElementState.ts

@@ -66,7 +66,6 @@ import {
   PackageableElementExplicitReference,
   RelationalDatabaseConnection,
   DatabaseType,
-  StaticDatasourceSpecification,
   DefaultH2AuthenticationStrategy,
   ModelGenerationSpecification,
   DataElement,
@@ -74,6 +73,7 @@ import {
   Measure,
   Multiplicity,
   PrimitiveType,
+  LocalH2DatasourceSpecification,
 } from '@finos/legend-graph';
 import type { DSL_Mapping_LegendStudioApplicationPlugin_Extension } from '../extensions/DSL_Mapping_LegendStudioApplicationPlugin_Extension.js';
 import {
@@ -302,6 +302,8 @@ export class NewFlatDataConnectionDriver extends NewConnectionValueDriver<FlatDa
   }
 }
 
+const DEFAULT_H2_SQL =
+  '-- loads sample data for getting started. See https://github.com/pthom/northwind_psql for more info\n call loadNorthwindData()';
 export class NewRelationalDatabaseConnectionDriver extends NewConnectionValueDriver<RelationalDatabaseConnection> {
   constructor(editorStore: EditorStore) {
     super(editorStore);
@@ -327,10 +329,12 @@ export class NewRelationalDatabaseConnectionDriver extends NewConnectionValueDri
       const dbs = this.editorStore.graphManagerState.usableDatabases;
       selectedStore = dbs.length ? (dbs[0] as Database) : stub_Database();
     }
+    const spec = new LocalH2DatasourceSpecification();
+    spec.testDataSetupSqls = [DEFAULT_H2_SQL];
     return new RelationalDatabaseConnection(
       PackageableElementExplicitReference.create(selectedStore),
       DatabaseType.H2,
-      new StaticDatasourceSpecification('dummyHost', 80, 'myDb'),
+      spec,
       new DefaultH2AuthenticationStrategy(),
     );
   }
@@ -440,7 +444,6 @@ export class NewPackageableConnectionDriver extends NewElementDriver<Packageable
       this.store = store;
       this.newConnectionValueDriver = newDriver;
     }
-    return;
   }
 
   get isValid(): boolean {

package/src/stores/editor/QuickInputState.ts

@@ -21,4 +21,7 @@ export type QuickInputState<T> = {
   options: QuickInputOption<T>[];
   getSearchValue: (option: QuickInputOption<T>) => string;
   onSelect: (option: QuickInputOption<T>) => void;
+  customization?: {
+    rowHeight?: number | undefined;
+  };
 };

package/src/stores/editor/editor-state/element-editor-state/FunctionEditorState.ts

@@ -21,6 +21,7 @@ import {
   makeObservable,
   flow,
   flowResult,
+  override,
 } from 'mobx';
 import type { EditorStore } from '../../EditorStore.js';
 import {
@@ -50,6 +51,7 @@ import {
   buildLambdaVariableExpressions,
   VariableExpression,
   observe_ValueSpecification,
+  generateFunctionPrettyName,
 } from '@finos/legend-graph';
 import {
   ExecutionPlanState,
@@ -254,13 +256,14 @@ export class FunctionEditorState extends ElementEditorState {
 
     makeObservable(this, {
       selectedTab: observable,
-      functionElement: computed,
-      setSelectedTab: action,
-      reprocess: action,
       isRunningQuery: observable,
       isGeneratingPlan: observable,
       executionResultText: observable,
       executionPlanState: observable,
+      label: override,
+      functionElement: computed,
+      setSelectedTab: action,
+      reprocess: action,
       setExecutionResultText: action,
       setIsRunningQuery: action,
       runQuery: flow,
@@ -287,6 +290,13 @@ export class FunctionEditorState extends ElementEditorState {
     this.parametersState = new FunctionParametersState(this);
   }
 
+  override get label(): string {
+    return generateFunctionPrettyName(this.functionElement, {
+      fullPath: true,
+      spacing: false,
+    });
+  }
+
   get functionElement(): ConcreteFunctionDefinition {
     return guaranteeType(
       this.element,
@@ -512,15 +522,15 @@ export class FunctionEditorState extends ElementEditorState {
         );
       }
     } catch (error) {
-      // When user cancels the query by calling the cancelQuery api, it will throw an exeuction failure error.
+      // When user cancels the query by calling the cancelQuery api, it will throw an execution failure error.
       // For now, we don't want to notify users about this failure. Therefore we check to ensure the promise is still the same one.
       // When cancelled the query, we set the queryRunPromise as undefined.
-      this.editorStore.applicationStore.logService.error(
-        LogEvent.create(GRAPH_MANAGER_EVENT.EXECUTION_FAILURE),
-        error,
-      );
       if (this.queryRunPromise === promise) {
         assertErrorThrown(error);
+        this.editorStore.applicationStore.logService.error(
+          LogEvent.create(GRAPH_MANAGER_EVENT.EXECUTION_FAILURE),
+          error,
+        );
         this.editorStore.applicationStore.notificationService.notifyError(
           error,
         );

package/src/stores/editor/editor-state/element-editor-state/mapping/DEPRECATED__MappingTestState.ts

@@ -476,6 +476,7 @@ export class DEPRECATED__MappingTestState extends MappingEditorTabState {
   get label(): string {
     return this.test.name;
   }
+
   setIsRunningTest(val: boolean): void {
     this.isRunningTest = val;
   }
@@ -703,75 +704,6 @@ export class DEPRECATED__MappingTestState extends MappingEditorTabState {
     }
   }
 
-  *runTest(): GeneratorFn<void> {
-    if (DEPRECATED__validate_MappingTest(this.test)) {
-      this.editorStore.applicationStore.notificationService.notifyError(
-        `Can't run test '${this.test.name}'. Please make sure that the test is valid`,
-      );
-      return;
-    } else if (this.isExecutingTest) {
-      this.editorStore.applicationStore.notificationService.notifyWarning(
-        `Test '${this.test.name}' is already running`,
-      );
-      return;
-    }
-    const startTime = Date.now();
-    let promise;
-    try {
-      const runtime = this.inputDataState.runtime;
-      this.isRunningTest = true;
-      promise = this.editorStore.graphManagerState.graphManager.runQuery(
-        this.test.query,
-        this.mappingEditorState.mapping,
-        runtime,
-        this.editorStore.graphManagerState.graph,
-        {
-          useLosslessParse: true,
-        },
-      );
-      this.setTestRunPromise(promise);
-      const result = (yield promise) as ExecutionResult;
-      if (this.testRunPromise === promise) {
-        this.handleResult(result);
-      }
-    } catch (error) {
-      // When user cancels the query by calling the cancelQuery api, it will throw an exeuction failure error.
-      // For now, we don't want to notify users about this failure. Therefore we check to ensure the promise is still the same one.
-      // When cancelled the query, we set the queryRunPromise as undefined.
-      if (this.testRunPromise === promise) {
-        assertErrorThrown(error);
-        this.handleError(error, promise);
-      }
-    } finally {
-      this.isRunningTest = false;
-      this.runTime = Date.now() - startTime;
-      // if the test is currently opened and ran but did not pass, switch to the result tab
-      if (
-        [TEST_RESULT.FAILED, TEST_RESULT.ERROR].includes(this.result) &&
-        this.testRunPromise === promise &&
-        this.mappingEditorState.currentTabState === this
-      ) {
-        this.setSelectedTab(MAPPING_TEST_EDITOR_TAB_TYPE.RESULT);
-      }
-    }
-  }
-
-  *cancelTest(): GeneratorFn<void> {
-    this.setIsRunningTest(false);
-    this.setTestRunPromise(undefined);
-    try {
-      yield this.editorStore.graphManagerState.graphManager.cancelUserExecutions(
-        true,
-      );
-    } catch (error) {
-      // don't notify users about success or failure
-      this.editorStore.applicationStore.logService.error(
-        LogEvent.create(GRAPH_MANAGER_EVENT.EXECUTION_FAILURE),
-        error,
-      );
-    }
-  }
-
   handleResult(result: ExecutionResult): void {
     this.testExecutionResultText = stringifyLosslessJSON(
       extractExecutionResultValues(result),
@@ -843,6 +775,75 @@ export class DEPRECATED__MappingTestState extends MappingEditorTabState {
     );
   }
 
+  *runTest(): GeneratorFn<void> {
+    if (DEPRECATED__validate_MappingTest(this.test)) {
+      this.editorStore.applicationStore.notificationService.notifyError(
+        `Can't run test '${this.test.name}'. Please make sure that the test is valid`,
+      );
+      return;
+    } else if (this.isExecutingTest) {
+      this.editorStore.applicationStore.notificationService.notifyWarning(
+        `Test '${this.test.name}' is already running`,
+      );
+      return;
+    }
+    const startTime = Date.now();
+    let promise;
+    try {
+      const runtime = this.inputDataState.runtime;
+      this.isRunningTest = true;
+      promise = this.editorStore.graphManagerState.graphManager.runQuery(
+        this.test.query,
+        this.mappingEditorState.mapping,
+        runtime,
+        this.editorStore.graphManagerState.graph,
+        {
+          useLosslessParse: true,
+        },
+      );
+      this.setTestRunPromise(promise);
+      const result = (yield promise) as ExecutionResult;
+      if (this.testRunPromise === promise) {
+        this.handleResult(result);
+      }
+    } catch (error) {
+      // When user cancels the query by calling the cancelQuery api, it will throw an execution failure error.
+      // For now, we don't want to notify users about this failure. Therefore we check to ensure the promise is still the same one.
+      // When cancelled the query, we set the queryRunPromise as undefined.
+      if (this.testRunPromise === promise) {
+        assertErrorThrown(error);
+        this.handleError(error, promise);
+      }
+    } finally {
+      this.isRunningTest = false;
+      this.runTime = Date.now() - startTime;
+      // if the test is currently opened and ran but did not pass, switch to the result tab
+      if (
+        [TEST_RESULT.FAILED, TEST_RESULT.ERROR].includes(this.result) &&
+        this.testRunPromise === promise &&
+        this.mappingEditorState.currentTabState === this
+      ) {
+        this.setSelectedTab(MAPPING_TEST_EDITOR_TAB_TYPE.RESULT);
+      }
+    }
+  }
+
+  *cancelTest(): GeneratorFn<void> {
+    this.setIsRunningTest(false);
+    this.setTestRunPromise(undefined);
+    try {
+      yield this.editorStore.graphManagerState.graphManager.cancelUserExecutions(
+        true,
+      );
+    } catch (error) {
+      // don't notify users about success or failure
+      this.editorStore.applicationStore.logService.error(
+        LogEvent.create(GRAPH_MANAGER_EVENT.EXECUTION_FAILURE),
+        error,
+      );
+    }
+  }
+
   *generatePlan(debug: boolean): GeneratorFn<void> {
     try {
       this.isGeneratingPlan = true;