From a4da7a935cfd07099e7dfa781e2c0d71976e826e Mon Sep 17 00:00:00 2001
From: Antoine Clausse <antoine.clausse@overleaf.com>
Date: Fri, 17 Jul 2026 10:26:58 +0200
Subject: [PATCH] [web] Remove redundant monthlyTimesTwelve from pricing tables
 (#35506)

* [web] Remove redundant monthlyTimesTwelve from pricing tables

monthlyTimesTwelve was always exactly monthly * 12 in every pricing row,
and the value was only ever used to render the "billed monthly for a year"
strikethrough price in the compile-timeout paywall.

- Drop the stored field from the pricing tables
- Send raw monthly/annual numbers in ol-standardPlanPricing instead of
  pre-formatted strings
- Format the prices (and derive the strikethrough as monthly * 12) in the
  paywall modal via the frontend currency helper

No user-facing change: the displayed prices are identical.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Remove `monthlyTimesTwelve` from script

* Remove comments

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
GitOrigin-RevId: b637208540b3b96180b1a3cc4417b09944c5d158
---
 .../Features/Project/ProjectController.mjs    | 11 ++--------
 .../compile-timeout-paywall-modal.tsx         | 21 ++++++++++++++-----
 services/web/frontend/js/utils/meta.ts        |  5 ++---
 .../src/Project/ProjectController.test.mjs    |  1 -
 4 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/services/web/app/src/Features/Project/ProjectController.mjs b/services/web/app/src/Features/Project/ProjectController.mjs
index f221c01534..65be956500 100644
--- a/services/web/app/src/Features/Project/ProjectController.mjs
+++ b/services/web/app/src/Features/Project/ProjectController.mjs
@@ -1059,7 +1059,6 @@ const _ProjectController = {
   },
 
   async _getPlanPricing(req, res, plan = 'collaborator') {
-    const locale = req.i18n.language
     const { currency } = await SubscriptionController.getRecommendedCurrency(
       req,
       res
@@ -1076,14 +1075,8 @@ const _ProjectController = {
     }
 
     return {
-      monthly: formatCurrency(planPricing.monthly, currency, locale, true),
-      annual: formatCurrency(planPricing.annual, currency, locale, true),
-      monthlyTimesTwelve: formatCurrency(
-        planPricing.monthlyTimesTwelve,
-        currency,
-        locale,
-        true
-      ),
+      monthly: planPricing.monthly,
+      annual: planPricing.annual,
     }
   },
 
diff --git a/services/web/frontend/js/features/pdf-preview/components/compile-timeout-paywall-modal.tsx b/services/web/frontend/js/features/pdf-preview/components/compile-timeout-paywall-modal.tsx
index 4e45158170..5503abf588 100644
--- a/services/web/frontend/js/features/pdf-preview/components/compile-timeout-paywall-modal.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/compile-timeout-paywall-modal.tsx
@@ -12,6 +12,7 @@ import BillingPeriodToggle, {
   type BillingPeriod,
 } from '@/shared/components/billing-period-toggle'
 import getMeta from '@/utils/meta'
+import { formatCurrency } from '@/shared/utils/currency'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
@@ -34,7 +35,7 @@ export function CompileTimeoutPaywallModal({
   const standardPlanPricing = getMeta('ol-standardPlanPricing')
   const currency = getMeta('ol-recommendedCurrency')
 
-  const supportsAnnualPricing = Boolean(standardPlanPricing?.annual)
+  const supportsAnnualPricing = standardPlanPricing?.annual != null
   const [annual, setAnnual] = useState(false)
 
   useEffect(() => {
@@ -116,15 +117,25 @@ export function CompileTimeoutPaywallModal({
     })
   }, [billingPeriod, currency])
 
-  const price = annual
+  const rawPrice = annual
     ? standardPlanPricing?.annual
     : standardPlanPricing?.monthly
+  const price =
+    rawPrice != null
+      ? formatCurrency(rawPrice, currency, undefined, true)
+      : undefined
 
   const priceSubtext = annual ? t('per_year') : t('per_month')
 
-  const strikethroughPrice = annual
-    ? standardPlanPricing?.monthlyTimesTwelve
-    : undefined
+  const strikethroughPrice =
+    annual && standardPlanPricing?.monthly != null
+      ? formatCurrency(
+          standardPlanPricing.monthly * 12,
+          currency,
+          undefined,
+          true
+        )
+      : undefined
 
   return (
     <OLModal
diff --git a/services/web/frontend/js/utils/meta.ts b/services/web/frontend/js/utils/meta.ts
index 04149c6e11..b198fda736 100644
--- a/services/web/frontend/js/utils/meta.ts
+++ b/services/web/frontend/js/utils/meta.ts
@@ -311,9 +311,8 @@ export interface Meta {
   'ol-ssoErrorMessage': string
   'ol-ssoInitPath': string
   'ol-standardPlanPricing': {
-    monthly?: string
-    annual?: string
-    monthlyTimesTwelve?: string
+    monthly?: number
+    annual?: number
   }
   'ol-stripeCustomerData': Array<{
     customerId: string
diff --git a/services/web/test/unit/src/Project/ProjectController.test.mjs b/services/web/test/unit/src/Project/ProjectController.test.mjs
index 2a5afa99c2..d3d74ac719 100644
--- a/services/web/test/unit/src/Project/ProjectController.test.mjs
+++ b/services/web/test/unit/src/Project/ProjectController.test.mjs
@@ -44,7 +44,6 @@ describe('ProjectController', function () {
             monthly: 15,
             annual: 180,
             annualDividedByTwelve: 15,
-            monthlyTimesTwelve: 180,
           },
         },
       },