@finos/legend-application-repl 0.0.52 → 0.0.54

package/src/stores/dataCube/editor/DataCubeEditorColumnsPanelState.ts

@@ -14,16 +14,16 @@
  * limitations under the License.
  */
 
-import { action, makeObservable, observable } from 'mobx';
+import { action, makeObservable, observable, override } from 'mobx';
 import type { DataCubeState } from '../DataCubeState.js';
 import {
   type DataCubeQuerySnapshot,
   type DataCubeQuerySnapshotColumn,
+  type DataCubeQuerySnapshotExtendedColumn,
 } from '../core/DataCubeQuerySnapshot.js';
 import type { DataCubeQueryEditorPanelState } from './DataCubeEditorPanelState.js';
 import {
   DataCubeEditorColumnsSelectorColumnState,
-  DataCubeEditorColumnsSelectorHiddenColumnsVisibility,
   DataCubeEditorColumnsSelectorState,
 } from './DataCubeEditorColumnsSelectorState.js';
 import type { DataCubeEditorState } from './DataCubeEditorState.js';
@@ -31,6 +31,29 @@ import { type DataCubeConfiguration } from '../core/DataCubeConfiguration.js';
 import { DataCubeMutableColumnConfiguration } from './DataCubeMutableConfiguration.js';
 
 export class DataCubeEditorBasicColumnsSelectorState extends DataCubeEditorColumnsSelectorState<DataCubeEditorColumnsSelectorColumnState> {
+  showHiddenColumns = false;
+
+  constructor(
+    editor: DataCubeEditorState,
+    options?: {
+      onChange?:
+        | ((
+            select: DataCubeEditorColumnsSelectorState<DataCubeEditorColumnsSelectorColumnState>,
+          ) => void)
+        | undefined;
+    },
+  ) {
+    super(editor, options);
+
+    makeObservable(this, {
+      availableColumnsForDisplay: override,
+      selectedColumnsForDisplay: override,
+
+      showHiddenColumns: observable,
+      setShowHiddenColumns: action,
+    });
+  }
+
   override cloneColumn(column: DataCubeEditorColumnsSelectorColumnState) {
     return new DataCubeEditorColumnsSelectorColumnState(
       column.name,
@@ -41,13 +64,68 @@ export class DataCubeEditorBasicColumnsSelectorState extends DataCubeEditorColum
   override get availableColumns() {
     return [
       ...this.editor.columns.sourceColumns,
-      // TODO: add extended columns
+      ...this.editor.columns.leafExtendColumns,
+      ...this.editor.columns.groupExtendColumns,
     ].map(
       (col) => new DataCubeEditorColumnsSelectorColumnState(col.name, col.type),
     );
   }
+
+  override get availableColumnsForDisplay(): DataCubeEditorColumnsSelectorColumnState[] {
+    return this.availableColumns
+      .filter(
+        (column) =>
+          !this.selectedColumns.find((col) => column.name === col.name),
+      )
+      .sort((a, b) => a.name.localeCompare(b.name))
+      .filter((column) => {
+        // group-level extended columns are always shown regardless if they are hidden or not
+        if (
+          this.editor.columns.groupExtendColumns.find(
+            (col) => col.name === column.name,
+          )
+        ) {
+          return true;
+        }
+
+        return this.showHiddenColumns
+          ? true
+          : !this.editor.columnProperties.getColumnConfiguration(column.name)
+              ?.hideFromView;
+      });
+  }
+
+  override get selectedColumnsForDisplay(): DataCubeEditorColumnsSelectorColumnState[] {
+    return this.selectedColumns.filter((column) => {
+      // group-level extended columns are always shown regardless if they are hidden or not
+      if (
+        this.editor.columns.groupExtendColumns.find(
+          (col) => col.name === column.name,
+        )
+      ) {
+        return true;
+      }
+
+      return this.showHiddenColumns
+        ? true
+        : !this.editor.columnProperties.getColumnConfiguration(column.name)
+            ?.hideFromView;
+    });
+  }
+
+  setShowHiddenColumns(val: boolean): void {
+    this.showHiddenColumns = val;
+  }
 }
 
+/**
+ * This panel allows selection of columns (including extended columns) for the query.
+ *
+ * NOTE: though it technically represents the `select()` function in the query, since for
+ * convenience, we also show group-level extended columns, there are a fair amount of
+ * edge cases we need to handle, such as we need to translate `unselecting` a group-level
+ * extended column to hiding it since this extend() operation occurs after select().
+ */
 export class DataCubeEditorColumnsPanelState
   implements DataCubeQueryEditorPanelState
 {
@@ -56,26 +134,27 @@ export class DataCubeEditorColumnsPanelState
   readonly selector!: DataCubeEditorBasicColumnsSelectorState;
 
   sourceColumns: DataCubeQuerySnapshotColumn[] = [];
+  leafExtendColumns: DataCubeQuerySnapshotExtendedColumn[] = [];
+  groupExtendColumns: DataCubeQuerySnapshotExtendedColumn[] = [];
 
   constructor(editor: DataCubeEditorState) {
     makeObservable(this, {
-      sourceColumns: observable,
-      setSourceColumns: action,
+      sourceColumns: observable.ref,
+      leafExtendColumns: observable.ref,
+      groupExtendColumns: observable.ref,
+
+      applySnaphot: action,
     });
 
     this.editor = editor;
     this.dataCube = editor.dataCube;
     this.selector = new DataCubeEditorBasicColumnsSelectorState(editor, {
-      initialHiddenColumnsVisibility:
-        DataCubeEditorColumnsSelectorHiddenColumnsVisibility.HIDDEN,
       onChange: (selector) => {
         // populate a default configuration for the newly selected columns
         selector.selectedColumns
           .filter(
             (col) =>
-              !this.editor.columnProperties.columns.find(
-                (column) => column.name === col.name,
-              ),
+              !this.editor.columnProperties.getColumnConfiguration(col.name),
           )
           .forEach((col) => {
             this.editor.columnProperties.setColumns([
@@ -86,6 +165,18 @@ export class DataCubeEditorColumnsPanelState
               }),
             ]);
           });
+
+        // update hidden flag for group-level extended columns
+        // based on the new selection state
+        this.groupExtendColumns.forEach((col) => {
+          const columnConfiguration =
+            this.editor.columnProperties.getColumnConfiguration(col.name);
+          columnConfiguration?.setHideFromView(
+            !selector.selectedColumns.find(
+              (column) => column.name === col.name,
+            ),
+          );
+        });
       },
     });
   }
@@ -102,49 +193,61 @@ export class DataCubeEditorColumnsPanelState
     // prune column properties
     this.editor.columnProperties.setColumns(
       this.editor.columnProperties.columns.filter((column) =>
-        this.selector.selectedColumns.find((col) => col.name === column.name),
+        this.editor.columnProperties.configurableColumns.find(
+          (col) => col.name === column.name,
+        ),
       ),
     );
 
     // prune sorts
     this.editor.sorts.selector.setSelectedColumns(
       this.editor.sorts.selector.selectedColumns.filter((column) =>
-        this.selector.selectedColumns.find((col) => col.name === column.name),
+        this.editor.sorts.selector.availableColumns.find(
+          (col) => col.name === column.name,
+        ),
       ),
     );
 
     // prune vertical pivots columns
     this.editor.verticalPivots.selector.setSelectedColumns(
       this.editor.verticalPivots.selector.selectedColumns.filter((column) =>
-        this.selector.selectedColumns.find((col) => col.name === column.name),
+        this.editor.verticalPivots.selector.availableColumns.find(
+          (col) => col.name === column.name,
+        ),
       ),
     );
 
     // TODO: prune horizontal pivots columns
   }
 
-  setSourceColumns(columns: DataCubeQuerySnapshotColumn[]) {
-    this.sourceColumns = columns;
-  }
-
   applySnaphot(
     snapshot: DataCubeQuerySnapshot,
     configuration: DataCubeConfiguration,
   ) {
-    this.setSourceColumns(snapshot.data.sourceColumns);
+    this.sourceColumns = snapshot.data.sourceColumns;
+    this.leafExtendColumns = snapshot.data.leafExtendedColumns;
+    this.groupExtendColumns = snapshot.data.groupExtendedColumns;
+
     this.selector.setSelectedColumns(
       // extract selected columns from the configuration since the configuration specifies the order
-      // taking into account the group extended columns
-      // NOTE: since select() is applied before grouping/aggregation, it's technicaly not possible to
-      // unselect the group extended columns, so we will take advantage of the `hidden` property to show
-      // group extended columns that are not hidden as selected
-      configuration.columns.map((col) => {
-        const column = this.selector.getColumn(col.name);
-        return new DataCubeEditorColumnsSelectorColumnState(
-          column.name,
-          column.type,
-        );
-      }),
+      // taking into account the group-level extended columns
+      configuration.columns
+        // NOTE: since select() is applied before grouping/aggregation, it's technicaly not possible to
+        // unselect the group-level extended columns, so we will take advantage of the `hidden` property to show
+        // group-level extended columns that are not hidden as selected
+        .filter(
+          (col) =>
+            !this.groupExtendColumns.find(
+              (column) => column.name === col.name,
+            ) || !col.hideFromView,
+        )
+        .map((col) => {
+          const column = this.selector.getColumn(col.name);
+          return new DataCubeEditorColumnsSelectorColumnState(
+            column.name,
+            column.type,
+          );
+        }),
     );
   }
 
@@ -154,8 +257,11 @@ export class DataCubeEditorColumnsPanelState
   ) {
     this.propagateColumnSelectionChanges();
     newSnapshot.data.selectColumns = this.selector.selectedColumns
-      // TODO: filter by group extended columns
-      // and translate unselection to hidden columns in column configuration
+      // filter out group-level extended columns since these columns are technically not selectable
+      .filter(
+        (col) =>
+          !this.groupExtendColumns.find((column) => column.name === col.name),
+      )
       .map((col) => ({
         name: col.name,
         type: col.type,

package/src/stores/dataCube/editor/DataCubeEditorColumnsSelectorState.ts

@@ -29,12 +29,6 @@ export class DataCubeEditorColumnsSelectorColumnState {
   }
 }
 
-export enum DataCubeEditorColumnsSelectorHiddenColumnsVisibility {
-  VISIBLE = 'visible',
-  VISIBLE_WITH_WARNING = 'visible-with-warning',
-  HIDDEN = 'hidden',
-}
-
 export abstract class DataCubeEditorColumnsSelectorState<
   T extends DataCubeEditorColumnsSelectorColumnState,
 > {
@@ -49,14 +43,10 @@ export abstract class DataCubeEditorColumnsSelectorState<
   readonly onChange?:
     | ((selector: DataCubeEditorColumnsSelectorState<T>) => void)
     | undefined;
-  hiddenColumnsVisibility!: DataCubeEditorColumnsSelectorHiddenColumnsVisibility;
 
   constructor(
     editor: DataCubeEditorState,
     options?: {
-      initialHiddenColumnsVisibility?:
-        | DataCubeEditorColumnsSelectorHiddenColumnsVisibility
-        | undefined;
       onChange?:
         | ((select: DataCubeEditorColumnsSelectorState<T>) => void)
         | undefined;
@@ -75,24 +65,11 @@ export abstract class DataCubeEditorColumnsSelectorState<
 
       selectedColumnsSearchText: observable,
       setSelectedColumnsSearchText: action,
-
-      hiddenColumnsVisibility: observable,
-      setHiddenColumnsVisibility: action,
     });
 
     this.editor = editor;
     this.dataCube = editor.dataCube;
     this.onChange = options?.onChange;
-    this.hiddenColumnsVisibility =
-      options?.initialHiddenColumnsVisibility ??
-      // default to show hidden columns
-      DataCubeEditorColumnsSelectorHiddenColumnsVisibility.VISIBLE;
-  }
-
-  setHiddenColumnsVisibility(
-    val: DataCubeEditorColumnsSelectorHiddenColumnsVisibility,
-  ) {
-    this.hiddenColumnsVisibility = val;
   }
 
   abstract get availableColumns(): T[];
@@ -103,26 +80,11 @@ export abstract class DataCubeEditorColumnsSelectorState<
         (column) =>
           !this.selectedColumns.find((col) => column.name === col.name),
       )
-      .sort((a, b) => a.name.localeCompare(b.name))
-      .filter(
-        (column) =>
-          this.hiddenColumnsVisibility !==
-            DataCubeEditorColumnsSelectorHiddenColumnsVisibility.HIDDEN ||
-          !this.editor.columnProperties.columns.find(
-            (col) => col.name === column.name,
-          )?.hideFromView,
-      );
+      .sort((a, b) => a.name.localeCompare(b.name));
   }
 
   get selectedColumnsForDisplay(): T[] {
-    return this.selectedColumns.filter(
-      (column) =>
-        this.hiddenColumnsVisibility !==
-          DataCubeEditorColumnsSelectorHiddenColumnsVisibility.HIDDEN ||
-        !this.editor.columnProperties.columns.find(
-          (col) => col.name === column.name,
-        )?.hideFromView,
-    );
+    return this.selectedColumns;
   }
 
   setSelectedColumns(val: T[]) {

package/src/stores/dataCube/editor/DataCubeEditorSortsPanelState.ts

@@ -55,7 +55,15 @@ export class DataCubeEditorSortColumnsSelectorState extends DataCubeEditorColumn
   }
 
   override get availableColumns() {
-    return this.editor.columns.selector.selectedColumns.map(
+    return [
+      ...this.editor.columns.selector.selectedColumns,
+      ...this.editor.columns.groupExtendColumns.filter(
+        (col) =>
+          !this.editor.columns.selector.selectedColumns.find(
+            (column) => column.name === col.name,
+          ),
+      ),
+    ].map(
       (col) =>
         new DataCubeEditorSortColumnState(
           col.name,

package/src/stores/dataCube/editor/DataCubeEditorState.tsx

@@ -20,14 +20,20 @@ import { DataCubeEditorSortsPanelState } from './DataCubeEditorSortsPanelState.j
 import { DataCubeEditorCodePanelState } from './DataCubeEditorCodePanelState.js';
 import { DataCubeQuerySnapshotController } from '../core/DataCubeQuerySnapshotManager.js';
 import { type DataCubeQuerySnapshot } from '../core/DataCubeQuerySnapshot.js';
-import { guaranteeNonNullable } from '@finos/legend-shared';
+import {
+  ActionState,
+  assertErrorThrown,
+  guaranteeNonNullable,
+} from '@finos/legend-shared';
 import { DataCubeEditorGeneralPropertiesPanelState } from './DataCubeEditorGeneralPropertiesPanelState.js';
 import { DataCubeEditorColumnPropertiesPanelState } from './DataCubeEditorColumnPropertiesPanelState.js';
 import { DataCubeEditorColumnsPanelState } from './DataCubeEditorColumnsPanelState.js';
 import { DataCubeConfiguration } from '../core/DataCubeConfiguration.js';
 import { DataCubeEditorVerticalPivotsPanelState } from './DataCubeEditorVerticalPivotsPanelState.js';
-import { SingletonModeDisplayState } from '../../LayoutManagerState.js';
+import { DisplayState } from '../../LayoutManagerState.js';
 import { DataCubeEditor } from '../../../components/dataCube/editor/DataCubeEditor.js';
+import { buildExecutableQuery } from '../core/DataCubeQueryBuilder.js';
+import { _lambda } from '../core/DataCubeQueryBuilderUtils.js';
 
 export enum DataCubeEditorTab {
   GENERAL_PROPERTIES = 'General Properties',
@@ -39,8 +45,18 @@ export enum DataCubeEditorTab {
   CODE = 'Code',
 }
 
+/**
+ * This query editor state backs the main form editor of data cube. It supports
+ * batching changes before application, i.e. allowing user to make multiple edits before
+ * applying and propgating them.
+ *
+ * NOTE: It allows almost FULL 1-1 control over the data cube query state.
+ * It could also host other form editor states like filter editors, but due to ergonomic
+ * reasons, those have been separated out into their own respective query editor states.
+ */
 export class DataCubeEditorState extends DataCubeQuerySnapshotController {
-  readonly display: SingletonModeDisplayState;
+  readonly display: DisplayState;
+  readonly finalizationState = ActionState.create();
 
   readonly code: DataCubeEditorCodePanelState;
 
@@ -49,6 +65,7 @@ export class DataCubeEditorState extends DataCubeQuerySnapshotController {
 
   readonly columns: DataCubeEditorColumnsPanelState;
   readonly verticalPivots: DataCubeEditorVerticalPivotsPanelState;
+  // TODO: horizontal pivot
   readonly sorts: DataCubeEditorSortsPanelState;
 
   currentTab = DataCubeEditorTab.GENERAL_PROPERTIES;
@@ -63,7 +80,7 @@ export class DataCubeEditorState extends DataCubeQuerySnapshotController {
       applyChanges: action,
     });
 
-    this.display = new SingletonModeDisplayState(
+    this.display = new DisplayState(
       this.dataCube.repl.layout,
       'Properties',
       () => <DataCubeEditor dataCube={this.dataCube} />,
@@ -82,7 +99,9 @@ export class DataCubeEditorState extends DataCubeQuerySnapshotController {
     this.currentTab = val;
   }
 
-  applyChanges() {
+  async applyChanges() {
+    this.finalizationState.inProgress();
+
     const baseSnapshot = guaranteeNonNullable(this.getLatestSnapshot());
     const snapshot = baseSnapshot.clone();
 
@@ -98,6 +117,32 @@ export class DataCubeEditorState extends DataCubeQuerySnapshotController {
     this.generalProperties.buildSnapshot(snapshot, baseSnapshot);
     this.columnProperties.buildSnapshot(snapshot, baseSnapshot);
 
+    // compile the query to validate it
+    // NOTE: This is a helpful check for a lot of different scenarios where the
+    // consistency of the query might be thrown off by changes
+    // e.g. when a column that group-level extended columns' expressions depend on has been unselected.
+    try {
+      await this.dataCube.engine.getQueryRelationType(
+        _lambda(
+          [],
+          [
+            buildExecutableQuery(
+              snapshot,
+              this.dataCube.engine.filterOperations,
+            ),
+          ],
+        ),
+      );
+    } catch (error) {
+      assertErrorThrown(error);
+      this.dataCube.repl.alertError(error, {
+        message: `Query Validation Failure: ${error.message}`,
+      });
+      return;
+    } finally {
+      this.finalizationState.complete();
+    }
+
     snapshot.finalize();
     if (snapshot.hashCode !== baseSnapshot.hashCode) {
       this.publishSnapshot(snapshot);

package/src/stores/dataCube/editor/DataCubeEditorVerticalPivotsPanelState.ts

@@ -38,16 +38,18 @@ export class DataCubeEditorVerticalPivotColumnsSelectorState extends DataCubeEdi
 
   override get availableColumns(): DataCubeEditorColumnsSelectorColumnState[] {
     return this.editor.columns.selector.selectedColumns
-      .map(
-        // TODO: filter group extended columns
-        (col) =>
-          new DataCubeEditorColumnsSelectorColumnState(col.name, col.type),
-      )
       .filter(
         (column) =>
-          this.editor.columnProperties.columns.find(
+          this.editor.columnProperties.getColumnConfiguration(column.name)
+            ?.kind === DataCubeColumnKind.DIMENSION &&
+          // exclude group-level extended columns
+          !this.editor.columns.groupExtendColumns.find(
             (col) => col.name === column.name,
-          )?.kind === DataCubeColumnKind.DIMENSION,
+          ),
+      )
+      .map(
+        (col) =>
+          new DataCubeEditorColumnsSelectorColumnState(col.name, col.type),
       );
   }
 }
@@ -92,8 +94,13 @@ export class DataCubeEditorVerticalPivotsPanelState
               (column) =>
                 column.kind === DataCubeColumnKind.MEASURE &&
                 column.aggregateFunction !== undefined &&
+                // exclude group-by columns
                 this.selector.selectedColumns.find(
                   (col) => col.name !== column.name,
+                ) &&
+                // exclude group-level extended columns
+                !this.editor.columns.groupExtendColumns.find(
+                  (col) => col.name === column.name,
                 ),
             )
             .map((column) => ({

package/src/stores/dataCube/editor/DataCubeMutableConfiguration.ts

@@ -15,8 +15,8 @@
  */
 
 import {
+  DataCubeColumnKind,
   getDataType,
-  type DataCubeColumnKind,
   type DataCubeFont,
   type DataCubeOperationValue,
   type DataCubeNumberScale,
@@ -38,6 +38,7 @@ import {
   DEFAULT_ZERO_FOREGROUND_COLOR,
   DEFAULT_ERROR_FOREGROUND_COLOR,
   DEFAULT_BACKGROUND_COLOR,
+  DataCubeAggregateOperator,
 } from '../core/DataCubeQueryEngine.js';
 import { type PlainObject, type Writable } from '@finos/legend-shared';
 import { makeObservable, observable, action, computed } from 'mobx';
@@ -46,6 +47,11 @@ import {
   DataCubeConfiguration,
 } from '../core/DataCubeConfiguration.js';
 import { buildDefaultColumnConfiguration } from '../core/DataCubeConfigurationBuilder.js';
+import {
+  _findCol,
+  type DataCubeQuerySnapshot,
+} from '../core/DataCubeQuerySnapshot.js';
+import { PRIMITIVE_TYPE } from '@finos/legend-graph';
 
 export class DataCubeMutableColumnConfiguration extends DataCubeColumnConfiguration {
   readonly dataType!: DataCubeColumnDataType;
@@ -189,6 +195,31 @@ export class DataCubeMutableColumnConfiguration extends DataCubeColumnConfigurat
     );
   }
 
+  populateSyntheticMetadata(snapshot: DataCubeQuerySnapshot) {
+    if (this.kind === DataCubeColumnKind.MEASURE) {
+      const aggCol = _findCol(snapshot.data.groupBy?.aggColumns, this.name);
+      if (aggCol) {
+        this.setAggregateFunction(aggCol.operation);
+        this.setAggregateFunctionParameters(aggCol.parameters);
+      } else {
+        switch (this.type) {
+          case PRIMITIVE_TYPE.NUMBER:
+          case PRIMITIVE_TYPE.INTEGER:
+          case PRIMITIVE_TYPE.DECIMAL:
+          case PRIMITIVE_TYPE.FLOAT: {
+            this.setAggregateFunction(DataCubeAggregateOperator.SUM);
+            this.setAggregateFunctionParameters([]);
+            break;
+          }
+          default: {
+            break;
+          }
+        }
+      }
+    }
+    return this;
+  }
+
   serialize() {
     return DataCubeColumnConfiguration.serialization.toJson(this);
   }