From cf3a9e014c504405624cc704dda509f38b38ef7b Mon Sep 17 00:00:00 2001
From: Michal Klobukowski <michal.klobukowski@contractors.roche.com>
Date: Wed, 28 Nov 2018 12:09:09 +0100
Subject: [PATCH] Use ProgressButton in ResourcePropertiesForm

Feature #14393

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>
---
 .../resource-properties-form.tsx               | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/views-components/resource-properties-form/resource-properties-form.tsx b/src/views-components/resource-properties-form/resource-properties-form.tsx
index df9ff849..c881928c 100644
--- a/src/views-components/resource-properties-form/resource-properties-form.tsx
+++ b/src/views-components/resource-properties-form/resource-properties-form.tsx
@@ -4,16 +4,17 @@
 
 import * as React from 'react';
 import { InjectedFormProps, reduxForm } from 'redux-form';
-import { Grid, Button } from '@material-ui/core';
+import { Grid, withStyles } from '@material-ui/core';
 import { PropertyKeyField, PROPERTY_KEY_FIELD_NAME } from './property-key-field';
 import { PropertyValueField, PROPERTY_VALUE_FIELD_NAME } from './property-value-field';
+import { ProgressButton } from '~/components/progress-button/progress-button';
 
 export interface ResourcePropertiesFormData {
     [PROPERTY_KEY_FIELD_NAME]: string;
     [PROPERTY_VALUE_FIELD_NAME]: string;
 }
 
-export const ResourcePropertiesForm = ({ handleSubmit }: InjectedFormProps<ResourcePropertiesFormData>) =>
+export const ResourcePropertiesForm = ({ handleSubmit, submitting, invalid }: InjectedFormProps<ResourcePropertiesFormData>) =>
     <form onSubmit={handleSubmit}>
         <Grid container spacing={16}>
             <Grid item xs>
@@ -23,7 +24,18 @@ export const ResourcePropertiesForm = ({ handleSubmit }: InjectedFormProps<Resou
                 <PropertyValueField />
             </Grid>
             <Grid item xs>
-                <Button variant='contained' type='submit'>Add</Button>
+                <Button
+                    disabled={invalid}
+                    loading={submitting}
+                    color='primary'
+                    variant='contained'
+                    type='submit'>
+                    Add
+                </Button>
             </Grid>
         </Grid>
     </form>;
+
+const Button = withStyles(theme => ({
+    root: { marginTop: theme.spacing.unit }
+}))(ProgressButton);
-- 
2.30.2