@finos/legend-application-studio 28.1.4 → 28.2.1

package/src/components/editor/editor-group/FunctionEditor.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useState, useEffect, useCallback, useRef } from 'react';
+import React, { useState, useEffect, useCallback, useRef } from 'react';
 import { observer } from 'mobx-react-lite';
 import {
   FunctionEditorState,
@@ -27,6 +27,7 @@ import {
 } from '../../../stores/editor/utils/DnDUtils.js';
 import {
   assertErrorThrown,
+  assertTrue,
   prettyCONSTName,
   returnUndefOnError,
   UnsupportedOperationError,
@@ -61,6 +62,7 @@ import {
   PauseCircleIcon,
   PlayIcon,
   PanelLoadingIndicator,
+  PencilIcon,
 } from '@finos/legend-art';
 import { LEGEND_STUDIO_TEST_ID } from '../../../__lib__/LegendStudioTesting.js';
 import {
@@ -98,6 +100,7 @@ import {
   getClassProperty,
   RawExecutionResult,
   extractExecutionResultValues,
+  RawLambda,
 } from '@finos/legend-graph';
 import {
   type ApplicationStore,
@@ -131,7 +134,9 @@ import {
 } from '../../../stores/graph-modifier/RawValueSpecificationGraphModifierHelper.js';
 import { LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../../../__lib__/LegendStudioApplicationNavigationContext.js';
 import {
+  type QueryBuilderState,
   ExecutionPlanViewer,
+  FunctionQueryBuilderState,
   LambdaEditor,
   LambdaParameterValuesEditor,
 } from '@finos/legend-query-builder';
@@ -1055,7 +1060,7 @@ export const FunctionEditor = observer(() => {
   const debugPlanGeneration = applicationStore.guardUnhandledError(() =>
     flowResult(functionEditorState.generatePlan(true)),
   );
-
+  const embeddedQueryBuilderState = editorStore.embeddedQueryBuilderState;
   useEffect(() => {
     flowResult(
       functionEditorState.functionDefinitionEditorState.convertLambdaObjectToGrammarString(
@@ -1071,6 +1076,88 @@ export const FunctionEditor = observer(() => {
     LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.FUNCTION_EDITOR,
   );
 
+  const editWithQueryBuilder = (): (() => void) =>
+    applicationStore.guardUnhandledError(async () => {
+      try {
+        const functionQueryBuilderState = new FunctionQueryBuilderState(
+          embeddedQueryBuilderState.editorStore.applicationStore,
+          embeddedQueryBuilderState.editorStore.graphManagerState,
+          functionEditorState.functionElement,
+        );
+        functionQueryBuilderState.initializeWithQuery(
+          new RawLambda(
+            functionEditorState.functionElement.parameters.map((_param) =>
+              functionEditorState.editorStore.graphManagerState.graphManager.serializeRawValueSpecification(
+                _param,
+              ),
+            ),
+            functionEditorState.functionElement.expressionSequence,
+          ),
+        );
+        assertTrue(
+          Boolean(
+            functionQueryBuilderState.isQuerySupported &&
+              functionQueryBuilderState.executionContextState.mapping &&
+              functionQueryBuilderState.executionContextState.runtimeValue,
+          ),
+          `Only functions returning TDS/graph fetch using the from() function can be edited via query builder`,
+        );
+        await flowResult(
+          embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration({
+            setupQueryBuilderState: (): QueryBuilderState =>
+              functionQueryBuilderState,
+            actionConfigs: [
+              {
+                key: 'save-query-btn',
+                renderer: (
+                  queryBuilderState: QueryBuilderState,
+                ): React.ReactNode => {
+                  const save = applicationStore.guardUnhandledError(
+                    async () => {
+                      try {
+                        const rawLambda = queryBuilderState.buildQuery();
+                        await flowResult(
+                          functionEditorState.updateFunctionWithQuery(
+                            rawLambda,
+                          ),
+                        );
+                        applicationStore.notificationService.notifySuccess(
+                          `Function query is updated`,
+                        );
+                        embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration(
+                          undefined,
+                        );
+                      } catch (error) {
+                        assertErrorThrown(error);
+                        applicationStore.notificationService.notifyError(
+                          `Can't save query: ${error.message}`,
+                        );
+                      }
+                    },
+                  );
+                  return (
+                    <button
+                      className="query-builder__dialog__header__custom-action"
+                      tabIndex={-1}
+                      disabled={isReadOnly}
+                      onClick={save}
+                    >
+                      Save Query
+                    </button>
+                  );
+                },
+              },
+            ],
+          }),
+        );
+      } catch (error) {
+        assertErrorThrown(error);
+        applicationStore.notificationService.notifyError(
+          `Unable to edit via query builder: ${error.message}`,
+        );
+      }
+    });
+
   return (
     <div className="function-editor uml-editor uml-editor--dark">
       <Panel>
@@ -1102,6 +1189,17 @@ export const FunctionEditor = observer(() => {
             ))}
           </div>
           <div className="panel__header__actions">
+            <div className="btn__dropdown-combo btn__dropdown-combo--primary">
+              <button
+                className="btn__dropdown-combo__label"
+                onClick={editWithQueryBuilder()}
+                title="Edit Query"
+                tabIndex={-1}
+              >
+                <PencilIcon className="btn__dropdown-combo__label__icon" />
+                <div className="btn__dropdown-combo__label__title">Edit</div>
+              </button>
+            </div>
             <div className="btn__dropdown-combo btn__dropdown-combo--primary">
               {functionEditorState.isRunningFunc ? (
                 <button

package/src/components/editor/editor-group/project-configuration-editor/ProjectDependencyEditor.tsx

@@ -850,19 +850,17 @@ const ProjectVersionDependencyEditor = observer(
       }
     };
     const viewProject = (): void => {
-      if (!projectDependency.isLegacyDependency) {
-        applicationStore.navigationService.navigator.visitAddress(
-          applicationStore.navigationService.navigator.generateAddress(
-            generateViewProjectByGAVRoute(
-              guaranteeNonNullable(projectDependency.groupId),
-              guaranteeNonNullable(projectDependency.artifactId),
-              projectDependency.versionId === MASTER_SNAPSHOT_ALIAS
-                ? SNAPSHOT_VERSION_ALIAS
-                : projectDependency.versionId,
-            ),
+      applicationStore.navigationService.navigator.visitAddress(
+        applicationStore.navigationService.navigator.generateAddress(
+          generateViewProjectByGAVRoute(
+            guaranteeNonNullable(projectDependency.groupId),
+            guaranteeNonNullable(projectDependency.artifactId),
+            projectDependency.versionId === MASTER_SNAPSHOT_ALIAS
+              ? SNAPSHOT_VERSION_ALIAS
+              : projectDependency.versionId,
           ),
-        );
-      }
+        ),
+      );
     };
     // NOTE: This assumes that the dependant project is in the same studio instance as the current project
     // In the future, the studio instance may be part of the project data
@@ -927,11 +925,7 @@ const ProjectVersionDependencyEditor = observer(
           content={
             <MenuContent>
               <MenuContentItem
-                disabled={
-                  projectDependency.isLegacyDependency ||
-                  !selectedProject ||
-                  !selectedVersionOption
-                }
+                disabled={!selectedProject || !selectedVersionOption}
                 onClick={viewProject}
                 title="View project"
               >
@@ -940,7 +934,6 @@ const ProjectVersionDependencyEditor = observer(
               <MenuContentItem
                 title="View SDLC project"
                 disabled={
-                  projectDependency.isLegacyDependency ||
                   !selectedProject ||
                   !selectedVersionOption ||
                   !projectDependencyData

package/src/components/editor/editor-group/service-editor/ServiceExecutionQueryEditor.tsx

@@ -36,7 +36,6 @@ import { assertErrorThrown } from '@finos/legend-shared';
 import { flowResult } from 'mobx';
 import { useEditorStore } from '../../EditorStoreProvider.js';
 import {
-  isStubbed_PackageableElement,
   isStubbed_RawLambda,
   KeyedExecutionParameter,
 } from '@finos/legend-graph';
@@ -115,91 +114,78 @@ export const ServiceExecutionQueryEditor = observer(
       applicationStore.guardUnhandledError(async () => {
         const selectedExecutionState =
           executionState.selectedExecutionContextState;
-        if (selectedExecutionState?.executionContext.mapping === undefined) {
-          applicationStore.notificationService.notifyError(
-            'Editing query without runtime and mapping is unsupported via query builder, please leverage the text mode to edit query',
-          );
-          executionState.setOpeningQueryEditor(false);
-        } else {
-          const mapping = selectedExecutionState.executionContext.mapping.value;
-          if (!isStubbed_PackageableElement(mapping)) {
-            await flowResult(
-              embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration({
-                setupQueryBuilderState: (): QueryBuilderState => {
-                  const queryBuilderState = new ServiceQueryBuilderState(
-                    embeddedQueryBuilderState.editorStore.applicationStore,
-                    embeddedQueryBuilderState.editorStore.graphManagerState,
-                    service,
-                    undefined,
-                    selectedExecutionState.executionContext instanceof
-                    KeyedExecutionParameter
-                      ? selectedExecutionState.executionContext.key
-                      : undefined,
+
+        await flowResult(
+          embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration({
+            setupQueryBuilderState: (): QueryBuilderState => {
+              const queryBuilderState = new ServiceQueryBuilderState(
+                embeddedQueryBuilderState.editorStore.applicationStore,
+                embeddedQueryBuilderState.editorStore.graphManagerState,
+                service,
+                undefined,
+                selectedExecutionState?.executionContext instanceof
+                KeyedExecutionParameter
+                  ? selectedExecutionState.executionContext.key
+                  : undefined,
+              );
+              queryBuilderState.initializeWithQuery(
+                executionState.execution.func,
+              );
+              if (openInTextMode) {
+                queryBuilderState.textEditorState.openModal(
+                  QueryBuilderTextEditorMode.TEXT,
+                );
+              }
+              return queryBuilderState;
+            },
+            actionConfigs: [
+              {
+                key: 'save-query-btn',
+                renderer: (
+                  queryBuilderState: QueryBuilderState,
+                ): React.ReactNode => {
+                  const save = applicationStore.guardUnhandledError(
+                    async () => {
+                      try {
+                        const rawLambda = queryBuilderState.buildQuery();
+                        await flowResult(
+                          executionState.queryState.updateLamba(rawLambda),
+                        );
+                        applicationStore.notificationService.notifySuccess(
+                          `Service query is updated`,
+                        );
+                        embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration(
+                          undefined,
+                        );
+                      } catch (error) {
+                        assertErrorThrown(error);
+                        applicationStore.notificationService.notifyError(
+                          `Can't save query: ${error.message}`,
+                        );
+                      }
+                    },
                   );
-                  queryBuilderState.initializeWithQuery(
-                    executionState.execution.func,
+
+                  return (
+                    <button
+                      className="query-builder__dialog__header__custom-action"
+                      tabIndex={-1}
+                      disabled={isReadOnly}
+                      onClick={save}
+                    >
+                      Save Query
+                    </button>
                   );
-                  if (openInTextMode) {
-                    queryBuilderState.textEditorState.openModal(
-                      QueryBuilderTextEditorMode.TEXT,
-                    );
-                  }
-                  return queryBuilderState;
                 },
-                actionConfigs: [
-                  {
-                    key: 'save-query-btn',
-                    renderer: (
-                      queryBuilderState: QueryBuilderState,
-                    ): React.ReactNode => {
-                      const save = applicationStore.guardUnhandledError(
-                        async () => {
-                          try {
-                            const rawLambda = queryBuilderState.buildQuery();
-                            await flowResult(
-                              executionState.queryState.updateLamba(rawLambda),
-                            );
-                            applicationStore.notificationService.notifySuccess(
-                              `Service query is updated`,
-                            );
-                            embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration(
-                              undefined,
-                            );
-                          } catch (error) {
-                            assertErrorThrown(error);
-                            applicationStore.notificationService.notifyError(
-                              `Can't save query: ${error.message}`,
-                            );
-                          }
-                        },
-                      );
-
-                      return (
-                        <button
-                          className="query-builder__dialog__header__custom-action"
-                          tabIndex={-1}
-                          disabled={isReadOnly}
-                          onClick={save}
-                        >
-                          Save Query
-                        </button>
-                      );
-                    },
-                  },
-                ],
-                disableCompile: isStubbed_RawLambda(
-                  executionState.queryState.query,
-                ),
-              }),
-            );
-            executionState.setOpeningQueryEditor(false);
-            return;
-          }
-          applicationStore.notificationService.notifyWarning(
-            'Please specify a mapping and a runtime for the execution context to edit with query builder',
-          );
-          executionState.setOpeningQueryEditor(false);
-        }
+              },
+            ],
+            disableCompile: isStubbed_RawLambda(
+              executionState.queryState.query,
+            ),
+          }),
+        );
+        executionState.setOpeningQueryEditor(false);
+        return;
       });
 
     const importQuery = (): void =>

package/src/components/editor/editor-group/service-editor/testable/ServiceTestDataEditor.tsx

@@ -16,10 +16,12 @@
 
 import {
   BlankPanelPlaceholder,
+  CaretDownIcon,
   clsx,
   ContextMenu,
   CustomSelectorInput,
   Dialog,
+  DropdownMenu,
   InfoCircleIcon,
   MaskIcon,
   MenuContent,
@@ -199,6 +201,12 @@ export const ConnectionTestDataEditor = observer(
       }
     };
 
+    const generateQuerySchemas = (): void => {
+      flowResult(connectionTestDataState.generateQuerySchemas()).catch(
+        applicationStore.alertUnhandledError,
+      );
+    };
+
     return (
       <div className="service-test-data-editor">
         <div className="service-test-suite-editor__header">
@@ -231,22 +239,45 @@ export const ConnectionTestDataEditor = observer(
                 <MaskIcon />
               </button>
             </div>
-            <button
-              className="panel__header__action service-execution-editor__test-data__generate-btn"
-              onClick={generateTestData}
-              title="Generate test data if possible"
-              disabled={
-                connectionTestDataState.generatingTestDataState.isInProgress
-              }
-              tabIndex={-1}
-            >
-              <div className="service-execution-editor__test-data__generate-btn__label">
-                <RefreshIcon className="service-execution-editor__test-data__generate-btn__label__icon" />
-                <div className="service-execution-editor__test-data__generate-btn__label__title">
+            <div className="btn__dropdown-combo btn__dropdown-combo--primary">
+              <button
+                className="btn__dropdown-combo__label"
+                onClick={generateTestData}
+                title="Generate test data if possible"
+                disabled={
+                  connectionTestDataState.generatingTestDataState.isInProgress
+                }
+                tabIndex={-1}
+              >
+                <RefreshIcon className="btn__dropdown-combo__label__icon" />
+                <div className="btn__dropdown-combo__label__title">
                   Generate
                 </div>
-              </div>
-            </button>
+              </button>
+              <DropdownMenu
+                className="btn__dropdown-combo__dropdown-btn"
+                content={
+                  <MenuContent>
+                    <MenuContentItem
+                      className="btn__dropdown-combo__option"
+                      onClick={generateQuerySchemas}
+                      disabled={
+                        connectionTestDataState.generateSchemaQueryState
+                          .isInProgress
+                      }
+                    >
+                      Generate Query Schemas
+                    </MenuContentItem>
+                  </MenuContent>
+                }
+                menuProps={{
+                  anchorOrigin: { vertical: 'bottom', horizontal: 'right' },
+                  transformOrigin: { vertical: 'top', horizontal: 'right' },
+                }}
+              >
+                <CaretDownIcon />
+              </DropdownMenu>
+            </div>
             <button
               className="panel__header__action service-execution-editor__test-data__generate-btn"
               onClick={openShared}
@@ -631,10 +662,16 @@ export const ServiceTestDataEditor = observer(
               </ResizablePanelSplitter>
               <ResizablePanel minSize={600}>
                 <PanelLoadingIndicator
-                  isLoading={Boolean(
-                    testDataState.selectedDataState?.generatingTestDataState
-                      .isInProgress,
-                  )}
+                  isLoading={
+                    Boolean(
+                      testDataState.selectedDataState?.generatingTestDataState
+                        .isInProgress,
+                    ) ||
+                    Boolean(
+                      testDataState.selectedDataState?.generateSchemaQueryState
+                        .isInProgress,
+                    )
+                  }
                 />
                 {testDataState.selectedDataState && (
                   <ConnectionTestDataEditor

package/src/components/editor/editor-group/uml-editor/ClassQueryBuilder.tsx

@@ -68,11 +68,11 @@ const promoteQueryToService = async (
   const applicationStore = editorStore.applicationStore;
   try {
     const mapping = guaranteeNonNullable(
-      queryBuilderState.mapping,
+      queryBuilderState.executionContextState.mapping,
       'Mapping is required to create service execution',
     );
     const runtime = guaranteeNonNullable(
-      queryBuilderState.runtimeValue,
+      queryBuilderState.executionContextState.runtimeValue,
       'Runtime is required to create service execution',
     );
     const query = queryBuilderState.buildQuery();
@@ -269,15 +269,15 @@ const PromoteToServiceQueryBuilderAction = observer(
       setPromoteQueryType(type);
     const closeNewServiceModal = (): void => setPromoteQueryType(undefined);
     const allowPromotion = Boolean(
-      queryBuilderState.mapping &&
-        queryBuilderState.runtimeValue &&
+      queryBuilderState.executionContextState.mapping &&
+        queryBuilderState.executionContextState.runtimeValue &&
         !queryBuilderState.allValidationIssues.length,
     );
 
     const renderSaveAsModal = (): React.ReactNode => {
       if (
         promoteQueryModal === PROMOTE_QUERY_TYPE.SERVICE &&
-        queryBuilderState.mapping
+        queryBuilderState.executionContextState.mapping
       ) {
         const promoteToService = async (
           packagePath: string,
@@ -295,7 +295,7 @@ const PromoteToServiceQueryBuilderAction = observer(
 
         return (
           <NewServiceModal
-            mapping={queryBuilderState.mapping}
+            mapping={queryBuilderState.executionContextState.mapping}
             close={closeNewServiceModal}
             showModal={true}
             promoteToService={promoteToService}

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

@@ -698,7 +698,7 @@ const ExplorerContextMenu = observer(
         editorStore.projectConfigurationEditorState.projectConfiguration?.projectDependencies.find(
           (dep) => dep.projectId === node?.packageableElement.name,
         );
-      if (projectDependency && !projectDependency.isLegacyDependency) {
+      if (projectDependency) {
         applicationStore.navigationService.navigator.visitAddress(
           applicationStore.navigationService.navigator.generateAddress(
             generateViewProjectByGAVRoute(

package/src/stores/editor/EditorGraphState.ts

@@ -42,11 +42,7 @@ import { ElementEditorState } from './editor-state/element-editor-state/ElementE
 import { GraphGenerationState } from './editor-state/GraphGenerationState.js';
 import { MODEL_IMPORT_NATIVE_INPUT_TYPE } from './editor-state/ModelImporterState.js';
 import type { DSL_LegendStudioApplicationPlugin_Extension } from '../LegendStudioApplicationPlugin.js';
-import {
-  type Entity,
-  EntitiesWithOrigin,
-  generateGAVCoordinates,
-} from '@finos/legend-storage';
+import { type Entity, EntitiesWithOrigin } from '@finos/legend-storage';
 import {
   type EntityChange,
   type ProjectDependency,
@@ -59,7 +55,6 @@ import {
   ProjectDependencyCoordinates,
   RawProjectDependencyReport,
   buildDependencyReport,
-  StoreProjectData,
 } from '@finos/legend-server-depot';
 import {
   GRAPH_MANAGER_EVENT,
@@ -752,53 +747,15 @@ export class EditorGraphState {
     projectDependencies: ProjectDependency[],
   ): Promise<ProjectDependencyCoordinates[]> {
     return Promise.all(
-      projectDependencies.map(async (dep) => {
-        /**
-         * We expect current dependency ids to be in the format of {groupId}:{artifactId}.
-         * For the legacy dependency we must fetch the corresponding coordinates (group, artifact ids) from the depot server
-         *
-         * @backwardCompatibility
-         */
-        if (dep.isLegacyDependency) {
-          return this.editorStore.depotServerClient
-            .getProjectById(dep.projectId)
-            .then((projects) => {
-              const projectsData = projects.map((p) =>
-                StoreProjectData.serialization.fromJson(p),
-              );
-              if (projectsData.length !== 1) {
-                throw new Error(
-                  `Expected 1 project for project ID '${dep.projectId}'. Got ${
-                    projectsData.length
-                  } projects with coordinates ${projectsData
-                    .map(
-                      (i) =>
-                        `'${generateGAVCoordinates(
-                          i.groupId,
-                          i.artifactId,
-                          undefined,
-                        )}'`,
-                    )
-                    .join(', ')}.`,
-                );
-              }
-              const project = projectsData[0] as StoreProjectData;
-              return new ProjectDependencyCoordinates(
-                project.groupId,
-                project.artifactId,
-                dep.versionId,
-              );
-            });
-        } else {
-          return Promise.resolve(
-            new ProjectDependencyCoordinates(
-              guaranteeNonNullable(dep.groupId),
-              guaranteeNonNullable(dep.artifactId),
-              dep.versionId,
-            ),
-          );
-        }
-      }),
+      projectDependencies.map(async (dep) =>
+        Promise.resolve(
+          new ProjectDependencyCoordinates(
+            guaranteeNonNullable(dep.groupId),
+            guaranteeNonNullable(dep.artifactId),
+            dep.versionId,
+          ),
+        ),
+      ),
     );
   }
 

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

@@ -32,6 +32,7 @@ import {
   assertType,
   StopWatch,
   filterByType,
+  assertTrue,
 } from '@finos/legend-shared';
 import { ElementEditorState } from './ElementEditorState.js';
 import {
@@ -51,6 +52,7 @@ import {
   VariableExpression,
   observe_ValueSpecification,
   generateFunctionPrettyName,
+  RawVariableExpression,
 } from '@finos/legend-graph';
 import {
   ExecutionPlanState,
@@ -271,6 +273,7 @@ export class FunctionEditorState extends ElementEditorState {
       generatePlan: flow,
       handleRunFunc: flow,
       cancelFuncRun: flow,
+      updateFunctionWithQuery: flow,
     });
 
     assertType(
@@ -335,6 +338,32 @@ export class FunctionEditorState extends ElementEditorState {
     this.functionDefinitionEditorState.setCompilationError(undefined);
   }
 
+  *updateFunctionWithQuery(val: RawLambda): GeneratorFn<void> {
+    const lambdaParam = val.parameters ? (val.parameters as object[]) : [];
+    const parameters = lambdaParam
+      .map((param) =>
+        this.editorStore.graphManagerState.graphManager.buildRawValueSpecification(
+          param,
+          this.editorStore.graphManagerState.graph,
+        ),
+      )
+      .map((rawValueSpec) =>
+        guaranteeType(rawValueSpec, RawVariableExpression),
+      );
+    assertTrue(
+      Array.isArray(val.body),
+      `Query body expected to be a list of expressions`,
+    );
+    this.functionElement.expressionSequence = val.body as object[];
+    this.functionElement.parameters = parameters;
+    yield flowResult(
+      this.functionDefinitionEditorState.convertLambdaObjectToGrammarString({
+        pretty: true,
+        firstLoad: true,
+      }),
+    );
+  }
+
   reprocess(
     newElement: ConcreteFunctionDefinition,
     editorStore: EditorStore,