From bbc964ef05e921d23db74ea709ad57f0fee26a7f Mon Sep 17 00:00:00 2001
From: Rasmy Nguyen <raz@automattic.com>
Date: Wed, 14 Aug 2024 14:54:56 -0400
Subject: [PATCH 1/4] fix(ras-acc): respect social icon padding

---
 includes/class-newspack-newsletters-renderer.php | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/includes/class-newspack-newsletters-renderer.php b/includes/class-newspack-newsletters-renderer.php
index c5d28d78e..c7dedc848 100644
--- a/includes/class-newspack-newsletters-renderer.php
+++ b/includes/class-newspack-newsletters-renderer.php
@@ -854,15 +854,18 @@ function ( $block ) {
 					'mode'          => 'horizontal',
 					'padding'       => '0',
 					'border-radius' => '999px',
-					'icon-padding'  => '7px',
 				);
 				if ( isset( $attrs['align'] ) ) {
 					$social_wrapper_attrs['align'] = $attrs['align'];
 				} else {
 					$social_wrapper_attrs['align'] = 'left';
 				}
+				if ( isset( $attrs['padding'] ) ) {
+					$social_wrapper_attrs['padding'] = $attrs['padding'];
+				}
+
 				$markup = '<mj-social ' . self::array_to_attributes( $social_wrapper_attrs ) . '>';
-				foreach ( $inner_blocks as $link_block ) {
+				foreach ( $inner_blocks as $index => $link_block ) {
 					if ( isset( $link_block['attrs']['url'] ) ) {
 						$url = $link_block['attrs']['url'];
 						// Handle older version of the block, where innner blocks we named `core/social-link-<service>`.
@@ -875,8 +878,14 @@ function ( $block ) {
 								'src'              => plugins_url( 'assets/' . $social_icon['icon'], __DIR__ ),
 								'background-color' => $social_icon['color'],
 								'css-class'        => 'social-element',
+								'padding'          => '8px',
 							);
 
+							if ( $index === 0 || $index === count( $inner_blocks ) - 1 ) {
+								$img_attrs['padding-left']  = $index === 0 ? '0' : '8px';
+								$img_attrs['padding-right'] = $index === 0 ? '8px' : '0';
+							}
+
 							$markup .= '<mj-social-element ' . self::array_to_attributes( $img_attrs ) . '/>';
 						}
 					}

From c81221b002201132e2b887b11879f847732d27b6 Mon Sep 17 00:00:00 2001
From: Rasmy Nguyen <raz@automattic.com>
Date: Wed, 14 Aug 2024 15:05:35 -0400
Subject: [PATCH 2/4] fix(ras-acc): update phpunit test

---
 tests/test-renderer.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/test-renderer.php b/tests/test-renderer.php
index 97546f830..e14be2f8d 100755
--- a/tests/test-renderer.php
+++ b/tests/test-renderer.php
@@ -313,7 +313,7 @@ public function test_render_social_icons() {
 					'innerHTML'    => '<div></div>',
 				]
 			),
-			'<mj-section padding="0"><mj-column padding="12px" width="100%"><mj-social icon-size="24px" mode="horizontal" padding="0" border-radius="999px" icon-padding="7px" align="left"><mj-social-element href="https://x.com/hi" src="' . $plugin_path . 'assets/white-x.png" background-color="#000000" css-class="social-element"/></mj-social></mj-column></mj-section>',
+			'<mj-section padding="0"><mj-column padding="12px" width="100%"><mj-social icon-size="24px" mode="horizontal" padding="0" border-radius="999px" align="left"><mj-social-element href="https://x.com/hi" src="' . $plugin_path . 'assets/white-x.png" background-color="#000000" css-class="social-element" padding="8px" padding-left="0" padding-right="8px"/></mj-social></mj-column></mj-section>',
 			'Renders social icons'
 		);
 	}

From a654998b92df0798634df0fffbdc1c57d64e2cc8 Mon Sep 17 00:00:00 2001
From: Rasmy Nguyen <raz@automattic.com>
Date: Wed, 14 Aug 2024 16:13:03 -0400
Subject: [PATCH 3/4] fix(ras-acc): conditionally add social icon padding

---
 includes/class-newspack-newsletters-renderer.php | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/includes/class-newspack-newsletters-renderer.php b/includes/class-newspack-newsletters-renderer.php
index c7dedc848..b1732c3d9 100644
--- a/includes/class-newspack-newsletters-renderer.php
+++ b/includes/class-newspack-newsletters-renderer.php
@@ -852,8 +852,9 @@ function ( $block ) {
 				$social_wrapper_attrs = array(
 					'icon-size'     => '24px',
 					'mode'          => 'horizontal',
-					'padding'       => '0',
 					'border-radius' => '999px',
+					'icon-padding'  => 'is-style-filled-primary-text' === $attrs['className'] ? '0px' : '7px',
+					'padding'       => '0',
 				);
 				if ( isset( $attrs['align'] ) ) {
 					$social_wrapper_attrs['align'] = $attrs['align'];

From 15045ff9af98bbd9c2a7570d92757cf0912333de Mon Sep 17 00:00:00 2001
From: Rasmy Nguyen <raz@automattic.com>
Date: Wed, 14 Aug 2024 16:14:52 -0400
Subject: [PATCH 4/4] fix(ras-acc): remove social icons container conditional
 padding

---
 includes/class-newspack-newsletters-renderer.php | 5 +----
 tests/test-renderer.php                          | 2 +-
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/includes/class-newspack-newsletters-renderer.php b/includes/class-newspack-newsletters-renderer.php
index b1732c3d9..d671e8925 100644
--- a/includes/class-newspack-newsletters-renderer.php
+++ b/includes/class-newspack-newsletters-renderer.php
@@ -853,7 +853,7 @@ function ( $block ) {
 					'icon-size'     => '24px',
 					'mode'          => 'horizontal',
 					'border-radius' => '999px',
-					'icon-padding'  => 'is-style-filled-primary-text' === $attrs['className'] ? '0px' : '7px',
+					'icon-padding'  => isset( $attrs['className'] ) && 'is-style-filled-primary-text' === $attrs['className'] ? '0px' : '7px',
 					'padding'       => '0',
 				);
 				if ( isset( $attrs['align'] ) ) {
@@ -861,9 +861,6 @@ function ( $block ) {
 				} else {
 					$social_wrapper_attrs['align'] = 'left';
 				}
-				if ( isset( $attrs['padding'] ) ) {
-					$social_wrapper_attrs['padding'] = $attrs['padding'];
-				}
 
 				$markup = '<mj-social ' . self::array_to_attributes( $social_wrapper_attrs ) . '>';
 				foreach ( $inner_blocks as $index => $link_block ) {
diff --git a/tests/test-renderer.php b/tests/test-renderer.php
index e14be2f8d..63e0f1a34 100755
--- a/tests/test-renderer.php
+++ b/tests/test-renderer.php
@@ -313,7 +313,7 @@ public function test_render_social_icons() {
 					'innerHTML'    => '<div></div>',
 				]
 			),
-			'<mj-section padding="0"><mj-column padding="12px" width="100%"><mj-social icon-size="24px" mode="horizontal" padding="0" border-radius="999px" align="left"><mj-social-element href="https://x.com/hi" src="' . $plugin_path . 'assets/white-x.png" background-color="#000000" css-class="social-element" padding="8px" padding-left="0" padding-right="8px"/></mj-social></mj-column></mj-section>',
+			'<mj-section padding="0"><mj-column padding="12px" width="100%"><mj-social icon-size="24px" mode="horizontal" border-radius="999px" icon-padding="7px" padding="0" align="left"><mj-social-element href="https://x.com/hi" src="' . $plugin_path . 'assets/white-x.png" background-color="#000000" css-class="social-element" padding="8px" padding-left="0" padding-right="8px"/></mj-social></mj-column></mj-section>',
 			'Renders social icons'
 		);
 	}