Proyectos de Subversion LeadersLinked - Antes de SPA

import React from 'react'
import Pagination from 'react-bootstrap/Pagination'
import styled from 'styled-components'

const StyledDefaultPagination = styled(Pagination)`
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: inherit !important;
  position: inherit !important;
  transform: inherit !important;
`
const StyledRowPagination = styled(Pagination)`
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: initial !important;
  position: inherit !important;
  transform: inherit !important;
`

const PaginationComponent = ({
  pages = 1,
  currentActivePage = 1,
  onChangePage,
  isRow,
}) => {
  const currentPage = currentActivePage
  const StyledPagination = isRow ? StyledRowPagination : StyledDefaultPagination
  const nextPages = []
  const previousPages = []
  const maxPages = pages < 5 ? pages : 5

  const generateCurrentPages = () => {
    let isPreviousOrNext = false
    let pagesCont = 1
    let nextPage = currentPage + 1
    let previousPage = currentPage - 1
    do {
      if (isPreviousOrNext) {
        // nextPage
        if (nextPage <= pages) {
          nextPages.push(nextPage)
          nextPage++
          pagesCont++
        }
        isPreviousOrNext = !isPreviousOrNext
      } else {
        // previousPage
        if (previousPage > 0) {
          previousPages.unshift(previousPage)
          previousPage--
          pagesCont++
        }
        isPreviousOrNext = !isPreviousOrNext
      }
    } while (pagesCont < maxPages)
  }

  const previousPageHandler = () => {
    onChangePage(currentPage - 1)
  }
  const nextPageHandler = () => {
    onChangePage(currentPage + 1)
  }

  const onClickHandler = (pageToNavigate) => {
    onChangePage(pageToNavigate)
  }

  generateCurrentPages()

  return (
    <>
      {pages > 1 && (
        <StyledPagination>
          <Pagination.Prev
            disabled={currentPage - 1 <= 0}
            onClick={previousPageHandler}
          />
          {previousPages.map((previousPage) => (
            <Pagination.Item
              key={previousPage}
              onClick={() => onClickHandler(previousPage)}
            >
              {previousPage}
            </Pagination.Item>
          ))}
          <Pagination.Item active>{currentPage}</Pagination.Item>
          {nextPages.map((nextPage) => (
            <Pagination.Item
              key={nextPage}
              onClick={() => onClickHandler(nextPage)}
            >
              {nextPage}
            </Pagination.Item>
          ))}
          <Pagination.Next
            onClick={nextPageHandler}
            disabled={currentPage + 1 > pages}
          />
        </StyledPagination>
      )}
    </>
  )
}

export default PaginationComponent