import ComponentLoader from "../ComponentLoader/ComponentLoader";
import ErrorMessage from "../ErrorMessage/ErrorMessage";
import FilterViewer from "../Filters/FilterViewer";
import Pagination from "../Pagination/Pagination";
import ListBody from "./ListBody";
import React from "react";
import { DragDropContext } from "react-beautiful-dnd";
const List = (props) => {
    const getListbody = () => {
        if (props.isLoading) {
            return React.createElement(ComponentLoader, null);
        }
        if (props.error) {
            return (React.createElement("div", { className: "p-6" },
                React.createElement(ErrorMessage, { message: props.error, onRefreshClick: props.onRefreshClick })));
        }
        if (props.data.length === 0) {
            return (React.createElement("div", { className: "p-6" },
                React.createElement(ErrorMessage, { message: props.noItemsMessage
                        ? props.noItemsMessage
                        : `No ${props.singularLabel.toLocaleLowerCase()}`, onRefreshClick: props.onRefreshClick })));
        }
        return (React.createElement(ListBody, { id: `${props.id}-body`, data: props.data, fields: props.fields, actionButtons: props.actionButtons, enableDragAndDrop: props.enableDragAndDrop, dragAndDropScope: `${props.id}-dnd`, dragDropIdField: props.dragDropIdField, dragDropIndexField: props.dragDropIndexField, listDetailOptions: props.listDetailOptions }));
    };
    return (React.createElement("div", { "data-testid": "list-container" },
        React.createElement("div", { className: "mt-6" },
            React.createElement("div", { className: "bg-white pr-6 pl-6" },
                React.createElement(FilterViewer, { id: `${props.id}-filter`, showFilterModal: props.showFilterModal || false, onFilterChanged: props.onFilterChanged || undefined, isModalLoading: props.isFilterLoading || false, filterError: props.filterError, onFilterRefreshClick: props.onFilterRefreshClick, filters: props.filters || [], onFilterModalClose: () => {
                        var _a;
                        (_a = props.onFilterModalClose) === null || _a === void 0 ? void 0 : _a.call(props);
                    }, onFilterModalOpen: () => {
                        var _a;
                        (_a = props.onFilterModalOpen) === null || _a === void 0 ? void 0 : _a.call(props);
                    }, singularLabel: props.singularLabel, pluralLabel: props.pluralLabel, onAdvancedFiltersToggle: props.onAdvancedFiltersToggle })),
            React.createElement("div", { className: "" },
                React.createElement(DragDropContext, { onDragEnd: (result) => {
                        var _a;
                        if (((_a = result.destination) === null || _a === void 0 ? void 0 : _a.index) && props.onDragDrop) {
                            props.onDragDrop(result.draggableId, result.destination.index);
                        }
                    } }, getListbody()),
                !props.disablePagination && (React.createElement("div", { className: "mt-5 -mb-6" },
                    React.createElement(Pagination, { singularLabel: props.singularLabel, pluralLabel: props.pluralLabel, currentPageNumber: props.currentPageNumber, totalItemsCount: props.totalItemsCount, hasMore: props.hasMore, itemsOnPage: props.itemsOnPage, onNavigateToPage: props.onNavigateToPage, isLoading: props.isLoading, isError: Boolean(props.error), dataTestId: "list-pagination" })))))));
};
export default List;
//# sourceMappingURL=List.js.map