Skip to content

feat: add featured image caption block#4519

Open
chickenn00dle wants to merge 2 commits intotrunkfrom
feat/add-featured-image-caption-block
Open

feat: add featured image caption block#4519
chickenn00dle wants to merge 2 commits intotrunkfrom
feat/add-featured-image-caption-block

Conversation

@chickenn00dle
Copy link
Contributor

@chickenn00dle chickenn00dle commented Feb 25, 2026

All Submissions:

Changes proposed in this Pull Request:

Closes https://linear.app/a8c/issue/NPPD-1187/captioncredit-block-for-featured-images

This PR adds a featured image caption block when a block theme is active.

Screenshot 2026-02-26 at 12 56 37

How to test the changes in this Pull Request:

  1. Go to any post and add a featured image or featured image block to the post.
  2. Add the featured image caption block to the page
  3. Save and view the post on the frontend. Confirm the featured image caption appears as expected
  4. Back in the editor select the featured image caption block and add custom text
  5. Save. View the featured image meta by selecting 'Replace' and confirm the caption did not change.
  6. View the post on the frontend. Confirm the featured image caption appears as expected
  7. Go back to the editor and remove the featured image.
  8. Confirm the featured image caption block displays placeholder text asking you to add a featured image.
  9. Save and view the post on the frontend. Confirm the featured image caption block is not present.
  10. In the editor, add the query loop block and add the featured image and featured image caption blocks and save.
  11. Verify the query loop displays the featured image captions correctly in the frontend

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?

@chickenn00dle chickenn00dle force-pushed the feat/add-featured-image-caption-block branch from b31be21 to cb81dbe Compare February 26, 2026 17:47
@chickenn00dle chickenn00dle marked this pull request as ready for review February 26, 2026 17:51
@chickenn00dle chickenn00dle requested a review from a team as a code owner February 26, 2026 17:51
Copilot AI review requested due to automatic review settings February 26, 2026 17:51
Copy link
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

Adds a new dynamic Gutenberg block to display a post’s featured image caption and (optionally) image credit when using a block theme.

Changes:

  • Registers a new newspack/featured-image-caption block (editor + server render).
  • Adds an editor UI for overriding the caption via a customCaption attribute.
  • Wires the block into block-theme-only registration paths (JS + PHP).

Reviewed changes

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

Show a summary per file
File Description
src/blocks/index.js Registers the new block and gates it behind block-theme-only registration.
src/blocks/featured-image-caption/index.js Block registration metadata/settings (title, icon, keywords, edit component).
src/blocks/featured-image-caption/edit.js Editor implementation: pulls featured image + derives caption/credit placeholder; supports custom override.
src/blocks/featured-image-caption/style.scss Adds editor styling for the “no featured image” placeholder state.
src/blocks/featured-image-caption/block.json Defines block name, attributes, context usage, and supports settings.
src/blocks/featured-image-caption/class-featured-image-caption-block.php Server-side render callback for frontend output (caption + credit, or custom override).
includes/class-blocks.php Loads the new block PHP implementation when a block theme is active.

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

Comment on lines +57 to +59
<figcaption { ...blockProps }>
<span className="featured-image-caption-placeholder">{ __( 'Featured image caption.', 'newspack-plugin' ) }</span>
</figcaption>
Copy link

Copilot AI Feb 26, 2026

Choose a reason for hiding this comment

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

The placeholder shown when no featured image is set does not match the PR testing instructions (it doesn’t prompt the user to add a featured image). Consider updating this placeholder copy to explicitly instruct the user to add/set a featured image so the editor state is self-explanatory.

Copilot uses AI. Check for mistakes.
Comment on lines +36 to +40
const { caption, credit } = useSelect(
select => {
if ( ! featuredImage ) {
return {};
}
Copy link

Copilot AI Feb 26, 2026

Choose a reason for hiding this comment

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

This new block adds logic to derive caption/credit from the featured image entity (and format credits) but there are no accompanying unit tests. Similar blocks in this repo have Jest/Testing Library coverage; consider adding tests for “no featured image”, “caption only”, “credit only”, and “caption + org credit” to prevent regressions.

Copilot uses AI. Check for mistakes.
@chickenn00dle chickenn00dle added the [Status] Needs Review The issue or pull request needs to be reviewed label Feb 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[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.

2 participants