Fixing plotly#10

Author: AdrianIssott

README.md

@@ -61,6 +61,7 @@ Default Values:
 * `hiddenAttributes`: []
 * `hiddenFromAggregators`: []
 * `hiddenFromDragDrop`: []
+* `valueFilter`: []
 
 
 ## FAQ

dash_pivottable/PivotTable.py

@@ -48,7 +48,7 @@ class PivotTable(Component):
 orders by row total
 - aggregatorName (string; optional): Which aggregator is currently selected. E.g. Count, Sum, Average, etc.
 - vals (list; optional): Vals for the aggregator.
-- valueFilter (dict; optional): Value filter for each attibute name.
+- valueFilter (dict; optional): Value filter for each attribute name.
 - rendererName (string; optional): Which renderer is currently selected. E.g. Table, Line Chart, Scatter
 Chart, etc."""
     @_explicitize_args

dash_pivottable/metadata.json

@@ -133,14 +133,22 @@
           "name": "array"
         },
         "required": false,
-        "description": "Vals for the aggregator."
+        "description": "Vals for the aggregator.",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
       },
       "valueFilter": {
         "type": {
           "name": "object"
         },
         "required": false,
-        "description": "Value filter for each attibute name."
+        "description": "Value filter for each attribute name.",
+        "defaultValue": {
+          "value": "[]",
+          "computed": false
+        }
       },
       "rendererName": {
         "type": {

src/lib/components/PivotTable.react.js

@@ -35,7 +35,6 @@ const PlotlyRenderers = createPlotlyRenderers(Plot);
 export default class PivotTable extends Component {
     constructor(props) {
         super(props);
-        this.state = props;
         this.handleChange = this.handleChange.bind(this);
     }
 
@@ -46,7 +45,9 @@ export default class PivotTable extends Component {
           rows,
           rowOrder,
           aggregatorName,
-          rendererName
+          rendererName,
+          valueFilter,
+          vals,
         } = state;
 
         if (typeof this.props.setProps === 'function') {
@@ -56,7 +57,9 @@ export default class PivotTable extends Component {
                 rows,
                 rowOrder,
                 aggregatorName,
-                rendererName
+                rendererName,
+                valueFilter,
+                vals,
             });
         }
 
@@ -70,7 +73,9 @@ export default class PivotTable extends Component {
             hiddenFromAggregators,
             hiddenFromDragDrop,
             menuLimit,
-            unusedOrientationCutoff
+            unusedOrientationCutoff,
+            valueFilter,
+            vals,
         } = this.props;
 
         return (
@@ -83,7 +88,9 @@ export default class PivotTable extends Component {
                 hiddenFromDragDrop={hiddenFromDragDrop}
                 menuLimit={menuLimit}
                 unusedOrientationCutoff={unusedOrientationCutoff}
-                {...this.state}
+                valueFilter={valueFilter}
+                vals={vals}
+                {...this.props}
             />
         );
     }
@@ -94,7 +101,9 @@ PivotTable.defaultProps = {
     unusedOrientationCutoff: 85,
     hiddenAttributes: [],
     hiddenFromAggregators: [],
-    hiddenFromDragDrop: []
+    hiddenFromDragDrop: [], 
+    valueFilter: [],
+    vals: [],
 };
 
 PivotTable.propTypes = {
@@ -181,7 +190,7 @@ PivotTable.propTypes = {
     vals: PropTypes.array,
 
     /**
-     * Value filter for each attibute name.
+     * Value filter for each attribute name.
      */
     valueFilter: PropTypes.object,
 

tests/test_callbacks.py

@@ -13,6 +13,7 @@ def test_callbacks(dash_duo):
         'col_order': 'key_a_to_z',
         'aggregator': 'Average',
         'renderer': 'Grouped Column Chart',
+        'data_length': 'Data length: 245',
     }
 
     app = import_app('usage')