From 478002dc32366622953edaa213a4cc393573eb51 Mon Sep 17 00:00:00 2001
From: Philipp Stracker <p.stracker@syde.com>
Date: Thu, 12 Dec 2024 18:29:36 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Introduce=20price-matrix=20and=20cu?=
 =?UTF-8?q?rrency-formatting?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ReusableComponents/PricingTitleBadge.js   | 22 +++++++---
 .../resources/js/utils/countryPriceInfo.js    | 40 +++++++++++--------
 .../resources/js/utils/formatPrice.js         | 34 ++++++++++++++++
 3 files changed, 74 insertions(+), 22 deletions(-)
 create mode 100644 modules/ppcp-settings/resources/js/utils/formatPrice.js

diff --git a/modules/ppcp-settings/resources/js/Components/ReusableComponents/PricingTitleBadge.js b/modules/ppcp-settings/resources/js/Components/ReusableComponents/PricingTitleBadge.js
index 3e89d40d6..33825d96b 100644
--- a/modules/ppcp-settings/resources/js/Components/ReusableComponents/PricingTitleBadge.js
+++ b/modules/ppcp-settings/resources/js/Components/ReusableComponents/PricingTitleBadge.js
@@ -1,8 +1,19 @@
 import { __, sprintf } from '@wordpress/i18n';
 
-import { countryPriceInfo } from '../../utils/countryPriceInfo';
-import TitleBadge, { TITLE_BADGE_INFO } from './TitleBadge';
 import { CommonHooks } from '../../data';
+import { countryPriceInfo } from '../../utils/countryPriceInfo';
+import { formatPrice } from '../../utils/formatPrice';
+import TitleBadge, { TITLE_BADGE_INFO } from './TitleBadge';
+
+const getFixedAmount = ( currency, priceList ) => {
+	if ( priceList[ currency ] ) {
+		return formatPrice( priceList[ currency ], currency );
+	}
+
+	const [ defaultCurrency, defaultPrice ] = Object.entries( priceList )[ 0 ];
+
+	return formatPrice( defaultPrice, defaultCurrency );
+};
 
 const PricingTitleBadge = ( { item } ) => {
 	const { storeCountry } = CommonHooks.useWooSettings();
@@ -13,13 +24,12 @@ const PricingTitleBadge = ( { item } ) => {
 	}
 
 	const percentage = infos[ item ].toFixed( 2 );
-	const fixedFee = `${ infos.currencySymbol }${ infos.fixedFee }`;
+	const fixedAmount = getFixedAmount( storeCountry, infos.fixedFee );
 
 	const label = sprintf(
-		__( 'from %1$s%% + %2$s %3$s', 'woocommerce-paypal-payments' ),
+		__( 'from %1$s%% + %2$s', 'woocommerce-paypal-payments' ),
 		percentage,
-		fixedFee,
-		infos.currencySymbol
+		fixedAmount
 	);
 
 	return (
diff --git a/modules/ppcp-settings/resources/js/utils/countryPriceInfo.js b/modules/ppcp-settings/resources/js/utils/countryPriceInfo.js
index 34bfc8e7f..17504453b 100644
--- a/modules/ppcp-settings/resources/js/utils/countryPriceInfo.js
+++ b/modules/ppcp-settings/resources/js/utils/countryPriceInfo.js
@@ -1,7 +1,8 @@
 export const countryPriceInfo = {
 	US: {
-		currencySymbol: '$',
-		fixedFee: 0.49,
+		fixedFee: {
+			USD: 0.49,
+		},
 		checkout: 3.49,
 		ccf: 2.59,
 		dw: 2.59,
@@ -10,8 +11,9 @@ export const countryPriceInfo = {
 		standardCardFields: 2.99,
 	},
 	UK: {
-		currencySymbol: '£',
-		fixedFee: 0.3,
+		fixedFee: {
+			GPB: 0.3,
+		},
 		checkout: 2.9,
 		ccf: 1.2,
 		dw: 1.2,
@@ -19,8 +21,9 @@ export const countryPriceInfo = {
 		standardCardFields: 1.2,
 	},
 	CA: {
-		currencySymbol: '$',
-		fixedFee: 0.3,
+		fixedFee: {
+			CAD: 0.3,
+		},
 		checkout: 2.9,
 		ccf: 2.7,
 		dw: 2.7,
@@ -28,8 +31,9 @@ export const countryPriceInfo = {
 		standardCardFields: 2.9,
 	},
 	AU: {
-		currencySymbol: '$',
-		fixedFee: 0.3,
+		fixedFee: {
+			AUD: 0.3,
+		},
 		checkout: 2.6,
 		ccf: 1.75,
 		dw: 1.75,
@@ -37,8 +41,9 @@ export const countryPriceInfo = {
 		standardCardFields: 2.6,
 	},
 	FR: {
-		currencySymbol: '€',
-		fixedFee: 0.35,
+		fixedFee: {
+			EUR: 0.35,
+		},
 		checkout: 2.9,
 		ccf: 1.2,
 		dw: 1.2,
@@ -46,8 +51,9 @@ export const countryPriceInfo = {
 		standardCardFields: 1.2,
 	},
 	IT: {
-		currencySymbol: '€',
-		fixedFee: 0.35,
+		fixedFee: {
+			EUR: 0.35,
+		},
 		checkout: 3.4,
 		ccf: 1.2,
 		dw: 1.2,
@@ -55,8 +61,9 @@ export const countryPriceInfo = {
 		standardCardFields: 1.2,
 	},
 	DE: {
-		currencySymbol: '€',
-		fixedFee: 0.39,
+		fixedFee: {
+			EUR: 0.39,
+		},
 		checkout: 2.99,
 		ccf: 2.99,
 		dw: 2.99,
@@ -64,8 +71,9 @@ export const countryPriceInfo = {
 		standardCardFields: 2.99,
 	},
 	ES: {
-		currencySymbol: '€',
-		fixedFee: 0.35,
+		fixedFee: {
+			EUR: 0.35,
+		},
 		checkout: 2.9,
 		ccf: 1.2,
 		dw: 1.2,
diff --git a/modules/ppcp-settings/resources/js/utils/formatPrice.js b/modules/ppcp-settings/resources/js/utils/formatPrice.js
new file mode 100644
index 000000000..56e6b85d9
--- /dev/null
+++ b/modules/ppcp-settings/resources/js/utils/formatPrice.js
@@ -0,0 +1,34 @@
+const priceFormatInfo = {
+	USD: {
+		prefix: '$',
+		suffix: 'USD',
+	},
+	CAD: {
+		prefix: '$',
+		suffix: 'CAD',
+	},
+	AUD: {
+		prefix: '$',
+		suffix: 'AUD',
+	},
+	EUR: {
+		prefix: '€',
+		suffix: '',
+	},
+	GPB: {
+		prefix: '£',
+		suffix: '',
+	},
+};
+
+export const formatPrice = ( value, currency ) => {
+	const currencyInfo = priceFormatInfo[ currency ];
+	const amount = value.toFixed( 2 );
+
+	if ( ! currencyInfo ) {
+		console.error( `Unsupported currency: ${ currency }` );
+		return amount;
+	}
+
+	return `${ currencyInfo.prefix }${ amount } ${ currencyInfo.suffix }`;
+};