diff --git a/packages/lib/src/components/AmazonPay/components/AmazonPayComponent.tsx b/packages/lib/src/components/AmazonPay/components/AmazonPayComponent.tsx index 420e3e2542..c61696c3a9 100644 --- a/packages/lib/src/components/AmazonPay/components/AmazonPayComponent.tsx +++ b/packages/lib/src/components/AmazonPay/components/AmazonPayComponent.tsx @@ -62,6 +62,8 @@ export default function AmazonPayComponent(props: AmazonPayComponentProps) { { - const { amazonCheckoutSessionId, amount, clientKey, publicKeyId, region, returnUrl } = props; + const { amazonCheckoutSessionId, amount, clientKey, chargePermissionType, publicKeyId, region, recurringMetadata, returnUrl } = props; const request: UpdateAmazonCheckoutSessionRequest = { amount, + chargePermissionType, checkoutResultReturnUrl: returnUrl, checkoutSessionId: amazonCheckoutSessionId, publicKeyId, + recurringMetadata, region }; diff --git a/packages/lib/src/components/AmazonPay/types.ts b/packages/lib/src/components/AmazonPay/types.ts index 8e17f09eaa..f318a77252 100644 --- a/packages/lib/src/components/AmazonPay/types.ts +++ b/packages/lib/src/components/AmazonPay/types.ts @@ -12,10 +12,23 @@ declare global { type ButtonColor = 'Gold' | 'LightGray' | 'DarkGray'; type Placement = 'Home' | 'Product' | 'Cart' | 'Checkout' | 'Other'; type ProductType = 'PayOnly' | 'PayAndShip'; +type ChargePermissionType = 'OneTime' | 'Recurring'; +type FrequencyUnit = 'Year'| 'Month'| 'Week'| 'Day'| 'Variable'; export type Currency = 'EUR' | 'GBP' | 'USD'; export type Region = 'EU' | 'UK' | 'US'; export type SupportedLocale = typeof SUPPORTED_LOCALES_EU[number] | typeof SUPPORTED_LOCALES_US[number]; +export interface RecurringMetadata { + frequency: { + unit: string + value: FrequencyUnit + }, + amount: { + amount: string + currencyCode: Currency + } +} + export interface AmazonPayConfiguration { merchantId?: string; publicKeyId?: string; @@ -30,6 +43,7 @@ export interface AmazonPayElementProps { amount?: PaymentAmount; buttonColor?: ButtonColor; cancelUrl?: string; + chargePermissionType?: ChargePermissionType; clientKey?: string; configuration?: AmazonPayConfiguration; currency?: Currency; @@ -44,6 +58,7 @@ export interface AmazonPayElementProps { payButton?: any; placement?: Placement; productType?: ProductType; + recurringMetadata?: RecurringMetadata; region?: Region; returnUrl?: string; showChangePaymentDetailsButton: boolean; @@ -65,6 +80,7 @@ export interface AmazonPayButtonProps { amazonRef: any; buttonColor?: ButtonColor; cancelUrl?: string; + chargePermissionType?: ChargePermissionType; clientKey?: string; configuration?: AmazonPayConfiguration; currency?: Currency; @@ -75,6 +91,7 @@ export interface AmazonPayButtonProps { onError: (error, component) => void; placement?: Placement; productType?: ProductType; + recurringMetadata?: RecurringMetadata; ref: any; region?: Region; returnUrl?: string; @@ -100,7 +117,9 @@ export interface OrderButtonProps { amazonCheckoutSessionId: string; amount: PaymentAmount; clientKey: string; + chargePermissionType?: ChargePermissionType; onError: (error, component) => void; + recurringMetadata: RecurringMetadata; ref: any; region: Region; returnUrl: string; @@ -180,6 +199,7 @@ export type LedgerCurrencies = { export interface PayloadJSON { addressDetails?: AddressDetails; + chargePermissionType?: ChargePermissionType; deliverySpecifications?: DeliverySpecifications; merchantMetadata?: MerchantMetadata; paymentDetails?: { @@ -188,6 +208,7 @@ export interface PayloadJSON { presentmentCurrency: Currency; totalOrderAmount: ChargeAmount; }; + recurringMetadata?: RecurringMetadata; storeId: string; webCheckoutDetails: { checkoutCancelUrl?: string; @@ -207,10 +228,12 @@ export interface CheckoutDetailsRequest { export interface UpdateAmazonCheckoutSessionRequest { amount: PaymentAmount; + chargePermissionType?: ChargePermissionType; checkoutCancelUrl?: string; checkoutResultReturnUrl: string; checkoutSessionId: string; publicKeyId: string; + recurringMetadata?: RecurringMetadata; region: Region; } diff --git a/packages/lib/src/components/AmazonPay/utils.ts b/packages/lib/src/components/AmazonPay/utils.ts index ece970e158..0ff2ecd806 100644 --- a/packages/lib/src/components/AmazonPay/utils.ts +++ b/packages/lib/src/components/AmazonPay/utils.ts @@ -100,13 +100,24 @@ export function getChargeAmount(amount: PaymentAmount): ChargeAmount { * @returns PayloadJSON */ export function getPayloadJSON(props): PayloadJSON { - const { addressDetails, cancelUrl, checkoutMode, deliverySpecifications, returnUrl, merchantMetadata } = props; + const { + addressDetails, + cancelUrl, + checkoutMode, + deliverySpecifications, + returnUrl, + merchantMetadata, + chargePermissionType, + recurringMetadata, + } = props; + const { storeId } = props.configuration; const isPayNow = checkoutMode === 'ProcessOrder'; const amount = isPayNow ? getChargeAmount(props.amount) : null; return { storeId, + chargePermissionType, webCheckoutDetails: { ...(isPayNow ? { checkoutResultReturnUrl: returnUrl } : { checkoutReviewReturnUrl: returnUrl }), ...(cancelUrl && { checkoutCancelUrl: cancelUrl }), @@ -120,6 +131,7 @@ export function getPayloadJSON(props): PayloadJSON { totalOrderAmount: amount } }), + ...(recurringMetadata && { recurringMetadata }), ...(merchantMetadata && { merchantMetadata }), ...(deliverySpecifications && { deliverySpecifications }), ...(addressDetails && { addressDetails }) diff --git a/packages/playground/src/pages/Wallets/Wallets.js b/packages/playground/src/pages/Wallets/Wallets.js index 59ae2a227a..8c07a5814b 100644 --- a/packages/playground/src/pages/Wallets/Wallets.js +++ b/packages/playground/src/pages/Wallets/Wallets.js @@ -26,13 +26,22 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse = const amazonCheckoutSessionId = urlSearchParams.get('amazonCheckoutSessionId'); const step = urlSearchParams.get('step'); + const chargeOptions = { + // chargePermissionType: 'Recurring', + // recurringMetadata: { + // frequency: { + // unit: 'Month', + // value: '1' + // } + // } + }; + // Initial state if (!step) { window.amazonpay = checkout .create('amazonpay', { - amount, productType: 'PayOnly', - + ...chargeOptions, // Regular checkout: // returnUrl: 'http://localhost:3020/wallets?step=result', // checkoutMode: 'ProcessOrder' @@ -47,16 +56,13 @@ getPaymentMethods({ amount, shopperLocale }).then(async paymentMethodsResponse = if (step === 'review') { window.amazonpay = checkout .create('amazonpay', { + ...chargeOptions, /** * The merchant will receive the amazonCheckoutSessionId attached in the return URL. */ amazonCheckoutSessionId, cancelUrl: 'http://localhost:3020/wallets', returnUrl: 'http://localhost:3020/wallets?step=result', - amount: { - currency: 'GBP', - value: 4700 - } }) .mount('.amazonpay-field'); }