Replace ChoiceCard destinationUrl with destination (#1431)

* Replace ChoiceCard destinationUrl with destination

* changeset

* prettier

Author: tomrf1

.changeset/empty-tigers-serve.md

@@ -0,0 +1,5 @@
+---
+'@guardian/support-dotcom-components': minor
+---
+
+Replace ChoiceCard destinationUrl with destination

src/server/lib/choiceCards/choiceCards.test.ts

@@ -93,15 +93,15 @@ describe('getChoiceCardsSettings', () => {
             supportTier: 'SupporterPlus',
             ratePlan: 'Monthly',
         });
-        expect(result?.choiceCards[1].destinationUrl).toBeNull();
+        expect(result?.choiceCards[1].destination).toEqual('LandingPage');
     });
 
-    it('preserves custom destinationUrl when provided', () => {
+    it('preserves custom destination when provided', () => {
         const variantChoiceCardSettings: ChoiceCardsSettings = {
             choiceCards: [
                 {
                     ...defaultEpicChoiceCardsSettings('UnitedStates').choiceCards[0],
-                    destinationUrl: 'https://support.theguardian.com/contribute/one-time',
+                    destination: 'Checkout',
                 },
                 defaultEpicChoiceCardsSettings('UnitedStates').choiceCards[1],
                 defaultEpicChoiceCardsSettings('UnitedStates').choiceCards[2],
@@ -119,9 +119,7 @@ describe('getChoiceCardsSettings', () => {
         );
 
         expect(result).toBeDefined();
-        expect(result?.choiceCards[0].destinationUrl).toEqual(
-            'https://support.theguardian.com/contribute/one-time',
-        );
+        expect(result?.choiceCards[0].destination).toEqual('Checkout');
     });
 
     it('returns choice cards with monthly discount (PROMO_B) applied', () => {

src/server/lib/choiceCards/choiceCards.ts

@@ -83,7 +83,7 @@ const enrichChoiceCard = (
         benefitsLabel: choiceCard.benefitsLabel,
         benefits,
         pill,
-        destinationUrl: choiceCard.destinationUrl, // Preserve the destination URL
+        destination: choiceCard.destination,
     };
 };
 

src/server/lib/choiceCards/defaultChoiceCardSettings.ts

@@ -20,7 +20,7 @@ const oneOffCard = (countryGroupId: CountryGroupId): ChoiceCard => ({
                     : 'We welcome support of any size, any time',
         },
     ],
-    destinationUrl: null, // Will use default CTA behavior
+    destination: 'LandingPage',
 });
 
 const fullChoiceCards = (countryGroupId: CountryGroupId): ChoiceCard[] => [
@@ -36,7 +36,7 @@ const fullChoiceCards = (countryGroupId: CountryGroupId): ChoiceCard[] => [
                 copy: 'Give to the Guardian every month with Support',
             },
         ],
-        destinationUrl: null, // Will use default CTA behavior
+        destination: 'LandingPage',
     },
     {
         product: {
@@ -58,7 +58,7 @@ const fullChoiceCards = (countryGroupId: CountryGroupId): ChoiceCard[] => [
         pill: {
             copy: 'Recommended',
         },
-        destinationUrl: null, // Will use default CTA behavior
+        destination: 'LandingPage',
     },
     oneOffCard(countryGroupId),
 ];
@@ -91,7 +91,7 @@ const shorterChoiceCards = (countryGroupId: CountryGroupId): ChoiceCard[] => [
         pill: {
             copy: 'Recommended',
         },
-        destinationUrl: null, // Will use default CTA behavior
+        destination: 'LandingPage',
     },
     oneOffCard(countryGroupId),
 ];

src/shared/types/props/choiceCards.ts

@@ -29,14 +29,16 @@ const pillSchema = z.object({
     backgroundColour: hexColourSchema.nullish(),
 });
 
+const destinationSchema = z.union([z.literal('LandingPage'), z.literal('Checkout')]);
+
 const choiceCardSchema = z.object({
     product: productSchema,
     label: z.string(), // e.g. "Support $15/month"
     isDefault: z.boolean(), // default selected choice card
     benefitsLabel: z.string().nullish(), // e.g. "Unlock All-access digital benefits:"
     benefits: z.array(productBenefitSchema),
     pill: pillSchema.nullish(),
-    destinationUrl: z.string().nullish(), // Optional override URL for this choice card
+    destination: destinationSchema.nullish(),
 });
 
 export type ChoiceCard = z.infer<typeof choiceCardSchema>;