🌐 Make discount value a parameter (#1557)

apps/web/src/app/api/stripe/webhook/route.ts

@@ -266,6 +266,8 @@ export async function POST(request: NextRequest) {
             },
             props: {
               name: session.customer_details?.name ?? undefined,
+              discount: 20,
+              couponCode: "GETPRO1Y20",
               recoveryUrl,
             },
           },

packages/emails/locales/en/emails.json

@@ -60,7 +60,7 @@
   "abandoned_checkout_offer": "To help you get started, you can get <b>{{discount}}% off</b> your first year. Just use the code below when you check out:",
   "abandoned_checkout_button": "Upgrade to Rallly Pro",
   "abandoned_checkout_support": "If you have any questions about Rallly Pro or need help with anything at all, just reply to this email. I'm here to help!",
-  "abandoned_checkout_preview": "Exclusive offer: Get 20% off your first year of Rallly Pro!",
-  "abandoned_checkout_subject": "Get 20% off your first year of Rallly Pro",
+  "abandoned_checkout_preview": "Exclusive offer: Get {{discount}}% off your first year of Rallly Pro!",
+  "abandoned_checkout_subject": "Get {{discount}}% off your first year of Rallly Pro",
   "abandoned_checkout_signoff": "Best regards,"
 }

packages/emails/src/previews/abandoned-checkout.tsx

@@ -5,6 +5,8 @@ export default function AbandonedCheckoutEmailPreview() {
   return (
     <AbandonedCheckoutEmail
       ctx={previewEmailContext}
+      discount={20}
+      couponCode="GETPRO1Y20"
       recoveryUrl="https://example.com"
       name="John Doe"
     />

packages/emails/src/templates/abandoned-checkout.tsx

@@ -7,12 +7,16 @@ import type { EmailContext } from "../types";
 
 interface AbandonedCheckoutEmailProps {
   recoveryUrl: string;
+  discount: number;
+  couponCode: string;
   name?: string;
   ctx: EmailContext;
 }
 
 export const AbandonedCheckoutEmail = ({
   recoveryUrl,
+  discount,
+  couponCode,
   name,
   ctx,
 }: AbandonedCheckoutEmailProps) => {
@@ -22,7 +26,8 @@ export const AbandonedCheckoutEmail = ({
       poweredBy={false}
       preview={ctx.t("abandoned_checkout_preview", {
         defaultValue:
-          "Exclusive offer: Get 20% off your first year of Rallly Pro!",
+          "Exclusive offer: Get {{discount}}% off your first year of Rallly Pro!",
+        discount,
         ns: "emails",
       })}
     >
@@ -68,7 +73,7 @@ export const AbandonedCheckoutEmail = ({
           defaults="To help you get started, I'd like to offer you <b>{{discount}}% off your first year</b> with Rallly Pro. Simply use this code during checkout:"
           ns="emails"
           values={{
-            discount: 20,
+            discount,
           }}
           components={{
             b: <b />,
@@ -84,7 +89,7 @@ export const AbandonedCheckoutEmail = ({
               fontWeight: "bold",
             }}
           >
-            GETPRO1Y20
+            {couponCode}
           </Text>
         </Card>
         <Button href={recoveryUrl} id="recoveryUrl">
@@ -131,7 +136,8 @@ AbandonedCheckoutEmail.getSubject = (
   return (
     "🎉 " +
     ctx.t("abandoned_checkout_subject", {
-      defaultValue: "Get 20% off your first year of Rallly Pro",
+      defaultValue: "Get {{discount}}% off your first year of Rallly Pro",
+      discount: props.discount,
       ns: "emails",
     })
   );