fix href pagination
All checks were successful
deploy / deploy (push) Successful in 59s

This commit is contained in:
Lee 2023-11-08 12:06:52 +00:00
parent 662999f65b
commit 3341f07136
2 changed files with 15 additions and 16 deletions

@ -10,7 +10,6 @@ const nextConfig = {
swcMinify: true, swcMinify: true,
experimental: { experimental: {
webpackBuildWorker: true, webpackBuildWorker: true,
optimizeCss: true,
optimizePackageImports: [ optimizePackageImports: [
"react", "react",
"react-dom", "react-dom",

@ -31,13 +31,13 @@ export default function Pagination(props: PaginationProps) {
{currentPage > 1 && ( {currentPage > 1 && (
<li className="rounded-md bg-neutral-700 hover:opacity-80"> <li className="rounded-md bg-neutral-700 hover:opacity-80">
{useHref ? ( {useHref ? (
<Link href={`?page=${currentPage - 1}`}> <Link href={`${currentPage - 1}`}>
<a <p
className="px-3 py-1" className="px-3 py-1"
aria-label={`Page ${currentPage - 1} (previous page)`} aria-label={`Page ${currentPage - 1} (previous page)`}
> >
<ArrowUturnLeftIcon width={20} height={20} /> <ArrowUturnLeftIcon width={20} height={20} />
</a> </p>
</Link> </Link>
) : ( ) : (
<button <button
@ -55,13 +55,13 @@ export default function Pagination(props: PaginationProps) {
<> <>
<li> <li>
{useHref ? ( {useHref ? (
<Link href={`?page=1`}> <Link href={`${1}`}>
<a <p
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80" className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
aria-label="Page 1 (first page)" aria-label="Page 1 (first page)"
> >
1 1
</a> </p>
</Link> </Link>
) : ( ) : (
<button <button
@ -82,8 +82,8 @@ export default function Pagination(props: PaginationProps) {
{pageNumbers.map((pageNumber) => ( {pageNumbers.map((pageNumber) => (
<li key={pageNumber}> <li key={pageNumber}>
{useHref ? ( {useHref ? (
<Link href={`?page=${pageNumber}`}> <Link href={`${pageNumber}`}>
<a <p
className={`rounded-md px-3 py-1 ${ className={`rounded-md px-3 py-1 ${
pageNumber === currentPage pageNumber === currentPage
? "bg-blue-500 text-primary" ? "bg-blue-500 text-primary"
@ -92,7 +92,7 @@ export default function Pagination(props: PaginationProps) {
aria-label={`Page ${pageNumber}`} aria-label={`Page ${pageNumber}`}
> >
{pageNumber} {pageNumber}
</a> </p>
</Link> </Link>
) : ( ) : (
<button <button
@ -118,13 +118,13 @@ export default function Pagination(props: PaginationProps) {
<li> <li>
{useHref ? ( {useHref ? (
<Link href={`?page=${totalPages}`}> <Link href={`${totalPages}`}>
<a <p
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80" className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
aria-label={`Page ${totalPages} (last page)`} aria-label={`Page ${totalPages} (last page)`}
> >
{totalPages} {totalPages}
</a> </p>
</Link> </Link>
) : ( ) : (
<button <button
@ -142,13 +142,13 @@ export default function Pagination(props: PaginationProps) {
{currentPage < totalPages && ( {currentPage < totalPages && (
<li className="rounded-md bg-neutral-700 hover:opacity-80"> <li className="rounded-md bg-neutral-700 hover:opacity-80">
{useHref ? ( {useHref ? (
<Link href={`?page=${currentPage + 1}`}> <Link href={`${currentPage + 1}`}>
<a <p
className="px-3 py-1" className="px-3 py-1"
aria-label={`Page ${currentPage + 1} (next page)`} aria-label={`Page ${currentPage + 1} (next page)`}
> >
<ArrowUturnRightIcon width={20} height={20} /> <ArrowUturnRightIcon width={20} height={20} />
</a> </p>
</Link> </Link>
) : ( ) : (
<button <button