Add multi-tag selection support to tag-picker without client side JS

This commit is contained in:
2026-01-14 15:03:23 -08:00
parent 85946a2b40
commit 560020632f
2 changed files with 29 additions and 8 deletions

View File

@@ -39,7 +39,7 @@ export function Home({ searchParams }: { searchParams: URLSearchParams }) {
</div>
)}
</div>
<Pagination currentPage={currentPage} totalPages={totalPages} />
<Pagination searchParams={searchParams} currentPage={currentPage} totalPages={totalPages} />
</main>
);
}
@@ -85,7 +85,7 @@ function PostCard({ post }: { post: Post }) {
);
}
function Pagination({ currentPage, totalPages }: { currentPage: number; totalPages: number }) {
function Pagination({ currentPage, totalPages, searchParams }:{ currentPage: number; totalPages: number, searchParams: URLSearchParams }) {
// Calculate the range of page numbers to show
let startPage: number;
let endPage: number;
@@ -113,11 +113,17 @@ function Pagination({ currentPage, totalPages }: { currentPage: number; totalPag
const pages = Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i);
let passThroughParams = ''
searchParams.forEach((val, key) => {
if(key != 'page')
passThroughParams += `&${key}=${val}`
})
return (
<nav className="pagination">
{/* Previous button - always visible, disabled on first page */}
<a
href={`/?page=${currentPage - 1}`}
href={`/?page=${currentPage - 1}${passThroughParams}`}
className={`pagination-link ${currentPage === 1 ? 'disabled' : ''}`}
style={{
opacity: currentPage === 1 ? 0.5 : 1,
@@ -132,7 +138,7 @@ function Pagination({ currentPage, totalPages }: { currentPage: number; totalPag
{pages.map((page) => (
<a
key={page}
href={`/?page=${page}`}
href={`/?page=${page}${passThroughParams}`}
className={`pagination-link ${page === currentPage ? 'active' : ''}`}
>
{page}
@@ -141,7 +147,7 @@ function Pagination({ currentPage, totalPages }: { currentPage: number; totalPag
{/* Next button - always visible, disabled on last page */}
<a
href={`/?page=${currentPage + 1}`}
href={`/?page=${currentPage + 1}${passThroughParams}`}
className={`pagination-link ${currentPage === totalPages ? 'disabled' : ''}`}
style={{
opacity: currentPage === totalPages ? 0.5 : 1,