2021-07-06 11:23:13 +00:00
|
|
|
import React from 'react';
|
|
|
|
import { Button } from 'react-bootstrap';
|
2021-07-14 07:39:40 +00:00
|
|
|
import { ExportStats } from 'services/exportService';
|
2021-07-06 11:23:13 +00:00
|
|
|
import { formatDateTime } from 'utils/file';
|
|
|
|
import constants from 'utils/strings/constants';
|
|
|
|
import { Label, Row, Value } from './Container';
|
|
|
|
import { ComfySpan } from './ExportInProgress';
|
|
|
|
|
2021-07-07 07:44:52 +00:00
|
|
|
interface Props {
|
2021-08-13 02:38:38 +00:00
|
|
|
show: boolean;
|
|
|
|
onHide: () => void;
|
|
|
|
exportFolder: string;
|
|
|
|
exportSize: string;
|
|
|
|
lastExportTime: number;
|
|
|
|
exportStats: ExportStats;
|
2021-07-07 07:44:52 +00:00
|
|
|
updateExportFolder: (newFolder: string) => void;
|
2021-07-12 09:15:08 +00:00
|
|
|
exportFiles: () => void;
|
|
|
|
retryFailed: () => void;
|
2021-07-07 07:44:52 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export default function ExportFinished(props: Props) {
|
2021-07-14 07:39:40 +00:00
|
|
|
const totalFiles = props.exportStats.failed + props.exportStats.success;
|
2021-07-06 11:23:13 +00:00
|
|
|
return (
|
2021-07-07 09:20:59 +00:00
|
|
|
<>
|
2021-08-13 02:38:38 +00:00
|
|
|
<div
|
|
|
|
style={{
|
|
|
|
borderBottom: '1px solid #444',
|
|
|
|
marginBottom: '20px',
|
|
|
|
padding: '0 5%',
|
|
|
|
}}>
|
2021-07-06 11:23:13 +00:00
|
|
|
<Row>
|
|
|
|
<Label width="40%">{constants.LAST_EXPORT_TIME}</Label>
|
2021-08-13 02:38:38 +00:00
|
|
|
<Value width="60%">
|
|
|
|
{formatDateTime(props.lastExportTime)}
|
|
|
|
</Value>
|
2021-07-06 11:23:13 +00:00
|
|
|
</Row>
|
|
|
|
<Row>
|
2021-08-13 02:38:38 +00:00
|
|
|
<Label width="60%">
|
|
|
|
{constants.SUCCESSFULLY_EXPORTED_FILES}
|
|
|
|
</Label>
|
2021-07-06 11:23:13 +00:00
|
|
|
<Value width="35%">
|
2021-08-13 02:38:38 +00:00
|
|
|
<ComfySpan>
|
|
|
|
{props.exportStats.success} / {totalFiles}
|
|
|
|
</ComfySpan>
|
2021-07-06 11:23:13 +00:00
|
|
|
</Value>
|
2021-08-13 02:38:38 +00:00
|
|
|
</Row>
|
|
|
|
{props.exportStats.failed > 0 && (
|
|
|
|
<Row>
|
|
|
|
<Label width="60%">
|
|
|
|
{constants.FAILED_EXPORTED_FILES}
|
|
|
|
</Label>
|
|
|
|
<Value width="35%">
|
|
|
|
<ComfySpan>
|
|
|
|
{props.exportStats.failed} / {totalFiles}
|
|
|
|
</ComfySpan>
|
|
|
|
</Value>
|
|
|
|
</Row>
|
|
|
|
)}
|
2021-07-06 11:23:13 +00:00
|
|
|
</div>
|
2021-08-13 02:38:38 +00:00
|
|
|
<div
|
|
|
|
style={{
|
|
|
|
width: '100%',
|
|
|
|
display: 'flex',
|
|
|
|
justifyContent: 'space-around',
|
|
|
|
}}>
|
|
|
|
<Button
|
|
|
|
block
|
|
|
|
variant={'outline-secondary'}
|
|
|
|
onClick={props.onHide}>
|
|
|
|
{constants.CLOSE}
|
|
|
|
</Button>
|
2021-07-06 11:23:13 +00:00
|
|
|
<div style={{ width: '30px' }} />
|
2021-08-13 02:38:38 +00:00
|
|
|
{props.exportStats.failed !== 0 ? (
|
|
|
|
<Button
|
|
|
|
block
|
|
|
|
variant={'outline-danger'}
|
|
|
|
onClick={props.retryFailed}>
|
|
|
|
{constants.RETRY_EXPORT_}
|
|
|
|
</Button>
|
|
|
|
) : (
|
|
|
|
<Button
|
|
|
|
block
|
|
|
|
variant={'outline-success'}
|
|
|
|
onClick={props.exportFiles}>
|
|
|
|
{constants.EXPORT_AGAIN}
|
|
|
|
</Button>
|
|
|
|
)}
|
2021-07-06 11:23:13 +00:00
|
|
|
</div>
|
2021-07-07 09:20:59 +00:00
|
|
|
</>
|
2021-07-06 11:23:13 +00:00
|
|
|
);
|
|
|
|
}
|