web: Fix selectedFilters behavior in Range components (#789)

appbaseio · Jan 16, 2019 · 64c18ba · 64c18ba
1 parent 9aa2655
commit 64c18ba
Show file tree

Hide file tree

Showing 6 changed files with 54 additions and 7 deletions.
diff --git a/packages/web/src/components/range/MultiDropdownRange.js b/packages/web/src/components/range/MultiDropdownRange.js
@@ -69,7 +69,15 @@ class MultiDropdownRange extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			this.selectItem(this.props.selectedValue || null);
+			const { value, onChange } = this.props;
+			if (value === undefined) {
+				this.selectItem(this.props.selectedValue || null);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				const selectedValuesArray = Object.keys(this.selectedValues);
+				this.selectItem(selectedValuesArray, true);
+			}
 		}
 	}
 

diff --git a/packages/web/src/components/range/MultiRange.js b/packages/web/src/components/range/MultiRange.js
@@ -70,7 +70,16 @@ class MultiRange extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			this.selectItem(this.props.selectedValue || null);
+			const { value, onChange } = this.props;
+
+			if (value === undefined) {
+				this.selectItem(this.props.selectedValue || null);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				const selectedValuesArray = Object.keys(this.state.selectedValues);
+				this.selectItem(selectedValuesArray, true);
+			}
 		}
 	}
 

diff --git a/packages/web/src/components/range/RangeSlider.js b/packages/web/src/components/range/RangeSlider.js
@@ -87,8 +87,16 @@ class RangeSlider extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			const value = RangeSlider.parseValue(this.props.selectedValue, this.props);
-			this.handleChange(value, this.props);
+			const { value, onChange } = this.props;
+
+			if (value === undefined) {
+				const selectedValue = RangeSlider.parseValue(this.props.selectedValue, this.props);
+				this.handleChange(selectedValue, this.props);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				this.handleChange(this.state.currentValue);
+			}
 		}
 	}
 

diff --git a/packages/web/src/components/range/RatingsFilter.js b/packages/web/src/components/range/RatingsFilter.js
@@ -64,7 +64,14 @@ class RatingsFilter extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			this.setValue(this.props.selectedValue || null);
+			const { value, onChange } = this.props;
+			if (value === undefined) {
+				this.setValue(this.props.selectedValue || null);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				this.setValue(this.state.currentValue);
+			}
 		}
 	}
 

diff --git a/packages/web/src/components/range/SingleDropdownRange.js b/packages/web/src/components/range/SingleDropdownRange.js
@@ -63,7 +63,15 @@ class SingleDropdownRange extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			this.setValue(this.props.selectedValue || null, true);
+			const { value, onChange } = this.props;
+			if (value === undefined) {
+				this.setValue(this.props.selectedValue || null, true);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				const selectedItem = this.state.currentValue.label;
+				this.setValue(selectedItem, true);
+			}
 		}
 	}
 

diff --git a/packages/web/src/components/range/SingleRange.js b/packages/web/src/components/range/SingleRange.js
@@ -63,7 +63,14 @@ class SingleRange extends Component {
 			!isEqual(this.state.currentValue, this.props.selectedValue)
 			&& !isEqual(this.props.selectedValue, prevProps.selectedValue)
 		) {
-			this.setValue(this.props.selectedValue || null);
+			const { value, onChange } = this.props;
+			if (value === undefined) {
+				this.setValue(this.props.selectedValue || null);
+			} else if (onChange) {
+				onChange(this.props.selectedValue || null);
+			} else {
+				this.setValue(this.state.currentValue);
+			}
 		}
 	}