Right now the contests list page loads all contests, which isn't good, since most of them aren't needed usually. It would be good to have pagination, displaying 100 contests per page with a page selector at the bottom. The page selector should be a new component that can be reused for other pages too. It should directly edit search parameter p=<page number> using the nuqs library. This pagination example from Codeberg can be followed. In the server component, simply do a .then() with .slice() on the array of contests before passing it to the client component. The total number of contests that pass the selected filters should also be returned, in addition to the 100 contests from the current page. There should be a label that explicitly displays the total number of matched contests (the pre-slice() length of the array).
Right now the contests list page loads all contests, which isn't good, since most of them aren't needed usually. It would be good to have pagination, displaying 100 contests per page with a page selector at the bottom. The page selector should be a new component that can be reused for other pages too. It should directly edit search parameter
p=<page number>using the nuqs library. This pagination example from Codeberg can be followed. In the server component, simply do a.then()with.slice()on the array of contests before passing it to the client component. The total number of contests that pass the selected filters should also be returned, in addition to the 100 contests from the current page. There should be a label that explicitly displays the total number of matched contests (the pre-slice() length of the array).