Merge pull request #24739 from overleaf/dk-thankyou-page

Update "thanks for subscribing page" with AI Assist links

GitOrigin-RevId: 41a23d6fd5edfc8f9ad0f97e513e1ea66aed5bdc

services/web/frontend/extracted-translations.json

@@ -626,7 +626,9 @@
   "get_error_assist": "",
   "get_exclusive_access_to_labs": "",
   "get_in_touch": "",
-  "get_most_subscription_discover_premium_features": "",
+  "get_most_subscription_by_checking_ai_writefull": "",
+  "get_most_subscription_by_checking_overleaf": "",
+  "get_most_subscription_by_checking_overleaf_ai_writefull": "",
   "get_real_time_track_changes": "",
   "git": "",
   "git_authentication_token": "",

services/web/frontend/js/features/subscription/components/dashboard/premium-features-link.tsx

@@ -1,10 +1,63 @@
 import { Trans } from 'react-i18next'
+import { Subscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { AI_ADD_ON_CODE, isStandaloneAiPlanCode } from '../../data/add-on-codes'
+
+function PremiumFeaturesLink({
+  subscription,
+}: {
+  subscription?: Subscription
+}) {
+  const hasAiAddon = subscription?.addOns?.some(
+    addOn => addOn.addOnCode === AI_ADD_ON_CODE
+  )
+  const onAiStandalonePlan = isStandaloneAiPlanCode(subscription?.planCode)
+
+  if (onAiStandalonePlan) {
+    return (
+      <p>
+        <Trans
+          i18nKey="get_most_subscription_by_checking_ai_writefull"
+          components={[
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/latex/Error_Assist" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a
+              href="https://help.writefull.com/writefull-for-overleaf--user-guide"
+              target="_blank"
+              rel="noopener"
+            />,
+          ]}
+        />
+      </p>
+    )
+  }
+
+  if (hasAiAddon) {
+    return (
+      <p>
+        <Trans
+          i18nKey="get_most_subscription_by_checking_overleaf_ai_writefull"
+          components={[
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/how-to/Overleaf_premium_features" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/latex/Error_Assist" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a
+              href="https://help.writefull.com/writefull-for-overleaf--user-guide"
+              target="_blank"
+              rel="noopener"
+            />,
+          ]}
+        />
+      </p>
+    )
+  }
 
-function PremiumFeaturesLink() {
   return (
     <p>
       <Trans
-        i18nKey="get_most_subscription_discover_premium_features"
+        i18nKey="get_most_subscription_by_checking_overleaf"
         components={[
           // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
           <a href="/learn/how-to/Overleaf_premium_features" />,

services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx

@@ -21,6 +21,7 @@ function SubscriptionDashboard() {
     hasDisplayedSubscription,
     hasSubscription,
     hasValidActiveSubscription,
+    personalSubscription,
   } = useSubscriptionDashboardContext()
 
   const fromPlansPage = getMeta('ol-fromPlansPage')
@@ -49,7 +50,9 @@ function SubscriptionDashboard() {
               <ManagedPublishers />
               <GroupSubscriptionMemberships />
               <InstitutionMemberships />
-              {hasValidActiveSubscription && <PremiumFeaturesLink />}
+              {hasValidActiveSubscription && (
+                <PremiumFeaturesLink subscription={personalSubscription} />
+              )}
               {!hasDisplayedSubscription &&
                 (hasSubscription ? <ContactSupport /> : <FreePlan />)}
             </div>

services/web/frontend/js/features/subscription/components/successful-subscription/successful-subscription.tsx

@@ -80,7 +80,7 @@ function SuccessfulSubscription() {
               subscription={subscription}
               onAiStandalonePlan={onAiStandalonePlan}
             />
-            {!onAiStandalonePlan && <PremiumFeaturesLink />}
+            <PremiumFeaturesLink subscription={subscription} />
             <p>
               {t('need_anything_contact_us_at')}&nbsp;
               <a href={`mailto:${adminEmail}`} rel="noopener noreferrer">

services/web/frontend/js/features/subscription/data/add-on-codes.ts

@@ -4,10 +4,10 @@ import { PendingPaymentProviderPlan } from "../../../../../types/subscription/pl
 export const AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE = 'assistant'
 export const AI_ADD_ON_CODE = 'assistant'
 // we dont want translations on plan or add-on names
-export const ADD_ON_NAME = "Error Assist"
+export const ADD_ON_NAME = "AI Assist"
 export const AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE = 'assistant-annual'
 
-export function isStandaloneAiPlanCode(planCode: string) {
+export function isStandaloneAiPlanCode(planCode?: string) {
   return planCode === AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE || planCode === AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE
 }
 

services/web/locales/en.json

@@ -827,7 +827,9 @@
   "get_in_touch": "Get in touch",
   "get_in_touch_having_problems": "<a href=\"__link__\">Get in touch with support</a> if you’re having problems",
   "get_involved": "Get involved",
-  "get_most_subscription_discover_premium_features": "Get the most from your __appName__ subscription. <0>Discover premium features</0>.",
+  "get_most_subscription_by_checking_ai_writefull": "Get the most out of your subscription by checking out <0>Overleaf’s AI features</0> and <1>Writefull’s features</1>.",
+  "get_most_subscription_by_checking_overleaf": "Get the most out of your subscription by checking out <0>Overleaf’s features</0>.",
+  "get_most_subscription_by_checking_overleaf_ai_writefull": "Get the most out of your subscription by checking out <0>Overleaf’s features</0>, <1>Overleaf’s AI features</1> and <2>Writefull’s features</2>.",
   "get_real_time_track_changes": "Get real-time track changes",
   "get_the_best_overleaf_experience": "Get the best Overleaf experience",
   "get_the_most_out_headline": "Get the most out of __appName__ with features such as:",

services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx

@@ -32,7 +32,7 @@ describe('<SubscriptionDashboard />', function () {
     })
 
     it('renders the "Get the most from your subscription" text', function () {
-      screen.getByText(/get the most from your Overleaf subscription/i)
+      screen.getByText(/Get the most out of your subscription/i)
     })
   })
 
@@ -42,7 +42,7 @@ describe('<SubscriptionDashboard />', function () {
     })
 
     it('does not render the "Get the most out of your" subscription text', function () {
-      const text = screen.queryByText('Get the most out of your', {
+      const text = screen.queryByText('Get the most out of your subscription', {
         exact: false,
       })
       expect(text).to.be.null

services/web/test/frontend/features/subscription/components/successful-subscription/successful-subscription.test.tsx

@@ -43,8 +43,8 @@ describe('successful subscription page', function () {
     screen.getByText(
       /it’s support from people like yourself that allows .* to continue to grow and improve/i
     )
-    expect(screen.getByText(/get the most from your/i).textContent).to.match(
-      /get the most from your .* subscription\. discover premium features/i
+    expect(screen.getByText(/get the most out of your/i).textContent).to.match(
+      /get the most out of your subscription by checking out Overleaf’s features/i
     )
     expect(
       screen
@@ -73,7 +73,7 @@ describe('successful subscription page', function () {
     )
 
     const helpLink = screen.getByRole('link', {
-      name: /discover premium features/i,
+      name: /Overleaf’s features/i,
     })
     expect(helpLink.getAttribute('href')).to.equal(
       '/learn/how-to/Overleaf_premium_features'