Merge pull request #9936 from overleaf/msm-itm-referrer

`itm_referrer` for subscription attribution

GitOrigin-RevId: 2787b55e8b7e9e415e66abef8deb669f3adf0f0d

services/web/app/src/Features/Subscription/RecurlyWrapper.js

@@ -1064,6 +1064,12 @@ function getCustomFieldsFromSubscriptionDetails(subscriptionDetails) {
       value: subscriptionDetails.ITMContent,
     })
   }
+  if (subscriptionDetails.ITMReferrer) {
+    customFields.push({
+      name: 'itm_referrer',
+      value: subscriptionDetails.ITMReferrer,
+    })
+  }
   return { custom_field: customFields }
 }
 

services/web/app/src/Features/Subscription/SubscriptionController.js

@@ -97,7 +97,8 @@ async function plansPage(req, res) {
   res.render(template, {
     title: 'plans_and_pricing',
     plans,
-    itm_content: req.query && req.query.itm_content,
+    itm_content: req.query?.itm_content,
+    itm_referrer: req.query?.itm_referrer,
     itm_campaign: 'plans',
     recommendedCurrency,
     planFeatures,
@@ -260,6 +261,7 @@ async function interstitialPaymentPage(req, res) {
       title: 'subscribe',
       itm_content: req.query && req.query.itm_content,
       itm_campaign: req.query?.itm_campaign,
+      itm_referrer: req.query?.itm_referrer,
       recommendedCurrency,
       interstitialPaymentConfig,
       showSkipLink,

services/web/app/views/layout/fat-footer.pug

@@ -43,13 +43,13 @@ footer.fat-footer.hidden-print
 					li
 						a(href="/learn/how-to/Overleaf_premium_features") #{translate('premium_features')}
 					li
-						a(href="/user/subscription/plans") !{translate('for_individuals_and_groups')}
+						a(href="/user/subscription/plans?itm_referrer=footer-for-indv-groups") !{translate('for_individuals_and_groups')}
 					li
 						a(href="/for/enterprises") #{translate('for_enterprise')}
 					li
 						a(href="/for/universities") #{translate('for_universities')}
 					li
-						a(href="/user/subscription/plans#view=student") #{translate('for_students')}
+						a(href="/user/subscription/plans#view=student?itm_referrer=footer-for-students") #{translate('for_students')}
 						
 			.footer-section
 				.footer-section-heading #{translate('get_involved')}

services/web/app/views/project/list/_current_plan_mixins.pug

@@ -80,7 +80,7 @@ mixin free_plan()
 		span.info-badge
 		|  
 	a.btn.btn-primary(
-		href="/user/subscription/plans"
+		href="/user/subscription/plans?itm_referrer=project-dashboard-upgrade-prompt"
 		event-tracking="upgrade-button-click"
 		event-tracking-mb="true"
 		event-tracking-label="upgrade"

services/web/app/views/subscriptions/plans-marketing/v2/_mixins.pug

@@ -513,7 +513,8 @@ mixin additional_link_group(eventTrackingKey, additionalEventSegmentation, plan)
 mixin additional_link_buy(eventTrackingKey, additionalEventSegmentation, plan, period)
 	- var buttonSegmentation = plan + '-link'
 	- var segmentation = JSON.stringify(Object.assign({}, {button: buttonSegmentation, location: 'table-header', period}, additionalEventSegmentation))
-	- var qs = new URLSearchParams({planCode: plan, currency: recommendedCurrency, itm_campaign, itm_content: 'card'})
+	- var itmReferrer = itm_referrer ? { itm_referrer } : {}
+	- var qs = new URLSearchParams({planCode: plan, currency: recommendedCurrency, itm_campaign, itm_content: 'card', ...itmReferrer})
 	small.plans-v2-table-th-content-additional-link
 		| #{translate("or")} 
 		a(

services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.js

@@ -12,7 +12,7 @@ function UpgradePrompt() {
   return (
     <a
       className="toolbar-header-upgrade-prompt btn btn-primary btn-xs"
-      href="/user/subscription/plans"
+      href="/user/subscription/plans?itm_referrer=editor-header-upgrade-prompt"
       target="_blank"
       onClick={handleClick}
     >

services/web/frontend/js/main/new-subscription.js

@@ -15,6 +15,7 @@ export default App.controller(
     window.plan_code = $location.search().planCode || ''
     window.ITMCampaign = $location.search().itm_campaign || ''
     window.ITMContent = $location.search().itm_content || ''
+    window.ITMReferrer = $location.search().itm_referrer || ''
 
     if (typeof recurly === 'undefined' || !recurly) {
       $scope.recurlyLoadError = true
@@ -45,7 +46,14 @@ export default App.controller(
         'subscription-form-switch-to-student',
         window.plan_code
       )
-      window.location = `/user/subscription/new?planCode=${planCode}&currency=${$scope.currencyCode}&cc=${$scope.data.coupon}&itm_campaign=${window.ITMCampaign}&itm_content=${window.ITMContent}`
+      window.location =
+        '/user/subscription/new' +
+        `?planCode=${planCode}` +
+        `&currency=${$scope.currencyCode}` +
+        `&cc=${$scope.data.coupon}` +
+        `&itm_campaign=${window.ITMCampaign}` +
+        `&itm_content=${window.ITMContent}` +
+        `&itm_referrer=${window.ITMReferrer}`
     }
 
     eventTracking.sendMB('payment-page-view', { plan: window.plan_code })
@@ -358,6 +366,7 @@ export default App.controller(
             },
             ITMCampaign: window.ITMCampaign,
             ITMContent: window.ITMContent,
+            ITMReferrer: window.ITMReferrer,
           },
         }
 

services/web/frontend/js/pages/user/subscription/plans.js

@@ -113,6 +113,10 @@ export function updateLinkTargets() {
       queryString.set('itm_content', itmContent)
     }
 
+    if (searchParams.get('itm_referrer')) {
+      queryString.set('itm_referrer', searchParams.get('itm_referrer'))
+    }
+
     el.href = `/user/subscription/new?${queryString.toString()}`
   })
 }

services/web/test/unit/src/Subscription/RecurlyWrapperTests.js

@@ -599,6 +599,7 @@ describe('RecurlyWrapper', function () {
         },
         ITMCampaign: 'itm-campaign-value',
         ITMContent: 'itm-content-value',
+        ITMReferrer: 'itm-referrer-value',
       }
       this.subscription = {}
       this.recurlyTokenIds = {
@@ -657,6 +658,10 @@ describe('RecurlyWrapper', function () {
 			<name>itm_content</name>
 			<value>itm-content-value</value>
 		</custom_field>
+		<custom_field>
+			<name>itm_referrer</name>
+			<value>itm-referrer-value</value>
+		</custom_field>
 	</custom_fields>
 </subscription>\
 `)