Translate hard coded strings in the fees tooltip breakdown (#10004)

Automattic · Dec 20, 2024 · 779ef47 · 779ef47
1 parent 915fcc8
commit 779ef47
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 4 deletions.
diff --git a/changelog/fix-8620-fee-types-in-fees-brakedown-tooltip-are-not-internationalised b/changelog/fix-8620-fee-types-in-fees-brakedown-tooltip-are-not-internationalised
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Use translatable strings on the fee breakdown tooltip of the payment settings screen.
diff --git a/client/utils/account-fees.tsx b/client/utils/account-fees.tsx
@@ -143,7 +143,7 @@ export const formatMethodFeesTooltip = (
 	return (
 		<div className={ 'wcpay-fees-tooltip' }>
 			<div>
-				<div>Base fee</div>
+				<div>{ __( 'Base fee', 'woocommerce-payments' ) }</div>
 				<div>
 					{ getFeeDescriptionString(
 						accountFees.base,
@@ -153,7 +153,12 @@ export const formatMethodFeesTooltip = (
 			</div>
 			{ hasFees( accountFees.additional ) ? (
 				<div>
-					<div>International payment method fee</div>
+					<div>
+						{ __(
+							'International payment method fee',
+							'woocommerce-payments'
+						) }
+					</div>
 					<div>
 						{ getFeeDescriptionString(
 							accountFees.additional,
@@ -166,14 +171,21 @@ export const formatMethodFeesTooltip = (
 			) }
 			{ hasFees( accountFees.fx ) ? (
 				<div>
-					<div>Currency conversion fee</div>
+					<div>
+						{ __(
+							'Currency conversion fee',
+							'woocommerce-payments'
+						) }
+					</div>
 					<div>{ getFeeDescriptionString( accountFees.fx ) }</div>
 				</div>
 			) : (
 				''
 			) }
 			<div>
-				<div>Total per transaction</div>
+				<div>
+					{ __( 'Total per transaction', 'woocommerce-payments' ) }
+				</div>
 				<div className={ 'wcpay-fees-tooltip__bold' }>
 					{ getFeeDescriptionString( total ) }
 				</div>