@finos/legend-data-cube 0.0.37 → 0.0.39

package/src/stores/view/grid/DataCubeGridClientEngine.ts

@@ -36,16 +36,15 @@ import { makeObservable, observable, runInAction } from 'mobx';
 import type {
   DataCubeConfiguration,
   DataCubeConfigurationColorKey,
-} from '../../core/models/DataCubeConfiguration.js';
-import { DEFAULT_LARGE_ALERT_WINDOW_CONFIG } from '../../core/DataCubeLayoutManagerState.js';
+} from '../../core/model/DataCubeConfiguration.js';
 import { type DataCubeQuerySnapshot } from '../../core/DataCubeQuerySnapshot.js';
-import { _sortByColName } from '../../core/models/DataCubeColumn.js';
+import { _sortByColName } from '../../core/model/DataCubeColumn.js';
 import {
   isPivotResultColumnName,
   type DataCubeQueryFunctionMap,
 } from '../../core/DataCubeQueryEngine.js';
 import { buildQuerySnapshot } from './DataCubeGridQuerySnapshotBuilder.js';
-import { AlertType } from '../../../components/core/DataCubeAlert.js';
+import { AlertType } from '../../services/DataCubeAlertService.js';
 import { sum } from 'mathjs';
 import type { DataCubeViewState } from '../DataCubeViewState.js';
 import {
@@ -53,7 +52,8 @@ import {
   buildGridDataFetchExecutableQuery,
 } from './DataCubeGridQueryBuilder.js';
 import { _colSpecArrayParam } from '../../core/DataCubeQuerySnapshotBuilderUtils.js';
-import { DataCubeSettingKey } from '../../core/DataCubeSetting.js';
+import { DataCubeSettingKey } from '../../../__lib__/DataCubeSetting.js';
+import { DEFAULT_ALERT_WINDOW_CONFIG } from '../../services/DataCubeLayoutService.js';
 
 type DataCubeGridClientCellValue = string | number | boolean | null | undefined;
 type DataCubeGridClientRowData = {
@@ -301,7 +301,7 @@ async function getCastColumns(
   const lambda = new V1_Lambda();
   lambda.body.push(query);
   const result = await view.engine.executeQuery(lambda, view.source, {
-    debug: view.dataCube.settings.getBooleanValue(
+    debug: view.settingService.getBooleanValue(
       DataCubeSettingKey.DEBUGGER__ENABLE_DEBUG_MODE,
     ),
   });
@@ -327,23 +327,28 @@ export type DataCubeGridClientDataFetchRequest = {
 export class DataCubeGridClientServerSideDataSource
   implements IServerSideDatasource
 {
-  readonly grid: DataCubeGridState;
+  private readonly _view: DataCubeViewState;
+  private readonly _grid: DataCubeGridState;
+
   rowCount: number | undefined = undefined;
 
-  constructor(grid: DataCubeGridState) {
+  constructor(grid: DataCubeGridState, view: DataCubeViewState) {
     makeObservable(this, {
       rowCount: observable,
     });
 
-    this.grid = grid;
+    this._grid = grid;
+    this._view = view;
   }
 
   async fetchRows(params: IServerSideGetRowsParams<unknown, unknown>) {
-    const task = this.grid.view.newTask('Fetching data');
+    const task = this._view.taskService.newTask('Fetching data');
 
     // ------------------------------ SNAPSHOT ------------------------------
 
-    const currentSnapshot = guaranteeNonNullable(this.grid.getLatestSnapshot());
+    const currentSnapshot = guaranteeNonNullable(
+      this._grid.getLatestSnapshot(),
+    );
     const request: DataCubeGridClientDataFetchRequest = {
       startRow: params.request.startRow,
       endRow: params.request.endRow,
@@ -368,13 +373,10 @@ export class DataCubeGridClientServerSideDataSource
       // Because is an expensive operation in certain case, we only
       // recompute when it's not a drilldown or paging request,
       // but we could still optimize further if needed.
-      if (!this.grid.isPaginationEnabled || request.startRow === 0) {
+      if (!this._grid.isPaginationEnabled || request.startRow === 0) {
         if (newSnapshot.data.pivot) {
           try {
-            const castColumns = await getCastColumns(
-              newSnapshot,
-              this.grid.view,
-            );
+            const castColumns = await getCastColumns(newSnapshot, this._view);
             newSnapshot.data.pivot.castColumns = castColumns;
             newSnapshot.data.sortColumns = newSnapshot.data.sortColumns.filter(
               (column) =>
@@ -384,12 +386,12 @@ export class DataCubeGridClientServerSideDataSource
             );
           } catch (error) {
             assertErrorThrown(error);
-            this.grid.view.engine.alertError(error, {
+            this._view.alertService.alertError(error, {
               message: `Query Validation Failure: Can't retrieve pivot results column metadata. ${error.message}`,
             });
             // fail early since we can't proceed without the cast columns validated
             params.fail();
-            this.grid.view.endTask(task);
+            this._view.taskService.endTask(task);
             return;
           }
         }
@@ -402,8 +404,8 @@ export class DataCubeGridClientServerSideDataSource
         // as applying snapshot to grid state could potentially update the grid
         // options and set SSRM filter model.
         newSnapshot.markAsPatchChange();
-        await this.grid.applySnapshot(newSnapshot, currentSnapshot);
-        this.grid.publishSnapshot(newSnapshot);
+        await this._grid.applySnapshot(newSnapshot, currentSnapshot);
+        this._grid.publishSnapshot(newSnapshot);
       }
     }
 
@@ -413,33 +415,33 @@ export class DataCubeGridClientServerSideDataSource
       const executableQuery = buildGridDataFetchExecutableQuery(
         request,
         newSnapshot,
-        this.grid.view.source,
-        (source) => this.grid.view.engine.buildExecutionContext(source),
-        this.grid.view.engine.filterOperations,
-        this.grid.view.engine.aggregateOperations,
-        this.grid.isPaginationEnabled,
+        this._view.source,
+        (source) => this._view.engine.buildExecutionContext(source),
+        this._view.engine.filterOperations,
+        this._view.engine.aggregateOperations,
+        this._grid.isPaginationEnabled,
       );
       const lambda = new V1_Lambda();
       lambda.body.push(executableQuery);
-      const result = await this.grid.view.engine.executeQuery(
+      const result = await this._view.engine.executeQuery(
         lambda,
-        this.grid.view.source,
+        this._view.source,
         {
-          debug: this.grid.view.dataCube.settings.getBooleanValue(
+          debug: this._view.settingService.getBooleanValue(
             DataCubeSettingKey.DEBUGGER__ENABLE_DEBUG_MODE,
           ),
         },
       );
       const rowData = buildRowData(result.result.result, newSnapshot);
       if (
-        this.grid.view.dataCube.settings.getBooleanValue(
+        this._view.settingService.getBooleanValue(
           DataCubeSettingKey.DEBUGGER__ENABLE_DEBUG_MODE,
         )
       ) {
-        this.grid.view.engine.debugProcess(
+        this._view.engine.debugProcess(
           `Execution`,
           ['Query', result.executedQuery],
-          ['Config', `pagination=${this.grid.isPaginationEnabled}`],
+          ['Config', `pagination=${this._grid.isPaginationEnabled}`],
           [
             'Stats',
             `${rowData.length} rows, ${result.result.result.columns.length} columns`,
@@ -448,7 +450,7 @@ export class DataCubeGridClientServerSideDataSource
         );
       }
 
-      if (this.grid.isPaginationEnabled) {
+      if (this._grid.isPaginationEnabled) {
         params.success({ rowData });
         // only update row count when loading the top-level drilldown data
         if (isTopLevelRequest) {
@@ -463,9 +465,9 @@ export class DataCubeGridClientServerSideDataSource
           request.startRow === 0 &&
           rowData.length === 0
         ) {
-          this.grid.client.showNoRowsOverlay();
+          this._grid.client.showNoRowsOverlay();
         } else {
-          this.grid.client.hideOverlay();
+          this._grid.client.hideOverlay();
         }
       } else {
         // NOTE: When pagination is disabled and the user currently scrolls to somewhere in the grid, as data is fetched
@@ -482,11 +484,11 @@ export class DataCubeGridClientServerSideDataSource
         // behavior by forcing a scroll top for every data fetch and also reset the cache block size to the default value to save memory
         if (rowData.length > INTERNAL__GRID_CLIENT_MAX_CACHE_BLOCK_SIZE) {
           if (
-            !this.grid.view.dataCube.settings.getBooleanValue(
+            !this._view.settingService.getBooleanValue(
               DataCubeSettingKey.GRID_CLIENT__SUPPRESS_LARGE_DATASET_WARNING,
             )
           ) {
-            this.grid.view.engine.alert({
+            this._view.alertService.alert({
               message: `Large dataset (>${INTERNAL__GRID_CLIENT_MAX_CACHE_BLOCK_SIZE} rows) detected!`,
               text: `Overall app performance can be impacted by large dataset due to longer query execution time and increased memory usage. At its limit, the engine can crash!\nTo boost performance, consider enabling pagination while working with large dataset.`,
               type: AlertType.WARNING,
@@ -494,20 +496,26 @@ export class DataCubeGridClientServerSideDataSource
                 {
                   label: 'Enable Pagination',
                   handler: () => {
-                    this.grid.setPaginationEnabled(true);
+                    this._grid.setPaginationEnabled(true);
                   },
                 },
                 {
                   label: 'Dismiss Warning',
                   handler: () => {
-                    this.grid.view.dataCube.settings.updateValue(
+                    this._view.settingService.updateValue(
+                      this._view.dataCube.api,
                       DataCubeSettingKey.GRID_CLIENT__SUPPRESS_LARGE_DATASET_WARNING,
                       true,
                     );
                   },
                 },
               ],
-              windowConfig: DEFAULT_LARGE_ALERT_WINDOW_CONFIG,
+              windowConfig: {
+                ...DEFAULT_ALERT_WINDOW_CONFIG,
+                width: 600,
+                minWidth: 300,
+                minHeight: 150,
+              },
             });
           }
 
@@ -531,9 +539,9 @@ export class DataCubeGridClientServerSideDataSource
 
         // toggle no-rows overlay
         if (isTopLevelRequest && rowData.length === 0) {
-          this.grid.client.showNoRowsOverlay();
+          this._grid.client.showNoRowsOverlay();
         } else {
-          this.grid.client.hideOverlay();
+          this._grid.client.hideOverlay();
         }
       }
 
@@ -543,23 +551,23 @@ export class DataCubeGridClientServerSideDataSource
       // `setTimeout()` is need to ensure this runs after the grid has been updated with the new data
       // since ag-grid does not provide an event hook for this action for server-side row model.
       setTimeout(() => {
-        this.grid.client.autoSizeAllColumns();
+        this._grid.client.autoSizeAllColumns();
       }, 0);
     } catch (error) {
       assertErrorThrown(error);
-      this.grid.view.engine.alertError(error, {
+      this._view.alertService.alertError(error, {
         message: `Data Fetch Failure: ${error.message}`,
       });
       params.fail();
     } finally {
-      this.grid.view.endTask(task);
+      this._view.taskService.endTask(task);
     }
   }
 
   getRows(params: IServerSideGetRowsParams<unknown, unknown>) {
     this.fetchRows(params).catch((error: unknown) => {
       assertErrorThrown(error);
-      this.grid.view.engine.logIllegalStateError(
+      this._view.logService.logIllegalStateError(
         `Error ocurred while fetching data for grid should have been handled gracefully`,
         error,
       );

package/src/stores/view/grid/DataCubeGridClientExportEngine.ts

@@ -22,7 +22,6 @@ import {
   isString,
   UnsupportedOperationError,
 } from '@finos/legend-shared';
-import type { DataCubeViewState } from '../DataCubeViewState.js';
 import type { DataCubeGridState } from './DataCubeGridState.js';
 import { DataCubeGridClientExportFormat } from './DataCubeGridClientEngine.js';
 
@@ -81,23 +80,21 @@ ${EMAIL_HTML_CONTENT}
  * server-side export engine which is more standardized and scalable.
  */
 export class DataCubeGridClientExportEngine {
-  readonly view!: DataCubeViewState;
-  readonly grid!: DataCubeGridState;
+  private readonly _grid!: DataCubeGridState;
 
   constructor(grid: DataCubeGridState) {
-    this.view = grid.view;
-    this.grid = grid;
+    this._grid = grid;
   }
 
   private generateFileName() {
-    return `${this.grid.queryConfiguration.name} - ${formatDate(new Date(), 'EEE MMM dd yyyy HH_mm_ss')}`;
+    return `${this._grid.queryConfiguration.name} - ${formatDate(new Date(), 'EEE MMM dd yyyy HH_mm_ss')}`;
   }
 
   exportFile(format: DataCubeGridClientExportFormat) {
     const fileName = this.generateFileName();
     switch (format) {
       case DataCubeGridClientExportFormat.CSV: {
-        this.grid.client.exportDataAsCsv({
+        this._grid.client.exportDataAsCsv({
           fileName: `${fileName}.csv`,
         });
         return;
@@ -105,7 +102,7 @@ export class DataCubeGridClientExportEngine {
       case DataCubeGridClientExportFormat.EXCEL: {
         // TODO?: configure settings for Excel export so we can export styling as well
         // See https://www.ag-grid.com/angular-data-grid/excel-export-styles/
-        this.grid.client.exportDataAsExcel({
+        this._grid.client.exportDataAsExcel({
           fileName: `${fileName}.xlsx`,
         });
         return;
@@ -125,7 +122,7 @@ export class DataCubeGridClientExportEngine {
         fileNameWithExtension = `${fileName}.csv`;
         contentType = ContentType.TEXT_CSV;
         attachment = await blobToBase64(
-          new Blob([this.grid.client.getDataAsCsv() ?? ''], {
+          new Blob([this._grid.client.getDataAsCsv() ?? ''], {
             type: ContentType.TEXT_CSV,
           }),
         );
@@ -136,7 +133,7 @@ export class DataCubeGridClientExportEngine {
         contentType = ContentType.APPLICATION_XLSX;
         // TODO?: configure settings for Excel export so we can export styling as well
         // See https://www.ag-grid.com/angular-data-grid/excel-export-styles/
-        const xlsxContent = this.grid.client.getDataAsExcel();
+        const xlsxContent = this._grid.client.getDataAsExcel();
         let xlsxBlob: Blob;
         if (xlsxContent instanceof Blob) {
           xlsxBlob = xlsxContent;

package/src/stores/view/grid/DataCubeGridConfigurationBuilder.tsx

@@ -25,7 +25,7 @@ import { type DataCubeQuerySnapshot } from '../../core/DataCubeQuerySnapshot.js'
 import {
   _findCol,
   type DataCubeColumn,
-} from '../../core/models/DataCubeColumn.js';
+} from '../../core/model/DataCubeColumn.js';
 import type {
   ColDef,
   ColGroupDef,
@@ -70,7 +70,7 @@ import {
 import type {
   DataCubeColumnConfiguration,
   DataCubeConfiguration,
-} from '../../core/models/DataCubeConfiguration.js';
+} from '../../core/model/DataCubeConfiguration.js';
 import {
   DataCubeColumnDataType,
   DataCubeColumnPinPlacement,
@@ -666,7 +666,6 @@ function generateDefinitionForPivotResultColumns(
   pivotResultColumns: DataCubeColumn[],
   snapshot: DataCubeQuerySnapshot,
   configuration: DataCubeConfiguration,
-  view: DataCubeViewState,
 ) {
   const columns = pivotResultColumns
     .map((col) => ({
@@ -787,7 +786,6 @@ function generateDefinitionForPivotResultColumns(
 export function generateColumnDefs(
   snapshot: DataCubeQuerySnapshot,
   configuration: DataCubeConfiguration,
-  view: DataCubeViewState,
 ) {
   // NOTE: only show columns which are fetched in select() as we
   // can't solely rely on column selection because of certain restrictions
@@ -845,7 +843,6 @@ export function generateColumnDefs(
       pivotResultColumns,
       snapshot,
       configuration,
-      view,
     ),
     ...columns.map((column) => {
       const columnData = {
@@ -1014,7 +1011,7 @@ export function generateGridOptionsFromSnapshot(
 
     // -------------------------------------- COLUMNS --------------------------------------
 
-    columnDefs: generateColumnDefs(snapshot, configuration, view),
+    columnDefs: generateColumnDefs(snapshot, configuration),
     autoGroupColumnDef: {
       // NOTE: the column ID here is set for explicitness, but this is not something ag-grid
       // allows setting for auto-group column, for more advanced use cases, we might want to

package/src/stores/view/grid/DataCubeGridControllerState.ts

@@ -20,7 +20,7 @@ import {
   uniq,
   uniqBy,
 } from '@finos/legend-shared';
-import { DataCubeConfiguration } from '../../core/models/DataCubeConfiguration.js';
+import { DataCubeConfiguration } from '../../core/model/DataCubeConfiguration.js';
 import {
   type DataCubeQuerySnapshot,
   type DataCubeQuerySnapshotSortColumn,
@@ -28,8 +28,8 @@ import {
 import {
   _toCol,
   type DataCubeColumn,
-} from '../../core/models/DataCubeColumn.js';
-import { DataCubeQuerySnapshotController } from '../DataCubeQuerySnapshotManager.js';
+} from '../../core/model/DataCubeColumn.js';
+import { DataCubeQuerySnapshotController } from '../../services/DataCubeQuerySnapshotService.js';
 import {
   type DataCubeQuerySortDirection,
   type DataCubeColumnPinPlacement,
@@ -72,6 +72,14 @@ import { _pruneExpandedPaths } from '../../core/DataCubeQuerySnapshotBuilderUtil
  * while the editor is still in the middle of a modification that has not been applied.
  */
 export class DataCubeGridControllerState extends DataCubeQuerySnapshotController {
+  readonly view: DataCubeViewState;
+
+  constructor(view: DataCubeViewState) {
+    super(view.engine, view.settingService, view.snapshotService);
+
+    this.view = view;
+  }
+
   configuration = new DataCubeConfiguration();
 
   menuBuilder?:

package/src/stores/view/grid/DataCubeGridMenuBuilder.tsx

@@ -43,7 +43,7 @@ import {
   INTERNAL__GRID_CLIENT_TREE_COLUMN_ID,
 } from './DataCubeGridClientEngine.js';
 import { PRIMITIVE_TYPE } from '@finos/legend-graph';
-import type { DataCubeColumnConfiguration } from '../../core/models/DataCubeConfiguration.js';
+import type { DataCubeColumnConfiguration } from '../../core/model/DataCubeConfiguration.js';
 import { DataCubeFilterEditorConditionTreeNode } from '../../core/filter/DataCubeQueryFilterEditorState.js';
 import { DataCubeEditorTab } from '../editor/DataCubeEditorState.js';
 
@@ -164,7 +164,7 @@ export function generateMenuBuilder(
   fromHeader: boolean,
 ) => (DefaultMenuItem | MenuItemDef)[] {
   const view = controller.view;
-  const engine = view.engine;
+  const dataCube = view.dataCube;
 
   // NOTE: we need to minimize the usage of these states
   // since the grid context-menu should be solely driven
@@ -422,7 +422,9 @@ export function generateMenuBuilder(
             action: () => {
               view.grid.exportEngine
                 .exportEmail(DataCubeGridClientExportFormat.EXCEL)
-                .catch((error) => engine.logUnhandledError(error));
+                .catch((error) =>
+                  dataCube.alertService.alertUnhandledError(error),
+                );
             },
           },
           {
@@ -430,7 +432,9 @@ export function generateMenuBuilder(
             action: () => {
               view.grid.exportEngine
                 .exportEmail(DataCubeGridClientExportFormat.CSV)
-                .catch((error) => engine.logUnhandledError(error));
+                .catch((error) =>
+                  dataCube.alertService.alertUnhandledError(error),
+                );
             },
           },
           {
@@ -588,7 +592,9 @@ export function generateMenuBuilder(
             action: () => {
               extend
                 .openNewColumnEditor()
-                .catch((error) => engine.alertUnhandledError(error));
+                .catch((error) =>
+                  dataCube.alertService.alertUnhandledError(error),
+                );
             },
           },
           ...(columnConfiguration && columnName
@@ -598,7 +604,9 @@ export function generateMenuBuilder(
                   action: () => {
                     extend
                       .openNewColumnEditor(columnConfiguration)
-                      .catch((error) => engine.alertUnhandledError(error));
+                      .catch((error) =>
+                        dataCube.alertService.alertUnhandledError(error),
+                      );
                   },
                 },
               ]
@@ -611,7 +619,9 @@ export function generateMenuBuilder(
                   action: () => {
                     extend
                       .openExistingColumnEditor(columnName)
-                      .catch((error) => engine.alertUnhandledError(error));
+                      .catch((error) =>
+                        dataCube.alertService.alertUnhandledError(error),
+                      );
                   },
                 },
                 {
@@ -619,7 +629,9 @@ export function generateMenuBuilder(
                   action: () => {
                     extend
                       .deleteColumn(columnName)
-                      .catch((error) => engine.alertUnhandledError(error));
+                      .catch((error) =>
+                        dataCube.alertService.alertUnhandledError(error),
+                      );
                   },
                 },
               ]

package/src/stores/view/grid/DataCubeGridQueryBuilder.ts

@@ -58,12 +58,12 @@ import {
   INTERNAL__GRID_CLIENT_ROW_GROUPING_COUNT_AGG_COLUMN_ID,
   type DataCubeGridClientDataFetchRequest,
 } from './DataCubeGridClientEngine.js';
-import { DataCubeConfiguration } from '../../core/models/DataCubeConfiguration.js';
+import { DataCubeConfiguration } from '../../core/model/DataCubeConfiguration.js';
 import type { DataCubeQueryFilterOperation } from '../../core/filter/DataCubeQueryFilterOperation.js';
 import type { DataCubeQueryAggregateOperation } from '../../core/aggregation/DataCubeQueryAggregateOperation.js';
 import { _colSpecArrayParam } from '../../core/DataCubeQuerySnapshotBuilderUtils.js';
 import { buildExecutableQuery } from '../../core/DataCubeQueryBuilder.js';
-import type { DataCubeSource } from '../../core/models/DataCubeSource.js';
+import type { DataCubeSource } from '../../core/model/DataCubeSource.js';
 
 /*****************************************************************************
  * [GRID]

package/src/stores/view/grid/DataCubeGridQuerySnapshotBuilder.ts

@@ -22,7 +22,7 @@
  ***************************************************************************************/
 
 import { type DataCubeQuerySnapshot } from '../../core/DataCubeQuerySnapshot.js';
-import { _toCol } from '../../core/models/DataCubeColumn.js';
+import { _toCol } from '../../core/model/DataCubeColumn.js';
 import {
   DataCubeGridClientSortDirection,
   INTERNAL__GRID_CLIENT_ROOT_AGGREGATION_COLUMN_ID,
@@ -34,7 +34,7 @@ import {
   getPivotResultColumnBaseColumnName,
   isPivotResultColumnName,
 } from '../../core/DataCubeQueryEngine.js';
-import { DataCubeConfiguration } from '../../core/models/DataCubeConfiguration.js';
+import { DataCubeConfiguration } from '../../core/model/DataCubeConfiguration.js';
 import { guaranteeNonNullable, uniqBy } from '@finos/legend-shared';
 import { _pruneExpandedPaths } from '../../core/DataCubeQuerySnapshotBuilderUtils.js';
 

package/src/stores/view/grid/DataCubeGridState.ts

@@ -30,13 +30,13 @@ import {
   INTERNAL__GRID_CLIENT_DEFAULT_ENABLE_PAGINATION,
   computeHashCodeForDataFetchManualTrigger,
 } from './DataCubeGridClientEngine.js';
-import { DataCubeQuerySnapshotController } from '../DataCubeQuerySnapshotManager.js';
+import { DataCubeQuerySnapshotController } from '../../services/DataCubeQuerySnapshotService.js';
 import type { DataCubeQuerySnapshot } from '../../core/DataCubeQuerySnapshot.js';
 import { generateGridOptionsFromSnapshot } from './DataCubeGridConfigurationBuilder.js';
-import { DataCubeConfiguration } from '../../core/models/DataCubeConfiguration.js';
+import { DataCubeConfiguration } from '../../core/model/DataCubeConfiguration.js';
 import { DataCubeGridControllerState } from './DataCubeGridControllerState.js';
 import { DataCubeGridClientExportEngine } from './DataCubeGridClientExportEngine.js';
-import { DataCubeSettingKey } from '../../core/DataCubeSetting.js';
+import { DataCubeSettingKey } from '../../../__lib__/DataCubeSetting.js';
 
 /**
  * This query editor state is responsible for syncing the internal state of ag-grid
@@ -54,10 +54,12 @@ import { DataCubeSettingKey } from '../../core/DataCubeSetting.js';
  * trigger publishing a new snapshot, hence not propagated.
  */
 export class DataCubeGridState extends DataCubeQuerySnapshotController {
-  readonly controller!: DataCubeGridControllerState;
-  readonly exportEngine!: DataCubeGridClientExportEngine;
-  private _client?: GridApi | undefined;
+  private readonly _view: DataCubeViewState;
+
+  readonly controller: DataCubeGridControllerState;
 
+  readonly exportEngine: DataCubeGridClientExportEngine;
+  private _client?: GridApi | undefined;
   clientDataSource: DataCubeGridClientServerSideDataSource;
 
   queryConfiguration: DataCubeConfiguration;
@@ -69,7 +71,7 @@ export class DataCubeGridState extends DataCubeQuerySnapshotController {
   debouncedAutoResizeColumns?: DebouncedFunc<() => void>;
 
   constructor(view: DataCubeViewState) {
-    super(view);
+    super(view.engine, view.settingService, view.snapshotService);
 
     makeObservable(this, {
       clientDataSource: observable,
@@ -87,10 +89,14 @@ export class DataCubeGridState extends DataCubeQuerySnapshotController {
       applySnapshot: action,
     });
 
-    this.controller = new DataCubeGridControllerState(this.view);
+    this._view = view;
+    this.controller = new DataCubeGridControllerState(this._view);
     this.exportEngine = new DataCubeGridClientExportEngine(this);
     this.queryConfiguration = new DataCubeConfiguration();
-    this.clientDataSource = new DataCubeGridClientServerSideDataSource(this);
+    this.clientDataSource = new DataCubeGridClientServerSideDataSource(
+      this,
+      this._view,
+    );
   }
 
   setPaginationEnabled(val: boolean) {
@@ -100,7 +106,10 @@ export class DataCubeGridState extends DataCubeQuerySnapshotController {
     // NOTE: if we don't fully reset the datasource, and say we just turned on pagination,
     // for how many page that we loaded when pagination is off, the datasource
     // will fire that many data fetch operations which is expensive.
-    this.clientDataSource = new DataCubeGridClientServerSideDataSource(this);
+    this.clientDataSource = new DataCubeGridClientServerSideDataSource(
+      this,
+      this._view,
+    );
     // NOTE: ag-grid uses the cache block size as page size, so it's important to set this
     // in corresponding to the pagination setting, else it would cause unexpected scrolling behavior
     this.client.updateGridOptions({
@@ -147,24 +156,24 @@ export class DataCubeGridState extends DataCubeQuerySnapshotController {
     const gridOptions = generateGridOptionsFromSnapshot(
       snapshot,
       configuration,
-      this.view,
+      this._view,
     );
     if (
-      this.view.dataCube.settings.getBooleanValue(
+      this._settingService.getBooleanValue(
         DataCubeSettingKey.DEBUGGER__ENABLE_DEBUG_MODE,
       )
     ) {
-      this.view.engine.debugProcess(`New Grid Options`, [
+      this._engine.debugProcess(`New Grid Options`, [
         'Grid Options',
         gridOptions,
       ]);
     }
     this.client.updateGridOptions({
       ...gridOptions,
-      rowBuffer: this.view.dataCube.settings.getNumericValue(
+      rowBuffer: this._settingService.getNumericValue(
         DataCubeSettingKey.GRID_CLIENT__ROW_BUFFER,
       ),
-      purgeClosedRowNodes: this.view.dataCube.settings.getBooleanValue(
+      purgeClosedRowNodes: this._settingService.getBooleanValue(
         DataCubeSettingKey.GRID_CLIENT__PURGE_CLOSED_ROW_NODES,
       ),
       // NOTE: ag-grid uses the cache block size as page size, so it's important to set this