From 829fdeca5d3df7cb49659920683dfc386e4dbb71 Mon Sep 17 00:00:00 2001
From: Hritik Chaudhary <hritikshiwach7@gmail.com>
Date: Mon, 25 Sep 2023 20:27:59 +0530
Subject: [PATCH] Remove data attributes from being saved in html of All
 products block (#10032)

* Remove data attributes from being saved in html of All products block

* added old save in deprecated

* Addressed review comments

---------

Co-authored-by: Tung Du <dinhtungdu@gmail.com>
Co-authored-by: Roy Ho <roykho77@gmail.com>
---
 .../products/all-products/deprecated.js       | 30 ++++++++++++++++++-
 .../js/blocks/products/all-products/save.js   | 10 -------
 2 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/assets/js/blocks/products/all-products/deprecated.js b/assets/js/blocks/products/all-products/deprecated.js
index 5a5aadbf684..48e118f3c60 100644
--- a/assets/js/blocks/products/all-products/deprecated.js
+++ b/assets/js/blocks/products/all-products/deprecated.js
@@ -33,4 +33,32 @@ const v1 = {
 	},
 };
 
-export default [ v1 ];
+const v2 = {
+	attributes: Object.assign( {}, attributeDefinitions, {
+		rows: { type: 'number', default: 1 },
+	} ),
+	save( { attributes } ) {
+		const dataAttributes = {};
+		Object.keys( attributes )
+			.sort()
+			.forEach( ( key ) => {
+				dataAttributes[ key ] = attributes[ key ];
+			} );
+		const data = {
+			'data-attributes': JSON.stringify( dataAttributes ),
+		};
+		return (
+			<div
+				className={ getBlockClassName(
+					'wc-block-all-products',
+					attributes
+				) }
+				{ ...data }
+			>
+				<InnerBlocks.Content />
+			</div>
+		);
+	},
+};
+
+export default [ v2, v1 ];
diff --git a/assets/js/blocks/products/all-products/save.js b/assets/js/blocks/products/all-products/save.js
index 108ae322d63..6f620e64e97 100644
--- a/assets/js/blocks/products/all-products/save.js
+++ b/assets/js/blocks/products/all-products/save.js
@@ -9,22 +9,12 @@ import { InnerBlocks } from '@wordpress/block-editor';
 import { getBlockClassName } from '../utils.js';
 
 export default function save( { attributes } ) {
-	const dataAttributes = {};
-	Object.keys( attributes )
-		.sort()
-		.forEach( ( key ) => {
-			dataAttributes[ key ] = attributes[ key ];
-		} );
-	const data = {
-		'data-attributes': JSON.stringify( dataAttributes ),
-	};
 	return (
 		<div
 			className={ getBlockClassName(
 				'wc-block-all-products',
 				attributes
 			) }
-			{ ...data }
 		>
 			<InnerBlocks.Content />
 		</div>