@finos/legend-query-builder 4.9.4 → 4.10.1

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

@@ -61,7 +61,13 @@ import {
 } from '@finos/legend-shared';
 import { flowResult } from 'mobx';
 import { observer } from 'mobx-react-lite';
-import { forwardRef, useCallback, useMemo, useRef, useState } from 'react';
+import React, {
+  forwardRef,
+  useCallback,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 import { useDrop, useDrag, useDragLayer } from 'react-dnd';
 import { QueryBuilderAggregateColumnState } from '../../stores/fetch-structure/tds/aggregation/QueryBuilderAggregationState.js';
 import type { QueryBuilderPostFilterOperator } from '../../stores/fetch-structure/tds/post-filter/QueryBuilderPostFilterOperator.js';
@@ -74,6 +80,8 @@ import {
   QueryBuilderPostFilterTreeGroupNodeData,
   QueryBuilderPostFilterTreeBlankConditionNodeData,
   QUERY_BUILDER_POST_FILTER_DND_TYPE,
+  PostFilterValueSpecConditionValueState,
+  PostFilterTDSColumnValueConditionValueState,
 } from '../../stores/fetch-structure/tds/post-filter/QueryBuilderPostFilterState.js';
 import {
   type QueryBuilderProjectionColumnState,
@@ -203,14 +211,14 @@ const QueryBuilderPostFilterGroupConditionEditor = observer(
 
 export const QueryBuilderColumnBadge = observer(
   (props: {
-    postFilterConditionState: PostFilterConditionState;
+    colState: QueryBuilderTDSColumnState;
     onColumnChange: (
       columnState: QueryBuilderProjectionColumnState,
     ) => Promise<void>;
   }) => {
-    const { postFilterConditionState, onColumnChange } = props;
+    const { colState, onColumnChange } = props;
     const applicationStore = useApplicationStore();
-    const type = postFilterConditionState.columnState.getColumnType();
+    const type = colState.getColumnType();
     const handleDrop = useCallback(
       (item: QueryBuilderProjectionColumnDragSource): Promise<void> =>
         onColumnChange(item.columnState),
@@ -261,12 +269,12 @@ export const QueryBuilderColumnBadge = observer(
             )}
             <div
               className="query-builder-column-badge__property"
-              title={`${postFilterConditionState.columnName}`}
+              title={`${colState.columnName}`}
             >
-              {postFilterConditionState.columnName}
+              {colState.columnName}
             </div>
             <QueryBuilderColumnInfoTooltip
-              columnState={postFilterConditionState.columnState}
+              columnState={colState}
               placement="bottom-end"
             >
               <div className="query-builder-column-badge__property__info">
@@ -291,13 +299,15 @@ const QueryBuilderPostFilterConditionEditor = observer(
     const applicationStore = useApplicationStore();
     const changeOperator = (val: QueryBuilderPostFilterOperator) => (): void =>
       node.condition.changeOperator(val);
+    const rightConditionValue = node.condition.rightConditionValue;
     const changeColumn = async (
       columnState: QueryBuilderProjectionColumnState,
     ): Promise<void> => {
       const currentColState =
-        node.condition.columnState instanceof QueryBuilderAggregateColumnState
-          ? node.condition.columnState.projectionColumnState
-          : node.condition.columnState;
+        node.condition.leftConditionValue instanceof
+        QueryBuilderAggregateColumnState
+          ? node.condition.leftConditionValue.projectionColumnState
+          : node.condition.leftConditionValue;
       if (currentColState !== columnState) {
         await flowResult(node.condition.changeColumn(columnState));
       }
@@ -306,12 +316,13 @@ const QueryBuilderPostFilterConditionEditor = observer(
     const handleDrop = useCallback(
       (item: QueryBuilderVariableDragSource): void => {
         const parameterType = item.variable.genericType?.value.rawType;
-        const conditionValueType = node.condition.columnState.getColumnType();
+        const conditionValueType =
+          node.condition.leftConditionValue.getColumnType();
         if (
           conditionValueType &&
           isTypeCompatibleForAssignment(parameterType, conditionValueType)
         ) {
-          node.condition.setValue(item.variable);
+          node.condition.buildFromValueSpec(item.variable);
         } else {
           applicationStore.notificationService.notifyWarning(
             `Incompatible parameter type ${parameterType?.name}. ${parameterType?.name} is not compatible with type ${conditionValueType?.name}.`,
@@ -339,7 +350,7 @@ const QueryBuilderPostFilterConditionEditor = observer(
       [handleDrop],
     );
     const resetNode = (): void => {
-      node.condition.setValue(
+      node.condition.buildFromValueSpec(
         node.condition.operator.getDefaultFilterConditionValue(node.condition),
       );
     };
@@ -355,7 +366,7 @@ const QueryBuilderPostFilterConditionEditor = observer(
       node.condition.typeaheadSearchState.complete();
     };
     const changeValueSpecification = (val: ValueSpecification): void => {
-      node.condition.setValue(val);
+      node.condition.buildFromValueSpec(val);
     };
     const selectorConfig = {
       values: node.condition.typeaheadSearchResults,
@@ -371,6 +382,70 @@ const QueryBuilderPostFilterConditionEditor = observer(
           monitor.getItemType() === QUERY_BUILDER_WINDOW_COLUMN_DND_TYPE),
     }));
 
+    const renderRightVal = (): React.ReactNode => {
+      if (
+        rightConditionValue instanceof PostFilterValueSpecConditionValueState &&
+        rightConditionValue.value
+      ) {
+        return (
+          <div
+            ref={dropConnector}
+            className="query-builder-post-filter-tree__condition-node__value"
+          >
+            <PanelEntryDropZonePlaceholder
+              isDragOver={isFilterValueDragOver}
+              label="Change Filter Value"
+            >
+              <BasicValueSpecificationEditor
+                valueSpecification={rightConditionValue.value}
+                setValueSpecification={changeValueSpecification}
+                graph={graph}
+                obseverContext={queryBuilderState.observerContext}
+                typeCheckOption={{
+                  expectedType: guaranteeNonNullable(
+                    node.condition.leftConditionValue.getColumnType(),
+                  ),
+                }}
+                resetValue={resetNode}
+                selectorConfig={selectorConfig}
+                isConstant={queryBuilderState.constantState.isValueSpecConstant(
+                  rightConditionValue.value,
+                )}
+              />
+            </PanelEntryDropZonePlaceholder>
+          </div>
+        );
+      } else if (
+        rightConditionValue instanceof
+        PostFilterTDSColumnValueConditionValueState
+      ) {
+        const changeRightCol = async (
+          columnState: QueryBuilderProjectionColumnState,
+        ): Promise<void> => {
+          rightConditionValue.changeCol(columnState);
+        };
+        return (
+          <div
+            ref={dropConnector}
+            className="query-builder-post-filter-tree__condition-node__value"
+          >
+            <PanelEntryDropZonePlaceholder
+              isDragOver={isFilterValueDragOver}
+              label="Change Filter Value"
+            >
+              <div className="query-builder-post-filter-tree__condition-node__property">
+                <QueryBuilderColumnBadge
+                  colState={rightConditionValue.tdsColumn}
+                  onColumnChange={changeRightCol}
+                />
+              </div>
+            </PanelEntryDropZonePlaceholder>
+          </div>
+        );
+      }
+      return null;
+    };
+
     return (
       <div className="query-builder-post-filter-tree__node__label__content dnd__entry__container">
         <PanelEntryDropZonePlaceholder
@@ -381,7 +456,7 @@ const QueryBuilderPostFilterConditionEditor = observer(
           <div className="query-builder-post-filter-tree__condition-node">
             <div className="query-builder-post-filter-tree__condition-node__property">
               <QueryBuilderColumnBadge
-                postFilterConditionState={node.condition}
+                colState={node.condition.leftConditionValue}
                 onColumnChange={changeColumn}
               />
             </div>
@@ -414,34 +489,7 @@ const QueryBuilderPostFilterConditionEditor = observer(
                 <CaretDownIcon />
               </div>
             </DropdownMenu>
-            {node.condition.value && (
-              <div
-                ref={dropConnector}
-                className="query-builder-post-filter-tree__condition-node__value"
-              >
-                <PanelEntryDropZonePlaceholder
-                  isDragOver={isFilterValueDragOver}
-                  label="Change Filter Value"
-                >
-                  <BasicValueSpecificationEditor
-                    valueSpecification={node.condition.value}
-                    setValueSpecification={changeValueSpecification}
-                    graph={graph}
-                    obseverContext={queryBuilderState.observerContext}
-                    typeCheckOption={{
-                      expectedType: guaranteeNonNullable(
-                        node.condition.columnState.getColumnType(),
-                      ),
-                    }}
-                    resetValue={resetNode}
-                    selectorConfig={selectorConfig}
-                    isConstant={queryBuilderState.constantState.isValueSpecConstant(
-                      node.condition.value,
-                    )}
-                  />
-                </PanelEntryDropZonePlaceholder>
-              </div>
-            )}
+            {renderRightVal()}
           </div>
         </PanelEntryDropZonePlaceholder>
       </div>
@@ -538,9 +586,8 @@ const QueryBuilderPostFilterTreeNodeContainer = observer(
               postFilterState,
               columnState,
               undefined,
-              undefined,
             );
-            conditionState.setValue(
+            conditionState.buildFromValueSpec(
               conditionState.operator.getDefaultFilterConditionValue(
                 conditionState,
               ),
@@ -648,6 +695,9 @@ const QueryBuilderPostFilterTreeNodeContainer = observer(
       >
         <div
           ref={ref}
+          data-testid={
+            QUERY_BUILDER_TEST_ID.QUERY_BUILDER_POST_FILTER_TREE_NODE_CONTENT
+          }
           className={clsx(
             'tree-view__node__container query-builder-post-filter-tree__node__container',
             {
@@ -679,6 +729,10 @@ const QueryBuilderPostFilterTreeNodeContainer = observer(
             <div
               className={clsx(
                 'tree-view__node__label query-builder-post-filter-tree__node__label',
+                {
+                  'query-builder-post-filter-tree__node__label--expandable':
+                    isExpandable,
+                },
               )}
             >
               {node instanceof QueryBuilderPostFilterTreeGroupNodeData && (
@@ -894,9 +948,8 @@ const QueryBuilderPostFilterPanelContent = observer(
             postFilterState,
             aggregateColumnState ?? columnState,
             undefined,
-            undefined,
           );
-          postFilterConditionState.setValue(
+          postFilterConditionState.buildFromValueSpec(
             postFilterConditionState.operator.getDefaultFilterConditionValue(
               postFilterConditionState,
             ),
@@ -959,7 +1012,7 @@ const QueryBuilderPostFilterPanelContent = observer(
           <div className="panel__header__actions">
             <DropdownMenu
               className="panel__header__action"
-              title="Show Filter Options Menu..."
+              title="Show Post-Filter Options Menu..."
               content={
                 <MenuContent>
                   <MenuContentItem onClick={createCondition}>
@@ -1091,7 +1144,7 @@ export const QueryBuilderPostFilterPanel = observer(
 
     return (
       <div
-        data-testid={QUERY_BUILDER_TEST_ID.QUERY_BUILDER_POST_FILTER}
+        data-testid={QUERY_BUILDER_TEST_ID.QUERY_BUILDER_POST_FILTER_PANEL}
         className="panel"
       >
         {fetchStructureImplementation instanceof QueryBuilderTDSState && (

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

@@ -688,7 +688,6 @@ const QueryBuilderProjectionColumnEditor = observer(
       }),
       [handleDrop],
     );
-
     return (
       <PanelDnDEntry
         ref={ref}
@@ -732,7 +731,12 @@ const QueryBuilderProjectionColumnEditor = observer(
           onOpen={onContextMenuOpen}
           onClose={onContextMenuClose}
         >
-          <div className="query-builder__projection__column__container">
+          <div
+            data-testid={
+              QUERY_BUILDER_TEST_ID.QUERY_BUILDER_TDS_PROJECTION_COLUMN
+            }
+            className="query-builder__projection__column__container"
+          >
             <PanelEntryDragHandle
               isDragging={false}
               dragSourceConnector={dragHandleRef}

package/src/components/filter/QueryBuilderFilterPanel.tsx

@@ -113,6 +113,7 @@ import {
 import { QueryBuilderTelemetryHelper } from '../../__lib__/QueryBuilderTelemetryHelper.js';
 import { getPropertyChainName } from '../../stores/QueryBuilderPropertyEditorState.js';
 import { QUERY_BUILDER_SUPPORTED_FUNCTIONS } from '../../graph/QueryBuilderMetaModelConst.js';
+import { buildPropertyExpressionChain } from '../../stores/QueryBuilderValueSpecificationBuilderHelper.js';
 
 const isCollectionProperty = (
   propertyExpression: AbstractPropertyExpression,
@@ -151,7 +152,7 @@ const isCollectionProperty = (
 export const buildFilterTreeWithExists = (
   propertyExpression: AbstractPropertyExpression,
   filterState: QueryBuilderFilterState,
-  targetDropNode?: QueryBuilderFilterTreeOperationNodeData,
+  targetDropNode?: QueryBuilderFilterTreeNodeData,
 ): void => {
   // 1. Decompose property expression
   const expressions: (AbstractPropertyExpression | SimpleFunctionExpression)[] =
@@ -294,7 +295,21 @@ export const buildFilterTreeWithExists = (
                 .value.path,
         );
         if (parentPropertyChainIndex >= 0) {
-          parentNode = targetDropNode;
+          // Here we choose parentNode based on what the type of targetDropNode
+          // 1. QueryBuilderFilterTreeConditionNodeData: In this case we would want to
+          // add a new group condition from the targetDropNode and add new exists node
+          // getting created as it's child so the parent would be the new group node
+          // 2. QueryBuilderFilterTreeGroupNodeData: Parent node would be same as
+          // targetDropNode
+          // 3. QueryBuilderFilterTreeBlankConditionNodeData: parentNode would be the
+          // parent of the targetDropNode. At the end we would deelete this blank node
+          // that got created.
+          parentNode =
+            targetDropNode instanceof QueryBuilderFilterTreeConditionNodeData
+              ? filterState.newGroupConditionFromNode(targetDropNode)
+              : targetDropNode instanceof QueryBuilderFilterTreeGroupNodeData
+              ? targetDropNode
+              : filterState.getParentNode(targetDropNode);
           existsLambdaPropertyChains = existsLambdaPropertyChains.slice(
             parentPropertyChainIndex + 1,
           );
@@ -303,7 +318,12 @@ export const buildFilterTreeWithExists = (
           );
         }
       } else if (!parentId) {
-        parentNode = targetDropNode;
+        parentNode =
+          targetDropNode instanceof QueryBuilderFilterTreeConditionNodeData
+            ? filterState.newGroupConditionFromNode(targetDropNode)
+            : targetDropNode instanceof QueryBuilderFilterTreeGroupNodeData
+            ? targetDropNode
+            : filterState.getParentNode(targetDropNode);
       }
     }
   }
@@ -332,6 +352,127 @@ export const buildFilterTreeWithExists = (
     filterConditionState,
   );
   filterState.addNodeFromNode(treeNode, parentNode);
+  if (targetDropNode instanceof QueryBuilderFilterTreeBlankConditionNodeData) {
+    filterState.removeNodeAndPruneBranch(targetDropNode);
+  }
+};
+
+export const buildPropertyExpressionFromExistsNode = (
+  filterState: QueryBuilderFilterState,
+  existsNode: QueryBuilderFilterTreeExistsNodeData,
+  node: QueryBuilderFilterTreeConditionNodeData,
+): AbstractPropertyExpression => {
+  let nodeParent = filterState.getParentNode(node);
+  let existsLambdaParameterNames: string[] = [];
+  let existsLambdaExpressions: AbstractPropertyExpression[] = [];
+  existsLambdaExpressions.push(
+    node.condition.propertyExpressionState.propertyExpression,
+  );
+  existsLambdaParameterNames.push(
+    nodeParent?.lambdaParameterName ?? filterState.lambdaParameterName,
+  );
+  while (nodeParent && nodeParent.id !== existsNode.id) {
+    if (nodeParent instanceof QueryBuilderFilterTreeExistsNodeData) {
+      existsLambdaExpressions.push(
+        nodeParent.propertyExpressionState.propertyExpression,
+      );
+      existsLambdaParameterNames.push(
+        nodeParent.lambdaParameterName ?? filterState.lambdaParameterName,
+      );
+    }
+    nodeParent = filterState.getParentNode(nodeParent);
+  }
+  if (nodeParent?.id === existsNode.id) {
+    existsLambdaExpressions.push(
+      existsNode.propertyExpressionState.propertyExpression,
+    );
+    existsLambdaParameterNames.push(
+      existsNode.lambdaParameterName ?? filterState.lambdaParameterName,
+    );
+  }
+  existsLambdaParameterNames = existsLambdaParameterNames.reverse();
+  existsLambdaExpressions = existsLambdaExpressions.reverse();
+
+  const initialPropertyExpression = guaranteeNonNullable(
+    existsLambdaExpressions[0],
+  );
+  existsLambdaParameterNames = existsLambdaParameterNames.slice(1);
+  existsLambdaExpressions = existsLambdaExpressions.slice(1);
+
+  let flattenedPropertyExpressionChain = new AbstractPropertyExpression('');
+  flattenedPropertyExpressionChain.func = initialPropertyExpression.func;
+  flattenedPropertyExpressionChain.parametersValues = [
+    ...initialPropertyExpression.parametersValues,
+  ];
+  for (const exp of existsLambdaExpressions) {
+    // when rebuilding the property expression chain, disregard the initial variable that starts the chain
+    const expressions: (
+      | AbstractPropertyExpression
+      | SimpleFunctionExpression
+    )[] = [];
+    let currentExpression: ValueSpecification = exp;
+    while (
+      currentExpression instanceof AbstractPropertyExpression ||
+      (currentExpression instanceof SimpleFunctionExpression &&
+        matchFunctionName(
+          currentExpression.functionName,
+          QUERY_BUILDER_SUPPORTED_FUNCTIONS.SUBTYPE,
+        ))
+    ) {
+      if (currentExpression instanceof SimpleFunctionExpression) {
+        const functionExpression = new SimpleFunctionExpression(
+          extractElementNameFromPath(QUERY_BUILDER_SUPPORTED_FUNCTIONS.SUBTYPE),
+        );
+        functionExpression.parametersValues.unshift(
+          guaranteeNonNullable(currentExpression.parametersValues[1]),
+        );
+        expressions.push(functionExpression);
+      } else if (currentExpression instanceof AbstractPropertyExpression) {
+        const propertyExp = new AbstractPropertyExpression('');
+        propertyExp.func = currentExpression.func;
+        // NOTE: we must retain the rest of the parameters as those are derived property parameters
+        propertyExp.parametersValues =
+          currentExpression.parametersValues.length > 1
+            ? currentExpression.parametersValues.slice(1)
+            : [];
+        expressions.push(propertyExp);
+      }
+      currentExpression = guaranteeNonNullable(
+        currentExpression.parametersValues[0],
+      );
+    }
+    assertTrue(
+      expressions.length > 0,
+      `Can't process exists() expression: exists() usage with non-chain property expression is not supported`,
+    );
+    for (let i = 0; i < expressions.length - 1; ++i) {
+      (
+        expressions[i] as AbstractPropertyExpression | SimpleFunctionExpression
+      ).parametersValues.unshift(
+        expressions[i + 1] as
+          | AbstractPropertyExpression
+          | SimpleFunctionExpression,
+      );
+    }
+    (
+      expressions[expressions.length - 1] as
+        | AbstractPropertyExpression
+        | SimpleFunctionExpression
+    ).parametersValues.unshift(flattenedPropertyExpressionChain);
+    flattenedPropertyExpressionChain = guaranteeType(
+      expressions[0],
+      AbstractPropertyExpression,
+      `Can't process exists() expression: can't flatten to a property expression`,
+    );
+  }
+  return guaranteeType(
+    buildPropertyExpressionChain(
+      flattenedPropertyExpressionChain,
+      filterState.queryBuilderState,
+      existsNode.lambdaParameterName ?? filterState.lambdaParameterName,
+    ),
+    AbstractPropertyExpression,
+  );
 };
 
 /**
@@ -340,7 +481,7 @@ export const buildFilterTreeWithExists = (
 const buildFilterTree = (
   propertyExpression: AbstractPropertyExpression,
   filterState: QueryBuilderFilterState,
-  targetDropNode?: QueryBuilderFilterTreeOperationNodeData | undefined,
+  targetDropNode?: QueryBuilderFilterTreeNodeData | undefined,
 ): void => {
   if (isCollectionProperty(propertyExpression)) {
     const propertyChainName = getPropertyChainName(
@@ -383,12 +524,88 @@ const buildFilterTree = (
       undefined,
       filterConditionState,
     );
-    filterState.addNodeFromNode(
-      treeNode,
-      targetDropNode instanceof QueryBuilderFilterTreeGroupNodeData
-        ? targetDropNode
-        : undefined,
-    );
+    // Check if there are any exists node present in the parent nodes of the target.
+    // This would change the way we build the filter tree
+    let cn: QueryBuilderFilterTreeNodeData | undefined = targetDropNode;
+    let existsNode: QueryBuilderFilterTreeExistsNodeData | undefined =
+      undefined;
+    let parentId = targetDropNode?.parentId;
+    while (parentId) {
+      cn = filterState.nodes.get(parentId);
+      parentId = cn?.parentId;
+      if (cn instanceof QueryBuilderFilterTreeExistsNodeData) {
+        existsNode = cn;
+      }
+    }
+    if (cn instanceof QueryBuilderFilterTreeExistsNodeData) {
+      existsNode = cn;
+    }
+    if (targetDropNode instanceof QueryBuilderFilterTreeGroupNodeData) {
+      if (existsNode) {
+        filterState.newGroupConditionFromNode(
+          existsNode,
+          treeNode,
+          targetDropNode.groupOperation,
+        );
+      } else {
+        filterState.addNodeFromNode(treeNode, targetDropNode);
+      }
+    } else if (
+      targetDropNode instanceof QueryBuilderFilterTreeBlankConditionNodeData
+    ) {
+      if (existsNode) {
+        filterState.queryBuilderState.applicationStore.notificationService.notifyError(
+          `Can't drag and drop here: property expression of target and source doesn't match`,
+        );
+      } else {
+        filterState.replaceBlankNodeWithNode(treeNode, targetDropNode);
+      }
+    } else if (
+      existsNode &&
+      targetDropNode instanceof QueryBuilderFilterTreeExistsNodeData
+    ) {
+      filterState.newGroupConditionFromNode(existsNode, treeNode);
+    } else if (
+      targetDropNode instanceof QueryBuilderFilterTreeConditionNodeData
+    ) {
+      const parentNode = filterState.getParentNode(targetDropNode);
+      if (
+        existsNode &&
+        parentNode instanceof QueryBuilderFilterTreeExistsNodeData &&
+        parentNode.childrenIds.length === 1
+      ) {
+        filterState.newGroupConditionFromNode(
+          existsNode,
+          treeNode,
+          QUERY_BUILDER_GROUP_OPERATION.AND,
+        );
+      } else if (
+        existsNode &&
+        parentNode instanceof QueryBuilderFilterTreeGroupNodeData
+      ) {
+        const propertyExpression1 = buildPropertyExpressionFromExistsNode(
+          filterState,
+          existsNode,
+          targetDropNode,
+        );
+        filterState.removeNodeAndPruneBranch(targetDropNode);
+        filterState.newGroupConditionFromNode(
+          existsNode,
+          treeNode,
+          parentNode.groupOperation,
+        );
+        const newParentNode = filterState.getParentNode(treeNode);
+        buildFilterTreeWithExists(
+          propertyExpression1,
+          filterState,
+          newParentNode,
+        );
+      } else {
+        filterState.newGroupWithConditionFromNode(treeNode, targetDropNode);
+      }
+    } else {
+      filterState.addNodeFromNode(treeNode, undefined);
+    }
   }
 };
 
@@ -604,7 +821,12 @@ const QueryBuilderFilterConditionEditor = observer(
     };
 
     return (
-      <div className="query-builder-filter-tree__node__label__content dnd__entry__container">
+      <div
+        className="query-builder-filter-tree__node__label__content dnd__entry__container"
+        data-testid={
+          QUERY_BUILDER_TEST_ID.QUERY_BUILDER_FILTER_TREE_CONDITION_NODE_CONTENT
+        }
+      >
         <PanelEntryDropZonePlaceholder
           isDragOver={isDragOver}
           label="Add New Logical Group"
@@ -845,21 +1067,17 @@ const QueryBuilderFilterTreeNodeContainer = observer(
               node,
             );
           } else if (node instanceof QueryBuilderFilterTreeConditionNodeData) {
-            filterState.newGroupWithConditionFromNode(
-              new QueryBuilderFilterTreeConditionNodeData(
-                undefined,
-                filterConditionState,
-              ),
+            buildFilterTree(
+              filterConditionState.propertyExpressionState.propertyExpression,
+              filterState,
               node,
             );
           } else if (
             node instanceof QueryBuilderFilterTreeBlankConditionNodeData
           ) {
-            filterState.replaceBlankNodeWithNode(
-              new QueryBuilderFilterTreeConditionNodeData(
-                undefined,
-                filterConditionState,
-              ),
+            buildFilterTree(
+              filterConditionState.propertyExpressionState.propertyExpression,
+              filterState,
               node,
             );
           }

package/src/stores/QueryBuilderConstantsState.ts

@@ -24,6 +24,12 @@ import {
   buildSourceInformationSourceId,
   ParserError,
   GRAPH_MANAGER_EVENT,
+  SimpleFunctionExpression,
+  PrimitiveInstanceValue,
+  PrimitiveType,
+  extractElementNameFromPath,
+  SUPPORTED_FUNCTIONS,
+  INTERNAL__UnknownValueSpecification,
 } from '@finos/legend-graph';
 import {
   type Hashable,
@@ -70,6 +76,22 @@ export abstract class QueryBuilderConstantExpressionState implements Hashable {
       this.variable.name,
     ]);
   }
+
+  buildLetExpression(): SimpleFunctionExpression {
+    const leftSide = new PrimitiveInstanceValue(
+      GenericTypeExplicitReference.create(
+        new GenericType(PrimitiveType.STRING),
+      ),
+    );
+    leftSide.values = [this.variable.name];
+    const letFunc = new SimpleFunctionExpression(
+      extractElementNameFromPath(SUPPORTED_FUNCTIONS.LET),
+    );
+    letFunc.parametersValues = [leftSide, this.buildLetAssignmentValue()];
+    return letFunc;
+  }
+
+  abstract buildLetAssignmentValue(): ValueSpecification;
 }
 
 export class QueryBuilderSimpleConstantExpressionState
@@ -141,6 +163,10 @@ export class QueryBuilderSimpleConstantExpressionState
     }
   }
 
+  override buildLetAssignmentValue(): ValueSpecification {
+    return this.value;
+  }
+
   override get hashCode(): string {
     return hashArray([
       QUERY_BUILDER_STATE_HASH_STRUCTURE.CONSTANT_EXPRESSION_STATE,
@@ -272,6 +298,10 @@ export class QueryBuilderCalculatedConstantExpressionState
   setValue(val: PlainObject): void {
     this.value = val;
   }
+
+  override buildLetAssignmentValue(): ValueSpecification {
+    return new INTERNAL__UnknownValueSpecification(this.value);
+  }
 }
 
 export class QueryBuilderConstantsState implements Hashable {