From 3f5e665a7ad1f1589ec31a210f94ab54a2d84877 Mon Sep 17 00:00:00 2001
From: Adrian Issott <adrian.issott@hp.com>
Date: Wed, 6 Jul 2022 20:30:42 +0100
Subject: [PATCH] Fixing https://github.com/plotly/dash-pivottable/issues/10

---
 README.md                              |  1 +
 dash_pivottable/PivotTable.py          |  2 +-
 dash_pivottable/metadata.json          | 12 ++++++++++--
 src/lib/components/PivotTable.react.js | 23 ++++++++++++++++-------
 tests/test_callbacks.py                |  1 +
 5 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/README.md b/README.md
index 9c82596..3351d20 100644
--- a/README.md
+++ b/README.md
@@ -61,6 +61,7 @@ Default Values:
 * `hiddenAttributes`: []
 * `hiddenFromAggregators`: []
 * `hiddenFromDragDrop`: []
+* `valueFilter`: []
 
 
 ## FAQ
diff --git a/dash_pivottable/PivotTable.py b/dash_pivottable/PivotTable.py
index 9eeab92..c4ecc5e 100644
--- a/dash_pivottable/PivotTable.py
+++ b/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
diff --git a/dash_pivottable/metadata.json b/dash_pivottable/metadata.json
index 7ac3c74..1401a0b 100644
--- a/dash_pivottable/metadata.json
+++ b/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": {
diff --git a/src/lib/components/PivotTable.react.js b/src/lib/components/PivotTable.react.js
index 8ac4c55..c4823b1 100644
--- a/src/lib/components/PivotTable.react.js
+++ b/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,
 
diff --git a/tests/test_callbacks.py b/tests/test_callbacks.py
index 2c20959..cea0204 100644
--- a/tests/test_callbacks.py
+++ b/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')