import React from 'react';
import DropdownButton from '../../components/DropdownButton';
import { Icon } from '../../components/icons';
import { useAdaptable } from '../AdaptableContext';
import { ButtonExport } from '../Components/Buttons/ButtonExport';
import clsx from 'clsx';
export const ExportDestinationPicker = ({ reportName, reportFormat, viewType, }) => {
    const adaptable = useAdaptable();
    const exportApi = adaptable.api.exportApi;
    const handleExport = (destination) => {
        exportApi.exportReport(reportName, reportFormat, destination);
    };
    const supportedDestinations = exportApi.getSupportedExportDestinations(reportFormat);
    if (supportedDestinations.length === 0 || supportedDestinations.length === 1) {
        return (React.createElement(ButtonExport, { className: clsx(viewType !== 'StatusBar' ? '' : undefined, ''), onClick: () => handleExport(supportedDestinations[0]), tooltip: "Export Report", disabled: reportName == undefined || reportFormat == undefined }));
    }
    const destinationItems = supportedDestinations.map((destination) => ({
        label: destination,
        onClick: () => handleExport(destination),
    }));
    return (React.createElement(DropdownButton, { "data-name": "report-export-selector", disabled: reportName == undefined || reportFormat == undefined, columns: ['label'], tooltip: "Export Report", variant: "text", items: destinationItems },
        React.createElement(Icon, { name: "export" })));
};
