From c0eb059a0552f505c1af824664f4ae3a914feb40 Mon Sep 17 00:00:00 2001 From: Jessica Lawshe Date: Mon, 9 Jan 2023 10:20:54 -0600 Subject: [PATCH] Merge pull request #10958 from overleaf/jel-features-page-link [web] Update features page link on dash for split test GitOrigin-RevId: 5b51700a8a4ca89920288b54e08caf88f29dec96 --- .../current-plan-widget/commons-plan.tsx | 16 +++-- .../current-plan-widget.tsx | 11 +++- .../current-plan-widget/free-plan.tsx | 10 +-- .../current-plan-widget/group-plan.tsx | 14 +++-- .../current-plan-widget/individual-plan.tsx | 13 ++-- .../components/current-plan-widget.test.tsx | 63 +++++++++++++++++++ .../types/project/dashboard/subscription.ts | 10 ++- 7 files changed, 110 insertions(+), 27 deletions(-) diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx index f3597887ef..da4d2f1947 100644 --- a/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx +++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx @@ -2,9 +2,16 @@ import { useTranslation, Trans } from 'react-i18next' import { CommonsPlanSubscription } from '../../../../../../types/project/dashboard/subscription' import Tooltip from '../../../../shared/components/tooltip' -type CommonsPlanProps = Pick +type CommonsPlanProps = Pick< + CommonsPlanSubscription, + 'subscription' | 'plan' | 'featuresPageURL' +> -function CommonsPlan({ subscription, plan }: CommonsPlanProps) { +function CommonsPlan({ + featuresPageURL, + subscription, + plan, +}: CommonsPlanProps) { const { t } = useTranslation() const currentPlanLabel = ( }} /> @@ -21,10 +28,7 @@ function CommonsPlan({ subscription, plan }: CommonsPlanProps) { id="commons-plan" overlayProps={{ placement: 'bottom' }} > - + {currentPlanLabel} diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx index dce787b7a5..d0c20014ef 100644 --- a/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx +++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx @@ -20,10 +20,16 @@ function CurrentPlanWidget() { const isGroupPlan = type === 'group' const isCommonsPlan = type === 'commons' + const newFeaturesPageVariant = + getMeta('ol-splitTestVariants')?.['features-page'] === 'new' + const featuresPageURL = newFeaturesPageVariant + ? '/about/features-overview' + : '/learn/how-to/Overleaf_premium_features' + let currentPlan if (isFreePlan) { - currentPlan = + currentPlan = } if (isIndividualPlan) { @@ -31,6 +37,7 @@ function CurrentPlanWidget() { ) } @@ -41,6 +48,7 @@ function CurrentPlanWidget() { subscription={usersBestSubscription.subscription} remainingTrialDays={usersBestSubscription.remainingTrialDays} plan={usersBestSubscription.plan} + featuresPageURL={featuresPageURL} /> ) } @@ -50,6 +58,7 @@ function CurrentPlanWidget() { ) } diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx index 013dc5863d..96b7c8d863 100644 --- a/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx +++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx @@ -1,9 +1,12 @@ import { useTranslation, Trans } from 'react-i18next' import { Button } from 'react-bootstrap' +import { FreePlanSubscription } from '../../../../../../types/project/dashboard/subscription' import Tooltip from '../../../../shared/components/tooltip' import * as eventTracking from '../../../../infrastructure/event-tracking' -function FreePlan() { +type FreePlanProps = Pick + +function FreePlan({ featuresPageURL }: FreePlanProps) { const { t } = useTranslation() const currentPlanLabel = ( }} /> @@ -21,10 +24,7 @@ function FreePlan() { id="free-plan" overlayProps={{ placement: 'bottom' }} > - + {currentPlanLabel} {' '} diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx index d23143bb21..7e240ac6a1 100644 --- a/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx +++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx @@ -4,10 +4,15 @@ import Tooltip from '../../../../shared/components/tooltip' type GroupPlanProps = Pick< GroupPlanSubscription, - 'subscription' | 'plan' | 'remainingTrialDays' + 'subscription' | 'plan' | 'remainingTrialDays' | 'featuresPageURL' > -function GroupPlan({ subscription, plan, remainingTrialDays }: GroupPlanProps) { +function GroupPlan({ + featuresPageURL, + subscription, + plan, + remainingTrialDays, +}: GroupPlanProps) { const { t } = useTranslation() const currentPlanLabel = remainingTrialDays >= 0 ? ( @@ -39,10 +44,7 @@ function GroupPlan({ subscription, plan, remainingTrialDays }: GroupPlanProps) { id="group-plan" overlayProps={{ placement: 'bottom' }} > - + {currentPlanLabel} diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx index 9c9961e2b2..f3ddc1cf07 100644 --- a/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx +++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx @@ -4,10 +4,14 @@ import Tooltip from '../../../../shared/components/tooltip' type IndividualPlanProps = Pick< IndividualPlanSubscription, - 'plan' | 'remainingTrialDays' + 'plan' | 'remainingTrialDays' | 'featuresPageURL' > -function IndividualPlan({ plan, remainingTrialDays }: IndividualPlanProps) { +function IndividualPlan({ + featuresPageURL, + plan, + remainingTrialDays, +}: IndividualPlanProps) { const { t } = useTranslation() const currentPlanLabel = remainingTrialDays >= 0 ? ( @@ -32,10 +36,7 @@ function IndividualPlan({ plan, remainingTrialDays }: IndividualPlanProps) { id="individual-plan" overlayProps={{ placement: 'bottom' }} > - + {currentPlanLabel} diff --git a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx index 4c3d6125f6..30b70d87b3 100644 --- a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx +++ b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx @@ -243,4 +243,67 @@ describe('', function () { }) }) }) + + describe('features page split test', function () { + const variants = [ + { name: 'default', link: '/learn/how-to/Overleaf_premium_features' }, + { name: 'new', link: '/about/features-overview' }, + ] + + const plans = [ + { type: 'free' }, + { + type: 'individual', + plan: { + name: 'Abc', + }, + }, + { + type: 'group', + plan: { + name: 'Abc', + }, + subscription: { + teamName: 'Example Team', + name: 'Example Name', + }, + }, + { + type: 'commons', + plan: { + name: 'Abc', + }, + subscription: { + name: 'Example Name', + }, + }, + ] + + for (const variant of variants) { + describe(`${variant.name} variant`, function () { + beforeEach(function () { + window.metaAttributesCache.set('ol-splitTestVariants', { + 'features-page': variant.name, + }) + }) + afterEach(function () { + window.metaAttributesCache.delete('ol-splitTestVariants') + }) + + for (const plan of plans) { + it(`links to ${variant.name} features page on ${plan.type} plan`, function () { + window.metaAttributesCache.set('ol-usersBestSubscription', { + ...plan, + }) + render() + + const links = screen.getAllByRole('link') + expect(links[0].getAttribute('href')).to.equal(variant.link) + + window.metaAttributesCache.delete('ol-usersBestSubscription') + }) + } + }) + } + }) }) diff --git a/services/web/types/project/dashboard/subscription.ts b/services/web/types/project/dashboard/subscription.ts index eeaeb0d9c3..2b708f5c3a 100644 --- a/services/web/types/project/dashboard/subscription.ts +++ b/services/web/types/project/dashboard/subscription.ts @@ -1,7 +1,11 @@ -type FreePlanSubscription = { - type: 'free' +type SubscriptionBase = { + featuresPageURL: string } +export type FreePlanSubscription = { + type: 'free' +} & SubscriptionBase + type FreeSubscription = FreePlanSubscription type PaidSubscriptionBase = { @@ -12,7 +16,7 @@ type PaidSubscriptionBase = { teamName?: string name: string } -} +} & SubscriptionBase export type IndividualPlanSubscription = { type: 'individual'