fix: tokenized cart support for special characters and local pickup (#…

…9122)

changelog/fix-tokenized-cart-special-chars

@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: fix: tokenized cart support for special characters and local pickup
+
+

client/tokenized-payment-request/transformers/__tests__/wc-to-stripe.test.js

@@ -1,7 +1,10 @@
 /**
  * Internal dependencies
  */
-import { transformPrice } from '../wc-to-stripe';
+import {
+	transformPrice,
+	transformCartDataForShippingOptions,
+} from '../wc-to-stripe';
 
 global.wcpayPaymentRequestParams = {};
 global.wcpayPaymentRequestParams.checkout = {};
@@ -51,4 +54,190 @@ describe( 'wc-to-stripe transformers', () => {
 			);
 		} );
 	} );
+
+	describe( 'transformCartDataForShippingOptions', () => {
+		it( 'transforms shipping rates', () => {
+			expect(
+				transformCartDataForShippingOptions( {
+					shipping_rates: [
+						{
+							package_id: 0,
+							name: 'Shipment 1',
+							destination: {},
+							items: [
+								{
+									key: 'aab3238922bcc25a6f606eb525ffdc56',
+									name: 'Beanie',
+									quantity: 1,
+								},
+							],
+							shipping_rates: [
+								{
+									rate_id: 'flat_rate:14',
+									name: 'CA Flat rate',
+									description: '',
+									delivery_time: '',
+									price: '1000',
+									taxes: '300',
+									instance_id: 14,
+									method_id: 'flat_rate',
+									meta_data: [
+										{
+											key: 'Items',
+											value: 'Beanie × 1',
+										},
+									],
+									selected: true,
+									currency_code: 'USD',
+									currency_symbol: '$',
+									currency_minor_unit: 2,
+									currency_decimal_separator: '.',
+									currency_thousand_separator: ',',
+									currency_prefix: '$',
+									currency_suffix: '',
+								},
+								{
+									rate_id: 'local_pickup:15',
+									name: 'Local pickup',
+									description: '',
+									delivery_time: '',
+									price: '350',
+									taxes: '105',
+									instance_id: 15,
+									method_id: 'local_pickup',
+									meta_data: [
+										{
+											key: 'Items',
+											value: 'Beanie × 1',
+										},
+									],
+									selected: false,
+									currency_code: 'USD',
+									currency_symbol: '$',
+									currency_minor_unit: 2,
+									currency_decimal_separator: '.',
+									currency_thousand_separator: ',',
+									currency_prefix: '$',
+									currency_suffix: '',
+								},
+								{
+									rate_id: 'free_shipping:13',
+									name: 'Free shipping',
+									description: '',
+									delivery_time: '',
+									price: '0',
+									taxes: '0',
+									instance_id: 13,
+									method_id: 'free_shipping',
+									meta_data: [
+										{
+											key: 'Items',
+											value: 'Beanie × 1',
+										},
+									],
+									selected: false,
+									currency_code: 'USD',
+									currency_symbol: '$',
+									currency_minor_unit: 2,
+									currency_decimal_separator: '.',
+									currency_thousand_separator: ',',
+									currency_prefix: '$',
+									currency_suffix: '',
+								},
+							],
+						},
+					],
+				} )
+			).toEqual( [
+				{
+					amount: 1000,
+					detail: '',
+					id: 'flat_rate:14',
+					label: 'CA Flat rate',
+				},
+				{
+					amount: 350,
+					detail: '',
+					id: 'local_pickup:15',
+					label: 'Local pickup',
+				},
+				{
+					amount: 0,
+					detail: '',
+					id: 'free_shipping:13',
+					label: 'Free shipping',
+				},
+			] );
+		} );
+
+		it( 'transforms shipping options for local pickup', () => {
+			expect(
+				transformCartDataForShippingOptions( {
+					shipping_rates: [
+						{
+							package_id: 0,
+							name: 'Shipment 1',
+							destination: {},
+							items: [
+								{
+									key: 'aab3238922bcc25a6f606eb525ffdc56',
+									name: 'Beanie',
+									quantity: 1,
+								},
+							],
+							shipping_rates: [
+								{
+									rate_id: 'pickup_location:1',
+									name:
+										'Local pickup – options coming from WooCommerce Blocks (Australian warehouse)',
+									description: '',
+									delivery_time: '',
+									price: '0',
+									taxes: '0',
+									instance_id: 0,
+									method_id: 'pickup_location',
+									meta_data: [
+										{
+											key: 'pickup_location',
+											value: 'Australian warehouse',
+										},
+										{
+											key: 'pickup_address',
+											value:
+												'42 Wallaby Way, Sydney New South Wales 200, Australia',
+										},
+										{
+											key: 'pickup_details',
+											value: 'Ask for P. Sherman',
+										},
+										{
+											key: 'Items',
+											value: 'Beanie × 1',
+										},
+									],
+									selected: false,
+									currency_code: 'USD',
+									currency_symbol: '$',
+									currency_minor_unit: 2,
+									currency_decimal_separator: '.',
+									currency_thousand_separator: ',',
+									currency_prefix: '$',
+									currency_suffix: '',
+								},
+							],
+						},
+					],
+				} )
+			).toEqual( [
+				{
+					amount: 0,
+					detail:
+						'42 Wallaby Way, Sydney New South Wales 200, Australia - Ask for P. Sherman',
+					id: 'pickup_location:1',
+					label:
+						'Local pickup – options coming from WooCommerce Blocks (Australian warehouse)',
+				},
+			] );
+		} );
+	} );
 } );

client/tokenized-payment-request/transformers/wc-to-stripe.js

@@ -2,6 +2,7 @@
  * External dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -94,7 +95,17 @@ export const transformCartDataForDisplayItems = ( cartData ) => {
 export const transformCartDataForShippingOptions = ( cartData ) =>
 	cartData.shipping_rates[ 0 ].shipping_rates.map( ( rate ) => ( {
 		id: rate.rate_id,
-		label: rate.name,
+		label: decodeEntities( rate.name ),
 		amount: transformPrice( parseInt( rate.price, 10 ), rate ),
-		detail: '',
+		detail: [
+			rate.meta_data.find(
+				( metadata ) => metadata.key === 'pickup_address'
+			)?.value,
+			rate.meta_data.find(
+				( metadata ) => metadata.key === 'pickup_details'
+			)?.value,
+		]
+			.filter( Boolean )
+			.map( decodeEntities )
+			.join( ' - ' ),
 	} ) );