From 21dd23d0e4533ec9af88ec59615ba6dd4bd8d09c Mon Sep 17 00:00:00 2001
From: Jimmy Domagala-Tang <Jimmy.Domagala-Tang@overleaf.com>
Date: Wed, 3 Jan 2024 09:54:51 -0500
Subject: [PATCH] Merge pull request #16318 from
 overleaf/jdt-fix-multiple-popups

Show only one editor notification at a time

GitOrigin-RevId: 88a0309da121e9545136cd718ed24710a9d25363
---
 .../table-generator/promotion/popover.tsx      | 18 +++++++++++++++---
 .../js/shared/context/editor-context.jsx       |  6 ++++++
 services/web/types/tutorial.ts                 |  2 ++
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx
index 2da929ee81..a445e407db 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx
@@ -30,14 +30,16 @@ const GRAMMARLY_CUTOFF_TIME = new Date(2023, 9, 10).getTime()
 const editorContextPropTypes = {
   inactiveTutorials: PropTypes.arrayOf(PropTypes.string).isRequired,
   deactivateTutorial: PropTypes.func.isRequired,
+  currentPopup: PropTypes.string,
+  setCurrentPopup: PropTypes.func.isRequired,
 }
 
 export const PromotionOverlay: FC = ({ children }) => {
   const ref = useRef<HTMLSpanElement>(null)
 
-  const { inactiveTutorials }: EditorTutorials = useEditorContext(
-    editorContextPropTypes
-  )
+  const { inactiveTutorials, currentPopup, setCurrentPopup }: EditorTutorials =
+    useEditorContext(editorContextPropTypes)
+
   const {
     splitTestVariants,
   }: { splitTestVariants: Record<string, string | undefined> } =
@@ -54,11 +56,21 @@ export const PromotionOverlay: FC = ({ children }) => {
   const hideBecauseNewUser =
     !userRegistrationTime || userRegistrationTime > NEW_USER_CUTOFF_TIME
 
+  const popupPresent =
+    currentPopup && currentPopup !== 'table-generator-promotion'
+
   const showPromotion =
     splitTestVariants['table-generator-promotion'] === 'enabled' &&
+    !popupPresent &&
     !inactiveTutorials.includes('table-generator-promotion') &&
     !hideBecauseNewUser
 
+  useEffect(() => {
+    if (showPromotion) {
+      setCurrentPopup('table-generator-promotion')
+    }
+  }, [showPromotion, setCurrentPopup])
+
   if (!showPromotion) {
     return <>{children}</>
   }
diff --git a/services/web/frontend/js/shared/context/editor-context.jsx b/services/web/frontend/js/shared/context/editor-context.jsx
index 58c131a007..66ea152897 100644
--- a/services/web/frontend/js/shared/context/editor-context.jsx
+++ b/services/web/frontend/js/shared/context/editor-context.jsx
@@ -91,6 +91,8 @@ export function EditorProvider({ children }) {
     getMeta('ol-inactiveTutorials', [])
   )
 
+  const [currentPopup, setCurrentPopup] = useState(null)
+
   const deactivateTutorial = useCallback(
     tutorialKey => {
       setInactiveTutorials([...inactiveTutorials, tutorialKey])
@@ -173,6 +175,8 @@ export function EditorProvider({ children }) {
       insertSymbol,
       inactiveTutorials,
       deactivateTutorial,
+      currentPopup,
+      setCurrentPopup,
     }),
     [
       cobranding,
@@ -188,6 +192,8 @@ export function EditorProvider({ children }) {
       insertSymbol,
       inactiveTutorials,
       deactivateTutorial,
+      currentPopup,
+      setCurrentPopup,
     ]
   )
 
diff --git a/services/web/types/tutorial.ts b/services/web/types/tutorial.ts
index e917a33429..1da5d837c2 100644
--- a/services/web/types/tutorial.ts
+++ b/services/web/types/tutorial.ts
@@ -2,4 +2,6 @@
 export type EditorTutorials = {
   inactiveTutorials: [string]
   deactivateTutorial: (key: string) => void
+  currentPopup: string
+  setCurrentPopup: (id: string) => void
 }