import Link from "next/link" ; import { FunctionComponent } from "react" ; import { PagedCollection } from "types/Collection" ; interface Props { collection : PagedCollection < any > ; } const Pagination = ( { collection } ) => { const view = collection && collection [ 'hydra:view' ] ; if ( ! view ) return ; const { 'hydra:first' : first , 'hydra:previous' : previous , 'hydra:next' : next , 'hydra:last' : last } = view ; return ( < nav aria - label = "Page navigation" > < Link href = { first ? first : '#' } > < a className = { `btn btn-primary${ previous ? '' : ' disabled' }` } > < span aria - hidden = "true" > & lArr ; < /span> First < /a> < /Link> < Link href = { previous ? previous : '#' } > < a className = { `btn btn-primary${ previous ? '' : ' disabled' }` } > < span aria - hidden = "true" > & larr ; < /span> Previous < /a> < /Link> < Link href = { next ? next : '#' } > < a className = { `btn btn-primary${ next ? '' : ' disabled' }` } > Next < span aria - hidden = "true" > & rarr ; < /span> < /a> < /Link> < Link href = { last ? last : '#' } > < a className = { `btn btn-primary${ next ? '' : ' disabled' }` } > Last < span aria - hidden = "true" > & rArr ; < /span> < /a> < /Link> < /nav>); } ; export default Pagination ;