52 lines
1.5 KiB
TypeScript
Executable File
52 lines
1.5 KiB
TypeScript
Executable File
import {IconButton} from '../../ui/buttons/icon-button';
|
|
import {FileDownloadIcon} from '../../icons/material/FileDownload';
|
|
import React, {Fragment, useState} from 'react';
|
|
import {DialogTrigger} from '../../ui/overlays/dialog/dialog-trigger';
|
|
import {ExportCsvPayload, useExportCsv} from '../requests/use-export-csv';
|
|
import {downloadFileFromUrl} from '../../uploads/utils/download-file-from-url';
|
|
import {CsvExportInfoDialog} from './csv-export-info-dialog';
|
|
|
|
interface DataTableExportCsvButtonProps {
|
|
endpoint: string;
|
|
payload?: ExportCsvPayload;
|
|
}
|
|
export function DataTableExportCsvButton({
|
|
endpoint,
|
|
payload,
|
|
}: DataTableExportCsvButtonProps) {
|
|
const [dialogIsOpen, setDialogIsOpen] = useState(false);
|
|
const exportCsv = useExportCsv(endpoint);
|
|
|
|
return (
|
|
<Fragment>
|
|
<IconButton
|
|
variant="outline"
|
|
color="primary"
|
|
size="sm"
|
|
className="flex-shrink-0"
|
|
disabled={exportCsv.isPending}
|
|
onClick={() => {
|
|
exportCsv.mutate(payload, {
|
|
onSuccess: response => {
|
|
if (response.downloadPath) {
|
|
downloadFileFromUrl(response.downloadPath);
|
|
} else {
|
|
setDialogIsOpen(true);
|
|
}
|
|
},
|
|
});
|
|
}}
|
|
>
|
|
<FileDownloadIcon />
|
|
</IconButton>
|
|
<DialogTrigger
|
|
type="modal"
|
|
isOpen={dialogIsOpen}
|
|
onOpenChange={setDialogIsOpen}
|
|
>
|
|
<CsvExportInfoDialog />
|
|
</DialogTrigger>
|
|
</Fragment>
|
|
);
|
|
}
|