Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 15501 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

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

const StyledPagination = styled(Pagination)`
  display: inline-flex;
  flex-direction: ${props => props.isRow ? 'row' : 'column'} !important;
`

const PaginationComponent = ({ pages = 1, currentActivePage = 1, onChangePage, isRow = true }) => {
        const currentPage = currentActivePage
        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()

        if (pages <= 1) return null

        return (
                <StyledPagination isRow={isRow}>
                        <Pagination.Prev
                                disabled={currentPage - 1 <= 0}
                                onClick={previousPageHandler}
                        >
                                Anterior
                        </Pagination.Prev>
                        {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
                                disabled={currentPage + 1 > pages}
                                onClick={nextPageHandler}
                        >
                                Siguiente
                        </Pagination.Next>
                </StyledPagination>
        )
}

export default PaginationComponent