@finos/legend-query-builder 4.0.1 → 4.0.3

package/src/components/QueryBuilderResultPanel.tsx

@@ -130,15 +130,13 @@ const QueryBuilderGridResultContextMenu = observer(
       new QueryBuilderPostFilterOperator_NotEqual();
     const postFilterNotInOperator = new QueryBuilderPostFilterOperator_NotIn();
     const postFilterState = tdsState.postFilterState;
-    const projectionColumnState = guaranteeNonNullable(
-      tdsState.projectionColumns
-        .filter((c) => c.columnName === event.current?.column.getColId())
-        .concat(
-          tdsState.aggregationState.columns
-            .filter((c) => c.columnName === event.current?.column.getColId())
-            .map((ag) => ag.projectionColumnState),
-        )[0],
-    );
+    const projectionColumnState = tdsState.tdsColumns
+      .filter((c) => c.columnName === event.current?.column.getColId())
+      .concat(
+        tdsState.aggregationState.columns
+          .filter((c) => c.columnName === event.current?.column.getColId())
+          .map((ag) => ag.projectionColumnState),
+      )[0];
 
     const getExistingPostFilterNode = (
       operators: QueryBuilderPostFilterOperator[],
@@ -153,7 +151,7 @@ const QueryBuilderGridResultContextMenu = observer(
         .filter(
           (n) =>
             (n as QueryBuilderPostFilterTreeConditionNodeData).condition
-              .columnState.columnName === projectionColumnState.columnName &&
+              .columnState.columnName === projectionColumnState?.columnName &&
             operators
               .map((op) => op.getLabel())
               .includes(
@@ -188,42 +186,43 @@ const QueryBuilderGridResultContextMenu = observer(
     const generateNewPostFilterConditionNodeData = async (
       operator: QueryBuilderPostFilterOperator,
     ): Promise<void> => {
-      let postFilterConditionState: PostFilterConditionState;
-      try {
-        postFilterConditionState = new PostFilterConditionState(
-          postFilterState,
-          projectionColumnState,
-          undefined,
-          operator,
-        );
-        if (
-          projectionColumnState instanceof
-          QueryBuilderDerivationProjectionColumnState
-        ) {
-          await flowResult(
-            projectionColumnState.fetchDerivationLambdaReturnType(),
+      if (projectionColumnState) {
+        try {
+          const postFilterConditionState = new PostFilterConditionState(
+            postFilterState,
+            projectionColumnState,
+            undefined,
+            operator,
           );
-        }
-        const defaultFilterConditionValue =
-          postFilterConditionState.operator.getDefaultFilterConditionValue(
-            postFilterConditionState,
+          if (
+            projectionColumnState instanceof
+            QueryBuilderDerivationProjectionColumnState
+          ) {
+            await flowResult(
+              projectionColumnState.fetchDerivationLambdaReturnType(),
+            );
+          }
+          const defaultFilterConditionValue =
+            postFilterConditionState.operator.getDefaultFilterConditionValue(
+              postFilterConditionState,
+            );
+          postFilterConditionState.setValue(defaultFilterConditionValue);
+          updateFilterConditionValue(
+            defaultFilterConditionValue as InstanceValue,
           );
-        postFilterConditionState.setValue(defaultFilterConditionValue);
-        updateFilterConditionValue(
-          defaultFilterConditionValue as InstanceValue,
-        );
-      } catch (error) {
-        assertErrorThrown(error);
-        applicationStore.notificationService.notifyWarning(error.message);
-        return;
+          postFilterState.addNodeFromNode(
+            new QueryBuilderPostFilterTreeConditionNodeData(
+              undefined,
+              postFilterConditionState,
+            ),
+            undefined,
+          );
+        } catch (error) {
+          assertErrorThrown(error);
+          applicationStore.notificationService.notifyWarning(error.message);
+          return;
+        }
       }
-      postFilterState.addNodeFromNode(
-        new QueryBuilderPostFilterTreeConditionNodeData(
-          undefined,
-          postFilterConditionState,
-        ),
-        undefined,
-      );
     };
 
     const updateExistingPostFilterConditionNodeData = (
@@ -323,6 +322,7 @@ const QueryBuilderGridResultContextMenu = observer(
     return (
       <MenuContent ref={ref}>
         <MenuContentItem
+          disabled={!projectionColumnState}
           onClick={(): void => {
             filterByOrOut(true);
           }}
@@ -330,6 +330,7 @@ const QueryBuilderGridResultContextMenu = observer(
           Filter By
         </MenuContentItem>
         <MenuContentItem
+          disabled={!projectionColumnState}
           onClick={(): void => {
             filterByOrOut(false);
           }}

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

@@ -62,6 +62,11 @@ export const TEST__setUpQueryBuilder = async (
     new LogService(),
   );
 
+  await graphManagerState.graphManager.initialize({
+    env: 'test',
+    tabSize: 2,
+    clientConfig: {},
+  });
   await graphManagerState.initializeSystem();
   await graphManagerState.graphManager.buildGraph(
     graphManagerState.graph,

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

@@ -22,7 +22,6 @@ import {
   CaretDownIcon,
   ChevronDownIcon,
   ChevronRightIcon,
-  ClickAwayListener,
   clsx,
   ContextMenu,
   DropdownMenu,
@@ -115,18 +114,15 @@ const QueryBuilderPostFilterConditionContextMenu = observer(
     const removeNode = (): void =>
       postFilterState.removeNodeAndPruneBranch(node);
     const createCondition = (): void => {
-      postFilterState.suppressClickawayEventListener();
       postFilterState.addNodeFromNode(
         new QueryBuilderPostFilterTreeBlankConditionNodeData(undefined),
         node,
       );
     };
     const createGroupCondition = (): void => {
-      postFilterState.suppressClickawayEventListener();
       postFilterState.addGroupConditionNodeFromNode(node);
     };
     const newGroupWithCondition = (): void => {
-      postFilterState.suppressClickawayEventListener();
       postFilterState.newGroupWithConditionFromNode(undefined, node);
     };
 
@@ -730,33 +726,30 @@ const QueryBuilderPostFilterTree = observer(
       postFilterState.getNode(rootId),
     );
     const onNodeSelect = (node: QueryBuilderPostFilterTreeNodeData): void =>
-      postFilterState.setSelectedNode(node);
+      postFilterState.setSelectedNode(
+        postFilterState.selectedNode !== node ? node : undefined,
+      );
     const getChildNodes = (
       node: QueryBuilderPostFilterTreeNodeData,
     ): QueryBuilderPostFilterTreeNodeData[] =>
       node instanceof QueryBuilderPostFilterTreeGroupNodeData
         ? node.childrenIds.map((id) => postFilterState.getNode(id))
         : [];
-    const onClickAway = (): void => {
-      postFilterState.handleClickaway();
-    };
     return (
-      <ClickAwayListener onClickAway={onClickAway}>
-        <div className="tree-view__node__root query-builder-post-filter-tree__root">
-          {rootNodes.map((node) => (
-            <QueryBuilderPostFilterTreeNodeView
-              key={node.id}
-              level={0}
-              node={node}
-              getChildNodes={getChildNodes}
-              onNodeSelect={onNodeSelect}
-              innerProps={{
-                tdsState: tdsState,
-              }}
-            />
-          ))}
-        </div>
-      </ClickAwayListener>
+      <div className="tree-view__node__root query-builder-post-filter-tree__root">
+        {rootNodes.map((node) => (
+          <QueryBuilderPostFilterTreeNodeView
+            key={node.id}
+            level={0}
+            node={node}
+            getChildNodes={getChildNodes}
+            onNodeSelect={onNodeSelect}
+            innerProps={{
+              tdsState: tdsState,
+            }}
+          />
+        ))}
+      </div>
     );
   },
 );
@@ -786,21 +779,18 @@ const QueryBuilderPostFilterPanelContent = observer(
       QueryBuilderTelemetryHelper.logEvent_PostFilterCleanupTreeLaunched(
         applicationStore.telemetryService,
       );
-      postFilterState.suppressClickawayEventListener();
       postFilterState.pruneTree();
     };
     const simplifyTree = (): void => {
       QueryBuilderTelemetryHelper.logEvent_PostFilterSimplifyTreeLaunched(
         applicationStore.telemetryService,
       );
-      postFilterState.suppressClickawayEventListener();
       postFilterState.simplifyTree();
     };
     const createCondition = (): void => {
       QueryBuilderTelemetryHelper.logEvent_PostFilterCreateConditionLaunched(
         applicationStore.telemetryService,
       );
-      postFilterState.suppressClickawayEventListener();
       postFilterState.addNodeFromNode(
         new QueryBuilderPostFilterTreeBlankConditionNodeData(undefined),
         postFilterState.selectedNode,
@@ -816,7 +806,6 @@ const QueryBuilderPostFilterPanelContent = observer(
       QueryBuilderTelemetryHelper.logEvent_PostFilterCreateLogicalGroupLaunched(
         applicationStore.telemetryService,
       );
-      postFilterState.suppressClickawayEventListener();
       if (allowGroupCreation) {
         postFilterState.addGroupConditionNodeFromNode(
           postFilterState.selectedNode,
@@ -827,7 +816,6 @@ const QueryBuilderPostFilterPanelContent = observer(
       QueryBuilderTelemetryHelper.logEvent_PostFilterCreateGroupFromConditionLaunched(
         applicationStore.telemetryService,
       );
-      postFilterState.suppressClickawayEventListener();
       if (
         postFilterState.selectedNode instanceof
         QueryBuilderPostFilterTreeConditionNodeData

package/src/components/filter/QueryBuilderFilterPanel.tsx

@@ -20,7 +20,6 @@ import {
   type TreeNodeContainerProps,
   type TreeNodeViewProps,
   clsx,
-  ClickAwayListener,
   ContextMenu,
   DropdownMenu,
   MenuContent,
@@ -328,14 +327,12 @@ const QueryBuilderFilterConditionContextMenu = observer(
     const filterState = queryBuilderState.filterState;
     const removeNode = (): void => filterState.removeNodeAndPruneBranch(node);
     const createCondition = (): void => {
-      filterState.suppressClickawayEventListener();
       filterState.addNodeFromNode(
         new QueryBuilderFilterTreeBlankConditionNodeData(undefined),
         node,
       );
     };
     const createGroupCondition = (): void => {
-      filterState.suppressClickawayEventListener();
       filterState.addGroupConditionNodeFromNode(node);
     };
     const newGroupWithCondition = (): void => {
@@ -343,7 +340,6 @@ const QueryBuilderFilterConditionContextMenu = observer(
         queryBuilderState.applicationStore.telemetryService,
       );
 
-      filterState.suppressClickawayEventListener();
       filterState.newGroupWithConditionFromNode(undefined, node);
     };
 
@@ -652,32 +648,32 @@ const QueryBuilderFilterTree = observer(
     const rootNodes = filterState.rootIds.map((rootId) =>
       filterState.getNode(rootId),
     );
-    const onNodeSelect = (node: QueryBuilderFilterTreeNodeData): void =>
-      filterState.setSelectedNode(node);
+    const onNodeSelect = (node: QueryBuilderFilterTreeNodeData): void => {
+      filterState.setSelectedNode(
+        filterState.selectedNode !== node ? node : undefined,
+      );
+    };
     const getChildNodes = (
       node: QueryBuilderFilterTreeNodeData,
     ): QueryBuilderFilterTreeNodeData[] =>
       node instanceof QueryBuilderFilterTreeGroupNodeData
         ? node.childrenIds.map((id) => filterState.getNode(id))
         : [];
-    const onClickAway = (): void => filterState.handleClickaway();
     return (
-      <ClickAwayListener onClickAway={onClickAway}>
-        <div className="tree-view__node__root query-builder-filter-tree__root">
-          {rootNodes.map((node) => (
-            <QueryBuilderFilterTreeNodeView
-              key={node.id}
-              level={0}
-              node={node}
-              getChildNodes={getChildNodes}
-              onNodeSelect={onNodeSelect}
-              innerProps={{
-                queryBuilderState,
-              }}
-            />
-          ))}
-        </div>
-      </ClickAwayListener>
+      <div className="tree-view__node__root query-builder-filter-tree__root">
+        {rootNodes.map((node) => (
+          <QueryBuilderFilterTreeNodeView
+            key={node.id}
+            level={0}
+            node={node}
+            getChildNodes={getChildNodes}
+            onNodeSelect={onNodeSelect}
+            innerProps={{
+              queryBuilderState,
+            }}
+          />
+        ))}
+      </div>
     );
   },
 );
@@ -707,21 +703,18 @@ export const QueryBuilderFilterPanel = observer(
       QueryBuilderTelemetryHelper.logEvent_FilterCleanupTreeLaunched(
         queryBuilderState.applicationStore.telemetryService,
       );
-      filterState.suppressClickawayEventListener();
       filterState.pruneTree();
     };
     const simplifyTree = (): void => {
       QueryBuilderTelemetryHelper.logEvent_FilterSimplifyTreeLaunched(
         queryBuilderState.applicationStore.telemetryService,
       );
-      filterState.suppressClickawayEventListener();
       filterState.simplifyTree();
     };
     const createCondition = (): void => {
       QueryBuilderTelemetryHelper.logEvent_FilterCreateConditionLaunched(
         queryBuilderState.applicationStore.telemetryService,
       );
-      filterState.suppressClickawayEventListener();
       filterState.addNodeFromNode(
         new QueryBuilderFilterTreeBlankConditionNodeData(undefined),
         filterState.selectedNode,
@@ -736,7 +729,6 @@ export const QueryBuilderFilterPanel = observer(
       QueryBuilderTelemetryHelper.logEvent_FilterCreateLogicalGroupLaunched(
         queryBuilderState.applicationStore.telemetryService,
       );
-      filterState.suppressClickawayEventListener();
       if (allowGroupCreation) {
         filterState.addGroupConditionNodeFromNode(filterState.selectedNode);
       }
@@ -745,7 +737,6 @@ export const QueryBuilderFilterPanel = observer(
       QueryBuilderTelemetryHelper.logEvent_FilterCreateLogicalGroupLaunched(
         applicationStore.telemetryService,
       );
-      filterState.suppressClickawayEventListener();
       if (
         filterState.selectedNode instanceof
         QueryBuilderFilterTreeConditionNodeData

package/src/components/shared/LambdaEditor.tsx

@@ -329,9 +329,10 @@ const LambdaEditor_Inner = observer(
       () => (): void => {
         if (editor) {
           disposeCodeEditor(editor);
+
+          onDidChangeModelContentEventDisposer.current?.dispose();
+          onDidFocusEditorWidgetDisposer.current?.dispose();
         }
-        onDidChangeModelContentEventDisposer.current?.dispose();
-        onDidFocusEditorWidgetDisposer.current?.dispose();
       },
       [editor],
     );
@@ -562,8 +563,9 @@ const LambdaEditor_PopUp = observer(
       () => (): void => {
         if (editor) {
           disposeCodeEditor(editor);
+
+          onDidChangeModelContentEventDisposer.current?.dispose();
         }
-        onDidChangeModelContentEventDisposer.current?.dispose();
       },
       [editor],
     );

package/src/index.ts

@@ -54,6 +54,10 @@ export * from './components/QueryBuilderTextEditor.js';
 export { QueryBuilderTextEditorMode } from './stores/QueryBuilderTextEditorState.js';
 export { buildSerialzieFunctionWithGraphFetch } from './stores/fetch-structure/graph-fetch/QueryBuilderGraphFetchTreeValueSpecificationBuilder.js';
 export { buildGetAllFunction } from './stores/QueryBuilderValueSpecificationBuilder.js';
+export {
+  QueryBuilderDiffViewState,
+  QueryBuilderChangeDetectionState,
+} from './stores/QueryBuilderChangeDetectionState.js';
 
 // ------------------------------------------- Shared components -------------------------------------------
 
@@ -72,6 +76,7 @@ export * from './components/execution-plan/ExecutionPlanViewer.js';
 export * from './stores/execution-plan/ExecutionPlanState.js';
 
 export * from './components/QueryLoader.js';
+export * from './components/QueryBuilderDiffPanel.js';
 export * from './stores/QueryLoaderState.js';
 export * from './stores/QueryBuilder_LegendApplicationPlugin_Extension.js';
 

package/src/stores/QueryBuilderChangeDetectionState.ts

@@ -114,11 +114,15 @@ export class QueryBuilderChangeDetectionState {
   }
 
   showDiffViewPanel(): void {
+    this.diffViewState = this.buildQueryBuilderDiffViewState();
+  }
+
+  buildQueryBuilderDiffViewState(): QueryBuilderDiffViewState {
     assertNonNullable(
       this.querySnapshot,
       `Can't show changes: change detection is not properly initialized`,
     );
-    this.diffViewState = new QueryBuilderDiffViewState(
+    return new QueryBuilderDiffViewState(
       this,
       this.querySnapshot,
       this.querybuilderState.buildQuery(),

package/src/stores/fetch-structure/graph-fetch/QueryBuilderGraphFetchTreeStateBuilder.ts

@@ -219,6 +219,12 @@ export const processGraphFetchSerializeExpression = (
       RootGraphFetchTree,
       `Can't process serialize() expression: serialize() graph-fetch tree root is missing`,
     );
+
+    assertTrue(
+      graphFetchTreeRoot.subTypeTrees.length === 0,
+      `Can't process serialize() expression: subTypeTree is not supported.`,
+    );
+
     graphFetchTreeState.setGraphFetchTree(
       buildGraphFetchTreeData(graphFetchTreeRoot),
     );

package/src/stores/fetch-structure/tds/post-filter/QueryBuilderPostFilterState.ts

@@ -478,7 +478,6 @@ export class QueryBuilderPostFilterState
   operators: QueryBuilderPostFilterOperator[] = [];
   rootIds: string[] = [];
   nodes = new Map<string, QueryBuilderPostFilterTreeNodeData>();
-  _suppressClickawayEventListener = false;
 
   constructor(
     tdsState: QueryBuilderTDSState,
@@ -502,7 +501,6 @@ export class QueryBuilderPostFilterState
       collapseTree: action,
       expandTree: action,
       replaceBlankNodeWithNode: action,
-      suppressClickawayEventListener: action,
       setRearrangingConditions: action,
       hashCode: computed,
     });
@@ -515,10 +513,6 @@ export class QueryBuilderPostFilterState
     this.isRearrangingConditions = val;
   }
 
-  suppressClickawayEventListener(): void {
-    this._suppressClickawayEventListener = true;
-  }
-
   setSelectedNode(val: QueryBuilderPostFilterTreeNodeData | undefined): void {
     this.selectedNode = val;
   }
@@ -652,14 +646,6 @@ export class QueryBuilderPostFilterState
     }
   }
 
-  handleClickaway(): void {
-    if (this._suppressClickawayEventListener) {
-      this._suppressClickawayEventListener = false;
-      return;
-    }
-    this.setSelectedNode(undefined);
-  }
-
   addNodeFromNode(
     node: QueryBuilderPostFilterTreeNodeData,
     fromNode: QueryBuilderPostFilterTreeNodeData | undefined,

package/src/stores/filter/QueryBuilderFilterState.ts

@@ -380,7 +380,6 @@ export class QueryBuilderFilterState
   selectedNode?: QueryBuilderFilterTreeNodeData | undefined;
   isRearrangingConditions = false;
   operators: QueryBuilderFilterOperator[] = [];
-  private _suppressClickawayEventListener = false;
   showPanel = true;
 
   constructor(
@@ -396,8 +395,6 @@ export class QueryBuilderFilterState
       showPanel: observable,
       setLambdaParameterName: action,
       setRearrangingConditions: action,
-      suppressClickawayEventListener: action,
-      handleClickaway: action,
       setSelectedNode: action,
       addNodeFromNode: action,
       replaceBlankNodeWithNode: action,
@@ -431,16 +428,6 @@ export class QueryBuilderFilterState
   setRearrangingConditions(val: boolean): void {
     this.isRearrangingConditions = val;
   }
-  suppressClickawayEventListener(): void {
-    this._suppressClickawayEventListener = true;
-  }
-  handleClickaway(): void {
-    if (this._suppressClickawayEventListener) {
-      this._suppressClickawayEventListener = false;
-      return;
-    }
-    this.setSelectedNode(undefined);
-  }
   setSelectedNode(val: QueryBuilderFilterTreeNodeData | undefined): void {
     this.selectedNode = val;
   }