us-newsletter-hide-soft-opt-in

[georgerichmond]

US newsletter marketing soft opt-in

What does this change?

Implements the UI logic for hiding the marketing consent toggle for signed-out US users when the usSignupHideMarketingToggle switch is enabled.

• Adds a useHideMarketingToggleForCountry hook that checks the switch and the user's country code via useCountryCode
• When the switch is on and countryCode === 'US' and the user is signed out, the marketing toggle is hidden and marketing=true is always included in the sign-up payload
• When the switch is off, or the user is signed in, or the country is anything other than US (including undefined while resolving), existing behaviour is unchanged
• A marketingOptInHidden: true field is appended to the sign-up request payload in the hidden case so the backend can identify implicit opt-ins
• marketingOptInType is included in Ophan tracking events on all three surfaces:
  • similar-guardian-products-optin-hidden-us — toggle hidden (US soft opt-in)
  • similar-guardian-products-optin — toggle visible, user opted in
  • similar-guardian-products-optout — toggle visible, user opted out
  • Omitted entirely for signed-in users
• Applies consistently across all three sign-up surfaces: SecureSignup, NewsletterSignupForm, and ManyNewsletterSignUp
• Mocks useCountryCode in Storybook preview and adds a USHideMarketingToggle story to NewsletterSignupForm

Why?

US consumer protection regulations mean we should not present a marketing opt-in toggle to US newsletter sign-ups. Instead, users are silently enrolled in similar_guardian_products — i.e. a soft opt-in. This is gated behind a switch so it can be enabled/disabled independently of a deploy.

Parent issue: guardian/email-rendering#930

Screenshots

No visible UI change for non-US users. For US signed-out users, the marketing toggle is hidden — no before/after screenshot is provided as this is switch-gated.

Before	After
Marketing toggle visible for all signed-out users	Marketing toggle hidden for signed-out US users (switch on)

[Copilot]

Pull request overview

Implements US “soft opt-in” behaviour for newsletter sign-ups by hiding the marketing consent toggle for signed-out users in the US when the us-signup-hide-marketing-toggle switch is enabled, while ensuring the backend and analytics can distinguish implicit opt-ins.

Changes:

• Added useHideMarketingToggleForCountry (switch + country-code gated) and wired it into all three signup surfaces.
• When hidden, forces marketing=true and appends marketingOptInHidden=true to the sign-up payload.
• Adds marketingOptInType into tracking payloads and extends unit/story coverage across surfaces.

Reviewed changes

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

Show a summary per file

File	Description
dotcom-rendering/src/lib/useNewsletterSignupForm.ts	Adds hidden-toggle support to payload + adds marketingOptInType to tracking details.
dotcom-rendering/src/lib/useHideMarketingToggleForCountry.ts	New hook to determine when the marketing toggle should be hidden (US + switch).
dotcom-rendering/src/lib/newsletter-sign-up-requests.ts	Extends multi-signup request payload to include marketingOptInHidden.
dotcom-rendering/src/components/SecureSignup.island.tsx	Hides marketing checkbox for US signed-out users, forces marketing opt-in, and adds tracking detail.
dotcom-rendering/src/components/SecureSignup.island.test.tsx	Adds tests covering US hide-toggle behaviour, payload, and tracking.
dotcom-rendering/src/components/NewsletterSignupForm.island.tsx	Passes hide-toggle flag into useNewsletterSignupForm.
dotcom-rendering/src/components/NewsletterSignupForm.island.test.tsx	Adds country/switch mocking and assertions for new tracking + hidden-toggle behaviour.
dotcom-rendering/src/components/NewsletterSignupForm.island.stories.tsx	Adds Storybook story for US hidden-toggle case and updates mocked state shape.
dotcom-rendering/src/components/ManyNewsletterSignUp.island.tsx	Hides checkbox in ManyNewsletter flow, forces marketing opt-in in payload, and tracks opt-in type.
dotcom-rendering/src/components/ManyNewsletterSignUp.island.test.tsx	Adds tests for US hide-toggle behaviour and tracking in ManyNewsletter flow.
dotcom-rendering/.storybook/preview.ts	Mocks useCountryCode for Storybook to support country-gated scenarios.

---

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

[github-actions]

Deploy build 27263 of dotcom:rendering-all to CODE

All deployment options

• Deploy build 27263 of dotcom:rendering-all to CODE
• Deploy parts of build 27263 to CODE by previewing it first
• What's on CODE right now?

---

From guardian/actions-riff-raff.

[Copilot]

Pull request overview

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

Comments suppressed due to low confidence (1)

dotcom-rendering/src/lib/useHideMarketingToggleForCountry.ts:21

• This hook explicitly returns false while useCountryCode() is still resolving (undefined). For US users that means the marketing toggle can render briefly and then disappear once the country code resolves, and the submit logic will force marketing=true afterwards. If the intent is “never show the toggle to US users”, consider defaulting to hidden until the country is known (or using a tri-state return so callers can choose not to render the toggle until resolution) to avoid flicker and inconsistent UX.

export const useHideMarketingToggleForCountry = (): boolean => {
	const countryCode = useCountryCode('useHideMarketingToggleForCountry');
	const switchEnabled =
		window.guardian.config.switches['us-signup-hide-marketing-toggle'] ===
		true;

	return switchEnabled && countryCode === 'US';

[Copilot]

Pull request overview

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

Comments suppressed due to low confidence (1)

dotcom-rendering/src/lib/useNewsletterSignupForm.ts:502

• showMarketingToggle and marketingOptInHiddenForCountry both treat isSignedIn === 'Pending' as signed-out (isSignedIn !== true). This changes pre-existing pending-state behaviour (toggle visibility + payload fields) and can lead to implicit opt-in/tracking before sign-in status is known. Consider handling 'Pending' explicitly (e.g. behave like signed-in until resolved).

		showMarketingToggle: isSignedIn !== true && !hideMarketingToggle,
		marketingOptIn,
		marketingOptInHiddenForCountry:
			hideMarketingToggle && isSignedIn !== true,

[github-actions]

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

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

[github-actions]

Deploy build 1538 of dotcom:ab-testing to CODE

All deployment options

• Deploy build 1538 of dotcom:ab-testing to CODE
• Deploy parts of build 1538 to CODE by previewing it first
• What's on CODE right now?

---

From guardian/actions-riff-raff.