argo-cd

1
import {Popup} from 'argo-ui';
2
import * as React from 'react';
3
import {ProgressBar} from './progress-bar';
4

5
const Title = ({title}: {title: string}) => {
6
    return <React.Fragment>{title}</React.Fragment>;
7
};
8

9
const Footer = ({percentage, onClose}: {percentage: number; onClose: () => void}) => {
10
    return (
11
        <div style={{textAlign: 'right'}}>
12
            {percentage >= 100 && (
13
                <button className='argo-button argo-button--base-o' onClick={() => onClose()}>
14
                    Close
15
                </button>
16
            )}
17
        </div>
18
    );
19
};
20

21
export const ProgressPopup = ({title, percentage, onClose}: {title: string; percentage: number; onClose: () => void}) => {
22
    return (
23
        <Popup title={<Title title={title} />} footer={<Footer percentage={percentage} onClose={onClose} />}>
24
            <ProgressBar percentage={percentage} />
25
        </Popup>
26
    );
27
};
28