Proyectos de Subversion LeadersLinked - Backend

import React from 'react'
import styled from 'styled-components'
import { Pagination } from 'react-bootstrap'

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 = true }) => {

        const currentPage = currentActivePage
        const StyledPagination = isRow ? StyledRowPagination : StyledDefaultPagination
        // const pages = 10;
        const nextPages = []
        const previousPages = []
        const maxPages = 5 > pages ? 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