Add pagination or infinite scroll support

[gtsiolis]

Problem to solve

Pagination. 📄

Proposal

🅰️ Pagination breaks up content into multiple pages.
🅱️ Infinite scroll helps users parse a large number of items. Infinite scroll is also suitable when the list updates frequently and there are no sorting or filtering options.

Cc @laushinka @jldec because of our recent discussion related to pagination.

Designs

Pagination (Simple)	Pagination (Complex)

Infinite Scroll (Simple)	Infinite Scroll (Loading)	Infinite Scroll (Showing All)

See design specs.

[laushinka]

Thanks for the designs!
@gtsiolis @jldec If paginated, how many results do we want to show per page?

[gtsiolis]

@laushinka, 20 is usually a good starting point for pagination that makes sense, but also depends on the context.

However, I'd say let's go with 10, which is also a common approach, for brevity following our approach with other product areas like the workspaces list (see inactive workspaces grouping, etc) and given the upcoming collapsible component to be added on each entry and the potential addition of the usage graph above this list (see relevant discussion (internal)).

We can always adjust this in future iterations. ➿

Looping in @jldec in case he has any strong preference towards a different solution. 🏀

[laushinka]

20 is usually a good starting point...
let's go with 10, ... and given the upcoming collapsible component to be added on each entry and the potential addition of the usage graph
We can always adjust this in future iterations. ➿

Agree! I also thought 10 is a good start. For now we're doing the pagination in the client instead of the server, so once the data is loaded, going through the pages takes no time at all.

[gtsiolis]

For now we're doing the pagination in the client instead of the server, so once the data is loaded, going through the pages takes no time at all.

I assume in the long-run we will switch to server-side pagination. Until then in case we notice any significant loading times, we could drop in a loading spinner while loading the data. ⏱️

[laushinka]

I assume in the long-run we will switch to server-side pagination.

Exactly.