18203: added support for adding multi properties at once

[arvados-workbench2.git] / src / views-components / project-properties / create-project-properties-form.tsx

diff --git a/src/views-components/project-properties/create-project-properties-form.tsx b/src/views-components/project-properties/create-project-properties-form.tsx
index 385afff7684c1ae8cca710422580de008f29c243..5a6d9df6471374d176112a33aabd9e029b5c1ae1 100644 (file)
--- a/src/views-components/project-properties/create-project-properties-form.tsx
+++ b/src/views-components/project-properties/create-project-properties-form.tsx
@@ -2,53 +2,32 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
-import { reduxForm, reset, InjectedFormProps } from 'redux-form';
-import { PROJECT_CREATE_PROPERTIES_FORM_NAME, addPropertyToCreateProjectForm } from '~/store/projects/project-create-actions';
-import { ResourcePropertiesFormData } from '~/views-components/resource-properties-form/resource-properties-form';
-import { StyleRulesCallback, WithStyles, withStyles, Grid } from '@material-ui/core';
-import { ArvadosTheme } from '~/common/custom-theme';
-import { PropertyKeyField } from '~/views-components/resource-properties-form/property-key-field';
-import { PropertyValueField } from '~/views-components/resource-properties-form/property-value-field';
-import { Button } from '~/views-components/resource-properties-form/resource-properties-form';
+import { reduxForm, change } from 'redux-form';
+import { withStyles } from '@material-ui/core';
+import {
+    PROJECT_CREATE_PROPERTIES_FORM_NAME,
+    PROJECT_CREATE_FORM_NAME
+} from 'store/projects/project-create-actions';
+import {
+    ResourcePropertiesForm,
+    ResourcePropertiesFormData
+} from 'views-components/resource-properties-form/resource-properties-form';
+import { addPropertyToResourceForm } from 'store/resources/resources-actions';
+import { PROPERTY_VALUE_FIELD_NAME } from 'views-components/resource-properties-form/property-value-field';
 
-type CssRules = 'root';
-
-const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
-    root: {
-        paddingTop: theme.spacing.unit,
-        margin: 0
-    }
-});
-
-type CreateProjectPropertiesFormProps = InjectedFormProps<ResourcePropertiesFormData> & WithStyles<CssRules>;
-
-const Form = withStyles(styles)(
-    ({ handleSubmit, submitting, invalid, classes }: CreateProjectPropertiesFormProps) =>
-        <Grid container spacing={16} className={classes.root}>
-            <Grid item xs={5}>
-                <PropertyKeyField />
-            </Grid>
-            <Grid item xs={5}>
-                <PropertyValueField />
-            </Grid>
-            <Grid item xs={2}>
-                <Button
-                    disabled={invalid}
-                    loading={submitting}
-                    color='primary'
-                    variant='contained'
-                    onClick={handleSubmit}>
-                    Add
-                </Button>
-            </Grid>
-        </Grid>
-);
+const Form = withStyles(
+    ({ spacing }) => (
+        { container:
+            {
+                margin: 0,
+            }
+        })
+    )(ResourcePropertiesForm);
 
 export const CreateProjectPropertiesForm = reduxForm<ResourcePropertiesFormData>({
     form: PROJECT_CREATE_PROPERTIES_FORM_NAME,
     onSubmit: (data, dispatch) => {
-        dispatch(addPropertyToCreateProjectForm(data));
-        dispatch(reset(PROJECT_CREATE_PROPERTIES_FORM_NAME));
+        dispatch(addPropertyToResourceForm(data, PROJECT_CREATE_FORM_NAME));
+        dispatch(change(PROJECT_CREATE_PROPERTIES_FORM_NAME, PROPERTY_VALUE_FIELD_NAME, ''));
     }
 })(Form);
\ No newline at end of file