import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Button } from '../Button';
import { ContentState } from '../ContentState';
import { SearchField } from '../SearchField';
import { DEFAULT_NOT_SELECTED_PLACEHOLDER, menuOrganizationClassnames, POPOVER_TITLE, } from './constants';
import { MenuOrganizationSkeleton } from './MenuOrganizationSkeleton';
import { NoData } from './NoData';
import { OrganizationButton } from './OrganizationButton';
import { OrganizationList } from './OrganizationList';
import { OrganizationListSkeleton } from './OrganizationListSkeleton';
import { ActionWrapper, OrganizationsWrapper, SearchWrapper, StyledPopover, StyledTypography, } from './styles';
import { useLogic } from './useLogic';
export const MenuOrganization = (props) => {
    const { anchorOrigin = { vertical: 'bottom', horizontal: 'right' }, transformOrigin = { vertical: 'top', horizontal: 'right' }, } = props;
    const { actionButtonProps, hasAction, isLoading, isError, onRetry, isComponentLoading, isShowOrganizationList, searchProps, popoverProps, organizationListProps, organizationButtonProps, isShowSearchField, isMobile, currentOrganization, notSelectedPlaceholder = DEFAULT_NOT_SELECTED_PLACEHOLDER, isOpen, onOpen, } = useLogic(props);
    if (isComponentLoading) {
        return _jsx(MenuOrganizationSkeleton, {});
    }
    return (_jsxs(_Fragment, { children: [currentOrganization ? (_jsx(OrganizationButton, { ...organizationButtonProps, currentOrganization: currentOrganization })) : (notSelectedPlaceholder({ isOpen, onOpen })), _jsxs(StyledPopover, { ...popoverProps, anchorOrigin: anchorOrigin, transformOrigin: transformOrigin, title: POPOVER_TITLE, children: [isShowSearchField && (_jsx(SearchWrapper, { children: _jsx(SearchField, { fullWidth: true, ...searchProps }) })), _jsx(OrganizationsWrapper, { "$isLoading": isLoading, className: menuOrganizationClassnames.root, children: _jsx(ContentState, { isLoading: isLoading, isCustom: isError, customState: {
                                title: (_jsx(StyledTypography, { children: "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435" })),
                                Actions: (_jsx(Button, { variant: "light", color: "grey", onClick: onRetry, children: "\u041F\u043E\u043F\u0440\u043E\u0431\u043E\u0432\u0430\u0442\u044C \u0441\u043D\u043E\u0432\u0430" })),
                                className: menuOrganizationClassnames.errorPlaceholder,
                            }, loadingContent: _jsx(OrganizationListSkeleton, {}), children: isShowOrganizationList ? (_jsx(OrganizationList, { ...organizationListProps })) : (_jsx(NoData, {})) }) }), hasAction && (_jsx(ActionWrapper, { children: _jsx(Button, { fullWidth: true, ...actionButtonProps, size: isMobile ? 'large' : 'medium', children: actionButtonProps.text }) }))] })] }));
};
