diff --git a/services/web/app/views/subscriptions/dashboard-react.pug b/services/web/app/views/subscriptions/dashboard-react.pug index 3b21ea8584..04c6368794 100644 --- a/services/web/app/views/subscriptions/dashboard-react.pug +++ b/services/web/app/views/subscriptions/dashboard-react.pug @@ -7,12 +7,13 @@ block head-scripts script(type="text/javascript", nonce=scriptNonce, src="https://js.recurly.com/v4/recurly.js") block append meta - meta(name="ol-managedGroupSubscriptions", data-type="json" content=managedGroupSubscriptions) - meta(name="ol-memberGroupSubscriptions", data-type="json" content=memberGroupSubscriptions) - meta(name="ol-managedInstitutions", data-type="json", content=managedInstitutions) - meta(name="ol-managedPublishers", data-type="json" content=managedPublishers) - meta(name="ol-planCodesChangingAtTermEnd", data-type="json", content=planCodesChangingAtTermEnd) - meta(name="ol-currentInstitutionsWithLicence", data-type="json" content=currentInstitutionsWithLicence) + meta(name="ol-managedGroupSubscriptions" data-type="json" content=managedGroupSubscriptions) + meta(name="ol-memberGroupSubscriptions" data-type="json" content=memberGroupSubscriptions) + meta(name="ol-managedInstitutions" data-type="json" content=managedInstitutions) + meta(name="ol-managedPublishers" data-type="json" content=managedPublishers) + meta(name="ol-planCodesChangingAtTermEnd" data-type="json", content=planCodesChangingAtTermEnd) + meta(name="ol-currentInstitutionsWithLicence" data-type="json" content=currentInstitutionsWithLicence) + meta(name="ol-hasSubscription" data-type="boolean" content=hasSubscription) meta(name="ol-plans", data-type="json" content=plans) if (personalSubscription && personalSubscription.recurly) meta(name="ol-recurlyApiKey" content=settings.apis.recurly.publicKey) diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json index f554ad0d40..2d27bcdb04 100644 --- a/services/web/frontend/extracted-translations.json +++ b/services/web/frontend/extracted-translations.json @@ -911,6 +911,7 @@ "you_are_a_manager_of_commons_at_institution_x": "", "you_are_a_manager_of_publisher_x": "", "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z": "", + "you_are_on_a_paid_plan_contact_support_to_find_out_more": "", "you_are_on_x_plan_as_a_confirmed_member_of_institution_y": "", "you_are_on_x_plan_as_member_of_group_subscription_y_administered_by_z": "", "you_can_now_log_in_sso": "", diff --git a/services/web/frontend/js/features/subscription/components/dashboard/contact-support-for-custom-subscription.tsx b/services/web/frontend/js/features/subscription/components/dashboard/contact-support-for-custom-subscription.tsx new file mode 100644 index 0000000000..5875d8893d --- /dev/null +++ b/services/web/frontend/js/features/subscription/components/dashboard/contact-support-for-custom-subscription.tsx @@ -0,0 +1,12 @@ +import { Trans } from 'react-i18next' + +export default function ContactSupport() { + return ( +

+ ]} // eslint-disable-line react/jsx-key, jsx-a11y/anchor-has-content + /> +

+ ) +} diff --git a/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx b/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx index 72c44388ff..e4e687d6fa 100644 --- a/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx +++ b/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx @@ -1,4 +1,5 @@ import { useTranslation } from 'react-i18next' +import ContactSupport from './contact-support-for-custom-subscription' import GroupSubscriptionMemberships from './group-subscription-memberships' import InstitutionMemberships from './institution-memberships' import FreePlan from './free-plan' @@ -10,7 +11,8 @@ import { useSubscriptionDashboardContext } from '../../context/subscription-dash function SubscriptionDashboard() { const { t } = useTranslation() - const { hasDisplayedSubscription } = useSubscriptionDashboardContext() + const { hasDisplayedSubscription, hasSubscription } = + useSubscriptionDashboardContext() return (
@@ -27,7 +29,8 @@ function SubscriptionDashboard() { - {!hasDisplayedSubscription && } + {!hasDisplayedSubscription && + (hasSubscription ? : )}
diff --git a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx index 800bf4e1cd..e57b3272e4 100644 --- a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx +++ b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx @@ -47,6 +47,7 @@ type SubscriptionDashboardContextValue = { updateManagedInstitution: (institution: ManagedInstitution) => void modalIdShown?: SubscriptionDashModalIds personalSubscription?: Subscription + hasSubscription: boolean plans: Plan[] planCodeToChangeTo?: string queryingGroupPlanToChangeToPrice: boolean @@ -121,6 +122,7 @@ export function SubscriptionDashboardProvider({ ManagedInstitution[] >(getMeta('ol-managedInstitutions')) const managedPublishers = getMeta('ol-managedPublishers') + const hasSubscription = getMeta('ol-hasSubscription') const recurlyApiKey = getMeta('ol-recurlyApiKey') const hasDisplayedSubscription = Boolean( @@ -247,6 +249,7 @@ export function SubscriptionDashboardProvider({ updateManagedInstitution, modalIdShown, personalSubscription, + hasSubscription, plans, planCodeToChangeTo, queryingGroupPlanToChangeToPrice, @@ -282,6 +285,7 @@ export function SubscriptionDashboardProvider({ updateManagedInstitution, modalIdShown, personalSubscription, + hasSubscription, plans, planCodeToChangeTo, queryingGroupPlanToChangeToPrice, diff --git a/services/web/locales/en.json b/services/web/locales/en.json index dd92a4c0f9..15bac77170 100644 --- a/services/web/locales/en.json +++ b/services/web/locales/en.json @@ -1687,6 +1687,7 @@ "you_are_a_manager_of_publisher_x": "You are a <0>manager of <0>__publisherName__", "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z": "You are a <1>manager of the <0>__planName__ group subscription <1>__groupName__ administered by <1>__adminEmail__", "you_are_about_to_upgrade": "You are about to upgrade to the __planName__", + "you_are_on_a_paid_plan_contact_support_to_find_out_more": "You’re on an __appName__ Paid plan. <0>Contact support to find out more.", "you_are_on_x_plan_as_a_confirmed_member_of_institution_y": "You are on our <0>__planName__ plan as a <1>confirmed member of <1>__institutionName__", "you_are_on_x_plan_as_member_of_group_subscription_y_administered_by_z": "You are on our <0>__planName__ plan as a <1>member of the group subscription <1>__groupName__ administered by <1>__adminEmail__", "you_can_now_log_in_sso": "You can now log in through your institution and may receive <0>free __appName__ Professional features!", diff --git a/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx index 796956dcff..99f3db1b58 100644 --- a/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx +++ b/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx @@ -12,12 +12,49 @@ describe('', function () { }) describe('Free Plan', function () { - it('does not render the "Get the most out of your" subscription text', function () { + beforeEach(function () { renderWithSubscriptionDashContext() + }) + + it('does not render the "Get the most out of your" subscription text', function () { const text = screen.queryByText('Get the most out of your', { exact: false, }) expect(text).to.be.null }) + + it('does not render the contact support message', function () { + const text = screen.queryByText( + `You’re on an Overleaf Paid plan. Contact`, + { + exact: false, + } + ) + expect(text).to.be.null + }) + }) + + describe('Custom subscription', function () { + it('renders the contact support message', function () { + renderWithSubscriptionDashContext(, { + metaTags: [ + { + name: 'ol-currentInstitutionsWithLicence', + value: [], + }, + { + name: 'ol-hasSubscription', + value: true, + }, + ], + }) + + screen.getByText(`You’re on an Overleaf Paid plan.`, { + exact: false, + }) + screen.getByText(`Contact support`, { + exact: false, + }) + }) }) }) diff --git a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx index f3bea0700f..5dbe9a18c5 100644 --- a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx +++ b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx @@ -6,7 +6,10 @@ import { groupPriceByUsageTypeAndSize, plans } from '../fixtures/plans' export function renderWithSubscriptionDashContext( component: React.ReactElement, options?: { - metaTags?: { name: string; value: string | object | Array }[] + metaTags?: { + name: string + value: string | object | Array | boolean + }[] recurlyNotLoaded?: boolean queryingRecurly?: boolean currencyCode?: string