Add tag ids section id to header by AnastasiiaBalenko · Pull Request #15702 · guardian/dotcom-rendering

AnastasiiaBalenko · 2026-04-14T09:26:08Z

What does this change?

This change adds page context fields to the header support request so targeting can use it.

Adds contentType, tagIds and sectionId as optional props through the header chain.
Passes these props from page layouts into the masthead and then into top bar support.
Includes front-specific mapping so front trending topic ids can be used as tagIds.
Extends the remote support header module request payload to include contentType, tagIds and sectionId.

Why?

Support header targeting needs contentTyle, section and tags context to make more accurate decisions. This change ensures those fields are consistently available across supported layout types.

github-actions · 2026-04-15T14:12:25Z

Deploy build 1282 of `dotcom:ab-testing` to CODE

All deployment options

From guardian/actions-riff-raff.

github-actions · 2026-04-15T14:20:30Z

Deploy build 26381 of `dotcom:rendering-all` to CODE

All deployment options

From guardian/actions-riff-raff.

github-actions · 2026-04-23T11:07:50Z

Hello 👋! When you're ready to run Chromatic, please apply the run_chromatic label to this PR.

You will need to reapply the label each time you want to run Chromatic.

Click here to see the Chromatic project.

Copilot

Pull request overview

This PR threads additional page-context fields (content type, section, and tags) from page layouts into the Masthead → TopBar → TopBarSupport chain so the remote Support header request can target more accurately.

Changes:

Add optional tagIds, sectionId, and contentType props through Masthead/TopBar/TopBarSupport.
Populate these fields from a wide range of layouts (including front-specific trending-topics → tagIds mapping).
Extend the Support header request payload targeting to include tagIds, sectionId, and contentType.

Reviewed changes

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

Show a summary per file

File	Description
dotcom-rendering/src/layouts/TagPageLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/StandardLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/SportDataPageLayout.tsx	Pass section / content type into `Masthead`.
dotcom-rendering/src/layouts/ShowcaseLayout.tsx	Pass header targeting context into `Masthead` (note: not in all branches).
dotcom-rendering/src/layouts/PictureLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/NewsletterSignupLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/LiveLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/InteractiveLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/ImmersiveLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/GalleryLayout.tsx	Thread tag IDs into `BannerAndMasthead`, then into `Masthead` and payload context.
dotcom-rendering/src/layouts/FullPageInteractiveLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/FrontLayout.tsx	Map trending topic IDs into `tagIds`, pass through to `Masthead`.
dotcom-rendering/src/layouts/CrosswordLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/CommentLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/layouts/AudioLayout.tsx	Pass tag IDs / section / content type into `Masthead`.
dotcom-rendering/src/components/TopBarSupport.island.tsx	Add new optional props and include them in the Support header targeting payload.
dotcom-rendering/src/components/TopBar.island.tsx	Thread new props down into `TopBarSupport`.
dotcom-rendering/src/components/Masthead/Masthead.tsx	Extend Masthead props and pass new fields into `TopBar`.

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

Copilot · 2026-04-23T11:29:04Z

+										tagIds={article.tags.map(
+											(tag) => tag.id,
+										)}
+										sectionId={article.config.section}


In the Labs branch, Masthead is not being passed contentType, so the support header request won't consistently include page content type for Labs showcase pages. Please pass contentType here as well (ideally using the same source as the non-Labs branch).

Suggested change

sectionId={article.config.section}

sectionId={article.config.section}

contentType={article.config.contentType}

Copilot · 2026-04-23T11:29:05Z

 						pageId={article.pageId}
+						tagIds={article.tags.map((tag) => tag.id)}
+						sectionId={article.config.section}
+						contentType={article.config.contentType}


contentType is passed from article.config.contentType here, but this layout (and most others) typically use article.contentType. Mixing the two sources makes it easy to accidentally diverge and can lead to inconsistent targeting. Consider standardising on one source (preferably article.contentType for articles) across all Masthead call sites.

Suggested change

contentType={article.config.contentType}

contentType={article.contentType}

gu-prout · 2026-04-23T13:35:00Z

Seen on PROD (merged by @AnastasiiaBalenko 8 minutes and 15 seconds ago) Please check your changes!

AnastasiiaBalenko added the feature Departmental tracking: work on a new feature label Apr 14, 2026

AnastasiiaBalenko force-pushed the ab/add-tagIds-sectionId-to-header branch from a6b3923 to 8570d23 Compare April 15, 2026 14:10

AnastasiiaBalenko force-pushed the ab/add-tagIds-sectionId-to-header branch from 8570d23 to bbadec8 Compare April 15, 2026 14:14

AnastasiiaBalenko force-pushed the ab/add-tagIds-sectionId-to-header branch 2 times, most recently from 4240783 to 2fcbfdc Compare April 23, 2026 11:06

AnastasiiaBalenko added 4 commits April 23, 2026 12:07

tagsId and sectionId added to header

024f376

SDC version updated

8e31495

contentType added to header

03ce90c

removed unrelated files

5bed551

AnastasiiaBalenko force-pushed the ab/add-tagIds-sectionId-to-header branch from 2fcbfdc to 5bed551 Compare April 23, 2026 11:07

AnastasiiaBalenko marked this pull request as ready for review April 23, 2026 11:07

AnastasiiaBalenko added the run_chromatic Runs chromatic when label is applied label Apr 23, 2026

github-actions Bot removed the run_chromatic Runs chromatic when label is applied label Apr 23, 2026

AnastasiiaBalenko requested a review from Copilot April 23, 2026 11:24

Copilot started reviewing on behalf of AnastasiiaBalenko April 23, 2026 11:24 View session

Copilot AI reviewed Apr 23, 2026

View reviewed changes

contentType prop added in StandardLayout, ShowcaseLayout

317394d

AnastasiiaBalenko added the run_chromatic Runs chromatic when label is applied label Apr 23, 2026

github-actions Bot removed the run_chromatic Runs chromatic when label is applied label Apr 23, 2026

tomrf1 approved these changes Apr 23, 2026

View reviewed changes

AnastasiiaBalenko changed the title ~~Ab/add tag ids section id to header~~ Add tag ids section id to header Apr 23, 2026

AnastasiiaBalenko merged commit 3c0af45 into main Apr 23, 2026
27 checks passed

AnastasiiaBalenko deleted the ab/add-tagIds-sectionId-to-header branch April 23, 2026 13:26

gu-prout Bot added Pending-on-PROD Seen-on-PROD and removed Pending-on-PROD labels Apr 23, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add tag ids section id to header#15702

Add tag ids section id to header#15702
AnastasiiaBalenko merged 5 commits intomainfrom
ab/add-tagIds-sectionId-to-header

AnastasiiaBalenko commented Apr 14, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Apr 15, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Apr 15, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Apr 23, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Apr 23, 2026

Uh oh!

Copilot AI Apr 23, 2026

Uh oh!

Uh oh!

gu-prout Bot commented Apr 23, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

	sectionId={article.config.section}
	sectionId={article.config.section}
	contentType={article.config.contentType}

	contentType={article.config.contentType}
	contentType={article.contentType}

Conversation

AnastasiiaBalenko commented Apr 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What does this change?

Why?

Uh oh!

github-actions Bot commented Apr 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploy build 1282 of dotcom:ab-testing to CODE

Uh oh!

github-actions Bot commented Apr 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploy build 26381 of dotcom:rendering-all to CODE

Uh oh!

github-actions Bot commented Apr 23, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Apr 23, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 23, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

gu-prout Bot commented Apr 23, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

AnastasiiaBalenko commented Apr 14, 2026 •

edited

Loading

github-actions Bot commented Apr 15, 2026 •

edited

Loading

Deploy build 1282 of `dotcom:ab-testing` to CODE

github-actions Bot commented Apr 15, 2026 •

edited

Loading

Deploy build 26381 of `dotcom:rendering-all` to CODE