paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-01 04:23:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

popover_menus: Only take special care of references in message feed.

Browse Source 
If the popover reference is in an overlay, the below check:
```js
elements_at_reference_position.some(
    (element) =>
        element.id === "navbar-fixed-container" ||
        element.id === "compose-content" ||
        element.classList.contains("sticky_header"),
)
```
would make the popover not appear if the reference was above them.

To make things simpler for us to check, we only handle popover
references inside message list which we know for sure will
always be below the elements checked above in stacking context.

Hiding popovers for other view is done good enough by
`data-reference-hidden` check that we don't need to manually
handle them.
This commit is contained in:
Aman Agrawal
2023-11-07 12:45:11 +00:00
committed by Tim Abbott
parent a4b4b0ad38
commit 6e9da8ab2a
1 changed files with 7 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/popover_menus.js
View File

@@ -169,18 +169,17 @@ export const default_popover_props = {
}
const $reference = $(state.elements.reference);
// We don't want to hide popovers in these fixed / sticky elements where the reference cannot be obscured.
if (
$reference.parents("#compose").length === 1 ||
$reference.parents("#navbar-fixed-container").length === 1 ||
$reference.parents(".sticky_header").length === 1
) {
// Hide popover if the reference element is below another element.
//
// We only care about the reference element if it is inside the message feed since
// hiding elements outside the message feed is tricky and expensive due to stacking context.
// References in overlays, modal, sidebar overlays, popovers, etc. can make the below logic hard
// to live with if we take elements outside message feed into account.
if ($reference.parents("#message_feed_container").length !== 1) {
return;
}
const reference_rect = $reference[0].getBoundingClientRect();
// Hide popover if the reference element is below another element.
//
// This is the logic we want but since it is too expensive to run
// on every scroll, we run a cheaper version of this to just check if
// compose, sticky header or navbar are not obscuring the reference