Add a `scroll to top` button for `History` list

[raviks789]

In the History page, it would be nice to have a scroll to top button to go back to top of the list.

[flourish86]

as discussed with @jrauh01.

I see, how the idea might be tempting.

This element is mostly seen on mobile. Some sites use it as a help for unexperienced users, who get lost with longer pages. As far as I know, this is almost exclusively used in consumer context.

On iOS you have scroll to top pretty consistently in any view by tapping the status bar. I guess there's something similar on Android.

On desktop there is your keyboard (Keyboard being quicker anyway) with either a dedicated "Pos 1" key or a shortcut, that is replicating this.

Either way, as far as I see it, desktop use is our main focus and our users are far from being unexperienced computer users. So it would be rather distracting while useless on desktop and cover valuable screen space on mobile.

If you need to do it, though, a better place (compared to #1277) to put it would probably be the control bar, where users usually find the pagination.

[jrauh01]

I just tried the "Pos 1" key and it does not work for our web layout. The only way I can think of is to grab the scroll bar on the and pull it to the top.

[flourish86]

Interesting. Actually it works in Safari. 😉

But you're right. I just checked it and neither Firefox or Chrome (Brave) work with "Pos 1".

Would it be an option to make it work in those?

[flourish86]

I found this article about scroll to top buttons from the NNGroup. While the context they refer to is mainly websites, some of the aspects are interesting to consider.

https://www.nngroup.com/articles/back-to-top

The thing that I find most crucial are the issues, the button should mainly solve.

When users get at the bottom of a really long page, they often will need to get back to the top to:

• See the navigation menu and choose a new destination
• Access filtering and sorting features
• Enter or edit a query in the search box

For none of these a separate button is needed, because all the controls are always apparent in the Icinga Web 2 interface.