From 11fddee8e4af054754e4c195ec05b57b6bf667b2 Mon Sep 17 00:00:00 2001
From: Thomas <thomas-@users.noreply.github.com>
Date: Fri, 3 Jun 2022 12:13:03 +0200
Subject: [PATCH] Merge pull request #8261 from
 overleaf/tm-show-correct-price-in-change-plans-list

Show correct prices in change plans list on subscription dashboard

GitOrigin-RevId: 194b516bae92564d33f50e1c0035d21b2ba246a9
---
 .../SubscriptionViewModelBuilder.js           |  5 ++++
 .../js/main/subscription-dashboard.js         | 24 +++++++++++++++++++
 2 files changed, 29 insertions(+)

diff --git a/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js b/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
index f85c7e1e68..dfc91aaee8 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
@@ -272,6 +272,11 @@ function buildUsersSubscriptionViewModel(user, callback) {
                 pendingSubscriptionTax,
               recurlySubscription.currency
             )
+          personalSubscription.recurly.currentPlanDisplayPrice =
+            SubscriptionFormatters.formatPrice(
+              recurlySubscription.unit_amount_in_cents + addOnPrice + tax,
+              recurlySubscription.currency
+            )
           const pendingTotalLicenses =
             (pendingPlan.membersLimit || 0) + pendingAdditionalLicenses
           personalSubscription.recurly.pendingAdditionalLicenses =
diff --git a/services/web/frontend/js/main/subscription-dashboard.js b/services/web/frontend/js/main/subscription-dashboard.js
index cc12850560..1c20fe65ab 100644
--- a/services/web/frontend/js/main/subscription-dashboard.js
+++ b/services/web/frontend/js/main/subscription-dashboard.js
@@ -210,6 +210,10 @@ App.controller(
   function ($scope, $modal, RecurlyPricing) {
     if (!ensureRecurlyIsSetup()) return
 
+    function stripCentsIfZero(displayPrice) {
+      return displayPrice ? displayPrice.replace(/\.00$/, '') : '...'
+    }
+
     $scope.changePlan = () =>
       $modal.open({
         templateUrl: 'confirmChangePlanModalTemplate',
@@ -239,6 +243,26 @@ App.controller(
       const planCode = plan.planCode
       const subscription = getMeta('ol-subscription')
       const { currency, taxRate } = subscription.recurly
+      if (subscription.recurly.displayPrice) {
+        if (subscription.pendingPlan?.planCode === planCode) {
+          $scope.displayPrice = stripCentsIfZero(
+            subscription.recurly.displayPrice
+          )
+          return
+        }
+        if (subscription.planCode === planCode) {
+          if (subscription.pendingPlan) {
+            $scope.displayPrice = stripCentsIfZero(
+              subscription.recurly.currentPlanDisplayPrice
+            )
+          } else {
+            $scope.displayPrice = stripCentsIfZero(
+              subscription.recurly.displayPrice
+            )
+          }
+          return
+        }
+      }
       $scope.displayPrice = '...' // Placeholder while we talk to recurly
       RecurlyPricing.loadDisplayPriceWithTax(planCode, currency, taxRate).then(
         recurlyPrice => {