{"size": 1745, "ext": "js", "max_stars_repo_path": "frontend/components/Pagination/index.js", "max_stars_repo_name": "Dinesh160290/memcode", "max_stars_repo_stars_event_min_datetime": "2020-04-14T08:35:54.000Z", "max_stars_repo_stars_event_max_datetime": "2020-04-14T08:35:54.000Z", "max_issues_repo_path": "frontend/components/Pagination/index.js", "max_issues_repo_name": "pavikishoor/memcode", "max_issues_repo_issues_event_min_datetime": "2020-03-25T17:39:25.000Z", "max_issues_repo_issues_event_max_datetime": "2020-03-27T04:09:18.000Z", "max_forks_repo_path": "frontend/components/Pagination/index.js", "max_forks_repo_name": "pavikishoor/memcode", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": 9, "max_forks_count": null, "avg_line_length": 24.2361111111, "max_line_length": 96, "alphanum_fraction": 0.605730659}
import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';

import css from './index.css';

class Pagination extends React.Component {
  static propTypes = {
    amountOfPages: PropTypes.number.isRequired,
    currentPage: PropTypes.number.isRequired,

    getUrlForNewPageNumber: PropTypes.func.isRequired,
    className: PropTypes.string
  }

  static defaultProps = {
    className: ''
  }

  pagesToDisplay = (currentPage, amountOfPages) =>
    [
      1,
      currentPage - 2,
      currentPage - 1,

      currentPage,

      currentPage + 1,
      currentPage + 2,
      amountOfPages
    ]
      // filter out negatives and exceeding max page amount
      .filter((pageN) =>
        pageN <= amountOfPages &&
        pageN >= 1
      )
      // uniq
      .filter((pageN, index, array) => array.indexOf(pageN) === index)

  renderPage = (pageN) =>
    <li key={pageN} className={pageN === this.props.currentPage ? 'page-n -current' : 'page-n'}>
      <Link
        to={this.props.getUrlForNewPageNumber(pageN)}
      >
        {pageN}
      </Link>
    </li>

  render = () => {
    const currentPage = this.props.currentPage;

    const pageLinks = [];
    let prevN = 0;

    // [1,   10, 11, 12,   100]
    this.pagesToDisplay(currentPage, this.props.amountOfPages).forEach((pageN) => {
      const ifPageIsConsecutive = prevN + 1 === pageN;
      if (!ifPageIsConsecutive) {
        pageLinks.push(<li className="epsilon" key={`epsilon before-${pageN}`}>...</li>);
      }
      pageLinks.push(this.renderPage(pageN));
      prevN = pageN;
    });

    return <ul className={`pagination ${css.ul} ${this.props.className}`}>
      {pageLinks}
    </ul>;
  }
}

export default Pagination;
