Fix: Stripe product name and description violate Stripe's schema resu…

…lting in error 400
aelassas · Feb 6, 2025 · 5fa3aca · 5fa3aca
1 parent 65cc177
commit 5fa3aca
Show file tree

Hide file tree

Showing 7 changed files with 58 additions and 5 deletions.
diff --git a/frontend/src/pages/Checkout.tsx b/frontend/src/pages/Checkout.tsx
@@ -298,13 +298,17 @@ const Checkout = () => {
       let _sessionId: string | undefined
       if (!payLater) {
         if (env.PAYMENT_GATEWAY === movininTypes.PaymentGateway.Stripe) {
+          const name = movininHelper.truncateString(`${env.WEBSITE_NAME} - ${property.name}`, StripeService.ORDER_NAME_MAX_LENGTH)
+          const _description = `${env.WEBSITE_NAME} - ${property.name} - ${daysLabel} - ${location.name}`
+          const description = movininHelper.truncateString(_description, StripeService.ORDER_DESCRIPTION_MAX_LENGTH)
+
           const payload: movininTypes.CreatePaymentPayload = {
             amount: price,
             currency: PaymentService.getCurrency(),
             locale: language,
             receiptEmail: (!authenticated ? renter?.email : user?.email) as string,
-            name: `${property.name} - ${daysLabel} - ${location.name}`,
-            description: `${env.WEBSITE_NAME} Web Service`,
+            name,
+            description,
             customerName: (!authenticated ? renter?.fullName : user?.fullName) as string,
           }
           const res = await StripeService.createCheckoutSession(payload)

diff --git a/frontend/src/services/StripeService.ts b/frontend/src/services/StripeService.ts
@@ -1,6 +1,22 @@
 import * as movininTypes from ':movinin-types'
 import axiosInstance from './axiosInstance'
 
+/**
+ * Order item name max length 250 characters
+ * https://docs.stripe.com/upgrades
+ *
+ * @type {250}
+ */
+export const ORDER_NAME_MAX_LENGTH = 250
+
+/**
+ * Order item description max length 500 characters
+ * https://docs.stripe.com/api/metadata
+ *
+ * @type {500}
+ */
+export const ORDER_DESCRIPTION_MAX_LENGTH = 500
+
 /**
  * Create Checkout Session.
  *

diff --git a/mobile/.env.example b/mobile/.env.example
@@ -14,3 +14,4 @@ MI_STRIPE_PUBLISHABLE_KEY=STRIPE_PUBLISHABLE_KEY
 MI_STRIPE_MERCHANT_IDENTIFIER=MERCHANT_IDENTIFIER
 MI_STRIPE_COUNTRY_CODE=US
 MI_BASE_CURRENCY=USD
+MI_WEBSITE_NAME="Movin' In"
diff --git a/mobile/config/env.config.ts b/mobile/config/env.config.ts
@@ -14,7 +14,8 @@ import {
   MI_STRIPE_PUBLISHABLE_KEY,
   MI_STRIPE_MERCHANT_IDENTIFIER,
   MI_STRIPE_COUNTRY_CODE,
-  MI_BASE_CURRENCY
+  MI_BASE_CURRENCY,
+  MI_WEBSITE_NAME,
 } from '@env'
 
 /**
@@ -68,6 +69,13 @@ export const CURRENCIES: Currency[] = [
  */
 export const APP_TYPE: string = 'frontend'
 
+/**
+ * API host.
+ *
+ * @type {string}
+ */
+export const WEBSITE_NAME: string = String(MI_WEBSITE_NAME || "Movin' In")
+
 /**
  * API host.
  *

diff --git a/mobile/screens/CheckoutScreen.tsx b/mobile/screens/CheckoutScreen.tsx
@@ -425,13 +425,20 @@ const CheckoutScreen = ({ navigation, route }: NativeStackScreenProps<StackParam
       let customerId: string | undefined
       try {
         if (!payLater) {
+          const name = movininHelper.truncateString(`${env.WEBSITE_NAME} - ${property.name}`, StripeService.ORDER_NAME_MAX_LENGTH)
+          const _locale = _fr ? fr : enUS
+          const days = movininHelper.days(from, to)
+          const daysLabel = from && to && `${helper.getDaysShort(days)} (${movininHelper.capitalize(format(from, _format, { locale: _locale }),)} - ${movininHelper.capitalize(format(to, _format, { locale: _locale }))})`
+          const _description = `${env.WEBSITE_NAME} - ${property.name} - ${daysLabel} - ${location.name}`
+          const description = movininHelper.truncateString(_description, StripeService.ORDER_DESCRIPTION_MAX_LENGTH)
+
           const createPaymentIntentPayload: movininTypes.CreatePaymentPayload = {
             amount: price,
             currency,
             locale: language,
             receiptEmail: (!authenticated ? renter?.email : user?.email) as string,
-            name: '',
-            description: "Movin' In Mobile Service",
+            name,
+            description,
             customerName: (!authenticated ? renter?.fullName : user?.fullName) as string,
           }
 

diff --git a/mobile/services/StripeService.ts b/mobile/services/StripeService.ts
@@ -4,6 +4,22 @@ import axiosInstance from './axiosInstance'
 import * as env from '@/config/env.config'
 import * as AsyncStorage from '@/common/AsyncStorage'
 
+/**
+ * Order item name max length 250 characters
+ * https://docs.stripe.com/upgrades
+ *
+ * @type {250}
+ */
+export const ORDER_NAME_MAX_LENGTH = 250
+
+/**
+ * Order item description max length 500 characters
+ * https://docs.stripe.com/api/metadata
+ *
+ * @type {500}
+ */
+export const ORDER_DESCRIPTION_MAX_LENGTH = 500
+
 /**
  * Create Payment Intent
  *

diff --git a/mobile/types/env.d.ts b/mobile/types/env.d.ts
@@ -15,4 +15,5 @@ declare module '@env' {
     export const MI_STRIPE_MERCHANT_IDENTIFIER: string
     export const MI_STRIPE_COUNTRY_CODE: string
     export const MI_BASE_CURRENCY: string
+    export const MI_WEBSITE_NAME: string
 }