Merge pull request #11158 from overleaf/em-recompile-pdf-split-test

Recompile PDF split test

GitOrigin-RevId: b02b3fb5b7a979ac299358e276ed432d736c7a03

services/web/app/src/Features/Project/ProjectController.js

@@ -48,6 +48,10 @@ const ProjectListController = require('./ProjectListController')
 const ProjectAuditLogHandler = require('./ProjectAuditLogHandler')
 const PublicAccessLevels = require('../Authorization/PublicAccessLevels')
 
+// We want the recompile-button-text split test to only target users who have
+// signed up recently.
+const RECOMPILE_BUTTON_SPLIT_TEST_MIN_SIGNUP_DATE = new Date('2023-01-16')
+
 /**
  * @typedef {import("./types").GetProjectsRequest} GetProjectsRequest
  * @typedef {import("./types").GetProjectsResponse} GetProjectsResponse
@@ -1082,6 +1086,27 @@ const ProjectController = {
             }
           )
         },
+        recompileButtonTextAssignment: [
+          'user',
+          (results, cb) => {
+            if (
+              results.user.signUpDate <
+              RECOMPILE_BUTTON_SPLIT_TEST_MIN_SIGNUP_DATE
+            ) {
+              return cb()
+            }
+            SplitTestHandler.getAssignment(
+              req,
+              res,
+              'recompile-button-text',
+              {},
+              () => {
+                // do not fail editor load if assignment fails
+                cb()
+              }
+            )
+          },
+        ],
       },
       (
         err,

services/web/frontend/js/features/pdf-preview/components/pdf-compile-button-inner.tsx

@@ -1,8 +1,11 @@
 import { Button } from 'react-bootstrap'
+import PropTypes from 'prop-types'
 import Tooltip from '../../../shared/components/tooltip'
 import Icon from '../../../shared/components/icon'
 import { useTranslation } from 'react-i18next'
-import { memo } from 'react'
+import { memo, useCallback } from 'react'
+import { useSplitTestContext } from '../../../shared/context/split-test-context'
+import * as eventTracking from '../../../infrastructure/event-tracking'
 
 const modifierKey = /Mac/i.test(navigator.platform) ? 'Cmd' : 'Ctrl'
 
@@ -17,7 +20,28 @@ function PdfCompileButtonInner({
 }: PdfCompileButtonInnerProps) {
   const { t } = useTranslation()
 
-  const compileButtonLabel = compiling ? t('compiling') + '…' : t('recompile')
+  const { splitTestVariants } = useSplitTestContext({
+    splitTestVariants: PropTypes.object,
+  })
+  const recompileButtonTextVariant = splitTestVariants['recompile-button-text']
+
+  let compileButtonLabel
+  if (compiling) {
+    compileButtonLabel = t('compiling') + '…'
+  } else if (splitTestVariants['recompile-button-text'] === 'recompile-pdf') {
+    compileButtonLabel = t('recompile') + ' PDF'
+  } else {
+    compileButtonLabel = t('recompile')
+  }
+
+  const handleRecompileButtonClick = useCallback(() => {
+    if (recompileButtonTextVariant != null) {
+      // Only send the event when the user is targeted by the
+      // recompile-button-text split test
+      eventTracking.sendMB('recompile-pdf-clicked')
+    }
+    startCompile()
+  }, [recompileButtonTextVariant, startCompile])
 
   return (
     <Tooltip
@@ -34,7 +58,7 @@ function PdfCompileButtonInner({
       <Button
         className="btn-recompile"
         bsStyle="primary"
-        onClick={() => startCompile()}
+        onClick={handleRecompileButtonClick}
         aria-label={compileButtonLabel}
         disabled={compiling}
         data-ol-loading={compiling}