From d53c5a222202705dde2a6d017000f9df102c868b Mon Sep 17 00:00:00 2001
From: Herman <KokkieH@users.noreply.github.com>
Date: Tue, 10 Sep 2024 09:25:24 +0200
Subject: [PATCH] Fix in-app product card descriptions (#51228)

* Add classname to description section for business service card

* Decode HTML entities in product descriptions

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Raja sekar <raja.sekar.manimaran@automattic.com>
---
 .../marketplace/components/product-card/product-card.tsx | 9 +++++++--
 .../51228-fix-wccom-21571-business-services-description  | 4 ++++
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 plugins/woocommerce/changelog/51228-fix-wccom-21571-business-services-description

diff --git a/plugins/woocommerce-admin/client/marketplace/components/product-card/product-card.tsx b/plugins/woocommerce-admin/client/marketplace/components/product-card/product-card.tsx
index 7b8aba159fa..79585e83189 100644
--- a/plugins/woocommerce-admin/client/marketplace/components/product-card/product-card.tsx
+++ b/plugins/woocommerce-admin/client/marketplace/components/product-card/product-card.tsx
@@ -6,6 +6,7 @@ import { Card } from '@wordpress/components';
 import clsx from 'clsx';
 import { ExtraProperties, queueRecordEvent } from '@woocommerce/tracks';
 import { useQuery } from '@woocommerce/navigation';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -161,6 +162,8 @@ function ProductCard( props: ProductCardProps ): JSX.Element {
 		</a>
 	);
 
+	const decodedDescription = decodeEntities( product.description );
+
 	const BusinessService = () => (
 		<div className="woocommerce-marketplace__business-card">
 			<div
@@ -174,7 +177,9 @@ function ProductCard( props: ProductCardProps ): JSX.Element {
 					<h2>
 						<CardLink />
 					</h2>
-					<p>{ product.description }</p>
+					<p className="woocommerce-marketplace__product-card__description">
+						{ decodedDescription }
+					</p>
 				</div>
 				<div className="woocommerce-marketplace__business-card__badge">
 					<span>{ product.productCategory }</span>
@@ -265,7 +270,7 @@ function ProductCard( props: ProductCardProps ): JSX.Element {
 					</div>
 					{ ! isTheme && (
 						<p className="woocommerce-marketplace__product-card__description">
-							{ ! isLoading && product.description }
+							{ ! isLoading && decodedDescription }
 						</p>
 					) }
 					<footer className="woocommerce-marketplace__product-card__footer">
diff --git a/plugins/woocommerce/changelog/51228-fix-wccom-21571-business-services-description b/plugins/woocommerce/changelog/51228-fix-wccom-21571-business-services-description
new file mode 100644
index 00000000000..7f67964ff9a
--- /dev/null
+++ b/plugins/woocommerce/changelog/51228-fix-wccom-21571-business-services-description
@@ -0,0 +1,4 @@
+Significance: patch
+Type: tweak
+
+Minor fixes to product descriptions on the Extensions screen.
\ No newline at end of file