Alert List panel plugin message twitching side-to-side on data refresh

[vrzh]

What happened?

I have found that the Alert List panel plugin twitches when data is refreshed. It is much more noticeable and annoying when the refresh rate is high. I noticed in the code there is mention of something related:

grafana/public/app/plugins/panel/alertlist/UnifiedAlertList.tsx

Line 252 in 37d1d1c

{/* loading moved here to avoid twitching */}

But, it does not seem to work for me. It seems like the vertical scrollbar pops up for a few milliseconds and that shifts the message to the left.

Similar behaviour happens when there are alerts and the panel is being refreshed. I have attached a short video to show what I observe. I am using the latest Grafana version 11.0.0

Grafana-Alert-Panel-Scroll-Jitter.mp4

What did you expect to happen?

"No alerts matching filters" should not jump to the left every time data is refreshed.

Did this work before?

Don't know, I am first time Grafana user.

How do we reproduce it?

Create an empty dashboard and add an empty alert panel plugin component to the dashboard. Increase the refresh rate of the dashboard to amplify the effect. You will notice that the "No alerts matching filters" jump to the left every time data is refreshed.

Is the bug inside a dashboard panel?

Yes

Environment (with versions)?

Grafana: 11.0.0
OS: Ubuntu 20.04
Browser: Chrome (latest)

Grafana platform?

Docker

Datasource(s)?

Prometheus