Eui: [EuiDataGrid] Enhanced virtualized scrolling
Summarizing a conversation with @weltenwort
- logs app is the two-sided open-ended timeline and pagination doesn't work very well without a well-known "first" page (siem has an unrelated case where pagination doesn't work well)
- logs are often interacted with as a stream, chopping up the log stream into arbitrary pages gets in the way of the usual viewing experience; having to pagination between two that would otherwise be right next to each other is cumbersome
Implementation considerations would need to include pinned rows and/or columns.
chandlerprall
All 3 comments
@chandlerprall Is the required implementation needs to be a custom virtualized scrolling component or by using existing external component like react-virtualized
ashikmeerankutty
on 13 Apr 2020
react-virtualized doesn't meat our accessibility standards so it's already being ripped out of the existing places that it's in EUI.
react-window is a good 3rd party replacement by the same developer that doesn't make any a11y assumptions at all so it's a much easier canvas to layer our a11y work on top of.
Either way, using a 3rd party renderer will likely cause problems with DOM work, our focus work, and our keyboard shortcuts... So there be lots of dragons here.
myasonik
on 13 Apr 2020
The datagrid's implementation (react-window or otherwise) will need to interact with the pagination in not-yet-determined ways. Most of the React virtualized scrolling libraries assume all of the data is available, and the windowing functionality is simply passing over the items, rendering whichever should be visible. Datagrid will need more thought than just that, as you may start with a "page" worth of data and then additional requests are necessary while scrolling (potentially both up and down).
Imagine a grid of log data, and the default starting point is now. More data is available every 30 seconds so you can scroll down the grid to load newer entries, but you could also scroll up to load historic data. As Michail stated above, this functionality needs to integrate with the existing focus & keyboard navigation, etc.
Any work against this should definitely start with a write-up exploring the problems, options, and a proposed path forward.
chandlerprall
on 13 Apr 2020
Related issues
j-m
路
3Comments
nickofthyme
路
4Comments
cedeber
路
4Comments
roberto910907
路
3Comments
miukimiu
路
3Comments
Most helpful comment
The datagrid's implementation (react-window or otherwise) will need to interact with the pagination in not-yet-determined ways. Most of the React virtualized scrolling libraries assume all of the data is available, and the windowing functionality is simply passing over the items, rendering whichever should be visible. Datagrid will need more thought than just that, as you may start with a "page" worth of data and then additional requests are necessary while scrolling (potentially both up and down).
Imagine a grid of log data, and the default starting point is
now. More data is available every 30 seconds so you can scroll down the grid to load newer entries, but you could also scroll up to load historic data. As Michail stated above, this functionality needs to integrate with the existing focus & keyboard navigation, etc.Any work against this should definitely start with a write-up exploring the problems, options, and a proposed path forward.