Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

popover_menu: Fix popover not closed on clicking external links. 

For example, gear menu was not closed after `Integrations` button
was clicked since we don't have an event handler which opens
`/integrations` in a new tab but we let the browser navigate user
to `/integrations` after clicking on `a href='/integrations'`.

There was no handler for hiding the popover after clicking on such
links, so this commit adds one.
This commit is contained in:
Aman Agrawal 2024-01-19 05:36:12 +00:00 committed by Tim Abbott
parent 1f79e6294f
commit febeeb5dac
1 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/popover_menus.ts
View File

@ -358,11 +358,11 @@ export function toggle_popover_menu(
target: ReferenceElement,
popover_props: Partial<PopoverProps>,
options?: {show_as_overlay_on_mobile: boolean},
): void {
): PopoverInstance {
const instance = target._tippy;
if (instance) {
instance.hide();
return;
return instance;
}
let mobile_popover_props = {};
@ -382,7 +382,7 @@ export function toggle_popover_menu(
];
}
tippy(target, {
return tippy(target, {
...default_popover_props,
showOnCreate: true,
...popover_props,
@ -409,7 +409,14 @@ export function register_popover_menu(target: string, popover_props: Partial<Pop
e.preventDefault();
e.stopPropagation();
toggle_popover_menu(e.currentTarget, popover_props);
// Hide popovers when user clicks on an element which navigates user to a link.
// We don't explicitly handle these clicks per element and let browser handle them but in doing so,
// we are not able to hide the popover which we would do otherwise.
const instance = toggle_popover_menu(e.currentTarget, popover_props);
const $popper = $(instance.popper);
$popper.on("click", "a[href]", () => {
instance.hide();
});
});
}