From: Lucas Di Pentima <ldipentima@veritasgenetics.com>
Date: Tue, 19 Nov 2019 17:04:59 +0000 (-0300)
Subject: 15069: Fixes bug on advanced search UI disallowing duplicate tags.
X-Git-Tag: 2.0.0~28^2~3
X-Git-Url: https://git.arvados.org/arvados-workbench2.git/commitdiff_plain/c2203b1706178b03dca89376f4cef84ccd882538?ds=sidebyside;hp=c33dec559093730850c578cb37e0606d33a9ca8a

15069: Fixes bug on advanced search UI disallowing duplicate tags.

When the user added properties with the same key as a search criteria, the
UI used to list them all, because the form saves them as a FieldArray and
they were being pushed to the array when clicking on the Add button.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <ldipentima@veritasgenetics.com>
---

diff --git a/src/store/search-bar/search-bar-actions.ts b/src/store/search-bar/search-bar-actions.ts
index 8e9e755d..4b745a4d 100644
--- a/src/store/search-bar/search-bar-actions.ts
+++ b/src/store/search-bar/search-bar-actions.ts
@@ -388,11 +388,6 @@ export const resetAdvancedFormProperty = (propertyField: string) =>
         dispatch(untouch(SEARCH_BAR_ADVANCED_FORM_NAME, propertyField));
     };
 
-export const updateAdvancedFormProperties = (propertyValue: PropertyValue) =>
-    (dispatch: Dispatch) => {
-        dispatch(arrayPush(SEARCH_BAR_ADVANCED_FORM_NAME, 'properties', propertyValue));
-    };
-
 export const moveUp = () =>
     (dispatch: Dispatch) => {
         dispatch(searchBarActions.MOVE_UP());
diff --git a/src/views-components/search-bar/search-bar-advanced-properties-view.tsx b/src/views-components/search-bar/search-bar-advanced-properties-view.tsx
index 0d7972f8..eb049b76 100644
--- a/src/views-components/search-bar/search-bar-advanced-properties-view.tsx
+++ b/src/views-components/search-bar/search-bar-advanced-properties-view.tsx
@@ -11,8 +11,7 @@ import { RootState } from '~/store/store';
 import {
     SEARCH_BAR_ADVANCED_FORM_NAME,
     changeAdvancedFormProperty,
-    resetAdvancedFormProperty,
-    updateAdvancedFormProperties
+    resetAdvancedFormProperty
 } from '~/store/search-bar/search-bar-actions';
 import { PropertyValue } from '~/models/search-bar';
 import { ArvadosTheme } from '~/common/custom-theme';
@@ -46,7 +45,7 @@ interface SearchBarAdvancedPropertiesViewDataProps {
 
 interface SearchBarAdvancedPropertiesViewActionProps {
     setProps: () => void;
-    addProp: (propertyValues: PropertyValue) => void;
+    setProp: (propertyValues: PropertyValue, properties: PropertyValue[]) => void;
     getAllFields: (propertyValues: PropertyValue[]) => PropertyValue[] | [];
 }
 
@@ -65,8 +64,11 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({
     setProps: (propertyValues: PropertyValue[]) => {
         dispatch<any>(changeAdvancedFormProperty('properties', propertyValues));
     },
-    addProp: (propertyValue: PropertyValue) => {
-        dispatch<any>(updateAdvancedFormProperties(propertyValue));
+    setProp: (propertyValue: PropertyValue, properties: PropertyValue[]) => {
+        dispatch<any>(changeAdvancedFormProperty(
+            'properties',
+            [...properties.filter(e => e.keyID! !== propertyValue.keyID!), propertyValue]
+        ));
         dispatch<any>(resetAdvancedFormProperty('key'));
         dispatch<any>(resetAdvancedFormProperty('value'));
         dispatch<any>(resetAdvancedFormProperty('keyID'));
@@ -81,7 +83,7 @@ export const SearchBarAdvancedPropertiesView = compose(
     connectVocabulary,
     connect(mapStateToProps, mapDispatchToProps))(
     withStyles(styles)(
-        ({ classes, fields, propertyValues, setProps, addProp, getAllFields, vocabulary }: SearchBarAdvancedPropertiesViewProps) =>
+        ({ classes, fields, propertyValues, setProps, setProp, getAllFields, vocabulary }: SearchBarAdvancedPropertiesViewProps) =>
             <Grid container item xs={12} spacing={16}>
                 <Grid item xs={2} className={classes.label}>Properties</Grid>
                 <Grid item xs={4}>
@@ -91,7 +93,7 @@ export const SearchBarAdvancedPropertiesView = compose(
                     <SearchBarValueField />
                 </Grid>
                 <Grid container item xs={2} justify='flex-end' alignItems="center">
-                    <Button className={classes.button} onClick={() => addProp(propertyValues)}
+                    <Button className={classes.button} onClick={() => setProp(propertyValues, getAllFields(fields))}
                         color="primary"
                         size='small'
                         variant="contained"