Skip to content

fix: remove colour label changes to avoid bleeding into other blocks#4703

Open
laurelfulford wants to merge 3 commits into
trunkfrom
fix/social-icons-colour-setting-bleed
Open

fix: remove colour label changes to avoid bleeding into other blocks#4703
laurelfulford wants to merge 3 commits into
trunkfrom
fix/social-icons-colour-setting-bleed

Conversation

@laurelfulford
Copy link
Copy Markdown
Contributor

@laurelfulford laurelfulford commented May 5, 2026

All Submissions:

Changes proposed in this Pull Request:

The Author Profile block's Social Links block includes some code that relabels the Color and Background colour pickers to Icon Color and Icon Background. This is having an unintended side effect and bleeding into other block settings.

This PR changes the approach to match how this is handled in Core's Social Links block, to (hopefully!) make it a little less fragile (the alternative seemed to be checking if the Author Profile social links block was active again and again, and adding/removing the label, but that seemed subpar).

Another option would be just to show the default 'Text' prefix. It's not as nice UX-wise, but much simpler under the hood. It doesn't match Core's Social Links block, but it matches the labelling in Core's new Icon block coming in WP 7.0.

Closes NPPD-1458

How to test the changes in this Pull Request:

  1. Using the Block Theme, edit one of the Single Post templates in the Site Editor (after resetting it if it has saved changes). These templates will already have the Author Profile block in place.
  2. In the site editor, click on any of the other blocks -- like the Post Title block -- and note the colour settings:
CleanShot 2026-05-05 at 14 37 06
  1. Apply this PR and run npm run build.
  2. Refresh the editor, and ensure standard blocks are no longer inheriting the 'Icon' prefix on the colour picker.
  3. Edit the Author Profile block and select the Social Icons block.
  4. Confirm the Colors panel shows up on the Style tab, under the Styles panel
  5. Ensure each colour has the prefix 'Icon'
  6. Try togglng the block between Default and Brand styles, and confirm that the colour pickers go away when "Brand" is picked, and appear again when "Default" is picked.
  7. Try changing the icon colours and saving - confirm colours can be changed and saved, and switching back to the Brand style switches back to the branded colours.

Other information:

  • Have you added an explanation of what your changes do and why you'd like us to include them?
  • Have you written new tests for your changes, as applicable?
  • Have you successfully ran tests with your changes locally?

@laurelfulford laurelfulford requested a review from a team as a code owner May 5, 2026 21:40
@laurelfulford laurelfulford requested a review from Copilot May 5, 2026 21:40
@laurelfulford laurelfulford added the [Status] Needs Review The issue or pull request needs to be reviewed label May 5, 2026
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR narrows the editor-side color-panel relabeling logic for the Author Social Links block so the “Icon color / Icon background” overrides only run when that block is selected, instead of affecting unrelated block inspectors in the Site Editor.

Changes:

  • Adds isSelected to the Author Social Links edit component and gates the sidebar mutation effect on block selection.
  • Updates the effect dependencies so the relabel/hide behavior re-runs when selection state changes.
  • Documents the new prop and the intent of limiting the sidebar mutations to the active block.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/blocks/author-profile-social/edit.jsx Outdated
@laurelfulford laurelfulford marked this pull request as draft May 5, 2026 21:55
@laurelfulford laurelfulford removed the [Status] Needs Review The issue or pull request needs to be reviewed label May 5, 2026
@laurelfulford laurelfulford changed the title fix: make colour label changes more contained to social links block fix: remove colour label changes to avoid bleeding into other blocks May 5, 2026
ker to match Core's Social Icons approach
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.


💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/blocks/author-profile-social/edit.jsx
@laurelfulford laurelfulford added the [Status] Needs Review The issue or pull request needs to be reviewed label May 5, 2026
@laurelfulford laurelfulford marked this pull request as ready for review May 5, 2026 23:17
@adekbadek adekbadek self-assigned this May 14, 2026
Copy link
Copy Markdown
Member

@adekbadek adekbadek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The bug fix itself is well-targeted and works end-to-end in the Site Editor — Article Subtitle and other unrelated blocks now show plain Text/Background labels, and the new in-block colour panel works as described, including the Brand-style hide/show.

One blocker before merge: removing the color supports from block.json without a deprecated registration is a silent-data-loss path for posts saved under the current shipped version.

A handful of polish items below — see the inline comments.

@@ -19,20 +19,31 @@
"iconSize": {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Blocker: Removing color.text / color.background supports without a deprecated registration is a silent-data-loss path for the ~30 days of posts (production since v6.37.0 / 2026-04-13) that have been saving textColor / backgroundColor / style.color.text / style.color.background under the previous schema. Because save: () => <InnerBlocks.Content /> returns no attribute markup, block validation won't fail loudly — the old keys are dropped from parsed attributes on first load, and on the frontend the new PHP resolve_color() never reads them, so the configured colours disappear silently and the data is gone on next resave. Verified in-env by saving a post with the old shape and loading the frontend: no --icon-color / --icon-background set despite the saved attrs.

Needs a deprecated entry registering the previous attribute shape with a migrate(attrs) mapping textColor → iconColor, style.color.text → iconColorValue, backgroundColor → iconBackgroundColor, style.color.background → iconBackgroundColorValue (and stripping the empty style.color).

},
label: __( 'Icon background', 'newspack-plugin' ),
},
];
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggestion: Worth manually confirming that picking a theme preset colour writes to iconColor (the slug attribute), not just iconColorValue. ColorGradientSettingsDropdown's onColorChange passes a single value, and withColors' setter is responsible for resolving it back to a slug by iterating the palette — Core's core/social-links uses the same pattern, but if for any reason iconColor never gets populated, the docblock claim in class-author-profile-social-block.php ("Prefers the preset slug so theme switches reflect new palette values") doesn't hold and the frontend always emits a raw hex.

*/
private static function resolve_color( array $attributes, string $preset_key, string $style_key ): ?string {
private static function resolve_color( array $attributes, string $preset_key, string $value_key ): ?string {
if ( ! empty( $attributes[ $preset_key ] ) && is_string( $attributes[ $preset_key ] ) ) {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggestion: resolve_color() returns var(--wp--preset--color--<slug>) whenever the slug is set, even if the active theme doesn't define that slug — the resulting CSS variable is unresolved and the icon renders uncoloured on the frontend. The editor side (via withColors's getColorObjectByAttributeValues) falls back to iconColorValue in that case, so editor preview and frontend can diverge on theme switch.

Either make the fallback symmetric (prefer iconColorValue when present, regardless of slug), or drop the "theme switches reflect new palette values" claim from the docblock.

private static function get_block_wrapper_attributes( WP_Block $block, array $attributes, int $icon_size ): string {
$previous = \WP_Block_Supports::$block_to_render ?? null;
// Inner blocks have already rendered by this point in the InnerBlocks
// path, leaving $block_to_render pointing at the last child — so the
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: Good that the rationale is documented now. The actual reason for the snapshot is more defensive than "the inner blocks have already rendered": each inner WP_Block::render() snapshots/restores $block_to_render around its own callback, so this should already be back to the parent's parsed_block by the time get_block_wrapper_attributes() is called. The snapshot here guards against a third-party filter or future Core change breaking that chain. Worth rewording the comment to reflect "defensive against the inner-render chain leaking the static" rather than "already rendered".

@github-actions github-actions Bot added the [Status] Needs Changes or Feedback The issue or pull request needs action from the original creator label May 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Status] Needs Changes or Feedback The issue or pull request needs action from the original creator [Status] Needs Review The issue or pull request needs to be reviewed

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants