Merge branch '18215-collection-update-without-manifest' into main.
[arvados-workbench2.git] / src / views-components / search-bar / search-bar-advanced-properties-view.tsx
index 0d7972f822f0cc20e41cd6a4c98d298aa0e1e8e1..6ebef15603e35ea285a99f665916990c47d2e065 100644 (file)
@@ -2,25 +2,25 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
+import React from 'react';
 import { Dispatch, compose } from 'redux';
 import { connect } from 'react-redux';
 import { InjectedFormProps, formValueSelector } from 'redux-form';
 import { Grid, withStyles, StyleRulesCallback, WithStyles, Button } from '@material-ui/core';
-import { RootState } from '~/store/store';
+import { RootState } from 'store/store';
 import {
     SEARCH_BAR_ADVANCED_FORM_NAME,
     changeAdvancedFormProperty,
-    resetAdvancedFormProperty,
-    updateAdvancedFormProperties
-} from '~/store/search-bar/search-bar-actions';
-import { PropertyValue } from '~/models/search-bar';
-import { ArvadosTheme } from '~/common/custom-theme';
-import { SearchBarKeyField, SearchBarValueField } from '~/views-components/form-fields/search-bar-form-fields';
-import { Chips } from '~/components/chips/chips';
-import { formatPropertyValue } from "~/common/formatters";
-import { Vocabulary } from '~/models/vocabulary';
+    resetAdvancedFormProperty
+} from 'store/search-bar/search-bar-actions';
+import { PropertyValue } from 'models/search-bar';
+import { ArvadosTheme } from 'common/custom-theme';
+import { SearchBarKeyField, SearchBarValueField } from 'views-components/form-fields/search-bar-form-fields';
+import { Chips } from 'components/chips/chips';
+import { formatPropertyValue } from "common/formatters";
+import { Vocabulary } from 'models/vocabulary';
 import { connectVocabulary } from '../resource-properties-form/property-field-common';
+import { isEqual } from 'lodash';
 
 type CssRules = 'label' | 'button';
 
@@ -46,7 +46,7 @@ interface SearchBarAdvancedPropertiesViewDataProps {
 
 interface SearchBarAdvancedPropertiesViewActionProps {
     setProps: () => void;
-    addProp: (propertyValues: PropertyValue) => void;
+    addProp: (propertyValues: PropertyValue, properties: PropertyValue[]) => void;
     getAllFields: (propertyValues: PropertyValue[]) => PropertyValue[] | [];
 }
 
@@ -65,8 +65,20 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({
     setProps: (propertyValues: PropertyValue[]) => {
         dispatch<any>(changeAdvancedFormProperty('properties', propertyValues));
     },
-    addProp: (propertyValue: PropertyValue) => {
-        dispatch<any>(updateAdvancedFormProperties(propertyValue));
+    addProp: (propertyValue: PropertyValue, properties: PropertyValue[]) => {
+        // Remove potential duplicates
+        properties = properties.filter(x => ! isEqual(
+            {
+                key: x.keyID || x.key,
+                value: x.valueID || x.value
+            }, {
+                key: propertyValue.keyID || propertyValue.key,
+                value: propertyValue.valueID || propertyValue.value
+            }));
+        dispatch<any>(changeAdvancedFormProperty(
+            'properties',
+            [...properties, propertyValue]
+        ));
         dispatch<any>(resetAdvancedFormProperty('key'));
         dispatch<any>(resetAdvancedFormProperty('value'));
         dispatch<any>(resetAdvancedFormProperty('keyID'));
@@ -91,7 +103,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={() => addProp(propertyValues, getAllFields(fields))}
                         color="primary"
                         size='small'
                         variant="contained"