import React from 'react';
import { Select } from '../../components/Select';
import { useAdaptable } from '../AdaptableContext';
import { SELECT_REPORT_STRING } from '../../Utilities/Constants/GeneralConstants';
import { Flex } from '../../components/Flex';
export const ReportNameSelector = (props) => {
    const { reportName, onReportNameSelected, size = 'normal' } = props;
    const adaptable = useAdaptable();
    const exportApi = adaptable.api.exportApi;
    const allReportNames = exportApi.internalApi.getAllAvailableReportNames();
    const reportItems = allReportNames.map((report) => {
        return {
            label: report,
            value: report,
        };
    });
    const elementType = props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
    return (React.createElement(Flex, { "data-name": "report-name-selector", className: "twa:min-w-[160px] twa:flex-1" },
        React.createElement(Select, { "aria-label": SELECT_REPORT_STRING, size: size, "data-name": "report-name-selector", placeholder: SELECT_REPORT_STRING, disabled: !allReportNames.length, className: `ab-${elementType}__Export__report-select twa:w-full`, options: reportItems, onChange: (report) => onReportNameSelected(report), value: reportName, isClearable: true })));
};
