Feature/322 support infinite scrolling

[g-saracca]

What this PR does / why we need it:

Support inifinite scrolling in the collections page.

Which issue(s) this PR closes:

• Closes #Support dynamic scrolling in addition to table view pagination #322

Special notes for your reviewer:

At the moment I replaced the original pagination with buttons in the collections section by this infinite scroll, the final goal would be to add a toggle button to be able to switch between common pagination and infinite scroll.
All the stories are done, component test and I added cases to the e2e test, in this last mentioned I made a skip of the tests for the usual pagination since at the moment it is not being rendered, when we add the toggle, we will have to apply them again.

We used the react-infinite-scroll-hook library which is super lightweight, (see https://bundlephobia.com/package/[email protected]).
I also added the classnames library to be able to assign dynamic css classes, this is going to be super useful for many cases in my opinion.

Suggestions on how to test this:

Install the necessary dependencies using npm install.
Start Storybook with npm run storybook.
Visit the Storybook and check the DatasetsListWithInfiniteScroll Stories inside sections.
There are many scenarios for the infinite scrolling feature.

Does this PR introduce a user interface change? If mockups are available, please link/include them here:

Is there a release notes update needed for this change?:

Additional documentation:

Storybook
Storybook with all states

[coveralls]

coverage: 97.26% (+0.08%) from 97.179%
when pulling 8cb9d10 on feature/322-support-infinite-scrolling
into a9d62da on develop.

[MellyGray]

LGTM!

[g-saracca]

All the recommended changes are ready. Thanks a lot, they were very useful! I just didn't do the one to implement the getDatasetsWithCount in the view with normal pagination in order not to extend too much this issue.

[GPortas]

This looks really good! @GermanSaracca

I think we should add a section about the infinite scrolling (mentioning next steps like the toggle button or configuration variable) on the Collection Page in the README section for changes to the original functionality: https:/IQSS/dataverse-frontend?tab=readme-ov-file#changes-in-functionality-behavior

I think we should make the results component longer, since it shows about 5 results when the original version shows 10.

Original JSF:

[g-saracca]

Hi @GPortas , thanks for the feedback!

• Container height:
  Making the results container longer will create a doble scrollbar, one on the whole page and one on the results container. At this point, the focus on the height of the container is based on the height of the viewport (60% of its height) to avoid this double scrollbar behaviour. Anyway, when we start adding more elements in the collections page we will have to check how it behaves and adjust it.
• Results label:
  The case of the message about the results, is that the container itself already has 10 items inside, so thats why "10 of ...". Although you are right, the user didn't see them yet, they are just in the list, I'm thinking we could simplify the text of the results to something like "10 out of 200 datasets" or something like "10 out of 200 datasets displayed".

I'm all ears, let me know what you think.

[g-saracca]

@GPortas I have updated the storybook link from the description in case you have tested from there, it was outdated from another chromatic deploy.
Please check this one