From 6da4b03a1e603a8bd738b03acbd6028fe28b2d8c Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Fri, 12 Aug 2022 17:32:27 -0400
Subject: [PATCH] Single context menu open at a time

---
 ts/components/ContextMenu.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/ts/components/ContextMenu.tsx b/ts/components/ContextMenu.tsx
index b625832d4..98e50c4e0 100644
--- a/ts/components/ContextMenu.tsx
+++ b/ts/components/ContextMenu.tsx
@@ -35,6 +35,8 @@ export type PropsType<T> = {
   readonly value?: T;
 };
 
+let closeCurrentOpenContextMenu: undefined | (() => unknown);
+
 export function ContextMenu<T>({
   children,
   i18n,
@@ -77,6 +79,7 @@ export function ContextMenu<T>({
     const handleOutsideClick = (event: MouseEvent) => {
       if (!referenceElement?.contains(event.target as Node)) {
         setIsMenuShowing(false);
+        closeCurrentOpenContextMenu = undefined;
         event.stopPropagation();
         event.preventDefault();
       }
@@ -120,12 +123,15 @@ export function ContextMenu<T>({
         focusedOption.onClick(focusedOption.value);
       }
       setIsMenuShowing(false);
+      closeCurrentOpenContextMenu = undefined;
       ev.stopPropagation();
       ev.preventDefault();
     }
   };
 
   const handleClick = (ev: KeyboardEvent | React.MouseEvent) => {
+    closeCurrentOpenContextMenu?.();
+    closeCurrentOpenContextMenu = () => setIsMenuShowing(false);
     setIsMenuShowing(true);
     ev.stopPropagation();
     ev.preventDefault();
@@ -187,6 +193,7 @@ export function ContextMenu<T>({
                   onClick={() => {
                     option.onClick(option.value);
                     setIsMenuShowing(false);
+                    closeCurrentOpenContextMenu = undefined;
                   }}
                 >
                   <div className={getClassName('__option--container')}>