import * as tslib_1 from "tslib";
import * as React from 'react';
import { ErrorBoundary } from '@skava/react-error-boundary';
import { observer } from 'xmobx/mobx-react';
import { ProductItem } from '@skava/ui-presets/dist/abstractions/ShoppingList/Item';
import { StyledProductListWrapper, ShoppingList, Header, } from '@skava/ui-presets/dist/presets/ShoppingList';
import { ProductList } from '@skava/ui-presets/dist/presets/ShoppingList/Item';
import { Pagination } from '@skava/packages/features/Pagination';
import { shoppingListContainer } from '../state/shoppingList/container';
import { StyledSearch, StyledOuterWrapper, ListsWrapper } from './styled';
import { wording, headerAttributes, searchAdditionalProps } from './fixture';
let ListsManagementSection = class ListsManagementSection extends React.Component {
    constructor() {
        super(...arguments);
        this.renderExpandableView = (props, state) => {
            const { currentExpandedListProducts, shouldShowPlaceHolder } = shoppingListContainer;
            const moveToListDropDown = shoppingListContainer.dropdownShoppingList;
            const { isConfirming, isExpanded } = state;
            const { noItemsInListText } = wording;
            return shouldShowPlaceHolder && isExpanded ? (React.createElement(ErrorBoundary, null,
                React.createElement(ProductItem, null))) : (React.createElement(StyledProductListWrapper, { isConfirming: isConfirming },
                React.createElement(ErrorBoundary, null,
                    React.createElement(ProductList, { emptyContent: noItemsInListText, productList: currentExpandedListProducts, onRemoveItem: shoppingListContainer.handleRemoveItem, onAddToCart: shoppingListContainer.handleAddToCart, shoppingListDropDownList: moveToListDropDown, onFormSubmit: shoppingListContainer.handleCreateList }))));
        };
    }
    componentDidMount() {
        shoppingListContainer.makeGetAllList();
    }
    componentWillMount() {
        shoppingListContainer.makeGetAllList();
        shoppingListContainer.updatePaginationLists();
    }
    render() {
        const { shoppingListsCount, paginatedLists } = shoppingListContainer;
        const { noListsAvailableText } = wording;
        const statusContent = shoppingListsCount === 0 ? noListsAvailableText : '';
        return (React.createElement(StyledOuterWrapper, null,
            React.createElement(StyledSearch, { searchAdditionalProps: searchAdditionalProps, onSearch: shoppingListContainer.handleSearchList }),
            React.createElement(Header, Object.assign({}, headerAttributes, { statusContent: statusContent, onCreateListSubmit: shoppingListContainer.handleCreateList })),
            shoppingListsCount > 0 ? (React.createElement(ListsWrapper, null,
                React.createElement(ShoppingList, { shoppingList: paginatedLists, renderExpandableView: this.renderExpandableView, onRemoveList: shoppingListContainer.handleRemoveList, onShowDetails: shoppingListContainer.handleShowDetails, onEditListName: shoppingListContainer.handleEditDetails, onToggleStatus: shoppingListContainer.handleChangeAccessType }))) : (''),
            shoppingListsCount > 0 ? (React.createElement(Pagination, { state: shoppingListContainer, dropdownview: "top", refetch: shoppingListContainer.refetch, paginationLimit: shoppingListContainer.length, defaultIndex: shoppingListContainer.currentPage })) : ('')));
    }
};
ListsManagementSection = tslib_1.__decorate([
    observer
], ListsManagementSection);
export { ListsManagementSection };
export default ListsManagementSection;
//# sourceMappingURL=ListsManagementSection.js.map