import React from 'react';
import Table from 'antd/es/table';
import RcPagination from 'rc-pagination';
import classnames from 'classnames';

import { ConfigConsumer } from '../config-provider';
import Icons from '../icons';
import './index.less';

const { CaretLeftIcon, CaretRightIcon } = Icons;

export default props => {
  // const itemRender = (current, type, originalElement) => {
  //   if (type === 'next') {
  //     return <a className={`${paginationProps.prefixCls}-item-link`}><CaretRightIcon /></a>
  //   }
  //   if (type === 'prev') {
  //     return <a className={`${paginationProps.prefixCls}-item-link`}><CaretLeftIcon /></a>
  //   }
  //   return originalElement;
  // };
  return (
    <ConfigConsumer>
      {({ getPrefixCls, paginationIconsProps, direction, antPrefix }) => {
        const {
          prefixCls: customizePrefixCls,
          pagination,
          dataSource,
          ...restProps
        } = props;
        const prefixCls = getPrefixCls('table', customizePrefixCls);
        // ========================== Pagination ==========================
        let topPaginationNode = null;
        let bottomPaginationNode = null;
        if (pagination !== false) {
          let paginationProps = {};
          const {
            prefixCls: paginationCustomizePrefixCls,
            className: paginationClassName,
            ...restPaginationProps
          } = pagination;
          const paginationPrefixCls = getPrefixCls(
            'pagination',
            paginationCustomizePrefixCls,
          );
          paginationProps = {
            ...restPaginationProps,
            ...paginationIconsProps(paginationPrefixCls, direction),
          };
          const renderPagination = (position = 'right') => (
            <RcPagination
              prefixCls={paginationPrefixCls}
              className={classnames(
                `${prefixCls}-pagination ${prefixCls}-pagination-${position}`,
                paginationClassName,
              )}
              {...paginationProps}
            />
          );
          if (
            paginationProps.position !== null &&
            Array.isArray(paginationProps.position)
          ) {
            const topPos = paginationProps.position.find(
              p => p.indexOf('top') !== -1,
            );
            const bottomPos = paginationProps.position.find(
              p => p.indexOf('bottom') !== -1,
            );
            if (!topPos && !bottomPos) {
              bottomPaginationNode = renderPagination();
            } else {
              if (topPos) {
                topPaginationNode = renderPagination(
                  topPos.toLowerCase().replace('top', ''),
                );
              }
              if (bottomPos) {
                bottomPaginationNode = renderPagination(
                  bottomPos.toLowerCase().replace('bottom', ''),
                );
              }
            }
          } else {
            bottomPaginationNode = renderPagination();
          }
        }

        return (
          <div className={`${prefixCls}-customize-wrapper`}>
            {topPaginationNode}
            <Table
              prefixCls={prefixCls}
              pagination={false}
              dataSource={dataSource}
              {...restProps}
            />
            {dataSource && dataSource.length > 0 && bottomPaginationNode}
          </div>
        );
      }}
    </ConfigConsumer>
  );
};