@finos/legend-query-builder 4.14.30 → 4.14.32

package/src/components/QueryBuilderPropertyExpressionEditor.tsx

@@ -37,6 +37,7 @@ import {
 import { observer } from 'mobx-react-lite';
 import {
   generateValueSpecificationForParameter,
+  getPropertyChainName,
   type QueryBuilderDerivedPropertyExpressionState,
   type QueryBuilderPropertyExpressionState,
 } from '../stores/QueryBuilderPropertyEditorState.js';
@@ -382,15 +383,16 @@ export const QueryBuilderPropertyExpressionEditor = observer(
 export const QueryBuilderEditablePropertyName = observer(
   (props: {
     columnName: string;
-    changeColumnName?:
-      | ((event: ChangeEvent<HTMLInputElement>) => void)
-      | undefined;
+    setColumnName?: ((columnName: string) => void) | undefined;
     error: string | undefined;
     title: string;
+    defaultColumnName: string;
   }) => {
-    const { columnName, changeColumnName, error, title } = props;
+    const { columnName, setColumnName, error, title, defaultColumnName } =
+      props;
 
     const [isEditingColumnName, setIsEditingColumnName] = useState(false);
+    const [selectedColumnName, setSelectedColumnName] = useState(columnName);
     const columnNameInputRef = useRef<HTMLInputElement>(null);
 
     useEffect(() => {
@@ -399,26 +401,33 @@ export const QueryBuilderEditablePropertyName = observer(
       }
     }, [isEditingColumnName, columnNameInputRef]);
 
+    const handleFinishEditing = (): void => {
+      const trimmedSelectedColumnName = selectedColumnName.trim();
+      if (trimmedSelectedColumnName.length > 0) {
+        setColumnName?.(trimmedSelectedColumnName);
+        setSelectedColumnName(trimmedSelectedColumnName);
+      } else {
+        setColumnName?.(defaultColumnName);
+        setSelectedColumnName(defaultColumnName);
+      }
+      setIsEditingColumnName(false);
+    };
+
     return isEditingColumnName ? (
       <div className="query-builder__property__name__editor">
         <InputWithInlineValidation
           className="query-builder__property__name__editor__input input-group__input"
           spellCheck={false}
-          value={columnName}
-          onChange={changeColumnName}
+          value={selectedColumnName}
+          onChange={(event: ChangeEvent<HTMLInputElement>) =>
+            setSelectedColumnName(event.target.value)
+          }
           onKeyDown={(event: React.KeyboardEvent<HTMLInputElement>) => {
             if (event.key === 'Enter') {
-              if (columnName.length > 0) {
-                setIsEditingColumnName(false);
-              }
-            }
-          }}
-          onBlur={() => {
-            if (columnName.length > 0) {
-              setIsEditingColumnName(false);
+              handleFinishEditing();
             }
           }}
-          error={error}
+          onBlur={handleFinishEditing}
           ref={columnNameInputRef}
           draggable={true}
           onDragStart={(e: React.DragEvent<HTMLInputElement>) => {
@@ -434,10 +443,10 @@ export const QueryBuilderEditablePropertyName = observer(
         <span
           className={clsx('query-builder__property__name__display__content', {
             'query-builder__property__name__display__content--error': error,
-            'editable-value': changeColumnName,
+            'editable-value': setColumnName,
           })}
           onClick={() => {
-            if (changeColumnName) {
+            if (setColumnName) {
               setIsEditingColumnName(true);
             }
           }}
@@ -456,14 +465,14 @@ export const QueryBuilderPropertyExpressionBadge = observer(
     onPropertyExpressionChange: (
       node: QueryBuilderExplorerTreePropertyNodeData,
     ) => void;
-    changeColumnName?: (event: ChangeEvent<HTMLInputElement>) => void;
+    setColumnName?: (columnName: string) => void;
     error?: string | undefined;
   }) => {
     const {
       columnName,
       propertyExpressionState,
       onPropertyExpressionChange,
-      changeColumnName,
+      setColumnName,
       error,
     } = props;
     const type =
@@ -529,9 +538,14 @@ export const QueryBuilderPropertyExpressionBadge = observer(
           >
             <QueryBuilderEditablePropertyName
               columnName={columnName ?? propertyExpressionState.title}
-              changeColumnName={changeColumnName}
+              setColumnName={setColumnName}
               error={error}
               title={`${propertyExpressionState.title} - ${propertyExpressionState.path}`}
+              defaultColumnName={getPropertyChainName(
+                propertyExpressionState.propertyExpression,
+                propertyExpressionState.queryBuilderState.explorerState
+                  .humanizePropertyName,
+              )}
             />
             {hasDerivedPropertyInExpression && (
               <button

package/src/components/__test-utils__/QueryBuilderComponentTestUtils.tsx

@@ -51,7 +51,7 @@ import {
 } from '../../stores/__test-utils__/QueryBuilderStateTestUtils.js';
 import { STYLE_PREFIX, STYLE_PREFIX__DARK } from '@finos/legend-art';
 import { expect } from '@jest/globals';
-import { QueryBuilderAdvancedWorkflowState } from '../../stores/workflow/QueryBuilderWorkFlowState.js';
+import { QueryBuilderAdvancedWorkflowState } from '../../stores/query-workflow/QueryBuilderWorkFlowState.js';
 
 const getSelectorContainerClassName = (lightMode?: boolean): string =>
   '.' + `${lightMode ? STYLE_PREFIX : STYLE_PREFIX__DARK}__value-container`;

package/src/components/fetch-structure/QueryBuilderFetchStructurePanel.tsx

@@ -32,6 +32,7 @@ import { QueryBuilderGraphFetchTreeState } from '../../stores/fetch-structure/gr
 import { QueryBuilderPanelIssueCountBadge } from '../shared/QueryBuilderPanelIssueCountBadge.js';
 import { FETCH_STRUCTURE_IMPLEMENTATION } from '../../stores/fetch-structure/QueryBuilderFetchStructureImplementationState.js';
 import { QUERY_BUILDER_TEST_ID } from '../../__lib__/QueryBuilderTesting.js';
+import { onChangeFetchStructureImplementation } from '../../stores/fetch-structure/QueryBuilderFetchStructureState.js';
 
 const QueryBuilderFetchStructureEditor = observer(
   (props: { queryBuilderState: QueryBuilderState }) => {
@@ -68,24 +69,18 @@ export const QueryBuilderFetchStructurePanel = observer(
   (props: { queryBuilderState: QueryBuilderState }) => {
     const { queryBuilderState } = props;
     const fetchStructureState = queryBuilderState.fetchStructureState;
-
-    const onChangeFetchStructureImplementation =
-      (implementationType: FETCH_STRUCTURE_IMPLEMENTATION): (() => void) =>
-      (): void => {
-        if (fetchStructureState.implementation.type !== implementationType) {
-          fetchStructureState.implementation.checkBeforeChangingImplementation(
-            () => {
-              fetchStructureState.changeImplementation(implementationType);
-            },
-          );
-        }
-      };
+    const fetchConfig =
+      queryBuilderState.workflowState.getFetchStructureLayoutConfig(
+        queryBuilderState,
+      );
 
     return (
       <Panel data-testid={QUERY_BUILDER_TEST_ID.QUERY_BUILDER_FETCH_STRUCTURE}>
         <PanelHeader>
           <div className="panel__header__title">
-            <div className="panel__header__title__label">fetch structure</div>
+            <div className="panel__header__title__label">
+              {fetchConfig.label}
+            </div>
             {fetchStructureState.implementation.fetchStructureValidationIssues
               .length !== 0 && (
               <QueryBuilderPanelIssueCountBadge
@@ -96,22 +91,27 @@ export const QueryBuilderFetchStructurePanel = observer(
               />
             )}
           </div>
-          <PanelHeaderActions>
-            <div className="query-builder__fetch__structure__modes">
-              {Object.values(FETCH_STRUCTURE_IMPLEMENTATION).map((type) => (
-                <button
-                  onClick={onChangeFetchStructureImplementation(type)}
-                  className={clsx('query-builder__fetch__structure__mode', {
-                    'query-builder__fetch__structure__mode--selected':
-                      type === fetchStructureState.implementation.type,
-                  })}
-                  key={type}
-                >
-                  {prettyCONSTName(type)}
-                </button>
-              ))}
-            </div>
-          </PanelHeaderActions>
+          {fetchConfig.showInFetchPanel ? (
+            <PanelHeaderActions>
+              <div className="query-builder__fetch__structure__modes">
+                {Object.values(FETCH_STRUCTURE_IMPLEMENTATION).map((type) => (
+                  <button
+                    onClick={onChangeFetchStructureImplementation(
+                      type,
+                      fetchStructureState,
+                    )}
+                    className={clsx('query-builder__fetch__structure__mode', {
+                      'query-builder__fetch__structure__mode--selected':
+                        type === fetchStructureState.implementation.type,
+                    })}
+                    key={type}
+                  >
+                    {prettyCONSTName(type)}
+                  </button>
+                ))}
+              </div>
+            </PanelHeaderActions>
+          ) : null}
         </PanelHeader>
         <QueryBuilderFetchStructureEditor
           queryBuilderState={queryBuilderState}

package/src/components/fetch-structure/QueryBuilderTDSPanel.tsx

@@ -14,14 +14,7 @@
  * limitations under the License.
  */
 
-import {
-  useEffect,
-  useRef,
-  useCallback,
-  useState,
-  forwardRef,
-  type ChangeEvent,
-} from 'react';
+import { useEffect, useRef, useCallback, useState, forwardRef } from 'react';
 import { observer } from 'mobx-react-lite';
 import {
   clsx,
@@ -161,10 +154,10 @@ const QueryBuilderProjectionColumnContextMenu = observer(
 const QueryBuilderSimpleProjectionColumnEditor = observer(
   (props: {
     projectionColumnState: QueryBuilderSimpleProjectionColumnState;
-    changeColumnName: (event: ChangeEvent<HTMLInputElement>) => void;
+    setColumnName: (columnName: string) => void;
     error?: string | undefined;
   }) => {
-    const { projectionColumnState, changeColumnName, error } = props;
+    const { projectionColumnState, setColumnName, error } = props;
     const onPropertyExpressionChange = (
       node: QueryBuilderExplorerTreePropertyNodeData,
     ): void =>
@@ -179,7 +172,7 @@ const QueryBuilderSimpleProjectionColumnEditor = observer(
         columnName={projectionColumnState.columnName}
         propertyExpressionState={projectionColumnState.propertyExpressionState}
         onPropertyExpressionChange={onPropertyExpressionChange}
-        changeColumnName={changeColumnName}
+        setColumnName={setColumnName}
         error={error}
       />
     );
@@ -391,9 +384,8 @@ const QueryBuilderProjectionColumnEditor = observer(
       tdsState.removeColumn(projectionColumnState);
 
     // name
-    const changeColumnName: React.ChangeEventHandler<HTMLInputElement> = (
-      event,
-    ) => projectionColumnState.setColumnName(event.target.value);
+    const setColumnName = (columnName: string): void =>
+      projectionColumnState.setColumnName(columnName);
     const isDuplicatedColumnName =
       projectionColumnState.tdsState.isDuplicateColumn(projectionColumnState);
 
@@ -787,7 +779,7 @@ const QueryBuilderProjectionColumnEditor = observer(
                 <div className="query-builder__projection__column__value">
                   <QueryBuilderSimpleProjectionColumnEditor
                     projectionColumnState={projectionColumnState}
-                    changeColumnName={changeColumnName}
+                    setColumnName={setColumnName}
                     error={
                       isDuplicatedColumnName
                         ? 'Duplicated column'
@@ -814,7 +806,7 @@ const QueryBuilderProjectionColumnEditor = observer(
                 <div className="query-builder__projection__column__value">
                   <QueryBuilderEditablePropertyName
                     columnName={projectionColumnState.columnName}
-                    changeColumnName={changeColumnName}
+                    setColumnName={setColumnName}
                     error={
                       isDuplicatedColumnName
                         ? 'Duplicated column'
@@ -823,6 +815,7 @@ const QueryBuilderProjectionColumnEditor = observer(
                         : undefined
                     }
                     title={projectionColumnState.columnName}
+                    defaultColumnName="(derivation)"
                   />
                   <QueryBuilderDerivationProjectionColumnEditor
                     projectionColumnState={projectionColumnState}

package/src/graph/QueryBuilderMetaModelConst.ts

@@ -24,6 +24,8 @@ export enum QUERY_BUILDER_PURE_PATH {
   DURATION_UNIT = 'meta::pure::functions::date::DurationUnit',
   DAY_OF_WEEK = 'meta::pure::functions::date::DayOfWeek',
 
+  // RELATION
+  RELATION = 'meta::pure::metamodel::relation::Relation',
   // serialization
   SERIALIZE_CONFIG = 'meta::pure::graphFetch::execution::AlloySerializationConfig',
 }
@@ -31,6 +33,7 @@ export enum QUERY_BUILDER_PURE_PATH {
 export enum QUERY_BUILDER_SUPPORTED_CALENDAR_AGGREGATION_FUNCTIONS {
   CALENDAR_ANNUALIZED = 'meta::pure::functions::date::calendar::annualized',
   CALENDAR_CME = ' meta::pure::functions::date::calendar::cme',
+
   CALENDAR_CW = 'meta::pure::functions::date::calendar::cw',
   CALENDAR_CW_FM = 'meta::pure::functions::date::calendar::cw_fm',
   CALENDAR_CY_MINUS2 = 'meta::pure::functions::date::calendar::CYMinus2',
@@ -114,6 +117,10 @@ export enum QUERY_BUILDER_SUPPORTED_FUNCTIONS {
   TDS_RESTRICT = 'meta::pure::tds::restrict',
   TDS_FUNC = 'meta::pure::tds::func',
 
+  // Relation
+  RELATION_PROJECT = 'meta::pure::functions::relation::project',
+  RELATION_LIMIT = 'meta::pure::functions::relation::limit',
+
   // filter
   CONTAINS = 'meta::pure::functions::string::contains',
   ENDS_WITH = 'meta::pure::functions::string::endsWith',

package/src/graph-manager/protocol/pure/QueryBuilder_PureProtocolProcessorPlugin.ts

@@ -146,10 +146,10 @@ export class QueryBuilder_PureProtocolProcessorPlugin extends PureProtocolProces
             processingContext,
           );
         } else if (
-          matchFunctionName(
-            functionName,
+          matchFunctionName(functionName, [
             QUERY_BUILDER_SUPPORTED_FUNCTIONS.TDS_PROJECT,
-          )
+            QUERY_BUILDER_SUPPORTED_FUNCTIONS.RELATION_PROJECT,
+          ])
         ) {
           return V1_buildProjectFunctionExpression(
             functionName,

package/src/graph-manager/protocol/pure/v1/V1_QueryValueSpecificationBuilderHelper.ts

@@ -21,6 +21,7 @@ import {
   filterByType,
   guaranteeNonNullable,
   guaranteeType,
+  isNonNullable,
   returnUndefOnError,
 } from '@finos/legend-shared';
 import {
@@ -56,6 +57,11 @@ import {
   LambdaFunction,
   LambdaFunctionInstanceValue,
   PackageableElementExplicitReference,
+  V1_ClassInstance,
+  V1_ColSpecArray,
+  ColSpecArrayInstance,
+  ColSpecArray,
+  ColSpec,
 } from '@finos/legend-graph';
 import {
   QUERY_BUILDER_PURE_PATH,
@@ -574,6 +580,110 @@ export const V1_buildFilterFunctionExpression = (
   return expression;
 };
 
+export const V1_buildTypedProjectFunctionExpression = (
+  functionName: string,
+  parameters: V1_ValueSpecification[],
+  openVariables: string[],
+  compileContext: V1_GraphBuilderContext,
+  processingContext: V1_ProcessingContext,
+): SimpleFunctionExpression => {
+  assertTrue(
+    parameters.length === 2,
+    `Can't build relation project() expression: project() expects 2 arguments`,
+  );
+
+  let topLevelLambdaParameters: V1_Variable[] = [];
+  const precedingExperession = (
+    parameters[0] as V1_ValueSpecification
+  ).accept_ValueSpecificationVisitor(
+    new V1_ValueSpecificationBuilder(
+      compileContext,
+      processingContext,
+      openVariables,
+    ),
+  );
+  assertNonNullable(
+    precedingExperession.genericType,
+    `Can't build relation project() expression: preceding expression return type is missing`,
+  );
+
+  const classInstance = parameters[1];
+  assertType(
+    classInstance,
+    V1_ClassInstance,
+    `Can't build relation project() expression: project() expects argument #1 to be a ClassInstance`,
+  );
+  const specArray = guaranteeType(
+    classInstance.value,
+    V1_ColSpecArray,
+    `Can't build relation project() expression: project() expects argument #1 to hold spec array instances value`,
+  );
+
+  topLevelLambdaParameters = specArray.colSpecs
+    .map((e) => e.function1)
+    .filter(isNonNullable)
+    .filter(filterByType(V1_Lambda))
+    .map((lambda) => lambda.parameters)
+    .flat();
+
+  const variables = new Set<string>();
+  // Make sure top-level lambdas have their lambda parameter types set properly
+  topLevelLambdaParameters.forEach((variable) => {
+    if (!variables.has(variable.name) && !variable.class) {
+      const variableExpression = new VariableExpression(
+        variable.name,
+        precedingExperession.multiplicity,
+      );
+      variableExpression.genericType = precedingExperession.genericType;
+      processingContext.addInferredVariables(variable.name, variableExpression);
+    }
+  });
+  const processedExpression = new ColSpecArrayInstance(Multiplicity.ONE);
+  const processedColSpecArray = new ColSpecArray();
+  processedExpression.values = [processedColSpecArray];
+
+  processedColSpecArray.colSpecs = specArray.colSpecs.map((colSpec) => {
+    const pColSpec = new ColSpec();
+    let lambda: ValueSpecification;
+    const _funct = guaranteeType(
+      colSpec.function1,
+      V1_ValueSpecification,
+      `Can't build relation col spec() expression: expects function1 to be a lambda`,
+    );
+    try {
+      lambda = buildProjectionColumnLambda(
+        _funct,
+        openVariables,
+        compileContext,
+        processingContext,
+      );
+    } catch {
+      lambda = new INTERNAL__UnknownValueSpecification(
+        V1_serializeValueSpecification(
+          _funct,
+          compileContext.extensions.plugins,
+        ),
+      );
+    }
+    pColSpec.function1 = lambda;
+    pColSpec.name = colSpec.name;
+    return pColSpec;
+  });
+
+  const expression = V1_buildBaseSimpleFunctionExpression(
+    [precedingExperession, processedExpression],
+    functionName,
+    compileContext,
+  );
+  expression.genericType = GenericTypeExplicitReference.create(
+    new GenericType(
+      compileContext.resolveType(QUERY_BUILDER_PURE_PATH.RELATION).value,
+    ),
+  );
+
+  return expression;
+};
+
 export const V1_buildProjectFunctionExpression = (
   functionName: string,
   parameters: V1_ValueSpecification[],
@@ -581,8 +691,19 @@ export const V1_buildProjectFunctionExpression = (
   compileContext: V1_GraphBuilderContext,
   processingContext: V1_ProcessingContext,
 ): SimpleFunctionExpression => {
+  if (parameters.length === 2) {
+    return V1_buildTypedProjectFunctionExpression(
+      functionName,
+      parameters,
+      openVariables,
+      compileContext,
+      processingContext,
+    );
+  }
+
+  const length = parameters.length;
   assertTrue(
-    parameters.length === 3,
+    length === 3 || length === 2,
     `Can't build project() expression: project() expects 2 arguments`,
   );
 

package/src/index.ts

@@ -93,4 +93,4 @@ export * from './stores/QueryBuilder_LegendApplicationPlugin_Extension.js';
 
 export * from './stores/data-access/DataAccessState.js';
 export * from './components/data-access/DataAccessOverview.js';
-export * from './stores/workflow/QueryBuilderWorkFlowState.js';
+export * from './stores/query-workflow/QueryBuilderWorkFlowState.js';

package/src/stores/QueryBuilderResultState.ts

@@ -312,6 +312,7 @@ export class QueryBuilderResultState {
     if (this.queryBuilderState.isQuerySupported) {
       const lambdaFunction = buildLambdaFunction(this.queryBuilderState, {
         isBuildingExecutionQuery: true,
+        useTypedRelationFunctions: this.queryBuilderState.isFetchStructureTyped,
         ...executionOptions,
       });
       query = buildRawLambdaFromLambdaFunction(

package/src/stores/QueryBuilderState.ts

@@ -109,7 +109,7 @@ import {
 import type { QueryBuilderConfig } from '../graph-manager/QueryBuilderConfig.js';
 import { QUERY_BUILDER_EVENT } from '../__lib__/QueryBuilderEvent.js';
 import { QueryBuilderChangeHistoryState } from './QueryBuilderChangeHistoryState.js';
-import { type QueryBuilderWorkflowState } from './workflow/QueryBuilderWorkFlowState.js';
+import { type QueryBuilderWorkflowState } from './query-workflow/QueryBuilderWorkFlowState.js';
 
 export interface QuerySDLC {}
 
@@ -157,6 +157,8 @@ export abstract class QueryBuilderState implements CommandRegistrar {
   isQueryChatOpened = false;
   isLocalModeEnabled = false;
 
+  lambdaWriteMode = QUERY_BUILDER_LAMBDA_WRITER_MODE.STANDARD;
+
   class?: Class | undefined;
   getAllFunction: QUERY_BUILDER_SUPPORTED_GET_ALL_FUNCTIONS =
     QUERY_BUILDER_SUPPORTED_GET_ALL_FUNCTIONS.GET_ALL;
@@ -204,6 +206,7 @@ export abstract class QueryBuilderState implements CommandRegistrar {
       isQueryChatOpened: observable,
       isLocalModeEnabled: observable,
       getAllFunction: observable,
+      lambdaWriteMode: observable,
 
       sideBarClassName: computed,
       isQuerySupported: computed,
@@ -218,6 +221,7 @@ export abstract class QueryBuilderState implements CommandRegistrar {
       setIsQueryChatOpened: action,
       setIsLocalModeEnabled: action,
       setGetAllFunction: action,
+      setLambdaWriteMode: action,
 
       resetQueryResult: action,
       resetQueryContent: action,
@@ -300,6 +304,17 @@ export abstract class QueryBuilderState implements CommandRegistrar {
     return this.allVariables.map((e) => e.name);
   }
 
+  get isFetchStructureTyped(): boolean {
+    return (
+      this.lambdaWriteMode ===
+      QUERY_BUILDER_LAMBDA_WRITER_MODE.TYPED_FETCH_STRUCTURE
+    );
+  }
+
+  setLambdaWriteMode(val: QUERY_BUILDER_LAMBDA_WRITER_MODE): void {
+    this.lambdaWriteMode = val;
+  }
+
   getQueryExecutionContext(): QueryExecutionContext {
     const queryExeContext = new QueryExplicitExecutionContext();
     const runtimeValue = guaranteeType(
@@ -538,6 +553,7 @@ export abstract class QueryBuilderState implements CommandRegistrar {
     return buildRawLambdaFromLambdaFunction(
       buildLambdaFunction(this, {
         keepSourceInformation: Boolean(options?.keepSourceInformation),
+        useTypedRelationFunctions: this.isFetchStructureTyped,
       }),
       this.graphManagerState,
     );