🚧 added pages to pagination
Co-authored-by: Sindre Kjelsrud <kjelsrudsindre@gmail.com>
This commit is contained in:
parent
4aede77061
commit
898590ac55
2 changed files with 6 additions and 2 deletions
|
@ -33,7 +33,11 @@ function App() {
|
||||||
<q.h2>Pages</q.h2>
|
<q.h2>Pages</q.h2>
|
||||||
<q.p>{calculatePages(totalPages)}</q.p>
|
<q.p>{calculatePages(totalPages)}</q.p>
|
||||||
<q.div className="flex gap-4">
|
<q.div className="flex gap-4">
|
||||||
<PaginationButton pageNumber={currentPage} />
|
{Array.from(Array(calculatePages(totalPages)).keys()).map(
|
||||||
|
(page) => (
|
||||||
|
<PaginationButton pageNumber={page + 1} />
|
||||||
|
)
|
||||||
|
)}
|
||||||
</q.div>
|
</q.div>
|
||||||
</q.div>
|
</q.div>
|
||||||
{!loading && movies ? (
|
{!loading && movies ? (
|
||||||
|
|
|
@ -6,7 +6,7 @@ interface PaginationButtonProps {
|
||||||
|
|
||||||
const PaginationButton: React.FC<PaginationButtonProps> = ({ pageNumber }) => {
|
const PaginationButton: React.FC<PaginationButtonProps> = ({ pageNumber }) => {
|
||||||
return (
|
return (
|
||||||
<q.div className="">
|
<q.div className="bg-red-400 p-2 rounded-md">
|
||||||
<p>{pageNumber}</p>
|
<p>{pageNumber}</p>
|
||||||
</q.div>
|
</q.div>
|
||||||
)
|
)
|
||||||
|
|
Reference in a new issue