Move error to server component

Author: xlisachan

apps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/stay-subscribed/error/page.tsx

@@ -0,0 +1,66 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import { headers } from 'next/headers';
+import { notFound, redirect } from 'next/navigation';
+
+import { SubscriptionParams } from '@fxa/payments/ui';
+import { determineStaySubscribedEligibilityAction } from '@fxa/payments/ui/actions';
+import { ChurnError } from '@fxa/payments/ui/server';
+import { auth } from 'apps/payments/next/auth';
+import { config } from 'apps/payments/next/config';
+
+export default async function LoyaltyDiscountStaySubscribedErrorPage({
+  params,
+  searchParams,
+}: {
+  params: SubscriptionParams;
+  searchParams: Record<string, string> | undefined;
+}) {
+  const { locale, subscriptionId } = params;
+  const acceptLanguage = headers().get('accept-language');
+
+  const session = await auth();
+  if (!session?.user?.id) {
+    const redirectToUrl = new URL(
+      `${config.paymentsNextHostedUrl}/${locale}/subscriptions/landing`
+    );
+    redirectToUrl.search = new URLSearchParams(searchParams).toString();
+    redirect(redirectToUrl.href);
+  }
+
+  const uid = session.user.id;
+
+  const pageContent = await determineStaySubscribedEligibilityAction(
+    uid,
+    subscriptionId,
+    acceptLanguage
+  );
+
+  if (!pageContent) {
+    notFound();
+  }
+
+  const { cmsOfferingContent, reason } = pageContent;
+
+  if (!cmsOfferingContent) {
+    notFound();
+  }
+
+  const staySubscribedContent = pageContent.staySubscribedContent;
+
+  if (staySubscribedContent.flowType !== 'stay_subscribed') {
+    notFound();
+  }
+
+  return (
+    <ChurnError
+      cmsOfferingContent={cmsOfferingContent}
+      locale={locale}
+      reason={reason}
+      pageContent={staySubscribedContent}
+      subscriptionId={subscriptionId}
+    />
+  );
+}

apps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/stay-subscribed/page.tsx

@@ -58,7 +58,7 @@ export default async function LoyaltyDiscountStaySubscribedPage({
 
   if (isErrorReason) {
     redirect(
-      `/${locale}/subscriptions/${subscriptionId}/loyalty-discount/error`
+      `/${locale}/subscriptions/${subscriptionId}/loyalty-discount/stay-subscribed/error`
     );
   }
 

libs/payments/customer/src/lib/subscription.manager.spec.ts

@@ -433,6 +433,9 @@ describe('SubscriptionManager', () => {
         {
           discounts: [{ coupon: mockCouponId }],
           cancel_at_period_end: false,
+          metadata: {
+            cancelled_for_customer_at: '',
+          },
         }
       );
       expect(result).toEqual(mockUpdatedResponse);
@@ -469,7 +472,10 @@ describe('SubscriptionManager', () => {
         mockSubscription.id,
         {
           discounts: [{ coupon: mockCouponId }],
-          cancel_at_period_end: true,
+          cancel_at_period_end: false,
+          metadata: {
+            cancelled_for_customer_at: '',
+          },
         }
       );
       expect(result).toEqual(mockUpdatedResponse);

libs/payments/management/src/lib/churn-intervention.service.spec.ts

@@ -78,18 +78,11 @@ describe('ChurnInterventionService', () => {
         {
           provide: ChurnInterventionManager,
           useValue: {
-            getEntry: jest.fn(),
+            getOrCreateEntry: jest.fn(),
             getRedemptionCountForUid: jest.fn(),
             updateEntry: jest.fn(),
           },
         },
-        {
-          provide: SubscriptionManager,
-          useValue: {
-            getSubscriptionStatus: jest.fn(),
-            applyStripeCouponToSubscription: jest.fn(),
-          },
-        },
         {
           provide: ProductConfigurationManager,
           useValue: {

libs/payments/management/src/lib/subscriptionManagement.service.spec.ts

@@ -192,8 +192,8 @@ describe('SubscriptionManagementService', () => {
           provide: ChurnInterventionService,
           useValue: {
             determineStaySubscribedEligibility: jest.fn(),
-          }
-        }
+          },
+        },
       ],
     }).compile();
 
@@ -313,7 +313,8 @@ describe('SubscriptionManagementService', () => {
       const mockPaymentMethod = StripeResponseFactory(
         StripePaymentMethodFactory({})
       );
-      const mockStaySubscribedCmsChurnEntry = ChurnInterventionByProductIdResultFactory();
+      const mockStaySubscribedCmsChurnEntry =
+        ChurnInterventionByProductIdResultFactory();
       const mockSubscriptionContent = SubscriptionContentFactory();
       const mockPaymentMethodInformation = {
         type: SubPlatPaymentMethodType.Card,
@@ -404,6 +405,7 @@ describe('SubscriptionManagementService', () => {
           isEligible: true,
           reason: 'eligible',
           cmsChurnInterventionEntry: mockStaySubscribedCmsChurnEntry,
+          cmsOfferingContent: null,
         });
 
       const result =
@@ -1527,7 +1529,7 @@ describe('SubscriptionManagementService', () => {
       await expect(
         subscriptionManagementService.setDefaultStripePaymentDetails(
           mockAccountCustomer.uid,
-          'pm_12345',
+          'pm_12345'
         )
       ).rejects.toBeInstanceOf(SetDefaultPaymentAccountCustomerMissingStripeId);
     });

…riptionId]/loyalty-discount/error/en.ftl …/lib/server/components/ChurnError/en.ftlapps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/error/en.ftl renamed to libs/payments/ui/src/lib/server/components/ChurnError/en.ftl apps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/error/en.ftl renamed to libs/payments/ui/src/lib/server/components/ChurnError/en.ftl

@@ -1,4 +1,4 @@
-## LoyaltyDiscountErrorPage
+## Churn flow - Error page
 
 churn-error-page-title-discount-already-applied = Discount code already applied
 # $productName (String) - The name of the product associated with the subscription.

…ptionId]/loyalty-discount/error/page.tsx …b/server/components/ChurnError/index.tsxapps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/error/page.tsx renamed to libs/payments/ui/src/lib/server/components/ChurnError/index.tsx apps/payments/next/app/[locale]/subscriptions/[subscriptionId]/loyalty-discount/error/page.tsx renamed to libs/payments/ui/src/lib/server/components/ChurnError/index.tsx

@@ -5,56 +5,44 @@
 import { headers } from 'next/headers';
 import Image from 'next/image';
 import Link from 'next/link';
-import { notFound, redirect } from 'next/navigation';
 
 import {
   getNextChargeChurnContent,
-  SubscriptionParams,
+  SubPlatPaymentMethodType,
 } from '@fxa/payments/ui';
-import { determineStaySubscribedEligibilityAction } from '@fxa/payments/ui/actions';
-import { getApp } from '@fxa/payments/ui/server';
 import { LinkExternal } from '@fxa/shared/react';
-import { auth } from 'apps/payments/next/auth';
-import { config } from 'apps/payments/next/config';
+import { getApp } from '@fxa/payments/ui/server';
 
-export default async function LoyaltyDiscountErrorPage({
-  params,
-  searchParams,
-}: {
-  params: SubscriptionParams;
-  searchParams: Record<string, string> | undefined;
-}) {
-  const { locale, subscriptionId } = params;
+type ChurnErrorProps = {
+  cmsOfferingContent: any;
+  locale: string;
+  reason: string;
+  pageContent: {
+    flowType: 'cancel' | 'stay_subscribed';
+    active: boolean;
+    cancelAtPeriodEnd: boolean;
+    currency: string;
+    currentPeriodEnd: number;
+    defaultPaymentMethodType?: SubPlatPaymentMethodType;
+    last4?: string;
+    nextInvoiceTax?: number;
+    nextInvoiceTotal?: number;
+    productName: string;
+    webIcon: string;
+  };
+  subscriptionId: string;
+};
+
+export async function ChurnError({
+  cmsOfferingContent,
+  locale,
+  reason,
+  pageContent,
+  subscriptionId,
+}: ChurnErrorProps) {
   const acceptLanguage = headers().get('accept-language');
   const l10n = getApp().getL10n(acceptLanguage);
 
-  const session = await auth();
-  if (!session?.user?.id) {
-    const redirectToUrl = new URL(
-      `${config.paymentsNextHostedUrl}/${locale}/subscriptions/landing`
-    );
-    redirectToUrl.search = new URLSearchParams(searchParams).toString();
-    redirect(redirectToUrl.href);
-  }
-
-  const uid = session.user.id;
-
-  const pageContent = await determineStaySubscribedEligibilityAction(
-    uid,
-    subscriptionId,
-    acceptLanguage
-  );
-
-  if (!pageContent) {
-    notFound();
-  }
-
-  const { cmsOfferingContent, reason, staySubscribedContent } = pageContent;
-
-  if (!cmsOfferingContent) {
-    notFound();
-  }
-
   const { productName, successActionButtonUrl, supportUrl, webIcon } =
     cmsOfferingContent;
 
@@ -148,23 +136,19 @@ export default async function LoyaltyDiscountErrorPage({
         </section>
       );
     case 'subscription_still_active':
-      if (
-        !staySubscribedContent ||
-        staySubscribedContent.flowType !== 'stay_subscribed'
-      ) {
+      if (!pageContent) {
         // Re-render as general error section below
         break;
       }
 
       const nextChargeChurnContent = getNextChargeChurnContent({
-        currency: staySubscribedContent.currency,
-        currentPeriodEnd: staySubscribedContent.currentPeriodEnd,
+        currency: pageContent.currency,
+        currentPeriodEnd: pageContent.currentPeriodEnd,
         locale,
-        defaultPaymentMethodType:
-          staySubscribedContent.defaultPaymentMethodType,
-        last4: staySubscribedContent.last4,
-        nextInvoiceTotal: staySubscribedContent.nextInvoiceTotal,
-        nextInvoiceTax: staySubscribedContent.nextInvoiceTax,
+        defaultPaymentMethodType: pageContent.defaultPaymentMethodType,
+        last4: pageContent.last4,
+        nextInvoiceTotal: pageContent.nextInvoiceTotal,
+        nextInvoiceTax: pageContent.nextInvoiceTax,
       });
 
       return (

libs/payments/ui/src/server.ts

@@ -6,6 +6,7 @@
 export * from './lib/nestapp/app';
 export * from './lib/nestapp/config';
 export * from './lib/config.utils';
+export * from './lib/server/components/ChurnError';
 export * from './lib/server/components/PriceInterval';
 export * from './lib/server/components/SignedIn';
 export * from './lib/server/components/SubscriptionTitle';