diff options
| -rw-r--r-- | FrontEnd/src/utilities/useClickOutside.ts | 13 | ||||
| -rw-r--r-- | FrontEnd/src/views/common/menu/PopupMenu.tsx | 2 |
2 files changed, 11 insertions, 4 deletions
diff --git a/FrontEnd/src/utilities/useClickOutside.ts b/FrontEnd/src/utilities/useClickOutside.ts index d4c53aa8..4b2f0e5c 100644 --- a/FrontEnd/src/utilities/useClickOutside.ts +++ b/FrontEnd/src/utilities/useClickOutside.ts @@ -2,7 +2,8 @@ import React from "react"; export default function useClickOutside( element: HTMLElement | null | undefined, - onClickOutside: () => void + onClickOutside: () => void, + nextTick?: boolean ): void { const onClickOutsideRef = React.useRef<() => void>(onClickOutside); @@ -22,10 +23,16 @@ export default function useClickOutside( } onClickOutsideRef.current(); }; - document.addEventListener("click", handler); + if (nextTick) { + setTimeout(() => { + document.addEventListener("click", handler); + }); + } else { + document.addEventListener("click", handler); + } return () => { document.removeEventListener("click", handler); }; } - }, [element]); + }, [element, nextTick]); } diff --git a/FrontEnd/src/views/common/menu/PopupMenu.tsx b/FrontEnd/src/views/common/menu/PopupMenu.tsx index fce97fcd..2344a6ea 100644 --- a/FrontEnd/src/views/common/menu/PopupMenu.tsx +++ b/FrontEnd/src/views/common/menu/PopupMenu.tsx @@ -30,7 +30,7 @@ const PopupMenu: React.FC<PopupMenuProps> = ({ React.useState<HTMLDivElement | null>(null); const { styles, attributes } = usePopper(referenceElement, popperElement); - useClickOutside(popperElement, () => setShow(false)); + useClickOutside(popperElement, () => setShow(false), true); return ( <> |