Merge branch '14489-context-menus-dropdowns-persists-after-using-back-option'
[arvados-workbench2.git] / src / components / progress-button / progress-button.tsx
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import * as React from 'react';
6 import Button, { ButtonProps } from '@material-ui/core/Button';
7 import { CircularProgress, withStyles } from '@material-ui/core';
8 import { CircularProgressProps } from '@material-ui/core/CircularProgress';
9
10 interface ProgressButtonProps extends ButtonProps {
11     loading?: boolean;
12     progressProps?: CircularProgressProps;
13 }
14
15 export const ProgressButton = ({ loading, progressProps, children, disabled, ...props }: ProgressButtonProps) =>
16     <Button {...props} disabled={disabled || loading}>
17         {children}
18         {loading && <Progress {...progressProps} size={getProgressSize(props.size)} />}
19     </Button>;
20
21 const Progress = withStyles({
22     root: {
23         position: 'absolute',
24     },
25 })(CircularProgress);
26
27 const getProgressSize = (size?: 'small' | 'medium' | 'large') => {
28     switch (size) {
29         case 'small':
30             return 16;
31         case 'large':
32             return 24;
33         default:
34             return 20;
35     }
36 };