Scroll list into view when filtering event participants

[richardolsson]

Description

A user is now able to filter participants in the event participants list, a feature which was introduced by #1285. However, there is a potential problem on this page for users on small screens, which is that they may see the filter feature without seeing the list, which is further down the page.

One solution would be to scroll the list into view when the user starts filtering, either onFocus or the first onFilterChange (perhaps better). This will require some experimentation to make sure it feels right.

Relevant Job Stories

None

Prerequisites

None

Requirements

• When the user filters participants (e.g. on http://localhost:3000/organize/1/projects/1/events/15/participants), make sure the topmost list section is scrolled into view

Possible implementations

I'm guessing there will need to be a ref on the first list, and that scrollIntoView() can be used with the smooth behaviour.

Design specifications

This is the context (note how the actual list being filtered is outside of the window below the fold, while the input field is not):

Open questions

When to trigger the scroll exactly? Let's experiment!