Fix: material-ui Button variant 'raised' renamed to 'contained'

- Also https://material-ui.com/style/typography/#migration-to-typography-v2

src/datasets/ui/c/DatasetDisplay.tsx

@@ -364,7 +364,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
                       dataset.repositoryFiles && dataset.repositoryFiles.map((e: RepositoryFile) => (
                         <PropertiesItem key={ e.uuid } title={
                           <a href={ `/proxy/api/v0/repository/download/${e.uuid}` }>
-                            <Button variant="raised" component="span" className={ `${classes.buttonGreen} ${classes.button}` }>
+                            <Button variant="contained" component="span" className={ `${classes.buttonGreen} ${classes.button}` }>
                               { t('common:action.download') }
                             </Button>
                           </a>

src/datasets/ui/dashboard/dataset-stepper/steps/creators/DatasetCreatorForm.tsx

@@ -151,7 +151,7 @@ class DatasetCreatorForm extends React.Component<IDatasetCreatorFormProps, any>
           <FieldArray name="creators" classes={ this.props.classes } component={ this.renderCreators }/>
         </form>
         <Grid item xs={ 12 } className="back-white">
-          <Button variant="raised" type="button" onClick={ this.createCreator } style={ { margin: '20px' } }>
+          <Button variant="contained" type="button" onClick={ this.createCreator } style={ { margin: '20px' } }>
             { t('datasets.dashboard.p.stepper.creators.add') }
           </Button>
         </Grid>

src/datasets/ui/dashboard/dataset-stepper/steps/files/FilesForm.tsx

@@ -111,7 +111,7 @@ class FilesForm extends React.Component<IFilesFormProps, any> {
             onChange={ this.upload }
           />
           <label htmlFor="file">
-            <Button variant="raised" component="span">
+            <Button variant="contained" component="span">
               { t('datasets.dashboard.p.stepper.attachments.upload') }
             </Button>
           </label>

src/datasets/ui/dashboard/dataset-stepper/steps/location/LocationForm.tsx

@@ -199,7 +199,7 @@ class LocationForm extends React.Component<ILocationFormProps, any> {
         )) }
         <div className="back-white m-20">
           <Button
-            variant="raised"
+            variant="contained"
             type="button"
             onClick={ this.createLocation }
           >{ t('datasets.dashboard.p.stepper.location.add') }</Button>

src/datasets/ui/search/c/SuggestionsForm.tsx

@@ -102,7 +102,7 @@ const SuggestionsForm = ({ classes, t, suggestions, onReset, handleSubmit, initi
       </Grid>
       }
       <div className={ `pt-20 pb-20 pl-20 ${classes.submitButtonWrapper}` }>
-        <Button variant="raised" onClick={ processSubmit }
+        <Button variant="contained" onClick={ processSubmit }
                 className={ `${classes.btnGreen} ${classes.submitButton}` }
                 type="submit">{ t('datasets.public.c.suggestionsForm.apply') }
         </Button>

src/descriptorlists/ui/c/Extras.tsx

@@ -83,7 +83,7 @@ class Extras extends React.Component<IExtras, any> {
             <Input multiline error={ this.state.jsonError && true } placeholder="" onChange={ this.updateJson } value={ this.state.extras[DescriptorListExtra.JSON_MAPPING] }/>
           </FormControl>
 
-          <Button variant="raised" type="button" disabled={ (this.state.jsonError) && true } onClick={ this.saveExtras }>{ t('descriptorlists.public.c.extras.save') }</Button>
+          <Button variant="contained" type="button" disabled={ (this.state.jsonError) && true } onClick={ this.saveExtras }>{ t('descriptorlists.public.c.extras.save') }</Button>
           <Button type="button" onClick={ this.getDefaults }>{ t('descriptorlists.public.c.extras.defaults') }</Button>
         </Paper>
       </div>

src/descriptors/ui/c/DescriptorCard.tsx

@@ -213,7 +213,7 @@ const DescriptorCard = ({ complete = true, compact, descriptor, classes, classNa
         <CardActions className={ classes.action }>
           { selectedProps && selectedProps.selectable && (
             <Button
-              variant="raised"
+              variant="contained"
               onClick={ onClick(true) }
               className={ classes.btnBlue }
               disabled={ selectedProps.disabled }
@@ -224,7 +224,7 @@ const DescriptorCard = ({ complete = true, compact, descriptor, classes, classNa
 
           { selectedProps && !selectedProps.selectable && (
             <Button
-              variant="raised"
+              variant="contained"
               onClick={ onClick(false) }
               disabled={ selectedProps.disabled }
               className={ classes.btnDefault }

src/descriptors/ui/c/DescriptorFilterForm.tsx

@@ -37,7 +37,7 @@ class DescriptorFilterForm extends React.Component<IDescriptorFilterFormProps, a
           <DescriptorFilters/>
         </form>
         <div className="pt-20 pb-20 pl-20">
-          <Button variant="raised" onClick={ handleSubmit } className={ classes.btnGreen }>
+          <Button variant="contained" onClick={ handleSubmit } className={ classes.btnGreen }>
             { t('descriptors.public.c.descriptorFilterForm.apply') }
           </Button>
           <Button onClick={ reset } className={ classes.btnReset }>

src/descriptors/ui/c/VocabularyForm.tsx

@@ -104,7 +104,7 @@ class VocabularyForm extends React.Component<any, any> {
           />
 
           <div>{ error && <strong>{ error }</strong> }</div>
-          <Button variant="raised" type="submit">{ t('common:action.saveChanges') }</Button>
+          <Button variant="contained" type="submit">{ t('common:action.saveChanges') }</Button>
         </form>
       </div>
     );

src/descriptors/ui/dashboard/c/DescriptorForm.tsx

@@ -268,7 +268,7 @@ class DescriptorForm extends React.Component<any, any> {
           ) }
 
           <div>{ error && <strong>{ error }</strong> }</div>
-          <Button variant="raised" type="submit" disabled={ submitting || invalid }>{ t('common:action.saveChanges') }</Button>
+          <Button variant="contained" type="submit" disabled={ submitting || invalid }>{ t('common:action.saveChanges') }</Button>
           { (initialValues && initialValues.id > 0 && !initialValues.published) &&
           <Button disabled={ anyTouched } type="button" onClick={ onPublish }>
             { t(`descriptors.admin.c.form.approvePublish`) }

src/partners/ui/c/PartnerForm.tsx

@@ -96,7 +96,7 @@ class PartnerForm extends React.Component<any, void> {
         <ItemsEditor name="countryCodes" itemLabel="Country code" addItem={ this.onAddString } removeItem={ this.onRemoveString } component={ stringField }/>
 
         <div>{ error && <strong>{ error }</strong> }</div>
-        <Button variant="raised" type="submit" disabled={ submitting || invalid }>{ t('common:action.saveChanges') }</Button>
+        <Button variant="contained" type="submit" disabled={ submitting || invalid }>{ t('common:action.saveChanges') }</Button>
         <PartnerLink to={ initialValues }><Button type="button">{ t('common:action.cancel') }</Button></PartnerLink>
       </form>
     );

src/partners/ui/c/SearchMenu.tsx

@@ -292,7 +292,7 @@ class SearchMenu extends React.Component<ISearchMenuProps, any> {
                     />
                   </ListItem>
                   <div className={ classes.applyReset }>
-                    <Button variant="raised" onClick={ this.apply } className={ classes.greenButton }>
+                    <Button variant="contained" onClick={ this.apply } className={ classes.greenButton }>
                       Apply
                     </Button>
                     <div className={ classes.flexGrow }/>
@@ -351,7 +351,7 @@ class SearchMenu extends React.Component<ISearchMenuProps, any> {
                     ))
                   }
                   <div className={ classes.applyReset }>
-                    <Button variant="raised" onClick={ this.apply } className={ classes.greenButton }>
+                    <Button variant="contained" onClick={ this.apply } className={ classes.greenButton }>
                       Apply
                     </Button>
                     <div className={ classes.flexGrow }/>

src/ui/catalog/dashboard/c/DashboardActionsArea.tsx

@@ -40,15 +40,15 @@ class DashboardActionsArea extends React.Component<IDasboardActionsAreaProps, an
     const { mainButtonTitle, cancelButtonTitle, actions, classes, isEditMode, t } = this.props;
     return (
       <div>
-        <Button variant="raised" className={ isEditMode ? classes.hidden : '' } onClick={ this.onShowClick }> { mainButtonTitle || t('common:action.show') } </Button>
+        <Button variant="contained" className={ isEditMode ? classes.hidden : '' } onClick={ this.onShowClick }> { mainButtonTitle || t('common:action.show') } </Button>
         { actions && actions.map((action, i) => (
           !action.admin ?
-            <Button key={ `${i}-${action.title}` } variant="raised" className={ !isEditMode ? classes.hidden : '' } onClick={ action.action }>{ action.title }</Button>
+            <Button key={ `${i}-${action.title}` } variant="contained" className={ !isEditMode ? classes.hidden : '' } onClick={ action.action }>{ action.title }</Button>
             : <Authorize key={ `${i}-${action.title}` } role="ROLE_ADMINISTRATOR">
-              <Button variant="raised" className={ !isEditMode ? classes.hidden : '' } onClick={ action.action }>{ action.title }</Button>
+              <Button variant="contained" className={ !isEditMode ? classes.hidden : '' } onClick={ action.action }>{ action.title }</Button>
             </Authorize>
         )) }
-        <Button variant="raised" className={ !isEditMode ? classes.hidden : '' } onClick={ this.onShowClick }> { cancelButtonTitle || t('common:action.cancel') } </Button>
+        <Button variant="contained" className={ !isEditMode ? classes.hidden : '' } onClick={ this.onShowClick }> { cancelButtonTitle || t('common:action.cancel') } </Button>
       </div>
     );
   }

src/ui/catalog/dashboard/c/DashboardTableRow.tsx

@@ -76,7 +76,7 @@ class DashboardTableRow extends React.Component<any> {
         <StatusCell t={ t } publishState={ row.state }/>
         <TableCell style={ { fontSize: '1rem' } }>
           <DataLink tab={ tab } row={ row }>
-            <Button variant="raised">{ row.state === PublishState.DRAFT && row._permissions.write ? t('common:action.edit') : t('common:action.view') }</Button>
+            <Button variant="contained">{ row.state === PublishState.DRAFT && row._permissions.write ? t('common:action.edit') : t('common:action.view') }</Button>
           </DataLink>
           { row._permissions.manage && <Permissions clazz={ dataClassName } id={ row.id }/> }
         </TableCell>

src/vocabulary/ui/BrowsePage.tsx

@@ -69,10 +69,10 @@ class BrowsePage extends BrowsePageTemplate<Vocabulary> {
             title={ t('vocabulary.admin.p.browse.title') }
             buttons={
               <div>
-                <Button className={ classes.updateButton } variant="raised" onClick={ this.autoUpdateVocabularies }>
+                <Button className={ classes.updateButton } variant="contained" onClick={ this.autoUpdateVocabularies }>
                   { t('vocabulary.admin.p.browse.update') }
                 </Button>
-                <Button variant="raised" onClick={ createVocabulary }>
+                <Button variant="contained" onClick={ createVocabulary }>
                   { t('vocabulary.admin.p.browse.create') }
                 </Button>
               </div>

src/vocabulary/ui/c/VocabularyForm.tsx

@@ -123,7 +123,7 @@ class VocabularyForm extends React.Component<any, any> {
               <div className="error">{ error }</div>
             ) }
 
-            <Button variant="raised" type="submit" disabled={ submitting || invalid }>
+            <Button variant="contained" type="submit" disabled={ submitting || invalid }>
               { t('common:action.saveChanges') }
             </Button>
             { (initialValues._permissions && initialValues._permissions.delete) &&