@deephaven/dashboard-core-plugins 0.22.3-embed-pandas.11 → 0.23.1-beta.0

package/dist/panels/DropdownFilterPanel.js

@@ -1,5 +1,4 @@
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import debounce from 'lodash.debounce';
@@ -19,86 +18,65 @@ import ToolType from "../linker/ToolType.js";
 import WidgetPanel from "./WidgetPanel.js";
 var log = Log.module('DropdownFilterPanel');
 var DROPDOWN_FILTER_DEBOUNCE = 250;
-
 class DropdownFilterPanel extends Component {
   // Filter dropdown needs to show and send full timestamp format with nanoseconds
+
   constructor(props) {
     super(props);
-
     _defineProperty(this, "dropdownFilterRef", void 0);
-
     _defineProperty(this, "panelContainer", void 0);
-
     _defineProperty(this, "pending", void 0);
-
     _defineProperty(this, "cleanup", void 0);
-
     _defineProperty(this, "columnFormats", void 0);
-
     _defineProperty(this, "getCachedValues", memoize((rawValues, _ref, formatter) => {
       var {
         type,
         name
       } = _ref;
-
       if (type !== undefined && TableUtils.isDateType(type)) {
         return rawValues.map(value => DropdownFilterPanel.DATETIME_FORMATTER.format(value));
       }
-
-      return rawValues.map(value => // Skip formatting for nulls so they don't get converted to ''
+      return rawValues.map(value =>
+      // Skip formatting for nulls so they don't get converted to ''
       value != null && type != null ? formatter.getFormattedString(value, type, name) : null);
     }));
-
     _defineProperty(this, "getCachedPanelLinks", memoize((dashboardLinks, panel) => {
       var panelId = LayoutUtils.getIdFromPanel(panel);
       log.debug('getCachedPanelLinks', dashboardLinks, panelId);
       return dashboardLinks.filter(link => {
         var _link$end;
-
         return ((_link$end = link.end) === null || _link$end === void 0 ? void 0 : _link$end.panelId) === panelId;
       });
     }));
-
     _defineProperty(this, "getCachedSource", memoize(links => {
       log.debug('getCachedSource', links);
-      var source = null;
-
+      var source;
       if (links.length > 0) {
         var [link] = links;
         source = link.start;
-
         if (links.length > 1) {
           log.error('Filter has more that one link', links);
         }
       }
-
       return source;
     }));
-
     _defineProperty(this, "getCachedSourceTable", memoize((panelTableMap, source) => {
       var _panelTableMap$get;
-
       log.debug('getCachedSourceTable', panelTableMap, source);
-
       if (source == null) {
         return null;
       }
-
       var {
         panelId
       } = source;
       return (_panelTableMap$get = panelTableMap.get(panelId)) !== null && _panelTableMap$get !== void 0 ? _panelTableMap$get : null;
     }));
-
     _defineProperty(this, "getCachedSourceColumn", memoize((table, source) => {
       var _table$columns$find;
-
       log.debug('getCachedSourceColumn', table, source);
-
       if (table == null || source == null) {
         return null;
       }
-
       return (_table$columns$find = table.columns.find(_ref2 => {
         var {
           name,
@@ -107,7 +85,6 @@ class DropdownFilterPanel extends Component {
         return name === source.columnName && type === source.columnType;
       })) !== null && _table$columns$find !== void 0 ? _table$columns$find : null;
     }));
-
     this.handleChange = debounce(this.handleChange.bind(this), DROPDOWN_FILTER_DEBOUNCE);
     this.handleClearAllFilters = this.handleClearAllFilters.bind(this);
     this.handleDisconnect = this.handleDisconnect.bind(this);
@@ -153,13 +130,13 @@ class DropdownFilterPanel extends Component {
       // eslint-disable-next-line react/no-unused-state
       panelState,
       // Dehydrated panel state that can load this panel
+
       isDisconnected: false,
       isLoading: false,
       isLoaded: false,
       error: null
     };
   }
-
   componentDidMount() {
     this.updateValuesTable();
     var {
@@ -168,11 +145,9 @@ class DropdownFilterPanel extends Component {
       timestamp
     } = this.state;
     var sourceTable = this.getSourceTable();
-
     if (sourceTable !== null) {
       this.startListeningToSource(sourceTable);
     }
-
     if (column != null) {
       var {
         name,
@@ -181,7 +156,6 @@ class DropdownFilterPanel extends Component {
       this.sendUpdate(name, type, value, timestamp);
     }
   }
-
   componentDidUpdate(prevProps, prevState) {
     var {
       valuesTable
@@ -193,91 +167,73 @@ class DropdownFilterPanel extends Component {
     var sourceTable = this.getSourceTable();
     var prevSource = this.getSource(prevProps);
     var prevSourceTable = this.getSourceTable(prevProps);
-
     if (settings !== prevProps.settings && settings !== undefined) {
       this.updateFormatterSettings(settings);
     }
-
     if (valuesTable !== prevState.valuesTable && prevState.valuesTable != null) {
       log.debug('Table in state modified, closing the old table.');
       prevState.valuesTable.close();
-    } // Checking source change in addition to table change
-    // in case a different column is selected in the same table
-
+    }
 
+    // Checking source change in addition to table change
+    // in case a different column is selected in the same table
     if (sourceTable !== prevSourceTable || source !== prevSource) {
       this.updateValuesTable();
     }
-
     if (sourceTable !== prevSourceTable) {
       if (prevSourceTable !== null) {
         this.stopListeningToSource(prevSourceTable);
       }
-
       if (sourceTable !== null) {
         this.startListeningToSource(sourceTable);
       }
     }
   }
-
   componentWillUnmount() {
     var {
       valuesTable
     } = this.state;
     var sourceTable = this.getSourceTable();
     this.pending.cancel();
-
     if (sourceTable !== null) {
       this.stopListeningToSource(sourceTable);
     }
-
     if (this.cleanup) {
       this.cleanup();
     }
-
     if (valuesTable != null) {
       valuesTable.close();
     }
   }
-
   getCoordinateForColumn() {
     var _element$getBoundingC;
-
     if (this.panelContainer.current == null) {
       return null;
     }
-
     var element = this.panelContainer.current.querySelector(".".concat(DropdownFilter.SOURCE_BUTTON_CLASS_NAME));
     var rect = (_element$getBoundingC = element === null || element === void 0 ? void 0 : element.getBoundingClientRect()) !== null && _element$getBoundingC !== void 0 ? _element$getBoundingC : null;
-
     if (rect == null || rect.width <= 0 || rect.height <= 0) {
       return null;
     }
-
     var x = rect.left + rect.width / 2;
     var y = rect.bottom;
     return [x, y];
   }
-
   getSettingsErrorMessage() {
     var {
       sourceSize
     } = this.state;
-
     if (sourceSize > DropdownFilterPanel.MAX_TABLE_SIZE) {
       return "Table too large, must have fewer than ".concat(DropdownFilterPanel.MAX_TABLE_SIZE, " options.");
     }
-
     return undefined;
   }
-
   getPanelErrorMessage() {
     var {
       error
     } = this.state;
     return error != null ? "".concat(error) : undefined;
   }
-
   getSource() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var {
@@ -286,7 +242,6 @@ class DropdownFilterPanel extends Component {
     var panelLinks = this.getCachedPanelLinks(dashboardLinks, this);
     return this.getCachedSource(panelLinks);
   }
-
   getSourceTable() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var {
@@ -295,12 +250,10 @@ class DropdownFilterPanel extends Component {
     var source = this.getSource(props);
     return this.getCachedSourceTable(panelTableMap, source);
   }
-
   getValuesColumn(valuesTable) {
     var source = this.getSource();
     return this.getCachedSourceColumn(valuesTable, source);
   }
-
   startListeningToSource(sourceTable) {
     log.debug('startListeningToSource');
     sourceTable.addEventListener(dh.Table.EVENT_FILTERCHANGED, this.handleSourceFilterChange);
@@ -309,7 +262,6 @@ class DropdownFilterPanel extends Component {
     sourceTable.addEventListener(dh.Table.EVENT_DISCONNECT, this.handleDisconnect);
     sourceTable.addEventListener(dh.Table.EVENT_RECONNECT, this.handleReconnect);
   }
-
   stopListeningToSource(sourceTable) {
     log.debug('stopListeningToSource');
     sourceTable.removeEventListener(dh.Table.EVENT_FILTERCHANGED, this.handleSourceFilterChange);
@@ -318,11 +270,10 @@ class DropdownFilterPanel extends Component {
     sourceTable.removeEventListener(dh.Table.EVENT_DISCONNECT, this.handleDisconnect);
     sourceTable.removeEventListener(dh.Table.EVENT_RECONNECT, this.handleReconnect);
   }
-
   handleChange(_ref3) {
     var {
       column,
-      isValueShown,
+      isValueShown = false,
       value
     } = _ref3;
     var {
@@ -333,7 +284,6 @@ class DropdownFilterPanel extends Component {
     var timestamp = Date.now();
     this.setState(_ref4 => {
       var _ref5, _timestamp;
-
       var {
         panelState,
         timestamp: prevTimestamp,
@@ -343,11 +293,9 @@ class DropdownFilterPanel extends Component {
       // If the user had a value set, and they flip the card over and flip it back without changing any settings, ignore it
       var isFlip = panelState != null && isValueShown !== panelState.isValueShown && name === panelState.name && type === panelState.type && value === panelState.value;
       sendUpdate = (_ref5 = !skipUpdate && isValueShown && (!isFlip || !wasFlipped)) !== null && _ref5 !== void 0 ? _ref5 : false;
-
       if (!sendUpdate) {
         timestamp = prevTimestamp;
       }
-
       return {
         panelState: {
           isValueShown,
@@ -366,7 +314,6 @@ class DropdownFilterPanel extends Component {
       }
     });
   }
-
   handleDisconnect() {
     this.setState({
       error: new Error('Table disconnected'),
@@ -374,22 +321,18 @@ class DropdownFilterPanel extends Component {
       isLoading: false
     });
   }
-
   handleReconnect() {
     this.setState({
       isDisconnected: false,
       error: null
     });
   }
-
   handleSourceFilterChange() {
     this.applySourceFilters();
   }
-
   handleSourceSortChange() {
     this.applySourceSorts();
   }
-
   handleSourceSizeChange(_ref6) {
     var {
       detail
@@ -398,7 +341,6 @@ class DropdownFilterPanel extends Component {
       sourceSize: detail
     });
   }
-
   handleColumnSelected() {
     log.debug('handleColumnSelected');
     var {
@@ -406,41 +348,34 @@ class DropdownFilterPanel extends Component {
     } = this.props;
     glEventHub.emit(InputFilterEvent.COLUMN_SELECTED, this, DropdownFilterPanel.SOURCE_COLUMN);
   }
-
   handleClearAllFilters() {
     var _this$dropdownFilterR, _this$dropdownFilterR2;
-
     (_this$dropdownFilterR = this.dropdownFilterRef) === null || _this$dropdownFilterR === void 0 ? void 0 : (_this$dropdownFilterR2 = _this$dropdownFilterR.current) === null || _this$dropdownFilterR2 === void 0 ? void 0 : _this$dropdownFilterR2.clearFilter();
   }
+
   /**
    * Set the filter value, card side, selected column
    * @param state Filter state to set
    * @param sendUpdate Emit filters changed event if true
    */
-
-
   setPanelState(state) {
     var _this$dropdownFilterR3, _this$dropdownFilterR4;
-
     var sendUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-
     if (this.getSource() == null) {
       log.debug('Ignore state update for unlinked filter', state);
       return;
-    } // Set the skipUpdate flag so the next onChange handler call doesn't emit the FILTERS_CHANGED event
-
-
+    }
+    // Set the skipUpdate flag so the next onChange handler call doesn't emit the FILTERS_CHANGED event
     this.setState({
       skipUpdate: !sendUpdate
-    }); // Changing the inputFilter state via props doesn't quite work because of the delays on manual input changes
-    // Setting the ref state directly triggers the onChange handler and updates the panelState
+    });
 
+    // Changing the inputFilter state via props doesn't quite work because of the delays on manual input changes
+    // Setting the ref state directly triggers the onChange handler and updates the panelState
     (_this$dropdownFilterR3 = this.dropdownFilterRef) === null || _this$dropdownFilterR3 === void 0 ? void 0 : (_this$dropdownFilterR4 = _this$dropdownFilterR3.current) === null || _this$dropdownFilterR4 === void 0 ? void 0 : _this$dropdownFilterR4.setFilterState(state);
   }
-
   sendUpdate(name, type, value, timestamp) {
     var _this$getSource;
-
     var {
       glEventHub
     } = this.props;
@@ -461,7 +396,6 @@ class DropdownFilterPanel extends Component {
       excludePanelIds
     });
   }
-
   updateValuesTable() {
     var source = this.getSource();
     var sourceTable = this.getSourceTable();
@@ -471,7 +405,6 @@ class DropdownFilterPanel extends Component {
       valuesTable: undefined,
       error: null
     });
-
     if (source == null) {
       log.debug('Filter unlinked.');
       this.setState({
@@ -482,15 +415,12 @@ class DropdownFilterPanel extends Component {
       });
       return;
     }
-
     this.setState({
       isLoading: true
     });
-
     if (sourceTable == null) {
       return;
     }
-
     this.setState({
       isLoaded: false,
       sourceSize: sourceTable.size
@@ -505,7 +435,6 @@ class DropdownFilterPanel extends Component {
       if (PromiseUtils.isCanceled(error)) {
         return;
       }
-
       log.error(error);
       this.setState({
         isLoading: false,
@@ -513,71 +442,56 @@ class DropdownFilterPanel extends Component {
       });
     });
   }
-
   applySourceSorts() {
     var {
       valuesTable
     } = this.state;
     var sourceTable = this.getSourceTable();
-    log.debug('applySourceSorts', sourceTable.sort);
-
-    if (valuesTable == null) {
+    log.debug('applySourceSorts', sourceTable === null || sourceTable === void 0 ? void 0 : sourceTable.sort);
+    if (valuesTable == null || sourceTable == null) {
       log.debug('Table not initialized');
       return;
     }
-
     var sorts = [...sourceTable.sort];
     valuesTable.applySort(sorts);
     this.setViewport(valuesTable);
   }
-
   applySourceFilters() {
     var {
       valuesTable
     } = this.state;
     var sourceTable = this.getSourceTable();
-    log.debug('applySourceFilters', sourceTable.filter);
-
-    if (valuesTable == null) {
+    log.debug('applySourceFilters', sourceTable === null || sourceTable === void 0 ? void 0 : sourceTable.filter);
+    if (valuesTable == null || sourceTable == null) {
       log.debug('Table not initialized');
       return;
     }
-
     var filters = [...sourceTable.filter];
     valuesTable.applyFilter(filters);
     this.setViewport(valuesTable);
   }
-
   updateViewportListener(valuesTable) {
     log.debug('updateViewportListener', valuesTable === null || valuesTable === void 0 ? void 0 : valuesTable.size);
-
     if (this.cleanup) {
       this.cleanup();
     }
-
     if (valuesTable == null) {
       this.cleanup = undefined;
       return;
     }
-
     this.cleanup = valuesTable.addEventListener(dh.Table.EVENT_UPDATED, this.handleValuesTableUpdate);
     this.setViewport(valuesTable);
   }
-
   setViewport(valuesTable) {
     var valuesColumn = this.getValuesColumn(valuesTable);
-
     if (!valuesColumn) {
       log.error('values column is null');
       return;
     }
-
     valuesTable.setViewport(0, DropdownFilterPanel.MAX_TABLE_SIZE - 1, [valuesColumn]);
   }
-
   updateFormatterSettings(settings) {
     var columnFormats = FormatterUtils.getColumnFormats(settings);
-
     if (!deepEqual(this.columnFormats, columnFormats)) {
       this.columnFormats = columnFormats;
       this.setState({
@@ -585,7 +499,6 @@ class DropdownFilterPanel extends Component {
       });
     }
   }
-
   handleValuesTableUpdate(_ref7) {
     var {
       detail
@@ -596,19 +509,15 @@ class DropdownFilterPanel extends Component {
     var {
       valuesTable
     } = this.state;
-
     if (!valuesTable) {
       log.error('valuesTable is null');
       return;
     }
-
     var valuesColumn = this.getValuesColumn(valuesTable);
-
     if (!valuesColumn) {
       log.error('Values column not found');
       return;
     }
-
     var values = rows.map(row => row.get(valuesColumn));
     this.setState({
       values,
@@ -617,31 +526,24 @@ class DropdownFilterPanel extends Component {
       valuesColumn
     });
   }
-
   handleSourceMouseEnter() {
     var {
       columnSelectionValidator
     } = this.props;
-
     if (!columnSelectionValidator) {
       return;
     }
-
     columnSelectionValidator(this, DropdownFilterPanel.SOURCE_COLUMN);
   }
-
   handleSourceMouseLeave() {
     var {
       columnSelectionValidator
     } = this.props;
-
     if (!columnSelectionValidator) {
       return;
     }
-
     columnSelectionValidator(this, undefined);
   }
-
   render() {
     var {
       columns,
@@ -698,26 +600,19 @@ class DropdownFilterPanel extends Component {
       onSourceMouseLeave: this.handleSourceMouseLeave
     })));
   }
-
 }
-
 _defineProperty(DropdownFilterPanel, "displayName", 'DropdownFilterPanel');
-
 _defineProperty(DropdownFilterPanel, "COMPONENT", 'DropdownFilterPanel');
-
 _defineProperty(DropdownFilterPanel, "MAX_TABLE_SIZE", 256);
-
 _defineProperty(DropdownFilterPanel, "DATETIME_FORMATTER", new DateTimeColumnFormatter({
   showTimeZone: false,
   showTSeparator: true,
   defaultDateTimeFormatString: "yyyy-MM-dd HH:mm:ss.SSSSSSSSS"
 }));
-
 _defineProperty(DropdownFilterPanel, "SOURCE_COLUMN", Object.freeze({
   name: 'FilterSource',
   type: null
 }));
-
 var mapStateToProps = (state, ownProps) => {
   var {
     localDashboardId
@@ -729,8 +624,8 @@ var mapStateToProps = (state, ownProps) => {
   var dashboardLinks = getLinksForDashboard(state, localDashboardId);
   var activeTool = getActiveTool(state);
   var isolatedLinkerPanelId = getIsolatedLinkerPanelIdForDashboard(state, localDashboardId);
-  var isLinkerActive = activeTool === ToolType.LINKER && (isolatedLinkerPanelId === undefined || isolatedLinkerPanelId === panelId); // Disable linking if linker is in isolated mode for a different panel
-
+  var isLinkerActive = activeTool === ToolType.LINKER && (isolatedLinkerPanelId === undefined || isolatedLinkerPanelId === panelId);
+  // Disable linking if linker is in isolated mode for a different panel
   var disableLinking = activeTool === ToolType.LINKER && isolatedLinkerPanelId !== undefined && isolatedLinkerPanelId !== panelId;
   return {
     columns: getColumnsForDashboard(state, localDashboardId),
@@ -742,7 +637,6 @@ var mapStateToProps = (state, ownProps) => {
     dashboardLinks
   };
 };
-
 export default connect(mapStateToProps, null, null, {
   forwardRef: true
 })(DropdownFilterPanel);