From 5aa2c22d65674b8f95a3d53c17752331a1300cb0 Mon Sep 17 00:00:00 2001 From: aelassas Date: Mon, 6 May 2024 19:31:37 +0100 Subject: [PATCH] Add Google Pay and Apple Pay to Mobile App --- frontend/.env.example | 1 + frontend/src/config/env.config.ts | 15 +++++++++++---- frontend/src/pages/Checkout.tsx | 4 +--- mobile/.env.example | 3 +++ mobile/App.tsx | 2 +- mobile/config/env.config.ts | 27 ++++++++++++++++++++++++++- mobile/screens/Checkout.tsx | 5 +---- mobile/types/env.d.ts | 3 +++ 8 files changed, 47 insertions(+), 13 deletions(-) diff --git a/frontend/.env.example b/frontend/.env.example index 90da5547..244a31e5 100644 --- a/frontend/.env.example +++ b/frontend/.env.example @@ -15,3 +15,4 @@ REACT_APP_MI_PROPERTY_IMAGE_HEIGHT=200 REACT_APP_MI_MINIMUM_AGE=21 REACT_APP_MI_PAGINATION_MODE=classic REACT_APP_MI_STRIPE_PUBLISHABLE_KEY=STRIPE_PUBLISHABLE_KEY +REACT_APP_BC_STRIPE_CURRENCY_CODE=USD diff --git a/frontend/src/config/env.config.ts b/frontend/src/config/env.config.ts index 8de6ca81..8ee732a9 100644 --- a/frontend/src/config/env.config.ts +++ b/frontend/src/config/env.config.ts @@ -41,16 +41,23 @@ const env = { RECAPTCHA_ENABLED: (process.env.REACT_APP_MI_RECAPTCHA_ENABLED && process.env.REACT_APP_MI_RECAPTCHA_ENABLED.toLowerCase()) === 'true', RECAPTCHA_SITE_KEY: String(process.env.REACT_APP_MI_RECAPTCHA_SITE_KEY), MINIMUM_AGE: Number.parseInt(String(process.env.REACT_APP_MI_MINIMUM_AGE), 10) || 21, - // PAGINATION_MODE: CLASSIC or INFINITE_SCROLL - // If you choose CLASSIC, you will get a classic pagination with next and previous buttons on desktop and infinite scroll on mobile. - // If you choose INFINITE_SCROLL, you will get infinite scroll on desktop and mobile. - // Defaults to CLASSIC + /** + * PAGINATION_MODE: CLASSIC or INFINITE_SCROLL + * If you choose CLASSIC, you will get a classic pagination with next and previous buttons on desktop and infinite scroll on mobile. + * If you choose INFINITE_SCROLL, you will get infinite scroll on desktop and mobile. + * Default is CLASSIC + */ PAGINATION_MODE: (process.env.REACT_APP_MI_PAGINATION_MODE && process.env.REACT_APP_MI_PAGINATION_MODE.toUpperCase()) === Const.PAGINATION_MODE.INFINITE_SCROLL ? Const.PAGINATION_MODE.INFINITE_SCROLL : Const.PAGINATION_MODE.CLASSIC, SIZE_UNIT: 'm²', STRIPE_PUBLISHABLE_KEY: String(process.env.REACT_APP_MI_STRIPE_PUBLISHABLE_KEY), + /** + * The three-letter ISO 4217 alphabetic currency code, e.g. "USD" or "EUR". Required for Stripe payments. Default is "USD". + * Must be a supported currency: https://docs.stripe.com/currencies + * */ + STRIPE_CURRENCY_CODE: String(process.env.REACT_APP_BC_STRIPE_CURRENCY_CODE || 'USD') } export default env diff --git a/frontend/src/pages/Checkout.tsx b/frontend/src/pages/Checkout.tsx index 3f10713f..ffafc525 100644 --- a/frontend/src/pages/Checkout.tsx +++ b/frontend/src/pages/Checkout.tsx @@ -282,9 +282,7 @@ const Checkout = () => { if (!payLater) { const payload: movininTypes.CreatePaymentPayload = { amount: price, - // Supported currencies for the moment: usd, eur - // Must be a supported currency: https://docs.stripe.com/currencies - currency: commonStrings.CURRENCY === '$' ? 'usd' : commonStrings.CURRENCY === '€' ? 'eur' : '', + currency: env.STRIPE_CURRENCY_CODE, locale: language, receiptEmail: (!authenticated ? renter?.email : user?.email) as string, name: `${property.name} diff --git a/mobile/.env.example b/mobile/.env.example index a2216a6d..e9ecc2a6 100644 --- a/mobile/.env.example +++ b/mobile/.env.example @@ -11,3 +11,6 @@ MI_PROPERTY_IMAGE_WIDTH=300 MI_PROPERTY_IMAGE_HEIGHT=200 MI_MINIMUM_AGE=21 MI_STRIPE_PUBLISHABLE_KEY=STRIPE_PUBLISHABLE_KEY +MI_STRIPE_MERCHANT_IDENTIFIER=MERCHANT_IDENTIFIER +MI_STRIPE_COUNTRY_CODE=US +MI_STRIPE_CURRENCY_CODE=USD diff --git a/mobile/App.tsx b/mobile/App.tsx index 2c21134f..384e141c 100644 --- a/mobile/App.tsx +++ b/mobile/App.tsx @@ -106,7 +106,7 @@ const App = () => { - + diff --git a/mobile/config/env.config.ts b/mobile/config/env.config.ts index 61f9b39e..12c726f0 100644 --- a/mobile/config/env.config.ts +++ b/mobile/config/env.config.ts @@ -11,7 +11,10 @@ import { MI_PROPERTY_IMAGE_WIDTH, MI_PROPERTY_IMAGE_HEIGHT, MI_MINIMUM_AGE, - MI_STRIPE_PUBLISHABLE_KEY + MI_STRIPE_PUBLISHABLE_KEY, + MI_STRIPE_MERCHANT_IDENTIFIER, + MI_STRIPE_COUNTRY_CODE, + MI_STRIPE_CURRENCY_CODE } from '@env' /** @@ -162,3 +165,25 @@ export const SIZE_UNIT = 'm²' * @type {string} */ export const STRIPE_PUBLISHABLE_KEY: string = MI_STRIPE_PUBLISHABLE_KEY + +/** + * The merchant identifier you registered with Apple for use with Apple Pay. + * + * @type {string} + */ +export const STRIPE_MERCHANT_IDENTIFIER: string = MI_STRIPE_MERCHANT_IDENTIFIER + +/** + * The two-letter ISO 3166 code of the country of your business, e.g. "US". Required for Stripe payments. + * + * @type {string} + */ +export const STRIPE_COUNTRY_CODE: string = MI_STRIPE_COUNTRY_CODE.toUpperCase() + +/** + * The three-letter ISO 4217 alphabetic currency code, e.g. "USD" or "EUR". Required for Stripe payments. + * Must be a supported currency: https://docs.stripe.com/currencies + * + * @type {string} + */ +export const STRIPE_CURRENCY_CODE: string = MI_STRIPE_CURRENCY_CODE.toUpperCase() diff --git a/mobile/screens/Checkout.tsx b/mobile/screens/Checkout.tsx index 0c0fd03d..d1c0d31e 100644 --- a/mobile/screens/Checkout.tsx +++ b/mobile/screens/Checkout.tsx @@ -416,12 +416,9 @@ const CheckoutScreen = ({ navigation, route }: NativeStackScreenProps