@deephaven/iris-grid 1.6.1-beta.0 → 1.7.0

package/dist/IrisGrid.js

@@ -14,7 +14,7 @@ import deepEqual from 'fast-deep-equal';
 import Log from '@deephaven/log';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { ContextActions, Stack, Menu, Page, Popper, ThemeExport, Tooltip, Button, ContextActionUtils, SlideTransition } from '@deephaven/components';
-import { Grid, GridRange, GridUtils, isEditableGridModel, isExpandableGridModel, isDeletableGridModel } from '@deephaven/grid';
+import { Grid, GridRange, GridUtils, isEditableGridModel, isExpandableGridModel, isDeletableGridModel, isExpandableColumnGridModel } from '@deephaven/grid';
 import { dhEye, dhFilterFilled, dhGraphLineUp, dhTriangleDownSquare, vsClose, vsCloudDownload, vsEdit, vsFilter, vsMenu, vsReply, vsRuby, vsSearch, vsSplitHorizontal, vsSymbolOperator, vsTools } from '@deephaven/icons';
 import { DateUtils, Formatter, FormatterUtils, TableUtils, isSortDirection } from '@deephaven/jsapi-utils';
 import { assertNotNull, copyToClipboard, EMPTY_ARRAY, EMPTY_MAP, Pending, PromiseUtils, ValidationError, getOrThrow } from '@deephaven/utils';
@@ -310,7 +310,9 @@ class IrisGrid extends Component {
     }, {
       max: 1
     }));
-    _defineProperty(this, "getCachedStateOverride", memoize((hoverSelectColumn, isFilterBarShown, isSelectingColumn, loadingScrimProgress, quickFilters, advancedFilters, sorts, reverse, rollupConfig, isMenuShown) => ({
+    _defineProperty(this, "getCachedStateOverride", memoize((model, theme, hoverSelectColumn, isFilterBarShown, isSelectingColumn, loadingScrimProgress, quickFilters, advancedFilters, sorts, reverse, rollupConfig, isMenuShown) => ({
+      model,
+      theme,
       hoverSelectColumn,
       isFilterBarShown,
       isSelectingColumn,
@@ -914,6 +916,29 @@ class IrisGrid extends Component {
     } = this.props;
     return this.getCachedKeyHandlers(keyHandlers);
   }
+  getMetricState() {
+    var _this$grid2;
+    var gridMetricState = (_this$grid2 = this.grid) === null || _this$grid2 === void 0 ? void 0 : _this$grid2.getMetricState();
+    if (gridMetricState == null) {
+      return undefined;
+    }
+    var {
+      advancedFilters,
+      hoverSelectColumn,
+      isFilterBarShown,
+      isMenuShown,
+      loadingScrimProgress,
+      quickFilters,
+      sorts,
+      reverse,
+      rollupConfig
+    } = this.state;
+    var {
+      model,
+      isSelectingColumn
+    } = this.props;
+    return _objectSpread(_objectSpread({}, gridMetricState), this.getCachedStateOverride(model, this.getTheme(), hoverSelectColumn, isFilterBarShown, isSelectingColumn, loadingScrimProgress, quickFilters, advancedFilters, sorts, reverse, rollupConfig, isMenuShown));
+  }
   get renderer() {
     var {
       renderer
@@ -1279,6 +1304,10 @@ class IrisGrid extends Component {
       advancedFilters,
       quickFilters
     } = this.state;
+    if (advancedFilters.size === 0 && quickFilters.size === 0) {
+      log.debug('No filters to rebuild');
+      return;
+    }
     var {
       columns,
       formatter
@@ -1730,8 +1759,8 @@ class IrisGrid extends Component {
     model.removeEventListener(IrisGridModel.EVENT.TABLE_CHANGED, this.handleTableChanged);
   }
   focus() {
-    var _this$grid2;
-    (_this$grid2 = this.grid) === null || _this$grid2 === void 0 ? void 0 : _this$grid2.focus();
+    var _this$grid3;
+    (_this$grid3 = this.grid) === null || _this$grid3 === void 0 ? void 0 : _this$grid3.focus();
   }
   focusFilterBar(column) {
     var {
@@ -1761,13 +1790,13 @@ class IrisGrid extends Component {
       lastLeft
     } = metrics;
     if (column < left) {
-      var _this$grid3;
-      (_this$grid3 = this.grid) === null || _this$grid3 === void 0 ? void 0 : _this$grid3.setViewState({
+      var _this$grid4;
+      (_this$grid4 = this.grid) === null || _this$grid4 === void 0 ? void 0 : _this$grid4.setViewState({
         left: column
       }, true);
     } else if (rightVisible < column) {
-      var _this$grid4, _this$grid5;
-      var metricState = (_this$grid4 = this.grid) === null || _this$grid4 === void 0 ? void 0 : _this$grid4.getMetricState();
+      var _this$grid5;
+      var metricState = this.getMetricState();
       assertNotNull(metricState);
       var newLeft = metricCalculator.getLastLeft(metricState, column, metricCalculator.getVisibleWidth(metricState));
       (_this$grid5 = this.grid) === null || _this$grid5 === void 0 ? void 0 : _this$grid5.setViewState({
@@ -1832,6 +1861,33 @@ class IrisGrid extends Component {
       movedColumns: newMovedColumns
     });
   }
+  toggleExpandColumn(modelIndex) {
+    log.debug2('Toggle expand column', modelIndex);
+    var {
+      model
+    } = this.props;
+    if (isExpandableColumnGridModel(model) && model.hasExpandableColumns) {
+      model.setColumnExpanded(modelIndex, !model.isColumnExpanded(modelIndex));
+    }
+  }
+  expandAllColumns() {
+    log.debug2('Expand all columns');
+    var {
+      model
+    } = this.props;
+    if (isExpandableColumnGridModel(model) && model.isExpandAllColumnsAvailable) {
+      model.expandAllColumns();
+    }
+  }
+  collapseAllColumns() {
+    log.debug2('Collapse all columns');
+    var {
+      model
+    } = this.props;
+    if (isExpandableColumnGridModel(model) && model.isExpandAllColumnsAvailable) {
+      model.collapseAllColumns();
+    }
+  }
   handleColumnVisibilityChanged(modelIndexes, isVisible) {
     var _this$grid7;
     var {
@@ -1859,16 +1915,12 @@ class IrisGrid extends Component {
   handleColumnVisibilityReset() {
     var _model$layoutHints$fr, _model$layoutHints2;
     var {
-      metricCalculator,
-      metrics
+      metricCalculator
     } = this.state;
     var {
       model
     } = this.props;
-    assertNotNull(metrics);
-    for (var i = 0; i < metrics.columnCount; i += 1) {
-      metricCalculator.resetColumnWidth(i);
-    }
+    metricCalculator.resetAllColumnWidths();
     this.handleMovedColumnsChanged(model.initialMovedColumns);
     this.handleHeaderGroupsChanged(model.initialColumnHeaderGroups);
     this.setState({
@@ -1957,6 +2009,17 @@ class IrisGrid extends Component {
     }
     (_this$grid9 = this.grid) === null || _this$grid9 === void 0 ? void 0 : _this$grid9.forceUpdate();
   }
+
+  /**
+   * Updates grid metrics after model columns have changed
+   * to keep Grid and IrisGrid metrics in sync since metrics are stored in both places.
+   */
+  updateMetrics() {
+    var _this$grid10;
+    this.setState({
+      metrics: (_this$grid10 = this.grid) === null || _this$grid10 === void 0 ? void 0 : _this$grid10.updateMetrics()
+    });
+  }
   toggleSort(columnIndex, addToExisting) {
     log.info('Toggling sort for column', columnIndex);
     var {
@@ -1975,15 +2038,15 @@ class IrisGrid extends Component {
     }
   }
   updateSorts(sorts) {
-    var _this$grid10;
+    var _this$grid11;
     this.startLoading('Sorting...');
     this.setState({
       sorts
     });
-    (_this$grid10 = this.grid) === null || _this$grid10 === void 0 ? void 0 : _this$grid10.forceUpdate();
+    (_this$grid11 = this.grid) === null || _this$grid11 === void 0 ? void 0 : _this$grid11.forceUpdate();
   }
   sortColumn(modelColumn) {
-    var _this$grid11;
+    var _this$grid12;
     var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : TableUtils.sortDirection.none;
     var isAbs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var addToExisting = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
@@ -1996,15 +2059,15 @@ class IrisGrid extends Component {
     this.setState({
       sorts
     });
-    (_this$grid11 = this.grid) === null || _this$grid11 === void 0 ? void 0 : _this$grid11.forceUpdate();
+    (_this$grid12 = this.grid) === null || _this$grid12 === void 0 ? void 0 : _this$grid12.forceUpdate();
   }
   reverse(reverse) {
-    var _this$grid12;
+    var _this$grid13;
     this.startLoading('Reversing...');
     this.setState({
       reverse
     });
-    (_this$grid12 = this.grid) === null || _this$grid12 === void 0 ? void 0 : _this$grid12.forceUpdate();
+    (_this$grid13 = this.grid) === null || _this$grid13 === void 0 ? void 0 : _this$grid13.forceUpdate();
   }
   isReversible() {
     var {
@@ -2045,8 +2108,8 @@ class IrisGrid extends Component {
         this.focusFilterBar(columnIndex);
       }
     } else {
-      var _this$grid13;
-      (_this$grid13 = this.grid) === null || _this$grid13 === void 0 ? void 0 : _this$grid13.focus();
+      var _this$grid14;
+      (_this$grid14 = this.grid) === null || _this$grid14 === void 0 ? void 0 : _this$grid14.focus();
     }
   }
   isTableSearchAvailable() {
@@ -2083,13 +2146,13 @@ class IrisGrid extends Component {
         var _this$crossColumnRef2;
         (_this$crossColumnRef2 = this.crossColumnRef) === null || _this$crossColumnRef2 === void 0 ? void 0 : _this$crossColumnRef2.current.focus();
       } else {
-        var _this$grid14;
-        (_this$grid14 = this.grid) === null || _this$grid14 === void 0 ? void 0 : _this$grid14.focus();
+        var _this$grid15;
+        (_this$grid15 = this.grid) === null || _this$grid15 === void 0 ? void 0 : _this$grid15.focus();
       }
     });
   }
   toggleGotoRow() {
-    var _this$grid15, _this$grid16;
+    var _this$grid16, _this$grid17;
     var row = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     var columnName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
@@ -2111,8 +2174,8 @@ class IrisGrid extends Component {
       (_this$gotoRowRef$curr = this.gotoRowRef.current) === null || _this$gotoRowRef$curr === void 0 ? void 0 : _this$gotoRowRef$curr.focus();
       return;
     }
-    var cursorRow = (_this$grid15 = this.grid) === null || _this$grid15 === void 0 ? void 0 : _this$grid15.state.cursorRow;
-    var cursorColumn = (_this$grid16 = this.grid) === null || _this$grid16 === void 0 ? void 0 : _this$grid16.state.cursorColumn;
+    var cursorRow = (_this$grid16 = this.grid) === null || _this$grid16 === void 0 ? void 0 : _this$grid16.state.cursorRow;
+    var cursorColumn = (_this$grid17 = this.grid) === null || _this$grid17 === void 0 ? void 0 : _this$grid17.state.cursorColumn;
     if (cursorRow == null || cursorColumn == null) {
       // if a cell is not selected / grid is not rendered
       this.setState({
@@ -2279,7 +2342,7 @@ class IrisGrid extends Component {
     this.setAdvancedFilter(index, filter, options);
   }
   handleAdvancedFilterSortChange(column, direction) {
-    var _this$grid17;
+    var _this$grid18;
     var addToExisting = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var {
       model
@@ -2302,11 +2365,11 @@ class IrisGrid extends Component {
     this.setState({
       sorts
     });
-    (_this$grid17 = this.grid) === null || _this$grid17 === void 0 ? void 0 : _this$grid17.forceUpdate();
+    (_this$grid18 = this.grid) === null || _this$grid18 === void 0 ? void 0 : _this$grid18.forceUpdate();
   }
   handleAdvancedFilterDone() {
-    var _this$grid18;
-    (_this$grid18 = this.grid) === null || _this$grid18 === void 0 ? void 0 : _this$grid18.focus();
+    var _this$grid19;
+    (_this$grid19 = this.grid) === null || _this$grid19 === void 0 ? void 0 : _this$grid19.focus();
   }
   handleAdvancedMenuOpened(column) {
     this.setState({
@@ -2392,8 +2455,8 @@ class IrisGrid extends Component {
     var setGridFocus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
     var defocusInput = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     if (setGridFocus) {
-      var _this$grid19;
-      (_this$grid19 = this.grid) === null || _this$grid19 === void 0 ? void 0 : _this$grid19.focus();
+      var _this$grid20;
+      (_this$grid20 = this.grid) === null || _this$grid20 === void 0 ? void 0 : _this$grid20.focus();
     }
     if (defocusInput) {
       this.setState({
@@ -2520,7 +2583,7 @@ class IrisGrid extends Component {
     }
   }
   handleUpdate() {
-    var _this$grid20;
+    var _this$grid21;
     log.debug2('Received model update');
     var {
       advancedFilters,
@@ -2549,7 +2612,7 @@ class IrisGrid extends Component {
     } else {
       this.lastLoadedConfig = null;
     }
-    (_this$grid20 = this.grid) === null || _this$grid20 === void 0 ? void 0 : _this$grid20.forceUpdate();
+    (_this$grid21 = this.grid) === null || _this$grid21 === void 0 ? void 0 : _this$grid21.forceUpdate();
     this.stopLoading();
   }
   handleTableChanged() {
@@ -2562,13 +2625,13 @@ class IrisGrid extends Component {
     });
   }
   handleViewChanged(metrics) {
-    var _this$grid$state, _this$grid21;
+    var _this$grid$state, _this$grid22;
     var {
       model
     } = this.props;
     var {
       selectionEndRow = 0
-    } = (_this$grid$state = (_this$grid21 = this.grid) === null || _this$grid21 === void 0 ? void 0 : _this$grid21.state) !== null && _this$grid$state !== void 0 ? _this$grid$state : {};
+    } = (_this$grid$state = (_this$grid22 = this.grid) === null || _this$grid22 === void 0 ? void 0 : _this$grid22.state) !== null && _this$grid$state !== void 0 ? _this$grid$state : {};
     var pendingRowCount = 0;
     if (isEditableGridModel(model) && model.isEditable) {
       assertNotNull(metrics);
@@ -2596,7 +2659,7 @@ class IrisGrid extends Component {
     });
   }
   handleSelectionChanged(selectedRanges) {
-    var _this$grid22;
+    var _this$grid23;
     assertNotNull(selectedRanges);
     var {
       onSelectionChanged
@@ -2612,7 +2675,7 @@ class IrisGrid extends Component {
         copyOperation: null
       });
     }
-    if (((_this$grid22 = this.grid) === null || _this$grid22 === void 0 ? void 0 : _this$grid22.state.cursorRow) != null) {
+    if (((_this$grid23 = this.grid) === null || _this$grid23 === void 0 ? void 0 : _this$grid23.state.cursorRow) != null) {
       this.setState({
         gotoRow: "".concat(this.grid.state.cursorRow + 1)
       });
@@ -2631,8 +2694,8 @@ class IrisGrid extends Component {
     this.setState({
       columnHeaderGroups: IrisGridUtils.parseColumnHeaderGroups(model, columnHeaderGroups).groups
     }, () => {
-      var _this$grid23;
-      return (_this$grid23 = this.grid) === null || _this$grid23 === void 0 ? void 0 : _this$grid23.forceUpdate();
+      var _this$grid24;
+      return (_this$grid24 = this.grid) === null || _this$grid24 === void 0 ? void 0 : _this$grid24.forceUpdate();
     });
   }
   handleTooltipRef(tooltip) {
@@ -2766,14 +2829,16 @@ class IrisGrid extends Component {
     }
   }
   handleCustomColumnsChanged() {
-    log.debug('custom columns changed');
+    log.debug('Model columns changed');
     var {
       isReady
     } = this.state;
     if (isReady) {
-      var _this$grid24;
+      this.updateMetrics();
+
+      // Make sure stopLoading() is called after the updateMetrics call,
+      // otherwise IrisGridModelUpdater queues an extra setViewport based on old metrics.
       this.stopLoading();
-      (_this$grid24 = this.grid) === null || _this$grid24 === void 0 ? void 0 : _this$grid24.forceUpdate();
     } else {
       this.loadTableState();
     }
@@ -3546,7 +3611,7 @@ class IrisGrid extends Component {
     } = theme;
     var filter = this.getCachedFilter(customFilters, quickFilters, advancedFilters, searchFilter);
     var userColumnWidths = metricCalculator.getUserColumnWidths();
-    var stateOverride = this.getCachedStateOverride(hoverSelectColumn, isFilterBarShown, isSelectingColumn, loadingScrimProgress, quickFilters, advancedFilters, sorts, reverse, rollupConfig, isMenuShown);
+    var stateOverride = this.getCachedStateOverride(model, theme, hoverSelectColumn, isFilterBarShown, isSelectingColumn, loadingScrimProgress, quickFilters, advancedFilters, sorts, reverse, rollupConfig, isMenuShown);
     var top = metrics ? metrics.top : 0;
     var bottom = metrics ? metrics.bottomViewport : 0;
     var left = null;