Add Pagination to front-end

[glubsy]

• Adds pagination buttons at the bottom of the page when the number of items to be displayed is greater than the selected preference.
• Add a selector to the side bar for users to select their preferred number of items to be displayed at once per page.
• Sorting should be handled by the pagination module whenever it keeps the list of items in memory.
• Pagination is hidden (buttons are removed) whenever there is no need for it, or when the user selected to display everything.
• This should significantly improve performance on the client side for directories listing hundreds or thousands of items.

Closes #283.

[glubsy]

A few notes on these patches:

• Basically we hook whenever items to be displayed are changed, which is why we reuse some code from the View module and make detours in it.
• Page refresh (with the refresh option) should be handled just fine, as well as sorting.
• The code is not the most elegant at times, but I tried to keep it as readable and maintainable as possible.
• At first I opted to make a singleton object for the pagination, but for readability purposes changed to simply keep it as a module with some global variables.
• A history of the (now squashed) commits can be found here.
• Translation files have been updated in the process.

Here is what it looks like:

You may notice it hovers above the list of displayed items.

[kuzdogan]

Is it likely this will be merged sometime soon? We really need this for https://repo.sourcify.dev Kudos to @glubsy :clap:

[kuzdogan]

I tried checking out these commits and https://github.com/lrsjng/h5ai/pull/771 but unfortunately it didn't get any faster

To try out I created a directory with 20k folders, similar to our own setting with:

mkdir test-{1..20000}

The UI still hangs a long time when entering the parent directory of these 20k directories. Is it the mounting of the directory that is really slow?

[glubsy]

It's been a little while since I worked on this, but the other commit you mentioned simply removes the loading of items from the parent directories. The children directories are loaded just like before.

There is no lazy loading here, all the child items are still loaded at once.

I don't think it would be possible to implement lazy loading without removing the various sort buttons. You would also lose the ability to get the total number of child items per directory (until you have loaded them all), and the total number of pages would be incremented as you load the next pages. This would also need to be implemented on the back-end side, not just front-end.