create and use Button component (#3087)

2 files changed, 14 insertions, 21 deletions

diff --git a/server/sonar-web/src/main/js/apps/background-tasks/components/WorkersForm.tsx b/server/sonar-web/src/main/js/apps/background-tasks/components/WorkersForm.tsx
index 91c5b7d3747..52d5eee1094 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/components/WorkersForm.tsx
+++ b/server/sonar-web/src/main/js/apps/background-tasks/components/WorkersForm.tsx
@@ -22,6 +22,7 @@ import { times } from 'lodash';
 import { setWorkerCount } from '../../../api/ce';
 import Modal from '../../../components/controls/Modal';
 import Select from '../../../components/controls/Select';
+import { SubmitButton, ResetButtonLink } from '../../../components/ui/buttons';
 import { translate } from '../../../helpers/l10n';
 
 const MAX_WORKERS = 10;
@@ -55,7 +56,9 @@ export default class WorkersForm extends React.PureComponent<Props, State> {
     this.mounted = false;
   }
 
-  handleClose = () => this.props.onClose();
+  handleClose = () => {
+    this.props.onClose();
+  };
 
   handleWorkerCountChange = (option: { value: number }) =>
     this.setState({ newWorkerCount: option.value });
@@ -105,12 +108,8 @@ export default class WorkersForm extends React.PureComponent<Props, State> {
           <footer className="modal-foot">
             <div>
               {this.state.submitting && <i className="spinner spacer-right" />}
-              <button disabled={this.state.submitting} type="submit">
-                {translate('save')}
-              </button>
-              <button type="reset" className="button-link" onClick={this.handleClose}>
-                {translate('cancel')}
-              </button>
+              <SubmitButton disabled={this.state.submitting}>{translate('save')}</SubmitButton>
+              <ResetButtonLink onClick={this.handleClose}>{translate('cancel')}</ResetButtonLink>
             </div>
           </footer>
         </form>
diff --git a/server/sonar-web/src/main/js/apps/background-tasks/components/__tests__/__snapshots__/WorkersForm-test.tsx.snap b/server/sonar-web/src/main/js/apps/background-tasks/components/__tests__/__snapshots__/WorkersForm-test.tsx.snap
index 4b9dfd60686..0b1320c6cb2 100644
--- a/server/sonar-web/src/main/js/apps/background-tasks/components/__tests__/__snapshots__/WorkersForm-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/background-tasks/components/__tests__/__snapshots__/WorkersForm-test.tsx.snap
@@ -79,19 +79,16 @@ exports[`changes select 1`] = `
       className="modal-foot"
     >
       <div>
-        <button
+        <SubmitButton
           disabled={false}
-          type="submit"
         >
           save
-        </button>
-        <button
-          className="button-link"
+        </SubmitButton>
+        <ResetButtonLink
           onClick={[Function]}
-          type="reset"
         >
           cancel
-        </button>
+        </ResetButtonLink>
       </div>
     </footer>
   </form>
@@ -177,19 +174,16 @@ exports[`changes select 2`] = `
       className="modal-foot"
     >
       <div>
-        <button
+        <SubmitButton
           disabled={false}
-          type="submit"
         >
           save
-        </button>
-        <button
-          className="button-link"
+        </SubmitButton>
+        <ResetButtonLink
           onClick={[Function]}
-          type="reset"
         >
           cancel
-        </button>
+        </ResetButtonLink>
       </div>
     </footer>
   </form>