Essentials + expandable sidebar on hover makes things weird

[patrontheo]

I have a bunch of tabs as essentials, and I use the expendable sidebar on hoover.
So, when not expended, I see on the side a column of icons (top down essentials then normal ones - let's assume I don't have pinned ones)
But when I bring my mouse on one of the icons, the sidebar gets expended, and the essentials are now as icons side-to-side (left to right), and the rest of the tabs are top-down. Sooo, each tab is now higher than it used to be (as expending made the essentials being displayed on one row instead of multiple rows.
So basically let's say i want to switch to some tab, I bring my mouse on its icon, then the sidebar gets expended, then I need to move my mouse up to go back on the correct tab, and then click, which is not ideal.. but at the same time I'm not sure how to fix this..
Maybe you could display the essentials as one icon when not expended ? But there would still be an issue if you have enough essentials so that there is two rows of essentials.
If I'm not being clear, let me know, I'll add some screenshots.
Anyway, thanks a lot @mr-cheff for the strong work!