cockpit-project / cockpit-machines

Cockpit UI for virtual machines
GNU Lesser General Public License v2.1
281 stars 73 forks source link

Help "?" popup hiding when in half-screen window resizing #1794

Open thepragmaticmero opened 2 weeks ago

thepragmaticmero commented 2 weeks ago

An image is worth a thousand words. image

The popup should be above the left-panel, not behind it

garrett commented 1 week ago

It's impossible for the popover to show above the left-panel, as that is a different page (the shell, versus the iframe which has the document with the popover).

The correct solution would be to have the popover account for the left side of the page.

There's a setting in PF @ https://www.patternfly.org/components/popover/#popover:

enableFlip boolean: true If true, tries to keep the popover in view by flipping it if necessary. If the position is set to 'auto', this prop is ignored.

However, I think that just flips left/right, and this is on top.

We could have the popover to the right in smaller modes... but then that'd cover up the options the popover is talking about. Below would also not work as expected. Ideally, we'd still be able to have it on the top, but with the popover slide over to the side (with the pointer in the same place).

I'm not sure if this is a PF issue or not. It should stay in the page by default.

garrett commented 1 week ago

Interestingly, in desktop mode, I see it pops up over to the right already: image

It only shows up on top in small sizes: Screen Shot 2024-09-02 at 15 21 06

Even odder, there's a small bit of width in-between where it's on top and it does slide over... I think this is actually what we'd want in smaller sizes: image (Although the arrow is misaligned a bit, it's mostly around the right location.)

thepragmaticmero commented 1 week ago

yeah, I'm using a tiling window manager on ArchLinux and Fedora, so my windows are 1/2 or 1/3 of my whole screen, problems with window reactivity aren´t really uncommon in the JS world. Anyways, let's wait for a fix then, for now I'll zoom out of the page.

garrett commented 5 days ago

PatternFly has an appendTo value for popovers @ https://www.patternfly.org/components/popover/#props — using this might help with the positioning for both vsock and watchdog (?) icons.

Meanwhile, this bug was supposed to have been fixed in PF some time ago:

But, it obviously is still an issue here, regardless of the state in PF and PF-React... so the problem still exists, of course.