Merge pull request #3834 from overleaf/tm-meta-tags-billing

[views] migrate subscription templates to meta tags GitOrigin-RevId: 4e81e81380048436a011467c230cc54c02e0c423
2024-11-07 20:31:06 -05:00 · 2021-04-08 09:26:19 -05:00 · 2021-04-08 09:26:19 -05:00 · e697064f16
commit e697064f16
parent 5220198991
10 changed files with 43 additions and 40 deletions
--- a/services/web/app/views/subscriptions/dashboard.pug
+++ b/services/web/app/views/subscriptions/dashboard.pug
@ -2,6 +2,12 @@ extends ../layout

 include ./dashboard/_team_name_mixin

+block append meta
+	if (personalSubscription)
+		meta(name="ol-recurlyApiKey" content=settings.apis.recurly.publicKey)
+		meta(name="ol-subscription" data-type="json" content=personalSubscription)
+		meta(name="ol-recomendedCurrency" content=personalSubscription.recurly.currency)
+
 block head-scripts
 	script(type="text/javascript", nonce=scriptNonce, src="https://js.recurly.com/v4/recurly.js")

--- a/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug
+++ b/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug
@ -1,8 +1,3 @@
-script(type="text/javascript", nonce=scriptNonce).
-	window.recurlyApiKey = "!{settings.apis.recurly.publicKey}"
-	window.subscription = !{StringHelper.stringifyJsonForScript(personalSubscription)}
-	window.recomendedCurrency = "#{personalSubscription.recurly.currency}"
-
 div(ng-controller="RecurlySubscriptionController")
 	div(ng-show="!showCancellation")
 		if (personalSubscription.recurly.account.has_past_due_invoice && personalSubscription.recurly.account.has_past_due_invoice._ == 'true')
--- a/services/web/app/views/subscriptions/new.pug
+++ b/services/web/app/views/subscriptions/new.pug
@ -1,11 +1,12 @@
 extends ../layout

+block append meta
+	meta(name="ol-countryCode" content=countryCode)
+	meta(name="ol-recurlyApiKey" content=settings.apis.recurly.publicKey)
+	meta(name="ol-recomendedCurrency" content=String(currency).slice(0,3))
+
 block head-scripts
 	script(type="text/javascript", nonce=scriptNonce, src="https://js.recurly.com/v4/recurly.js")
-	script(type="text/javascript", nonce=scriptNonce).
-		window.countryCode = !{StringHelper.stringifyJsonForScript(countryCode || '')}
-		window.recurlyApiKey = "!{settings.apis.recurly.publicKey}"
-		window.recomendedCurrency = !{StringHelper.stringifyJsonForScript(String(currency).slice(0,3))}

 block content
 	main.content.content-alt
--- a/services/web/app/views/subscriptions/plans.pug
+++ b/services/web/app/views/subscriptions/plans.pug
@ -6,11 +6,9 @@ include _plans_page_tables
 block vars
 	- metadata = { viewport: true }

-block head-scripts
-	script(type="text/javascript", nonce=scriptNonce).
-		window.recomendedCurrency = '#{recomendedCurrency}';
-		window.abCurrencyFlag = '#{abCurrencyFlag}';
-		window.groupPlans = !{StringHelper.stringifyJsonForScript(groupPlans)};
+block append meta
+	meta(name="ol-recomendedCurrency" content=recomendedCurrency)
+	meta(name="ol-groupPlans" data-type="json" content=groupPlans)

 block content
 	.content.content-alt
--- a/services/web/app/views/subscriptions/successful_subscription.pug
+++ b/services/web/app/views/subscriptions/successful_subscription.pug
@ -28,9 +28,3 @@ block content
 								| The #{settings.appName} Team
 						p
 							a.btn.btn-primary(href="/project") &lt; #{translate("back_to_your_projects")}
-
-	script(type="text/javascript", nonce=scriptNonce).
-		window.ab = [
-			{step:1, bucket:"student_control", testName:"editor_plan"},
-			{step:1, bucket:"collab_test", testName:"editor_plan"},
-		]
--- a/services/web/app/views/subscriptions/team/invite.pug
+++ b/services/web/app/views/subscriptions/team/invite.pug
@ -1,10 +1,8 @@
 extends ../../layout

-block head-scripts
-	script(type="text/javascript", nonce=scriptNonce).
-		window.teamId = '#{teamId}'
-		window.hasIndividualRecurlySubscription = #{hasIndividualRecurlySubscription}
-		window.inviteToken = '#{inviteToken}'
+block append meta
+	meta(name="ol-hasIndividualRecurlySubscription" data-type="boolean" content=hasIndividualRecurlySubscription)
+	meta(name="ol-inviteToken" content=inviteToken)

 block content
 	main.content.content-alt.team-invite
--- a/services/web/frontend/js/main/new-subscription.js
+++ b/services/web/frontend/js/main/new-subscription.js
@ -6,6 +6,7 @@ import _ from 'lodash'
 */
 /* global recurly */
 import App from '../base'
+import getMeta from '../utils/meta'

 export default App.controller('NewSubscriptionController', function(
  $scope,
@ -67,7 +68,7 @@ export default App.controller('NewSubscriptionController', function(
    city: '',
    company: '',
    vat_number: '',
-    country: window.countryCode,
+    country: getMeta('ol-countryCode'),
    coupon: window.couponCode
  }

@ -84,7 +85,7 @@ export default App.controller('NewSubscriptionController', function(
  )

  recurly.configure({
-    publicKey: window.recurlyApiKey,
+    publicKey: getMeta('ol-recurlyApiKey'),
    style: {
      all: {
        fontFamily: '"Open Sans", sans-serif',
--- a/services/web/frontend/js/main/plans.js
+++ b/services/web/frontend/js/main/plans.js
@ -3,8 +3,9 @@
    max-len
 */
 import App from '../base'
+import getMeta from '../utils/meta'
 App.factory('MultiCurrencyPricing', function() {
-  const currencyCode = window.recomendedCurrency
+  const currencyCode = getMeta('ol-recomendedCurrency')

  return {
    currencyCode,
@ -384,11 +385,12 @@ App.controller('GroupPlansModalPurchaseController', function(
    ]
  }

-  $scope.prices = window.groupPlans
+  $scope.prices = getMeta('ol-groupPlans')

  let currency = 'USD'
-  if (['USD', 'GBP', 'EUR'].includes(window.recomendedCurrency)) {
-    currency = window.recomendedCurrency
+  const recomendedCurrency = getMeta('ol-recomendedCurrency')
+  if (['USD', 'GBP', 'EUR'].includes(recomendedCurrency)) {
+    currency = recomendedCurrency
  }

  // default selected
--- a/services/web/frontend/js/main/subscription-dashboard.js
+++ b/services/web/frontend/js/main/subscription-dashboard.js
@ -18,13 +18,14 @@ import _ from 'lodash'
 * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
 */
 import App from '../base'
+import getMeta from '../utils/meta'
 const SUBSCRIPTION_URL = '/user/subscription/update'

 const ensureRecurlyIsSetup = _.once(() => {
  if (typeof recurly === 'undefined' || !recurly) {
    return false
  }
-  recurly.configure(window.recurlyApiKey)
+  recurly.configure(getMeta('ol-recurlyApiKey'))
  return true
 })

@ -106,7 +107,8 @@ App.controller('ChangePlanFormController', function(
  $scope.$watch('plan', function(plan) {
    if (!plan) return
    const planCode = plan.planCode
-    const { currency, taxRate } = window.subscription.recurly
+    const subscription = getMeta('ol-subscription')
+    const { currency, taxRate } = subscription.recurly
    $scope.price = '...' // Placeholder while we talk to recurly
    RecurlyPricing.loadDisplayPriceWithTax(planCode, currency, taxRate).then(
      price => {
@ -173,10 +175,11 @@ App.controller('GroupMembershipController', function($scope, $modal) {

 App.controller('RecurlySubscriptionController', function($scope) {
  const recurlyIsSetup = ensureRecurlyIsSetup()
-  $scope.showChangePlanButton = recurlyIsSetup && !window.subscription.groupPlan
+  const subscription = getMeta('ol-subscription')
+  $scope.showChangePlanButton = recurlyIsSetup && !subscription.groupPlan
  if (
-    window.subscription.recurly.account.has_past_due_invoice &&
-    window.subscription.recurly.account.has_past_due_invoice._ === 'true'
+    subscription.recurly.account.has_past_due_invoice &&
+    subscription.recurly.account.has_past_due_invoice._ === 'true'
  ) {
    $scope.showChangePlanButton = false
  }
@ -205,7 +208,7 @@ App.controller('RecurlyCancellationController', function(
  $http
 ) {
  if (!ensureRecurlyIsSetup()) return
-  const subscription = window.subscription
+  const subscription = getMeta('ol-subscription')
  const sevenDaysTime = new Date()
  sevenDaysTime.setDate(sevenDaysTime.getDate() + 7)
  const freeTrialEndDate = new Date(subscription.recurly.trial_ends_at)
@ -226,7 +229,7 @@ App.controller('RecurlyCancellationController', function(
    $scope.showBasicCancel = true
  }

-  const { currency, taxRate } = window.subscription.recurly
+  const { currency, taxRate } = subscription.recurly
  $scope.studentPrice = '...' // Placeholder while we talk to recurly
  RecurlyPricing.loadDisplayPriceWithTax('student', currency, taxRate).then(
    price => {
--- a/services/web/frontend/js/main/subscription/team-invite-controller.js
+++ b/services/web/frontend/js/main/subscription/team-invite-controller.js
@ -10,11 +10,15 @@
 * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
 */
 import App from '../../base'
+import getMeta from '../../utils/meta'

 export default App.controller('TeamInviteController', function($scope, $http) {
  $scope.inflight = false
+  const hasIndividualRecurlySubscription = getMeta(
+    'ol-hasIndividualRecurlySubscription'
+  )

-  if (window.hasIndividualRecurlySubscription) {
+  if (hasIndividualRecurlySubscription) {
    $scope.view = 'hasIndividualRecurlySubscription'
  } else {
    $scope.view = 'teamInvite'
@ -40,7 +44,8 @@ export default App.controller('TeamInviteController', function($scope, $http) {

  return ($scope.joinTeam = function() {
    $scope.inflight = true
-    const request = $http.put(`/subscription/invites/${window.inviteToken}/`, {
+    const inviteToken = getMeta('ol-inviteToken')
+    const request = $http.put(`/subscription/invites/${inviteToken}/`, {
      _csrf: window.csrfToken
    })
    request.then(function(response) {