diff --git a/assets/js/blocks/product-collection/inspector-controls/hand-picked-products-control.tsx b/assets/js/blocks/product-collection/inspector-controls/hand-picked-products-control.tsx
index 895a08008f2..b0d14e6b774 100644
--- a/assets/js/blocks/product-collection/inspector-controls/hand-picked-products-control.tsx
+++ b/assets/js/blocks/product-collection/inspector-controls/hand-picked-products-control.tsx
@@ -3,6 +3,7 @@
  */
 import { getProducts } from '@woocommerce/editor-components/utils';
 import { ProductResponseItem } from '@woocommerce/types';
+import { decodeEntities } from '@wordpress/html-entities';
 import { useState, useEffect, useCallback, useMemo } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import {
@@ -17,25 +18,6 @@ import {
  */
 import { QueryControlProps } from '../types';
 
-/**
- * Decodes HTML entities in a string.
- * Example:
- * decodeHTMLEntities( 'foo & bar' ) // 'foo & bar'
- * decodeHTMLEntities( 'Hoodie – Black' ) // 'Hoodie – Black'
- *
- * @param {string} str - The string containing HTML entities.
- * @return {string} - The decoded string.
- */
-function decodeHTMLEntities( str?: string ) {
-	if ( ! str ) {
-		return '';
-	}
-
-	const txt = document.createElement( 'textarea' );
-	txt.innerHTML = str;
-	return txt.value;
-}
-
 /**
  * Returns:
  * - productsMap: Map of products by id and name.
@@ -119,12 +101,12 @@ const HandPickedProductsControl = ( {
 		const parsedToken = Number( token );
 
 		if ( Number.isNaN( parsedToken ) ) {
-			return decodeHTMLEntities( token );
+			return decodeEntities( token ) || '';
 		}
 
 		const product = productsMap.get( parsedToken );
 
-		return decodeHTMLEntities( product?.name );
+		return decodeEntities( product?.name ) || '';
 	};
 
 	return (