Master Ticket: Implement Faceting 2.0 for visualizations

[d-callan]

Hooray for facets without constraints on cardinality!!

find mockups here, still to be reviewed by the eda ux group

this is a prereq to being able to build the individual summary app

[danicahelb]

Reviewed mockups in 12/12/2022 EDA UX meeting - now ready for implementation!

We need to give user feedback that scrolling is working, so we will show partial things sliding by as the user scrolls

• However, when the user stops scrolling they should always end up on a full row or column (never a partial column or row)

What is the maximum number of faceted panels that we should allow?

• A large number of panels on the screen will likely break the browser
• We will only allow X viewable panels in TOTAL to be viewed on the screen at any given time (we need to figure out X, the number of panels that won’t overwhelm the browser)
• We not worry about whether X is larger than what a user can reasonably view on their given screen size… if faceted panels are too small the user will adjust them

If the user selects a combination of viewable rows and columns that will exceed X panels, we will use a snackbar (which provide information about an ACTION or PROCESS) to let them know that they have exceeded X

We will pre-render 1 page on either side of the current view for better scrolling functionality (@dmfalke indicated that there is a well known library to handle this)

[dmfalke]

This is the library to which I was referring: https://github.com/bvaughn/react-window

[danicahelb]

To whomever QA's this ticket...Once this ticket has been implemented, check to see if these tickets can be closed:

#1280
VEuPathDB/web-components#399
#763

[danicahelb]

PIP task redmine ticket for faceting 2.0: https://redmine.apidb.org/issues/51781