37 lines
758 B
TypeScript
37 lines
758 B
TypeScript
import { Button, Flex } from "@chakra-ui/react"
|
|
|
|
type PaginationFooterProps = {
|
|
hasNextPage?: boolean
|
|
hasPreviousPage?: boolean
|
|
onChangePage: (newPage: number) => void
|
|
page: number
|
|
}
|
|
|
|
export function PaginationFooter({
|
|
hasNextPage,
|
|
hasPreviousPage,
|
|
onChangePage,
|
|
page,
|
|
}: PaginationFooterProps) {
|
|
return (
|
|
<Flex
|
|
gap={4}
|
|
alignItems="center"
|
|
mt={4}
|
|
direction="row"
|
|
justifyContent="flex-end"
|
|
>
|
|
<Button
|
|
onClick={() => onChangePage(page - 1)}
|
|
isDisabled={!hasPreviousPage || page <= 1}
|
|
>
|
|
Previous
|
|
</Button>
|
|
<span>Page {page}</span>
|
|
<Button isDisabled={!hasNextPage} onClick={() => onChangePage(page + 1)}>
|
|
Next
|
|
</Button>
|
|
</Flex>
|
|
)
|
|
}
|