Add static class name for product-details (#6914)

* Add a static class name for the product details item instead of the translatable string

* Update Jest snapshot

Co-authored-by: Saad Tarhi <[email protected]>

Author: Alex Florisca

assets/js/base/components/cart-checkout/product-details/index.tsx

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { kebabCase } from 'lodash';
 import { decodeEntities } from '@wordpress/html-entities';
 import type { ProductResponseItemData } from '@woocommerce/type-defs/product-response';
 
@@ -32,15 +31,10 @@ const ProductDetails = ( {
 			{ details.map( ( detail ) => {
 				// Support both `key` and `name` props
 				const name = detail?.key || detail.name || '';
-				const className = name
-					? `wc-block-components-product-details__${ kebabCase(
-							name
-					  ) }`
-					: '';
 				return (
 					<li
 						key={ name + ( detail.display || detail.value ) }
-						className={ className }
+						className="wc-block-components-product-details__item"
 					>
 						{ name && (
 							<>

assets/js/base/components/cart-checkout/product-details/test/__snapshots__/index.js.snap

@@ -5,7 +5,7 @@ exports[`ProductDetails should not render hidden details 1`] = `
   className="wc-block-components-product-details"
 >
   <li
-    className="wc-block-components-product-details__lorem"
+    className="wc-block-components-product-details__item"
   >
     <span
       className="wc-block-components-product-details__name"
@@ -32,7 +32,7 @@ exports[`ProductDetails should render details 1`] = `
   className="wc-block-components-product-details"
 >
   <li
-    className="wc-block-components-product-details__lorem"
+    className="wc-block-components-product-details__item"
   >
     <span
       className="wc-block-components-product-details__name"
@@ -48,7 +48,7 @@ exports[`ProductDetails should render details 1`] = `
     </span>
   </li>
   <li
-    className="wc-block-components-product-details__lorem"
+    className="wc-block-components-product-details__item"
   >
     <span
       className="wc-block-components-product-details__name"
@@ -64,7 +64,7 @@ exports[`ProductDetails should render details 1`] = `
     </span>
   </li>
   <li
-    className=""
+    className="wc-block-components-product-details__item"
   >
     
     <span