From 584524a561079a905291eb06ba7c29f2dca098cd Mon Sep 17 00:00:00 2001
From: Artemio Morales <artemio.morales@a8c.com>
Date: Mon, 17 Jun 2024 10:35:12 +0200
Subject: [PATCH] Save Panel: Remove connections icon and fix padding (#62542)

* Remove connections icon and fix padding

* Reuse Global Styles changes design for meta changes

* Update test

Co-authored-by: artemiomorales <artemiosans@git.wordpress.org>
Co-authored-by: cbravobernal <cbravobernal@git.wordpress.org>
Co-authored-by: SantosGuillamot <santosguillamot@git.wordpress.org>
Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>
---
 .../entity-record-item.js                      | 18 ++++--------------
 .../entities-saved-states/style.scss           | 13 -------------
 .../specs/editor/various/publish-panel.spec.js |  2 +-
 3 files changed, 5 insertions(+), 28 deletions(-)

diff --git a/packages/editor/src/components/entities-saved-states/entity-record-item.js b/packages/editor/src/components/entities-saved-states/entity-record-item.js
index 49733489b0a117..ca9fb2e0b169c3 100644
--- a/packages/editor/src/components/entities-saved-states/entity-record-item.js
+++ b/packages/editor/src/components/entities-saved-states/entity-record-item.js
@@ -1,12 +1,11 @@
 /**
  * WordPress dependencies
  */
-import { Icon, CheckboxControl, Flex, PanelRow } from '@wordpress/components';
+import { CheckboxControl, PanelRow } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useSelect } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
-import { connection } from '@wordpress/icons';
 
 /**
  * Internal dependencies
@@ -60,18 +59,9 @@ export default function EntityRecordItem( { record, checked, onChange } ) {
 				/>
 			</PanelRow>
 			{ hasPostMetaChanges && (
-				<PanelRow>
-					<Flex className="entities-saved-states__post-meta">
-						<Icon
-							className="entities-saved-states__connections-icon"
-							icon={ connection }
-							size={ 24 }
-						/>
-						<span className="entities-saved-states__bindings-text">
-							{ __( 'Post Meta.' ) }
-						</span>
-					</Flex>
-				</PanelRow>
+				<ul className="entities-saved-states__changes">
+					<li>{ __( 'Post Meta.' ) }</li>
+				</ul>
 			) }
 		</>
 	);
diff --git a/packages/editor/src/components/entities-saved-states/style.scss b/packages/editor/src/components/entities-saved-states/style.scss
index 8f0d8f53ca9cbb..981a0d92e5ff6b 100644
--- a/packages/editor/src/components/entities-saved-states/style.scss
+++ b/packages/editor/src/components/entities-saved-states/style.scss
@@ -30,16 +30,3 @@
 		margin-bottom: $grid-unit-05;
 	}
 }
-
-.entities-saved-states__post-meta {
-	margin-left: $grid-unit-30;
-	align-items: center;
-}
-
-.entities-saved-states__connections-icon {
-	flex-grow: 0;
-}
-
-.entities-saved-states__bindings-text {
-	flex-grow: 1;
-}
diff --git a/test/e2e/specs/editor/various/publish-panel.spec.js b/test/e2e/specs/editor/various/publish-panel.spec.js
index c70a7b85cd70fe..02a7bfa60eea45 100644
--- a/test/e2e/specs/editor/various/publish-panel.spec.js
+++ b/test/e2e/specs/editor/various/publish-panel.spec.js
@@ -164,7 +164,7 @@ test.describe( 'Post publish panel', () => {
 		await expect( publishPanel ).toBeVisible();
 
 		const postMetaPanel = publishPanel.locator(
-			'.entities-saved-states__post-meta'
+			'.entities-saved-states__changes'
 		);
 
 		await expect( postMetaPanel ).toBeVisible();