import { Dialog } from '../Dialog/Dialog';

export function LoadingSpinner() {
  return <span className="import-spinner" aria-hidden="true"><i/><i/><i/><i/></span>;
}

export function OperationProgress({ label }: { label: string }) {
  return <div className="import-progress" role="status" aria-live="polite">
    <LoadingSpinner/>
    <strong>{label}</strong>
  </div>;
}

export function OperationProgressDialog({ label }: { label?: string }) {
  if (!label) return null;
  return <Dialog title="Processing" dismissible={false} onClose={() => undefined}>
    <OperationProgress label={label}/>
  </Dialog>;
}