Created a template for the secondary user product card in account overview by enesihsa · Pull Request #1671 · guardian/manage-frontend

enesihsa · 2026-06-10T15:25:46Z

Current situation/background

This PR creates the necessary product card sections and benefits copies for the secondary user account benefits as part of the multiple accounts initiative.

What does this PR change?

Creates a new product card section for secondary user subscriptions.
- I assumed primary users will get their product data from MDAPI since their subscription is registered in Zuora.
SecondaryAccountCard.tsx to render the shared subscription product card on account overview without depending on a ProductDetail response since the endpoint for secondary accounts will not return a detailed subscription data.
Storybook card for visual testing.
Connection setup to '/api/me/secondary-user' endpoint and guarded DEV and CODE test for a hard-coded mock response from the API. This is still TBC.
New benefits text configuration to be used by the new card.

Next steps/further info

See Manage shared subscription page #1700 for the leave subscription button.
For the product card we need the primary user's name, and once the secondary user clicks 'Leave Subscription' we need name and email address. The current implementation assumes a single API call which returns both.
Endpoints and data format of the response still to be completed by the backend.
a. There is a guard for testing in CODE and DEV with a url parameter.
Primary user benefits will change for the digital plus (addition of account sharing), this is to be removed from secondary accounts (benefitsOverride can be used for this).

enesihsa · 2026-06-11T16:07:08Z

-								</div>
-								{groupedProductType.tierLabel && (
+				{isSecondary &&
+					primarySubscriber && ( // TODO Separate more properly.


This is the main addition, makes it look like there is plenty of changes but not really, much is indentation. This conditional section renders the shared subscription details and leave subscription Card.Sections. Currently combined into a single one but there probably is a better way to do this?

j-ruda-guardian · 2026-06-12T10:49:08Z

 				{cardConfig.getBenefitsSectionCopy && nextPaymentDetails && (
 					<Card.Section backgroundColor="#edf5fA" removeBorders>
 						<p css={benefitsTextCss}>
-							{cardConfig.getBenefitsSectionCopy(
-								nextPaymentDetails,
-							)}
+							{isSecondary && primarySubscriber // TODO should probably find a better way to do this too.
+								? `You're enjoying ${mainPlan.name} as part of a shared subscription.`
+								: cardConfig.getBenefitsSectionCopy(
+										nextPaymentDetails,
+								  )}
 						</p>


It's possible that nextPaymentDetails will not exist, so
cardConfig.getBenefitsSectionCopy && nextPaymentDetails
Will always test false. You could do something like:
cardConfig.getBenefitsSectionCopy && (nextPaymentDetails || isSecondary) && (
And then
isSecondary ? "you are enjoying copy" : cardConfig.getBenefitsSectionCopy()

Ah thanks, missed this one. Another question I had was would it be possible to have the secondary user details in the getBenefitsSectionCopy too (or a more generic way of fetching them), currently it has one for each Zuora subscription type I think, but there are exceptions now for secondary users and GW Gift subscriptions.

j-ruda-guardian

I think this looks good. May I ask you for a change that will make reviewing this files a lot easier:
Please, take the new secondary user card and extract it to a new file (This ProductCard file is already more than crowded enough) and then import it and render it conditionally like you are doing. That might solve this indentation nightmare and will also make the whole thing easier to review!

nice work, thank you!

enesihsa · 2026-06-23T16:29:30Z

-					/>
-					<JoinDateRow
+}) =>
+	!primaryUser && (


I am really confused as to why this keeps causing the same issue. At least it's much more manageable here and easier to verify that nothing actually changes apart from the addition of this condition.

github-actions · 2026-06-26T14:56:14Z

Deploy build 1974 of `support::manage-frontend` to CODE

All deployment options

From guardian/actions-riff-raff.

enesihsa · 2026-07-07T09:03:20Z

 			http.get('/api/me/one-off-contributions', () => {
 				return HttpResponse.json([]);
 			}),
+			http.get('/api/me/secondary-account', () => {


Endpoint still TBD

enesihsa · 2026-07-07T09:05:20Z

 		uniqueProductCategories.push('subscriptions');
 	}

+	// TODO we can add secondary user product card to subscriptions but will need to update the type definition to make it work.


This would allow us to show shared subscriptions alongside other subscriptions. Current setup shows it in a separate section.

enesihsa · 2026-07-07T09:25:06Z

+
+export const multipleAccountsApiHandler = proxyApiHandler(
+	// TODO format differs from other API hosts?
+	conf.STAGE === 'PROD'


TODO review see: https://github.com/guardian/manage-frontend/pull/1664/changes#diff-3f6f409d1dbf57bd43ba0c05e33878bb634eda5ed21026fb84b97de974da8ac5R260

enesihsa · 2026-07-07T10:25:10Z

 		>
 			<p css={benefitsTextCss}>
-				{cardConfig.getBenefitsSectionCopy(nextPaymentDetails)}
+				{nextPaymentDetails


This has to be done because secondary account benefits copy text cannot take in a nextPaymentDetails since it is not used for anything in the text. All other subscription product cards show some information about pricing and next payment dates.

enesihsa · 2026-07-07T10:25:46Z

 const guardianWeeklyBenefitsCopy = (npd: NextPaymentDetails) =>
 	`You're subscribed to The Guardian Weekly for ${npd.currentPriceValue} per ${npd.paymentInterval} and receive a curated news magazine featuring our best global journalism in print, as well as unlimited access to our full suite of digital benefits.`;

+// TODO This not having npd has been quite a problem. Current solution is a bit hacky.


See https://github.com/guardian/manage-frontend/pull/1671/changes#r3535584027

…rview.

github-actions · 2026-07-21T16:18:05Z

Deploy build 1974 of `support::help-centre` to CODE

All deployment options

From guardian/actions-riff-raff.

…overview

enesihsa added the feature Departmental tracking: work on a new feature label Jun 10, 2026

enesihsa commented Jun 11, 2026

View reviewed changes

Comment thread client/components/mma/accountoverview/ProductCard.tsx Outdated

j-ruda-guardian reviewed Jun 12, 2026

View reviewed changes

Comment thread client/components/mma/accountoverview/ProductCard.tsx Outdated

j-ruda-guardian reviewed Jun 12, 2026

View reviewed changes

enesihsa force-pushed the ea/multiple-accounts/secondary-user-account-overview branch from 044e650 to a756302 Compare June 15, 2026 14:32

enesihsa force-pushed the ea/multiple-accounts/secondary-user-account-overview branch 2 times, most recently from 16d4f8c to 0567ca5 Compare June 23, 2026 16:10

enesihsa commented Jun 23, 2026

View reviewed changes

enesihsa commented Jul 7, 2026

View reviewed changes

Comment thread client/fixtures/productBuilder/baseProducts.ts

enesihsa commented Jul 7, 2026

View reviewed changes

enesihsa force-pushed the ea/multiple-accounts/secondary-user-account-overview branch from 4e9357b to 6563f63 Compare July 7, 2026 10:09

enesihsa commented Jul 7, 2026

View reviewed changes

enesihsa added 10 commits July 20, 2026 11:58

Created a template for the secondary user product card in account ove…

855a631

…rview.

Moved Secondary Account product card sections to a separate file

d5eb749

Fixed missed git rebase issues

28796b4

Solved some conflicts attempting to rebase

2b367e6

Removed unusued element, ternary, and minor css edit

507c6fc

Plugged in the mocked server API calls

b18b6ce

Removed primary subscriber details from ProductCard

f399a84

Removed primaryUser from ProductDetail

35a1515

Remove last name from the copy text and types.

b629614

Changed API endpoints and data schema for responses

6fc8b9a

enesihsa force-pushed the ea/multiple-accounts/secondary-user-account-overview branch from 6563f63 to 6fc8b9a Compare July 21, 2026 16:11

enesihsa added 3 commits July 22, 2026 11:36

Merge branch 'main' into ea/multiple-accounts/secondary-user-account-…

c1a5b6b

…overview

Removed primaryUser from Subscription

7ec2428

Product title copy change

151751c

Uh oh!

Conversation

enesihsa commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Current situation/background

What does this PR change?

Next steps/further info

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

j-ruda-guardian left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

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

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

enesihsa Jul 7, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

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

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

enesihsa commented Jun 10, 2026 •

edited

Loading

github-actions Bot commented Jun 26, 2026 •

edited

Loading

enesihsa Jul 7, 2026 •

edited

Loading

github-actions Bot commented Jul 21, 2026 •

edited

Loading