Merge pull request #28421 from overleaf/dp-compile-timeout-paywall-analytics

Improvements to compile timeout paywall analytics for editor redesign test

GitOrigin-RevId: 46c30c601d37d24b4eb1803bdd303b711ff96606

services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-error-state/compile-timeout-error-state.tsx

@@ -7,28 +7,39 @@ import { useCallback, useMemo } from 'react'
 import ErrorState from './error-state'
 import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
 import getMeta from '@/utils/meta'
-import { sendMB } from '@/infrastructure/event-tracking'
+import {
+  populateEditorRedesignSegmentation,
+  useEditorAnalytics,
+} from '@/shared/hooks/use-editor-analytics'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 export const ShortCompileTimeoutErrorState = () => {
   const { t } = useTranslation()
   const { isProjectOwner } = useCompileContext()
+  const { sendEvent } = useEditorAnalytics()
+  const newEditor = useIsNewEditorEnabled()
 
   const { compileTimeout } = getMeta('ol-compileSettings')
   const segmentation = useMemo(
-    () => ({
-      'is-owner': isProjectOwner,
-      compileTime: compileTimeout,
-    }),
-    [isProjectOwner, compileTimeout]
+    () =>
+      populateEditorRedesignSegmentation(
+        {
+          'is-owner': isProjectOwner,
+          compileTime: compileTimeout,
+          location: 'error-state',
+        },
+        newEditor
+      ),
+    [isProjectOwner, compileTimeout, newEditor]
   )
 
   const sendInfoClickEvent = useCallback(() => {
-    sendMB('paywall-info-click', {
+    sendEvent('paywall-info-click', {
       ...segmentation,
       'paywall-type': 'compile-timeout',
       content: 'blog',
     })
-  }, [segmentation])
+  }, [segmentation, sendEvent])
 
   return (
     <ErrorState

services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-prompt-new.tsx

@@ -7,6 +7,11 @@ import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-err
 import OLButton from '@/shared/components/ol/ol-button'
 import * as eventTracking from '../../../infrastructure/event-tracking'
 import getMeta from '@/utils/meta'
+import {
+  populateEditorRedesignSegmentation,
+  useEditorAnalytics,
+} from '@/shared/hooks/use-editor-analytics'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 function TimeoutUpgradePromptNew() {
   const {
@@ -15,6 +20,7 @@ function TimeoutUpgradePromptNew() {
     setAnimateCompileDropdownArrow,
     isProjectOwner,
   } = useDetachCompileContext()
+  const newEditor = useIsNewEditorEnabled()
 
   const { enableStopOnFirstError } = useStopOnFirstError({
     eventSource: 'timeout-new',
@@ -29,11 +35,16 @@ function TimeoutUpgradePromptNew() {
   const { compileTimeout } = getMeta('ol-compileSettings')
 
   const sharedSegmentation = useMemo(
-    () => ({
-      'is-owner': isProjectOwner,
-      compileTime: compileTimeout,
-    }),
-    [isProjectOwner, compileTimeout]
+    () =>
+      populateEditorRedesignSegmentation(
+        {
+          'is-owner': isProjectOwner,
+          compileTime: compileTimeout,
+          location: 'logs',
+        },
+        newEditor
+      ),
+    [isProjectOwner, compileTimeout, newEditor]
   )
 
   return (
@@ -126,9 +137,10 @@ const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
   segmentation,
 }: PreventTimeoutHelpMessageProps) {
   const { t } = useTranslation()
+  const { sendEvent } = useEditorAnalytics()
 
   function sendInfoClickEvent() {
-    eventTracking.sendMB('paywall-info-click', {
+    sendEvent('paywall-info-click', {
       ...segmentation,
       'paywall-type': 'compile-timeout',
       content: 'blog',