@finos/legend-query-builder 4.1.1 → 4.1.3

package/src/stores/execution-plan/ExecutionPlanState.ts

@@ -14,15 +14,20 @@
  * limitations under the License.
  */
 
-import { observable, action, makeObservable } from 'mobx';
+import { observable, action, makeObservable, computed } from 'mobx';
 import {
   type RawExecutionPlan,
   type GraphManagerState,
   ExecutionPlan,
   ExecutionNode,
 } from '@finos/legend-graph';
-import type { TreeNodeData } from '@finos/legend-art';
+import type { TreeNodeData, TreeData } from '@finos/legend-art';
 import type { GenericLegendApplicationStore } from '@finos/legend-application';
+import {
+  addUniqueEntry,
+  filterByType,
+  guaranteeNonNullable,
+} from '@finos/legend-shared';
 
 export class ExecutionPlanViewTreeNodeData implements TreeNodeData {
   id: string;
@@ -33,10 +38,22 @@ export class ExecutionPlanViewTreeNodeData implements TreeNodeData {
   executionPlan!: ExecutionPlan;
 
   constructor(id: string, label: string, executionPlan: ExecutionPlan) {
+    makeObservable(this, {
+      isSelected: observable,
+      isOpen: observable,
+      setIsSelected: action,
+      setIsOpen: action,
+    });
     this.id = id;
     this.label = label;
     this.executionPlan = executionPlan;
   }
+  setIsSelected(val: boolean): void {
+    this.isSelected = val;
+  }
+  setIsOpen(val: boolean): void {
+    this.isOpen = val;
+  }
 }
 
 export class ExecutionNodeTreeNodeData implements TreeNodeData {
@@ -48,12 +65,85 @@ export class ExecutionNodeTreeNodeData implements TreeNodeData {
   executionNode: ExecutionNode;
 
   constructor(id: string, label: string, executionNode: ExecutionNode) {
+    makeObservable(this, {
+      isSelected: observable,
+      isOpen: observable,
+      setIsSelected: action,
+      setIsOpen: action,
+    });
     this.id = id;
     this.label = label;
     this.executionNode = executionNode;
   }
+
+  setIsSelected(val: boolean): void {
+    this.isSelected = val;
+  }
+  setIsOpen(val: boolean): void {
+    this.isOpen = val;
+  }
 }
 
+export const generateExecutionNodeTreeNodeData = (
+  executionNode: ExecutionNode,
+  label: string,
+  parentNode:
+    | ExecutionNodeTreeNodeData
+    | ExecutionPlanViewTreeNodeData
+    | undefined,
+): ExecutionNodeTreeNodeData => {
+  const executionNodeTreeNode = new ExecutionNodeTreeNodeData(
+    executionNode._UUID,
+    label,
+    executionNode,
+  );
+
+  const childrenIds: string[] = [];
+
+  executionNode.executionNodes
+    .slice()
+    .filter(filterByType(ExecutionNode))
+    .forEach((childExecutionNode) => {
+      addUniqueEntry(childrenIds, childExecutionNode._UUID);
+    });
+
+  executionNodeTreeNode.childrenIds = childrenIds;
+
+  return executionNodeTreeNode;
+};
+
+export const generateExecutionPlanTreeNodeData = (
+  executionPlan: ExecutionPlan,
+): ExecutionPlanViewTreeNodeData => {
+  const executionPlanNode = new ExecutionPlanViewTreeNodeData(
+    `Execution Plan`,
+    `Execution Plan`,
+    executionPlan,
+  );
+
+  const childrenIds: string[] = [];
+
+  const rootNodeId = executionPlan.rootExecutionNode._UUID;
+  addUniqueEntry(childrenIds, rootNodeId);
+  executionPlanNode.childrenIds = childrenIds;
+  return executionPlanNode;
+};
+
+export const getExecutionPlanTreeData = (
+  executionPlan: ExecutionPlan,
+): TreeData<ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData> => {
+  const rootIds: string[] = [];
+  const nodes = new Map<
+    string,
+    ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData
+  >();
+  const executionPlanTreeNode =
+    generateExecutionPlanTreeNodeData(executionPlan);
+  addUniqueEntry(rootIds, executionPlanTreeNode.id);
+  nodes.set(executionPlanTreeNode.id, executionPlanTreeNode);
+  return { rootIds, nodes };
+};
+
 export enum EXECUTION_PLAN_VIEW_MODE {
   FORM = 'Form',
   JSON = 'JSON',
@@ -69,6 +159,9 @@ export class ExecutionPlanState {
     | ExecutionPlanViewTreeNodeData
     | undefined = undefined;
   viewMode: EXECUTION_PLAN_VIEW_MODE = EXECUTION_PLAN_VIEW_MODE.FORM;
+  treeData?:
+    | TreeData<ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData>
+    | undefined;
   rawPlan?: RawExecutionPlan | undefined;
   plan?: ExecutionPlan | undefined;
   debugText?: string | undefined;
@@ -84,6 +177,7 @@ export class ExecutionPlanState {
       rawPlan: observable,
       plan: observable,
       debugText: observable,
+      treeData: observable,
       setExecutionPlanDisplayData: action,
       setExecutionPlanDisplayDataJson: action,
       transformMetadataToProtocolJson: action,
@@ -92,6 +186,11 @@ export class ExecutionPlanState {
       setPlan: action,
       setViewMode: action,
       setDebugText: action,
+      setTreeNode: action,
+      setTreeData: action,
+      refreshTreeData: action,
+      nonNullableTreeData: computed,
+      initialize: action,
     });
     this.applicationStore = applicationStore;
     this.graphManagerState = graphManagerState;
@@ -101,6 +200,36 @@ export class ExecutionPlanState {
     this.viewMode = val;
   }
 
+  setTreeNode(
+    id: string,
+    node: ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData,
+  ): void {
+    this.treeData?.nodes.set(id, node);
+  }
+
+  setTreeData(
+    val:
+      | TreeData<ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData>
+      | undefined,
+  ): void {
+    this.treeData = val;
+  }
+
+  refreshTreeData(): void {
+    if (this.treeData) {
+      this.setTreeData({ ...this.treeData });
+    }
+  }
+
+  get nonNullableTreeData(): TreeData<
+    ExecutionPlanViewTreeNodeData | ExecutionNodeTreeNodeData
+  > {
+    return guaranteeNonNullable(
+      this.treeData,
+      'Execution plan viewer tree data has not been initialized',
+    );
+  }
+
   setRawPlan = (val: RawExecutionPlan | undefined): void => {
     this.rawPlan = val;
   };
@@ -109,6 +238,15 @@ export class ExecutionPlanState {
     this.plan = val;
   };
 
+  initialize = (val: ExecutionPlan | undefined): void => {
+    this.setPlan(val);
+    if (val !== undefined) {
+      this.setTreeData(getExecutionPlanTreeData(val));
+    } else {
+      this.setTreeData(undefined);
+    }
+  };
+
   setDebugText(val: string | undefined): void {
     this.debugText = val;
   }
@@ -117,10 +255,10 @@ export class ExecutionPlanState {
     node: ExecutionNodeTreeNodeData | ExecutionPlanViewTreeNodeData | undefined,
   ): void {
     if (this.selectedNode) {
-      this.selectedNode.isSelected = false;
+      this.selectedNode.setIsSelected(false);
     }
     if (node) {
-      node.isSelected = true;
+      node.setIsSelected(true);
     }
     this.selectedNode = node;
   }

package/src/stores/fetch-structure/tds/QueryBuilderTDSState.ts

@@ -121,6 +121,8 @@ export class QueryBuilderTDSState
   isConvertDerivationProjectionObjects = false;
   showPostFilterPanel: boolean;
   showWindowFuncPanel = false;
+  draggedColumnIndex: number | undefined;
+  hoveredColumnIndex: number | undefined;
 
   postFilterOperators: QueryBuilderPostFilterOperator[] =
     getQueryBuilderCorePostFilterOperators();
@@ -142,11 +144,14 @@ export class QueryBuilderTDSState
       isConvertDerivationProjectionObjects: observable,
       showPostFilterPanel: observable,
       showWindowFuncPanel: observable,
+      draggedColumnIndex: observable,
+      hoveredColumnIndex: observable,
       TEMPORARY__showPostFetchStructurePanel: computed,
       derivations: computed,
       hasParserError: computed,
       addColumn: action,
       moveColumn: action,
+      setRearrangeColumnsIndex: action,
       replaceColumn: action,
       initialize: action,
       setShowPostFilterPanel: action,
@@ -154,6 +159,9 @@ export class QueryBuilderTDSState
       convertDerivationProjectionObjects: flow,
     });
 
+    this.draggedColumnIndex = undefined;
+    this.hoveredColumnIndex = undefined;
+
     this.resultSetModifierState = new QueryResultSetModifierState(this);
     this.postFilterState = new QueryBuilderPostFilterState(
       this,
@@ -174,6 +182,14 @@ export class QueryBuilderTDSState
       ) ?? false;
   }
 
+  setRearrangeColumnsIndex(
+    draggedColumnIndex: number | undefined,
+    hoveredColumnIndex: number | undefined,
+  ): void {
+    this.draggedColumnIndex = draggedColumnIndex;
+    this.hoveredColumnIndex = hoveredColumnIndex;
+  }
+
   get type(): string {
     return FETCH_STRUCTURE_IMPLEMENTATION.TABULAR_DATA_STRUCTURE;
   }

package/tsconfig.json

@@ -222,8 +222,16 @@
     "./src/components/ServiceQuerySetupUtils.tsx",
     "./src/components/__test-utils__/QueryBuilderComponentTestUtils.tsx",
     "./src/components/data-access/DataAccessOverview.tsx",
+    "./src/components/execution-plan/AllocationExecutionNodeViewer.tsx",
+    "./src/components/execution-plan/ConstantExecutionNodeViewer.tsx",
+    "./src/components/execution-plan/DataTypeResultTypeViewer.tsx",
     "./src/components/execution-plan/ExecutionPlanViewer.tsx",
+    "./src/components/execution-plan/FunctionParametersValidationNodeViewer.tsx",
+    "./src/components/execution-plan/RelationalTDSInstantiationExecutionNodeViewer.tsx",
+    "./src/components/execution-plan/ResultTypeViewer.tsx",
     "./src/components/execution-plan/SQLExecutionNodeViewer.tsx",
+    "./src/components/execution-plan/SequenceExecutionNodeViewer.tsx",
+    "./src/components/execution-plan/TDSResultTypeViewer.tsx",
     "./src/components/explorer/QueryBuilderExplorerPanel.tsx",
     "./src/components/explorer/QueryBuilderFunctionsExplorerPanel.tsx",
     "./src/components/explorer/QueryBuilderMilestoningEditor.tsx",