fix(vue): custom query sync issues

appbaseio · Jan 21, 2022 · 074b06e · 074b06e
1 parent 960c550
commit 074b06e
Show file tree

Hide file tree

Showing 11 changed files with 27 additions and 31 deletions.
diff --git a/packages/reactivecore b/packages/reactivecore
diff --git a/packages/vue/src/components/list/MultiDropdownList.jsx b/packages/vue/src/components/list/MultiDropdownList.jsx
@@ -352,7 +352,7 @@ const MultiDropdownList = {
 				// Update calculated default query in store
 				updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
 			}
-			this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+			this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
 			this.updateQuery({
 				componentId: this.internalComponent,
 				query,
@@ -370,7 +370,7 @@ const MultiDropdownList = {
 				customQueryOptions = getOptionsFromQuery(customQuery(value, props));
 				updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
 			}
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 			this.updateQuery({
 				componentId: props.componentId,
 				query,

diff --git a/packages/vue/src/components/list/MultiList.jsx b/packages/vue/src/components/list/MultiList.jsx
@@ -370,7 +370,7 @@ const MultiList = {
 				// Update calculated default query in store
 				updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
 			}
-			this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+			this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
 			this.updateQuery({
 				componentId: this.internalComponent,
 				query,
@@ -388,7 +388,7 @@ const MultiList = {
 				customQueryOptions = getOptionsFromQuery(customQuery(value, props));
 				updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
 			}
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 
 			this.updateQuery({
 				componentId: props.componentId,

diff --git a/packages/vue/src/components/list/SingleDropdownList.jsx b/packages/vue/src/components/list/SingleDropdownList.jsx
@@ -285,7 +285,7 @@ const SingleDropdownList = {
 				// Update calculated default query in store
 				updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
 			}
-			this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+			this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
 			this.updateQuery({
 				componentId: this.internalComponent,
 				query,
@@ -303,7 +303,7 @@ const SingleDropdownList = {
 				customQueryOptions = getOptionsFromQuery(customQuery(value, props));
 				updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
 			}
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 			this.updateQuery({
 				componentId: props.componentId,
 				query,

diff --git a/packages/vue/src/components/list/SingleList.jsx b/packages/vue/src/components/list/SingleList.jsx
@@ -310,7 +310,7 @@ const SingleList = {
 				// Update calculated default query in store
 				updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
 			}
-			this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+			this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
 			this.updateQuery({
 				componentId: this.internalComponent,
 				query,
@@ -328,7 +328,7 @@ const SingleList = {
 				customQueryOptions = getOptionsFromQuery(customQuery(value, props));
 				updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
 			}
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 			this.updateQuery({
 				componentId: props.componentId,
 				query,

diff --git a/packages/vue/src/components/list/ToggleButton.jsx b/packages/vue/src/components/list/ToggleButton.jsx
@@ -165,6 +165,7 @@ const ToggleButton = {
 				this.setQueryOptions(
 					props.componentId,
 					getOptionsFromQuery(customQuery(value, props)),
+					false
 				);
 				updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
 			}

diff --git a/packages/vue/src/components/range/DynamicRangeSlider.jsx b/packages/vue/src/components/range/DynamicRangeSlider.jsx
@@ -21,13 +21,8 @@ const {
 	updateComponentProps,
 } = Actions;
 
-const {
-	checkValueChange,
-	getClassName,
-	getOptionsFromQuery,
-	isEqual,
-	checkSomePropChange,
-} = helper;
+const { checkValueChange, getClassName, getOptionsFromQuery, isEqual, checkSomePropChange }
+	= helper;
 
 const DynamicRangeSlider = {
 	name: 'DynamicRangeSlider',
@@ -215,7 +210,7 @@ const DynamicRangeSlider = {
 			const [currentStart, currentEnd] = value;
 			// check if the slider is at its initial position
 			const isInitialValue = currentStart === start && currentEnd === end;
-			this.setQueryOptions(this.$props.componentId, customQueryOptions);
+			this.setQueryOptions(this.$props.componentId, customQueryOptions, false);
 
 			this.updateQuery({
 				componentId: this.$props.componentId,
@@ -372,7 +367,7 @@ DynamicRangeSlider.defaultQuery = (values, props) => {
 	return query;
 };
 
-DynamicRangeSlider.parseValue = value => [value.start, value.end];
+DynamicRangeSlider.parseValue = (value) => [value.start, value.end];
 
 const mapStateToProps = (state, props) => {
 	const componentId = state.aggregations[props.componentId];
@@ -431,7 +426,7 @@ const mapDispatchtoProps = {
 
 const RangeConnected = connect(mapStateToProps, mapDispatchtoProps)(DynamicRangeSlider);
 
-DynamicRangeSlider.install = function(Vue) {
+DynamicRangeSlider.install = function (Vue) {
 	Vue.component(DynamicRangeSlider.name, RangeConnected);
 };
 

diff --git a/packages/vue/src/components/range/MultiRange.jsx b/packages/vue/src/components/range/MultiRange.jsx
@@ -60,7 +60,7 @@ const MultiRange = {
 			} else if (isDefaultValue) {
 				currentValue = MultiRange.parseValue(item, props);
 				const values = {};
-				currentValue.forEach(value => {
+				currentValue.forEach((value) => {
 					values[[value.label]] = true;
 				});
 				if (reset) {
@@ -69,11 +69,11 @@ const MultiRange = {
 					selectedValues = { ...selectedValues, ...values };
 				}
 			} else if (selectedValues[item]) {
-				currentValue = currentValue.filter(value => value.label !== item);
+				currentValue = currentValue.filter((value) => value.label !== item);
 				const { [item]: del, ...selected } = selectedValues;
 				selectedValues = selected;
 			} else {
-				const currentItems = props.data.filter(value => item.indexOf(value.label) !== -1);
+				const currentItems = props.data.filter((value) => item.indexOf(value.label) !== -1);
 				currentValue = [...currentValue, ...currentItems];
 				selectedValues = {
 					...selectedValues,
@@ -112,7 +112,7 @@ const MultiRange = {
 				);
 			}
 
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 
 			this.updateQuery({
 				componentId: props.componentId,
@@ -177,7 +177,7 @@ const MultiRange = {
 					</Title>
 				)}
 				<UL class={getClassName(this.$props.innerClass, 'list')}>
-					{this.$props.data.map(item => {
+					{this.$props.data.map((item) => {
 						const selected
 							= !!this.$data.currentValue
 							&& this.$data.currentValue.label === item.label;
@@ -217,12 +217,12 @@ const MultiRange = {
 };
 
 MultiRange.parseValue = (value, props) =>
-	value ? props.data.filter(item => value.includes(item.label)) : null;
+	value ? props.data.filter((item) => value.includes(item.label)) : null;
 
 MultiRange.defaultQuery = (values, props) => {
 	const generateRangeQuery = (dataField, items) => {
 		if (items.length > 0) {
-			return items.map(value => ({
+			return items.map((value) => ({
 				range: {
 					[dataField]: {
 						gte: value.start,
@@ -277,7 +277,7 @@ const RangeConnected = ComponentWrapper(connect(mapStateToProps, mapDispatchtoPr
 	componentType: componentTypes.multiRange,
 });
 
-MultiRange.install = function(Vue) {
+MultiRange.install = function (Vue) {
 	Vue.component(MultiRange.name, RangeConnected);
 };
 // Add componentType for SSR

diff --git a/packages/vue/src/components/range/RangeSlider.jsx b/packages/vue/src/components/range/RangeSlider.jsx
@@ -113,7 +113,7 @@ const RangeSlider = {
 			const [currentStart, currentEnd] = value;
 			// check if the slider is at its initial position
 			const isInitialValue = currentStart === start && currentEnd === end;
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 			this.updateQuery({
 				componentId: props.componentId,
 				query,

diff --git a/packages/vue/src/components/range/SingleRange.jsx b/packages/vue/src/components/range/SingleRange.jsx
@@ -152,7 +152,7 @@ const SingleRange = {
 					this.currentValue,
 				);
 			}
-			this.setQueryOptions(props.componentId, customQueryOptions);
+			this.setQueryOptions(props.componentId, customQueryOptions, false);
 
 			this.updateQuery({
 				componentId: props.componentId,

diff --git a/packages/vue/src/components/search/DataSearch.jsx b/packages/vue/src/components/search/DataSearch.jsx
@@ -503,7 +503,7 @@ const DataSearch = {
 			this.setQueryOptions(this.internalComponent, {
 				...this.queryOptions,
 				...defaultQueryOptions,
-			});
+			}, false);
 			this.updateQuery({
 				componentId: this.internalComponent,
 				query,
@@ -528,7 +528,7 @@ const DataSearch = {
 				this.setQueryOptions(componentId, {
 					...this.queryOptions,
 					...customQueryOptions,
-				});
+				}, false);
 			}
 			if (!this.isPending) {
 				this.updateQuery({