From abbc0ff3f539a62995379547ceac84236543bc84 Mon Sep 17 00:00:00 2001
From: Alf Eaton <alf.eaton@overleaf.com>
Date: Tue, 14 Dec 2021 10:52:29 +0000
Subject: [PATCH] Track share-modal-opened event only when the Share modal is
 opened (#6088)

GitOrigin-RevId: 1518b879d6b31cad578335192d5fe01f90b8a539
---
 .../components/share-modal-body.js                |  5 -----
 .../components/share-project-modal.js             | 15 +++++++++++++++
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/services/web/frontend/js/features/share-project-modal/components/share-modal-body.js b/services/web/frontend/js/features/share-project-modal/components/share-modal-body.js
index a3be594dbf..f4bd66df32 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-modal-body.js
+++ b/services/web/frontend/js/features/share-project-modal/components/share-modal-body.js
@@ -11,7 +11,6 @@ import { useSplitTestContext } from '../../../shared/context/split-test-context'
 import { Row } from 'react-bootstrap'
 import PropTypes from 'prop-types'
 import RecaptchaConditions from '../../../shared/components/recaptcha-conditions'
-import * as eventTracking from '../../../infrastructure/event-tracking'
 
 export default function ShareModalBody() {
   const { isAdmin } = useShareProjectContext()
@@ -19,10 +18,6 @@ export default function ShareModalBody() {
     splitTestVariants: PropTypes.object,
   })
 
-  eventTracking.sendMB('share-modal-opened', {
-    splitTestVariant: splitTestVariants['null-test-share-modal'],
-  })
-
   const project = useProjectContext()
 
   switch (splitTestVariants['project-share-modal-paywall']) {
diff --git a/services/web/frontend/js/features/share-project-modal/components/share-project-modal.js b/services/web/frontend/js/features/share-project-modal/components/share-project-modal.js
index 731e59670b..b2c2a8d1a2 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-project-modal.js
+++ b/services/web/frontend/js/features/share-project-modal/components/share-project-modal.js
@@ -8,6 +8,8 @@ import React, {
 import PropTypes from 'prop-types'
 import ShareProjectModalContent from './share-project-modal-content'
 import { useProjectContext } from '../../../shared/context/project-context'
+import { useSplitTestContext } from '../../../shared/context/split-test-context'
+import { sendMB } from '../../../infrastructure/event-tracking'
 
 const ShareProjectContext = createContext()
 
@@ -72,6 +74,19 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
 
   const project = useProjectContext(projectShape)
 
+  const { splitTestVariants } = useSplitTestContext({
+    splitTestVariants: PropTypes.object,
+  })
+
+  // send tracking event when the modal is opened
+  useEffect(() => {
+    if (show) {
+      sendMB('share-modal-opened', {
+        splitTestVariant: splitTestVariants['null-test-share-modal'],
+      })
+    }
+  }, [splitTestVariants, show])
+
   // reset error when the modal is opened
   useEffect(() => {
     if (show) {