@deephaven/dashboard-core-plugins 0.15.5-vite.12 → 0.15.6-beta.3

package/dist/panels/ChartPanel.js

@@ -6,22 +6,20 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 import React, { Component } from 'react';
 import classNames from 'classnames';
-import PropTypes from 'prop-types';
 import memoize from 'memoize-one';
 import { connect } from 'react-redux';
 import { CSSTransition } from 'react-transition-group';
 import debounce from 'lodash.debounce';
-import { Chart, ChartUtils } from '@deephaven/chart';
-import { getOpenedPanelMapForDashboard, GLPropTypes, LayoutUtils } from '@deephaven/dashboard';
+import { Chart, ChartUtils, isFigureChartModel } from '@deephaven/chart';
+import { getOpenedPanelMapForDashboard, LayoutUtils } from '@deephaven/dashboard';
 import { IrisGridUtils } from '@deephaven/iris-grid';
-import dh, { PropTypes as APIPropTypes } from '@deephaven/jsapi-shim';
+import dh from '@deephaven/jsapi-shim';
 import { ThemeExport } from '@deephaven/components';
 import Log from '@deephaven/log';
 import { getActiveTool, getSettings, setActiveTool as setActiveToolAction } from '@deephaven/redux';
-import { Pending, PromiseUtils, TextUtils } from '@deephaven/utils';
+import { assertNotNull, Pending, PromiseUtils, TextUtils } from '@deephaven/utils';
 import WidgetPanel from "./WidgetPanel.js";
 import ToolType from "../linker/ToolType.js";
-import { UIPropTypes } from "../prop-types/index.js";
 import { InputFilterEvent, ChartEvent } from "../events/index.js";
 import { getColumnSelectionValidatorForDashboard, getInputFiltersForDashboard, getIsolatedLinkerPanelIdForDashboard, getLinksForDashboard, getTableMapForDashboard, setDashboardIsolatedLinkerPanelId as setDashboardIsolatedLinkerPanelIdAction } from "../redux/index.js";
 import ChartFilterOverlay from "./ChartFilterOverlay.js";
@@ -29,10 +27,28 @@ import ChartColumnSelectorOverlay from "./ChartColumnSelectorOverlay.js";
 import "./ChartPanel.css";
 var log = Log.module('ChartPanel');
 var UPDATE_MODEL_DEBOUNCE = 150;
+export function isChartPanelTableMetadata(metadata) {
+  return metadata.settings !== undefined;
+}
+
+function hasInputFilter(panel) {
+  return panel.inputFilters != null;
+}
+
+function hasPanelState(panel) {
+  return panel.panelState != null;
+}
+
 export class ChartPanel extends Component {
   constructor(props) {
     super(props);
 
+    _defineProperty(this, "panelContainer", void 0);
+
+    _defineProperty(this, "chart", void 0);
+
+    _defineProperty(this, "pending", void 0);
+
     _defineProperty(this, "getWaitingInputMap", memoize((isFilterRequired, columnMap, filterMap) => {
       if (!isFilterRequired) {
         return new Map();
@@ -97,7 +113,9 @@ export class ChartPanel extends Component {
         }
 
         if (columnName != null && columnMap.has(columnName)) {
-          linkedColumnMap.set(columnName, columnMap.get(columnName));
+          var column = columnMap.get(columnName);
+          assertNotNull(column);
+          linkedColumnMap.set(columnName, column);
         }
       }
 
@@ -144,24 +162,22 @@ export class ChartPanel extends Component {
       filterValueMap = [],
       settings = {}
     } = panelState !== null && panelState !== void 0 ? panelState : {};
-    var queryName = metadata.query;
     this.state = {
       settings,
-      error: null,
+      error: undefined,
       isActive: false,
       isDisconnected: false,
       isLoading: false,
       isLoaded: false,
-      isLinked: metadata && metadata.settings && metadata.settings.isLinked,
+      isLinked: metadata && isChartPanelTableMetadata(metadata) && metadata.settings && metadata.settings.isLinked,
       // Map of all non-empty filters applied to the chart.
       // Initialize the filter map to the previously stored values; input filters will be applied after load.
       filterMap: new Map(filterValueMap),
       // Map of filter values set from links, stored in panelState.
       // Combined with inputFilters to get applied filters (filterMap).
       filterValueMap: new Map(filterValueMap),
-      model: null,
+      model: undefined,
       columnMap: new Map(),
-      queryName,
       // eslint-disable-next-line react/no-unused-state
       panelState
     };
@@ -208,7 +224,7 @@ export class ChartPanel extends Component {
       this.updatePanelState();
     }
 
-    if (settings !== prevState.settings) {
+    if (settings !== prevState.settings && isFigureChartModel(model)) {
       model.updateSettings(settings);
       this.updatePanelState();
     }
@@ -249,7 +265,7 @@ export class ChartPanel extends Component {
     this.setState({
       isLoading: true,
       isLoaded: false,
-      error: null
+      error: undefined
     });
     var {
       makeModel
@@ -335,7 +351,7 @@ export class ChartPanel extends Component {
       return;
     }
 
-    columnSelectionValidator(this, null);
+    columnSelectionValidator(this, undefined);
   }
 
   handleDisconnect() {
@@ -364,7 +380,7 @@ export class ChartPanel extends Component {
   handleReconnect() {
     this.setState({
       isDisconnected: false,
-      error: null
+      error: undefined
     });
     this.sendColumnChange();
     this.updateColumnFilters();
@@ -434,9 +450,6 @@ export class ChartPanel extends Component {
       isLinked,
       model
     } = this.state;
-    var {
-      settings
-    } = metadata;
 
     if (!isLinked || !model || !source) {
       log.debug2('updateModelFromSource ignoring', isLinked, model, source);
@@ -445,9 +458,18 @@ export class ChartPanel extends Component {
 
 
     this.pending.cancel();
-    this.pending.add(dh.plot.Figure.create(ChartUtils.makeFigureSettings(settings, source))).then(figure => {
-      model.setFigure(figure);
-    }).catch(this.handleLoadError);
+
+    if (isChartPanelTableMetadata(metadata)) {
+      var {
+        settings
+      } = metadata;
+      this.pending.add(dh.plot.Figure.create(ChartUtils.makeFigureSettings(settings, source))).then(figure => {
+        if (isFigureChartModel(model)) {
+          model.setFigure(figure);
+        }
+      }).catch(this.handleLoadError);
+    }
+
     this.updatePanelState();
   }
 
@@ -467,15 +489,17 @@ export class ChartPanel extends Component {
     if (sourcePanel) {
       // Right now just update the panel state from the source
       // If the source isn't available, just keep the state that's already saved
-      var {
-        inputFilters
-      } = sourcePanel.props;
-      var {
-        panelState: sourcePanelState
-      } = sourcePanel.state;
+      if (hasInputFilter(sourcePanel.props) && hasPanelState(sourcePanel.state)) {
+        var {
+          inputFilters
+        } = sourcePanel.props;
+        var {
+          panelState: sourcePanelState
+        } = sourcePanel.state;
 
-      if (sourcePanelState) {
-        tableSettings = IrisGridUtils.extractTableSettings(sourcePanelState, inputFilters);
+        if (sourcePanelState) {
+          tableSettings = IrisGridUtils.extractTableSettings(sourcePanelState, inputFilters);
+        }
       }
     } // eslint-disable-next-line react/no-unused-state
 
@@ -550,7 +574,7 @@ export class ChartPanel extends Component {
   }
   /**
    * Create an input filter panel for the provided column
-   * @param {dh.Column} column The column to create the input filter for
+   * @param column The column to create the input filter for
    */
 
 
@@ -622,7 +646,7 @@ export class ChartPanel extends Component {
   }
   /**
    * Set chart filters based on the filter map
-   * @param {Map<string, Object>} filterMapParam Filter map
+   * @param filterMapParam Filter map
    */
 
 
@@ -693,8 +717,10 @@ export class ChartPanel extends Component {
       var inputFilterMap = this.getInputFilterColumnMap(columnMap, inputFilters);
 
       if (inputFilterMap.has(columnName)) {
+        var _inputFilterMap$get;
+
         var filterValue = filterMap.get(columnName);
-        var inputFilterValue = inputFilterMap.get(columnName).value;
+        var inputFilterValue = (_inputFilterMap$get = inputFilterMap.get(columnName)) === null || _inputFilterMap$get === void 0 ? void 0 : _inputFilterMap$get.value;
 
         if (inputFilterValue != null && filterValue !== inputFilterValue) {
           filterMap = new Map(state.filterMap);
@@ -800,7 +826,7 @@ export class ChartPanel extends Component {
             if (filterValueMap.has(name)) {
               var linkValue = filterValueMap.get(name);
 
-              if (linkValue !== filterValue) {
+              if (linkValue !== filterValue && linkValue != null) {
                 needsUpdate = true;
                 filterMap.set(name, linkValue);
               }
@@ -841,6 +867,7 @@ export class ChartPanel extends Component {
       filterMap,
       model
     } = this.state;
+    assertNotNull(model);
     var waitingInputMap = this.getWaitingInputMap(model.isFilterRequired(), columnMap, filterMap);
     model.setFilter(filterMap);
 
@@ -922,22 +949,24 @@ export class ChartPanel extends Component {
       filterMap,
       error,
       model,
-      queryName,
       isActive,
       isDisconnected,
       isLoaded,
       isLoading
     } = this.state;
-    var {
-      figure: figureName,
-      querySerial,
-      table: tableName
-    } = metadata;
+    var name;
+
+    if (isChartPanelTableMetadata(metadata)) {
+      name = metadata.table;
+    } else {
+      name = metadata.figure;
+    }
+
     var inputFilterMap = this.getInputFilterColumnMap(columnMap, inputFilters);
     var linkedColumnMap = this.getLinkedColumnMap(columnMap, links);
     var waitingInputMap = model != null ? this.getWaitingInputMap(model.isFilterRequired(), columnMap, filterMap) : new Map();
     var waitingFilterMap = model != null ? this.getWaitingFilterMap(model.isFilterRequired(), columnMap, filterMap, linkedColumnMap, inputFilterMap) : new Map();
-    var errorMessage = error ? "Unable to open chart. ".concat(error) : null;
+    var errorMessage = error ? "Unable to open chart. ".concat(error) : undefined;
     var isWaitingForFilter = waitingInputMap.size > 0;
     var isSelectingColumn = columnMap.size > 0 && isLinkerActive;
     return /*#__PURE__*/React.createElement(WidgetPanel, {
@@ -957,16 +986,14 @@ export class ChartPanel extends Component {
       isDisconnected: isDisconnected,
       isLoading: isLoading,
       isLoaded: isLoaded,
-      queryName: queryName,
-      querySerial: querySerial,
-      widgetName: figureName || tableName,
+      widgetName: name,
       widgetType: "Chart"
     }, /*#__PURE__*/React.createElement("div", {
       ref: this.panelContainer,
       className: "chart-panel-container h-100 w-100"
     }, /*#__PURE__*/React.createElement("div", {
       className: "chart-container h-100 w-100"
-    }, isLoaded && /*#__PURE__*/React.createElement(Chart, {
+    }, isLoaded && model && /*#__PURE__*/React.createElement(Chart, {
       isActive: isActive,
       model: model,
       settings: settings,
@@ -1006,54 +1033,30 @@ export class ChartPanel extends Component {
 
 }
 
-_defineProperty(ChartPanel, "COMPONENT", 'ChartPanel');
-
-ChartPanel.propTypes = {
-  glContainer: GLPropTypes.Container.isRequired,
-  glEventHub: GLPropTypes.EventHub.isRequired,
-  metadata: PropTypes.shape({
-    figure: PropTypes.string,
-    table: PropTypes.string,
-    query: PropTypes.string,
-    querySerial: PropTypes.string,
-    sourcePanelId: PropTypes.string,
-    settings: PropTypes.shape({
-      isLinked: PropTypes.bool
-    })
-  }).isRequired,
-
-  /** Function to build the ChartModel used by this ChartPanel. Can return a promise. */
-  makeModel: PropTypes.func.isRequired,
-  inputFilters: PropTypes.arrayOf(UIPropTypes.InputFilter).isRequired,
-  links: UIPropTypes.Links.isRequired,
-  localDashboardId: PropTypes.string.isRequired,
-  isLinkerActive: PropTypes.bool,
-  source: APIPropTypes.Table,
-  sourcePanel: UIPropTypes.Panel,
-  columnSelectionValidator: PropTypes.func,
-  setActiveTool: PropTypes.func.isRequired,
-  setDashboardIsolatedLinkerPanelId: PropTypes.func.isRequired,
-  panelState: PropTypes.shape({}),
-  settings: PropTypes.shape({})
-};
-ChartPanel.defaultProps = {
+_defineProperty(ChartPanel, "defaultProps", {
   columnSelectionValidator: null,
   isLinkerActive: false,
   source: null,
   sourcePanel: null,
   panelState: null,
   settings: {}
-};
-ChartPanel.displayName = 'ChartPanel';
+});
+
+_defineProperty(ChartPanel, "displayName", 'ChartPanel');
+
+_defineProperty(ChartPanel, "COMPONENT", 'ChartPanel');
 
 var mapStateToProps = (state, ownProps) => {
   var {
     localDashboardId,
-    metadata = {}
+    metadata
   } = ownProps;
-  var {
-    sourcePanelId
-  } = metadata;
+  var sourcePanelId;
+
+  if (metadata) {
+    sourcePanelId = metadata.sourcePanelId;
+  }
+
   var panelTableMap = getTableMapForDashboard(state, localDashboardId);
   var openedPanelMap = getOpenedPanelMapForDashboard(state, localDashboardId);
   var activeTool = getActiveTool(state);
@@ -1064,8 +1067,8 @@ var mapStateToProps = (state, ownProps) => {
     isLinkerActive,
     inputFilters: getInputFiltersForDashboard(state, localDashboardId),
     links: getLinksForDashboard(state, localDashboardId),
-    source: panelTableMap.get(sourcePanelId),
-    sourcePanel: openedPanelMap.get(sourcePanelId),
+    source: sourcePanelId != null ? panelTableMap.get(sourcePanelId) : undefined,
+    sourcePanel: sourcePanelId != null ? openedPanelMap.get(sourcePanelId) : undefined,
     settings: getSettings(state)
   };
 };