Merge pull request #2865 from overleaf/pr-handle-single-use-coupons

Handle single-use coupons

GitOrigin-RevId: 13af3c6a360adf67e5b0bc70764558ddcc3efd9c

services/web/app/views/subscriptions/new.pug

@@ -13,7 +13,6 @@ block head-scripts
 
 block content
 	.content.content-alt
-
 		.container(ng-controller="NewSubscriptionController" ng-cloak)
 			.row.card-group
 				.col-md-5.col-md-push-4
@@ -47,13 +46,30 @@ block content
 								.col-md-12.text-center
 									div(ng-if="trialLength")
 										span !{translate("first_few_days_free", {trialLen:'{{trialLength}}'})}
-										span(ng-if="discountMonths && discountRate")   -  {{discountMonths}} #{translate("month")}s {{discountRate}}% Off
+										span(ng-if="coupon.discountMonths && coupon.discountRate")   -  {{coupon.discountMonths}} #{translate("month")}s {{coupon.discountRate}}% Off
+									
 									div(ng-if="price")
-										strong {{availableCurrencies[currencyCode]['symbol']}}{{price.next.total}}
-										span(ng-if="monthlyBilling")  #{translate("every")} #{translate("month")}
-										span(ng-if="!monthlyBilling")  #{translate("every")} #{translate("year")}
-									div(ng-if="normalPrice")
-										span.small Normally {{availableCurrencies[currencyCode]['symbol']}}{{normalPrice}}
+										- var priceAngularExp = "<strong>{{ availableCurrencies[currencyCode]['symbol'] }}{{ price.total }}</strong>";
+										span(ng-if="!coupon.singleUse && monthlyBilling")
+											| !{translate("x_price_per_month", { price: priceAngularExp } )}
+										span(ng-if="!coupon.singleUse && !monthlyBilling")
+											| !{translate("x_price_per_year", { price: priceAngularExp } )}
+										span(ng-if="coupon.singleUse && monthlyBilling")
+											| !{translate("x_price_for_first_month", { price: priceAngularExp } )}
+										span(ng-if="coupon.singleUse && !monthlyBilling")
+											| !{translate("x_price_for_first_year", { price: priceAngularExp } )}
+
+									div(ng-if="coupon && coupon.normalPrice")
+										- var noDiscountPriceAngularExp = "{{ availableCurrencies[currencyCode]['symbol']}}{{coupon.normalPrice | number:2 }}";
+										span.small(ng-if="!coupon.singleUse && monthlyBilling")
+											| !{translate("normally_x_price_per_month", { price: noDiscountPriceAngularExp } )}
+										span.small(ng-if="!coupon.singleUse && !monthlyBilling")
+											| !{translate("normally_x_price_per_year", { price: noDiscountPriceAngularExp } )}
+										span.small(ng-if="coupon.singleUse && monthlyBilling")
+											| !{translate("then_x_price_per_month", { price: noDiscountPriceAngularExp } )}
+										span.small(ng-if="coupon.singleUse && !monthlyBilling")
+											| !{translate("then_x_price_per_year", { price: noDiscountPriceAngularExp } )}
+
 						.row(ng-hide="recurlyLoadError")
 							div()
 								.col-md-12()
@@ -191,7 +207,7 @@ block content
 													ng-model="data.company"
 												)
 
-											.form-group(ng-show="ui.addCompanyDetails && price.taxes.length")
+											.form-group(ng-show="ui.addCompanyDetails && taxes.length")
 												label(for="vat-number") #{translate("vat_number")}
 												input#vat-number.form-control(
 													type="text"
@@ -212,20 +228,24 @@ block content
 											p(ng-if="paymentMethod.value === 'paypal'") #{translate("paypal_upgrade")}
 
 											div.price-breakdown(
-												ng-show="price.taxes.length"
+												ng-show="taxes.length"
 											)
+												- var priceBreakdownAngularExp = "<strong>{{ availableCurrencies[currencyCode]['symbol'] }}{{ price.total }}</strong>";
+												- priceBreakdownAngularExp += " ({{availableCurrencies[currencyCode]['symbol']}}{{ price.subtotal }}";
+												- priceBreakdownAngularExp += " + " ;
+												- priceBreakdownAngularExp += "{{availableCurrencies[currencyCode]['symbol']}}{{ price.tax }} tax)";
 												hr.thin
 												span 
 													| Total:
 													|
-												strong 
-													| {{availableCurrencies[currencyCode]['symbol']}}{{price.next.total}}
-													|
-												span 
-													| ({{availableCurrencies[currencyCode]['symbol']}}{{price.next.subtotal}} + {{availableCurrencies[currencyCode]['symbol']}}{{price.next.tax}} tax)
-													|
-												span(ng-if="monthlyBilling") #{translate("every")} #{translate("month")}
-												span(ng-if="!monthlyBilling") #{translate("every")} #{translate("year")}
+													span(ng-if="!coupon.singleUse && monthlyBilling")
+														| !{translate("x_price_per_month", { price: priceBreakdownAngularExp } )}
+													span(ng-if="!coupon.singleUse && !monthlyBilling")
+														| !{translate("x_price_per_year", { price: priceBreakdownAngularExp } )}
+													span(ng-if="coupon.singleUse && monthlyBilling")
+														| !{translate("x_price_for_first_month", { price: priceBreakdownAngularExp } )}
+													span(ng-if="coupon.singleUse && !monthlyBilling")
+														| !{translate("x_price_for_first_year", { price: priceBreakdownAngularExp } )}
 												hr.thin
 
 											div.payment-submit

services/web/app/views/subscriptions/successful_subscription.pug

@@ -8,9 +8,11 @@ block content
 					.card(ng-cloak)
 						.page-header
 							h2 #{translate("thanks_for_subscribing")}
+
 						.alert.alert-success
-							p !{translate("next_payment_of_x_collectected_on_y", {paymentAmmount:"<strong>"+personalSubscription.recurly.price+"</strong>", collectionDate:"<strong>"+personalSubscription.recurly.nextPaymentDueAt+"</strong>"})}
-							include ./_price_exceptions
+							- if (personalSubscription.recurly.trial_ends_at)
+								p !{translate("next_payment_of_x_collectected_on_y", {paymentAmmount:"<strong>"+personalSubscription.recurly.price+"</strong>", collectionDate:"<strong>"+personalSubscription.recurly.nextPaymentDueAt+"</strong>"})}
+								include ./_price_exceptions
 							p #{translate("to_modify_your_subscription_go_to")} 
 								a(href="/user/subscription")  #{translate("manage_subscription")}.
 						p

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

@@ -117,10 +117,13 @@ export default App.controller('NewSubscriptionController', function(
 
   pricing.on('change', () => {
     $scope.planName = pricing.items.plan.name
-    $scope.price = pricing.price
+
     if (pricing.items.plan.trial) {
       $scope.trialLength = pricing.items.plan.trial.length
     }
+
+    $scope.price = $scope.trialLength ? pricing.price.next : pricing.price.now
+    $scope.taxes = pricing.price.taxes
     $scope.monthlyBilling = pricing.items.plan.period.length === 1
 
     $scope.availableCurrencies = {}
@@ -137,20 +140,25 @@ export default App.controller('NewSubscriptionController', function(
       pricing.items.coupon.discount &&
       pricing.items.coupon.discount.type === 'percent'
     ) {
-      const basePrice = parseInt(pricing.price.base.plan.unit)
-      $scope.normalPrice = basePrice
+      const basePrice = parseInt(pricing.price.base.plan.unit, 10)
+      $scope.coupon = {
+        singleUse: pricing.items.coupon.single_use,
+        normalPrice: basePrice
+      }
       if (
         pricing.items.coupon.applies_for_months > 0 &&
         pricing.items.coupon.discount.rate &&
         pricing.items.coupon.applies_for_months
       ) {
-        $scope.discountMonths = pricing.items.coupon.applies_for_months
-        $scope.discountRate = pricing.items.coupon.discount.rate * 100
+        $scope.coupon.discountMonths = pricing.items.coupon.applies_for_months
+        $scope.coupon.discountRate = pricing.items.coupon.discount.rate * 100
       }
 
       if (pricing.price.taxes[0] && pricing.price.taxes[0].rate) {
-        $scope.normalPrice += basePrice * pricing.price.taxes[0].rate
+        $scope.coupon.normalPrice += basePrice * pricing.price.taxes[0].rate
       }
+    } else {
+      $scope.coupon = null
     }
     $scope.$apply()
   })