import React from 'react';
import PropTypes from 'prop-types';

import {CommonListLayout} from './common/CommonListLayout';
import {PurePagination} from './PurePagination';
import {CounterText} from './CounterText';

export class PureListLayout extends React.Component {
    static propTypes = {
        hasStoreCounterText: PropTypes.bool,
        storeCounterText: PropTypes.string,
        paginationProps: PropTypes.shape(PurePagination.propTypes),
        paginationComponent: PropTypes.func,
        counter: PropTypes.number
    };

    static defaultProps = {
        hasStoreCounterText: true,
        storeCounterText: CounterText.defaultProps.template,
        paginationProps: PurePagination.defaultProps,
        paginationComponent: PurePagination,
        counter: 0
    };

    static VIEW_MODE_DETAILS = CommonListLayout.VIEW_MODE_DETAILS;
    static VIEW_MODE_FULL = CommonListLayout.VIEW_MODE_FULL;

    renderCounterText = () => {
        const {hasStoreCounterText, counter, storeCounterText} = this.props;

        if (!hasStoreCounterText) {
            return null;
        }

        return <CounterText counter={counter} template={storeCounterText} />;
    };

    renderPagination = (showPageSizeSelector = true) => {
        const {paginationProps, paginationComponent: PaginationComponent} = this.props;

        return (
            <PaginationComponent showPageSizeSelector={showPageSizeSelector} {...paginationProps} />
        );
    };

    render() {
        return (
            <CommonListLayout
                renderCounterText={this.renderCounterText}
                renderPagination={this.renderPagination}
                {...this.props}
            />
        );
    }
}
