NewsletterSignupCard — static card + feature flag swap-in#15728
Merged
georgerichmond merged 3 commits intoApr 20, 2026
Merged
Conversation
4 tasks
georgerichmond
force-pushed
the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
4 times, most recently
from
e226189 to
ec2856e
Compare
georgerichmond
changed the title
georgerichmond
force-pushed
the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
from
ec2856e to
466c8a6
Compare
There was a problem hiding this comment.
Pull request overview
This PR introduces a new presentational NewsletterSignupCard UI and wires it into the existing newsletter signup rendering path behind a showNewNewsletterSignupCard feature flag, while extending newsletter content to support an optional square illustration image.
Changes:
- Add
NewsletterSignupCard+NewsletterSignupCardContainer(and a Storybook story) to provide a new static card shell for newsletter signup. - Gate the new card shell behind
switches.showNewNewsletterSignupCardinEmailSignUpWrapper, keeping the existingSecureSignupform inside. - Extend newsletter types + JSON schemas with
illustrationSquare, and add new palette tokens for the card’s colours.
Reviewed changes
Copilot reviewed 10 out of 10 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| dotcom-rendering/src/types/content.ts | Adds optional illustrationSquare to the Newsletter type. |
| dotcom-rendering/src/paletteDeclarations.ts | Adds --newsletter-card-* palette tokens for the new card styling. |
| dotcom-rendering/src/model/newsletter-page-schema.json | Adds illustrationSquare to the newsletter page schema. |
| dotcom-rendering/src/model/block-schema.json | Adds illustrationSquare to the block schema’s newsletter definition. |
| dotcom-rendering/src/frontend/schemas/feArticle.json | Adds illustrationSquare to FE article schemas where newsletters appear. |
| dotcom-rendering/src/lib/renderElement.tsx | Passes illustrationSquare + showNewNewsletterSignupCard into EmailSignUpWrapper. |
| dotcom-rendering/src/components/NewsletterSignupCardContainer.tsx | Introduces a thin wrapper container for the new card component. |
| dotcom-rendering/src/components/NewsletterSignupCard.tsx | Adds the new presentational newsletter signup card shell. |
| dotcom-rendering/src/components/NewsletterSignupCard.stories.tsx | Adds a Storybook story for visual review of the new card. |
| dotcom-rendering/src/components/EmailSignUpWrapper.island.tsx | Adds the feature-flagged rendering path for the new card shell. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
mgosz-guardian
approved these changes
Apr 20, 2026
georgerichmond
force-pushed
the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
from
466c8a6 to
abd2b24
Compare
github-actions
Bot
removed
the
run_chromatic
georgerichmond
force-pushed
the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
from
8d81997 to
0c0dc11
Compare
georgerichmond
force-pushed
the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
from
0c0dc11 to
c8d2c32
Compare
github-actions
Bot
removed
the
run_chromatic
georgerichmond
deleted the
15680-newslettersignupcard-feature-flag-swap-in-emailsignupwrapper
branch
|
Seen on PROD (merged by @georgerichmond 9 minutes and 6 seconds ago) Please check your changes! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
NewsletterSignupCard — static card + feature flag swap-in
What does this change?
Introduces the new
NewsletterSignupCardcomponent and wires it intoEmailSignUpWrapperbehind a feature flag, while keeping the existingSecureSignupform inside.NewsletterSignupCard— new presentational card shell with themed palette colours, a frequency tag withSvgNewsletterFilled, title, description, and an optional circular illustration (illustrationSquare)NewsletterSignupCardContainer— a thin pass-through wrapper around the card, intentionally left minimal as an integration point for upcoming preview functionalityEmailSignUpWrapper— when theshowNewNewsletterSignupCardswitch is enabled, renders the new card design with the existingSecureSignupform inside; otherwise falls through to the existingEmailSignupbehaviour unchanged--newsletter-card-*colour tokens supporting light and dark modesillustrationSquareoptional field added to theNewslettertype and all three JSON schemasNewsletterSignupCard.stories.tsxfor visual review in StorybookWhy?
This is the first step in a phased rollout of a redesigned newsletter signup card. By landing the static shell and feature flag now, two parallel workstreams can merge cleanly on top:
NewsletterSignupCardContainerwith preview modal, tracking, and the "Preview newsletter" button, without touchingEmailSignUpWrapperSecureSignupfor the newNewsletterSignupForminsideEmailSignUpWrapperScreenshots