Address deprecation issues from Buttons flex layout PR. (#36192)

* Address deprecation issues from Buttons flex layout PR. * Simplify migration logic. * update fixtures Co-authored-by: ntsekouras <[email protected]>
WordPress · Nov 10, 2021 · 216df9e · 216df9e
1 parent 3606ae5
commit 216df9e
Show file tree

Hide file tree

Showing 7 changed files with 15 additions and 28 deletions.
diff --git a/packages/block-library/src/buttons/deprecated.js b/packages/block-library/src/buttons/deprecated.js
@@ -15,18 +15,20 @@ const migrateWithLayout = ( attributes ) => {
 		return attributes;
 	}
 
-	const { contentJustification, orientation } = attributes;
-
-	const updatedAttributes = {
-		...attributes,
-	};
+	const {
+		contentJustification,
+		orientation,
+		...updatedAttributes
+	} = attributes;
 
 	if ( contentJustification || orientation ) {
 		Object.assign( updatedAttributes, {
 			layout: {
 				type: 'flex',
-				justifyContent: contentJustification || 'left',
-				orientation: orientation || 'horizontal',
+				...( contentJustification && {
+					justifyContent: contentJustification,
+				} ),
+				...( orientation && { orientation } ),
 			},
 		} );
 	}
@@ -57,7 +59,8 @@ const deprecated = [
 				},
 			},
 		},
-		isEligible: ( { layout } ) => ! layout,
+		isEligible: ( { contentJustification, orientation } ) =>
+			!! contentJustification || !! orientation,
 		migrate: migrateWithLayout,
 		save( { attributes: { contentJustification, orientation } } ) {
 			return (

diff --git a/packages/block-library/src/buttons/edit.js b/packages/block-library/src/buttons/edit.js
@@ -2,7 +2,6 @@
  * WordPress dependencies
  */
 import {
-	BlockControls,
 	useBlockProps,
 	useInnerBlocksProps,
 	store as blockEditorStore,
@@ -39,10 +38,6 @@ function ButtonsEdit( { attributes: { layout = {} } } ) {
 
 	return (
 		<>
-			<BlockControls
-				group="block"
-				__experimentalShareWithChildBlocks
-			></BlockControls>
 			<div { ...innerBlocksProps } />
 		</>
 	);

diff --git a/test/integration/fixtures/blocks/core__buttons__deprecated-1.json b/test/integration/fixtures/blocks/core__buttons__deprecated-1.json
@@ -4,11 +4,9 @@
 		"name": "core/buttons",
 		"isValid": true,
 		"attributes": {
-			"contentJustification": "center",
 			"layout": {
 				"type": "flex",
-				"justifyContent": "center",
-				"orientation": "horizontal"
+				"justifyContent": "center"
 			}
 		},
 		"innerBlocks": [

diff --git a/test/integration/fixtures/blocks/core__buttons__deprecated-1.serialized.html b/test/integration/fixtures/blocks/core__buttons__deprecated-1.serialized.html
@@ -1,4 +1,4 @@
-<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","orientation":"horizontal"}} -->
+<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
 <div class="wp-block-buttons"><!-- wp:button -->
 <div class="wp-block-button"><a class="wp-block-button__link">My button 1</a></div>
 <!-- /wp:button -->

diff --git a/test/integration/fixtures/blocks/core__buttons__deprecated-2.json b/test/integration/fixtures/blocks/core__buttons__deprecated-2.json
@@ -4,8 +4,6 @@
 		"name": "core/buttons",
 		"isValid": true,
 		"attributes": {
-			"contentJustification": "center",
-			"orientation": "horizontal",
 			"align": "wide",
 			"layout": {
 				"type": "flex",

diff --git a/test/integration/fixtures/blocks/core_buttons__simple__deprecated.json b/test/integration/fixtures/blocks/core_buttons__simple__deprecated.json
@@ -3,14 +3,7 @@
 		"clientId": "_clientId_0",
 		"name": "core/buttons",
 		"isValid": true,
-		"attributes": {
-			"orientation": "horizontal",
-			"layout": {
-				"type": "flex",
-				"justifyContent": "left",
-				"orientation": "horizontal"
-			}
-		},
+		"attributes": {},
 		"innerBlocks": [
 			{
 				"clientId": "_clientId_0",

diff --git a/test/integration/fixtures/blocks/core_buttons__simple__deprecated.serialized.html b/test/integration/fixtures/blocks/core_buttons__simple__deprecated.serialized.html
@@ -1,4 +1,4 @@
-<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"left","orientation":"horizontal"}} -->
+<!-- wp:buttons -->
 <div class="wp-block-buttons"><!-- wp:button -->
 <div class="wp-block-button"><a class="wp-block-button__link">My button 1</a></div>
 <!-- /wp:button -->