From d8fee0d91aff9d263b32e7a5ecc63cece09d7e08 Mon Sep 17 00:00:00 2001 From: M Fahru Date: Wed, 22 Jun 2022 08:24:48 -0400 Subject: [PATCH] Implement premium features discoverability for user subscription page with split test (#8355) GitOrigin-RevId: c4bc01361a2d627f0a87f4ddeb8be8ed40f9acab --- .../Subscription/SubscriptionController.js | 15 +++++++++++++-- .../subscriptions/_premium_features_link.pug | 2 ++ .../web/app/views/subscriptions/dashboard.pug | 8 ++++++-- .../dashboard/_group_memberships.pug | 4 +++- .../dashboard/_institution_memberships.pug | 4 +++- .../dashboard/_personal_subscription_recurly.pug | 2 ++ services/web/locales/en.json | 1 + 7 files changed, 30 insertions(+), 6 deletions(-) create mode 100644 services/web/app/views/subscriptions/_premium_features_link.pug diff --git a/services/web/app/src/Features/Subscription/SubscriptionController.js b/services/web/app/src/Features/Subscription/SubscriptionController.js index 41ff5cd166..42997894b9 100644 --- a/services/web/app/src/Features/Subscription/SubscriptionController.js +++ b/services/web/app/src/Features/Subscription/SubscriptionController.js @@ -198,13 +198,23 @@ async function userSubscriptionPage(req, res) { AnalyticsManager.recordEventForSession(req.session, 'subscription-page-view') - const assignment = await SplitTestHandler.promises.getAssignment( + const cancelButtonAssignment = await SplitTestHandler.promises.getAssignment( req, res, 'subscription-cancel-button' ) - const cancelButtonNewCopy = assignment && assignment.variant === 'new-copy' + const cancelButtonNewCopy = cancelButtonAssignment?.variant === 'new-copy' + + const premiumFeaturesDiscoverabilityAssignment = + await SplitTestHandler.promises.getAssignment( + req, + res, + 'premium-features-discoverability' + ) + + const premiumFeaturesDiscoverability = + premiumFeaturesDiscoverabilityAssignment?.variant === 'active' const data = { title: 'your_subscription', @@ -222,6 +232,7 @@ async function userSubscriptionPage(req, res) { currentInstitutionsWithLicence, groupPlanModalOptions, cancelButtonNewCopy, + premiumFeaturesDiscoverability, } res.render('subscriptions/dashboard', data) } diff --git a/services/web/app/views/subscriptions/_premium_features_link.pug b/services/web/app/views/subscriptions/_premium_features_link.pug new file mode 100644 index 0000000000..d8f8436700 --- /dev/null +++ b/services/web/app/views/subscriptions/_premium_features_link.pug @@ -0,0 +1,2 @@ +if premiumFeaturesDiscoverability + p !{translate("get_most_subscription_by_checking_premium_features", {}, [{name: 'a', attrs: {href: '/learn/how-to/Overleaf_premium_features'}}])} \ No newline at end of file diff --git a/services/web/app/views/subscriptions/dashboard.pug b/services/web/app/views/subscriptions/dashboard.pug index f0ce2df476..60cac960c0 100644 --- a/services/web/app/views/subscriptions/dashboard.pug +++ b/services/web/app/views/subscriptions/dashboard.pug @@ -26,7 +26,6 @@ block content .card .page-header h1 #{translate("your_subscription")} - -var hasDisplayedSubscription = false if (personalSubscription) -hasDisplayedSubscription = true @@ -57,7 +56,12 @@ block content a(href="mailto:support@overleaf.com") support@overleaf.com | to find out more. else - p(ng-non-bindable) You are on the #{settings.appName} Free plan. Upgrade to access these Premium Features: + p(ng-non-bindable) + | You are on the #{settings.appName} Free plan. Upgrade to access these + if premiumFeaturesDiscoverability + a(href="/learn/how-to/Overleaf_premium_features") Premium Features: + else + | Premium Features: ul li #{translate('invite_more_collabs')} for feature in ['realtime_track_changes', 'full_doc_history', 'reference_search', 'reference_sync', 'dropbox_integration_lowercase', 'github_integration_lowercase', 'priority_support'] diff --git a/services/web/app/views/subscriptions/dashboard/_group_memberships.pug b/services/web/app/views/subscriptions/dashboard/_group_memberships.pug index f168486e12..5e17d823c5 100644 --- a/services/web/app/views/subscriptions/dashboard/_group_memberships.pug +++ b/services/web/app/views/subscriptions/dashboard/_group_memberships.pug @@ -1,5 +1,5 @@ div(ng-controller="GroupMembershipController") - each groupSubscription in memberGroupSubscriptions + each groupSubscription, index in memberGroupSubscriptions unless (groupSubscription.userIsGroupManager) if (user._id+'' != groupSubscription.admin_id._id+'') div @@ -8,6 +8,8 @@ div(ng-controller="GroupMembershipController") p //- Team notice is sanitized in SubscriptionViewModelBuilder em(ng-non-bindable) !{groupSubscription.teamNotice} + if index === memberGroupSubscriptions.length - 1 + include ../_premium_features_link span button.btn.btn-danger.text-capitalise(ng-click="removeSelfFromGroup('"+groupSubscription._id+"')") #{translate("leave_group")} hr diff --git a/services/web/app/views/subscriptions/dashboard/_institution_memberships.pug b/services/web/app/views/subscriptions/dashboard/_institution_memberships.pug index b47d5e796b..50c65a959e 100644 --- a/services/web/app/views/subscriptions/dashboard/_institution_memberships.pug +++ b/services/web/app/views/subscriptions/dashboard/_institution_memberships.pug @@ -2,7 +2,9 @@ if currentInstitutionsWithLicence === false .alert.alert-warning p Sorry, something went wrong. Subscription information related to institutional affiliations may not be displayed. Please try again later. else - each institution in currentInstitutionsWithLicence + each institution, index in currentInstitutionsWithLicence -hasDisplayedSubscription = true p !{translate("you_are_on_x_plan_as_a_confirmed_member_of_institution_y", {planName: 'Professional', institutionName: institution.name || ''}, [{name: 'a', attrs: {href: '/user/subscription/plans'}}, 'strong'])} + if (index === currentInstitutionsWithLicence.length - 1) + include ../_premium_features_link hr diff --git a/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug b/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug index cec986599e..521ac100e1 100644 --- a/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug +++ b/services/web/app/views/subscriptions/dashboard/_personal_subscription_recurly.pug @@ -26,6 +26,7 @@ div(ng-controller="RecurlySubscriptionController") if (personalSubscription.recurly.trialEndsAtFormatted && personalSubscription.recurly.trial_ends_at > Date.now()) p You're on a free trial which ends on #{personalSubscription.recurly.trialEndsAtFormatted} p !{translate("next_payment_of_x_collectected_on_y", {paymentAmmount: personalSubscription.recurly.displayPrice, collectionDate: personalSubscription.recurly.nextPaymentDueAt}, ['strong', 'strong'])} + include ../_premium_features_link include ./../_price_exceptions p.pull-right p @@ -44,6 +45,7 @@ div(ng-controller="RecurlySubscriptionController") when "canceled" p !{translate("currently_subscribed_to_plan", {planName: personalSubscription.plan.name}, ['strong'])} p !{translate("subscription_canceled_and_terminate_on_x", {terminateDate: personalSubscription.recurly.nextPaymentDueAt}, ['strong'])} + include ../_premium_features_link p a(href=personalSubscription.recurly.accountManagementLink, target="_blank").btn.btn-info #{translate("view_your_invoices")} p: form(action="/user/subscription/reactivate",method="post") diff --git a/services/web/locales/en.json b/services/web/locales/en.json index 0a34d743a9..bf220c9476 100644 --- a/services/web/locales/en.json +++ b/services/web/locales/en.json @@ -1785,5 +1785,6 @@ "commons_plan_tooltip": "You’re on the __plan__ plan because of your affiliation with __institution__. Click to find out how you could benefit from Overleaf premium features!", "trial_last_day": "This is the last day of your Overleaf Premium trial", "trial_remaining_days": "__days__ more days on your Overleaf Premium trial", + "get_most_subscription_by_checking_premium_features": "Get the most out of your __appName__ subscription by checking out the list of <0>__appName__’s premium features.", "to_get_the_most_of_sub_check_premium_features": "To get the most out of your subscription, check out the list of <0>__appName__’s premium features" }