guardian / guardian/dotcom-rendering

Sign up to a newsletter with one click - v1

Open
#15,603 0 comments 0 reactions 0 assignees View on GitHub
enhancement feature NEWSLETTERS
Dominant language
TypeScript
Stars
274
Forks
34
Avg merge
2d 22h
Merged PRs (30d)
121

Description

Sign up to a newsletter with one click

A signed-in reader can subscribe to a newsletter directly from the card, without entering their email address or leaving the page.

**Acceptance criteria:**
- [ ] A signed-in reader sees a single "Sign up" button — no email input field
- [ ] Clicking the button subscribes the reader using their account email
- [ ] While the request is in flight the button is replaced with a loading indicator
- [ ] If the request fails, an error message is shown with an option to try again
- [ ] The sign-up works for any newsletter, not a hardcoded one

**Technical notes:**
`Card.tsx` already has a prototype footer block that renders `SecureSignup` when `isNewsletter` is true, but it hardcodes `newsletterId='moving-the-goalposts'` and a fixed success description. `DCRFrontCard` needs two new fields — `newsletterId?: string` (maps to `Newsletter.identityName`) and `newsletterSuccessDescription?: string` (maps to `Newsletter.successDescription`) — threaded through `FrontCard.tsx` into `Card.tsx` to replace the hardcoded values. `SecureSignup` already handles the signed-in path correctly: it calls `resolveEmailIfSignedIn()` to fetch the user's email from the identity API, hides the text input, and renders a single button — no changes needed there for this ticket.

**Out of scope:** The sign-up flow for signed-out users

Image

https://www.figma.com/design/ucERNBXZ9CAObsjnVWqgEi/Newsletter-Sign-Up-Component?node-id=926-41913&m=dev

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.