Fix duplicate branding in Guardian Labs fronts for subsequent primary containers

Author: deedeeh

dotcom-rendering/src/lib/branding.ts

@@ -88,7 +88,7 @@ const everyCardHasSameSponsor = ([
 /**
  * TODO verify that this is what is necessary for two branding to be equal
  */
-const brandingEqual = (b1: Branding, b2: Branding) => {
+export const brandingEqual = (b1: Branding, b2: Branding): boolean => {
 	return (
 		b1.brandingType?.name === b2.brandingType?.name &&
 		b1.sponsorName === b2.sponsorName
@@ -101,6 +101,37 @@ export const isPaidContentSameBranding = (
 	collectionBranding?.kind === 'paid-content' &&
 	!collectionBranding.hasMultipleBranding;
 
+/**
+ * Determines if cards should have their branding stripped
+ * Returns true if all cards have paid-content branding with the same sponsor
+ *
+ * This can be called with either:
+ * - A CollectionBranding object (when available from decideCollectionBranding)
+ * - Raw cards array (when CollectionBranding is undefined but we still need to check)
+ */
+export const shouldStripBrandingFromCards = (
+	input: CollectionBranding | CardWithBranding[],
+	editionId?: EditionId,
+): boolean => {
+	// If we have a CollectionBranding object, use it directly
+	if (!Array.isArray(input)) {
+		return isPaidContentSameBranding(input);
+	}
+
+	// Otherwise, check the cards directly
+	if (!editionId) return false;
+
+	const brandingsFromCards = getBrandingFromCards(input, editionId);
+	if (!brandingsFromCards) {
+		return false;
+	}
+
+	const brandingKind = getBrandingType(brandingsFromCards);
+	const sameSponsor = everyCardHasSameSponsor(brandingsFromCards);
+
+	return brandingKind === 'paid-content' && sameSponsor;
+};
+
 export const badgeFromBranding = (
 	collectionBranding: CollectionBranding | undefined,
 ): DCRBadgeType | undefined => {

dotcom-rendering/src/model/enhanceCollections.ts

@@ -1,7 +1,8 @@
 import type { FECollection } from '../frontend/feFront';
 import {
 	decideCollectionBranding,
-	isPaidContentSameBranding,
+	shouldStripBrandingFromCards,
+	brandingEqual,
 } from '../lib/branding';
 import type { EditionId } from '../lib/edition';
 import type { Branding } from '../types/branding';
@@ -77,11 +78,19 @@ export const enhanceCollections = ({
 	const indexToShowFrontBranding =
 		findCollectionSuitableForFrontBranding(collections);
 
+	// Track the branding from the first primary container to detect duplicates in subsequent primary containers
+	let firstPrimaryBranding: Branding | undefined;
+
 	return collections.filter(isSupported).map((collection, index) => {
 		const { id, displayName, collectionType, hasMore, href, description } =
 			collection;
 		const allCards = [...collection.curated, ...collection.backfill];
-		const collectionBranding = decideCollectionBranding({
+
+		const isPrimaryContainer =
+			collection.config.collectionLevel === 'Primary';
+
+		// First, get the raw collection branding without considering previous containers
+		const rawCollectionBranding = decideCollectionBranding({
 			frontBranding,
 			couldDisplayFrontBranding: index === indexToShowFrontBranding,
 			cards: allCards,
@@ -91,8 +100,35 @@ export const enhanceCollections = ({
 					({ type }) => type === 'Branded',
 				) ?? false,
 		});
-		const stripBrandingFromCards =
-			isPaidContentSameBranding(collectionBranding);
+
+		// Determine if we should hide collection branding due to a previous primary container
+		const shouldHideCollectionBranding =
+			isPrimaryContainer &&
+			!!firstPrimaryBranding &&
+			!!rawCollectionBranding?.branding &&
+			brandingEqual(firstPrimaryBranding, rawCollectionBranding.branding);
+
+		// The actual collection branding to display (hide if duplicate branding of previous primary)
+		const collectionBranding = shouldHideCollectionBranding
+			? undefined
+			: rawCollectionBranding;
+
+		// Store the branding from the first primary container
+		if (
+			isPrimaryContainer &&
+			!firstPrimaryBranding &&
+			rawCollectionBranding
+		) {
+			firstPrimaryBranding = rawCollectionBranding.branding;
+		}
+
+		/** Determine if we should strip branding from cards
+		 * We need to check this directly in here because decideCollectionBranding might return undefined
+		 * when cards have same branding as frontBranding, but we still need to strip in that case
+		 */
+		const stripBrandingFromCards = rawCollectionBranding
+			? shouldStripBrandingFromCards(rawCollectionBranding)
+			: shouldStripBrandingFromCards(allCards, editionId);
 
 		const containerPalette = decideContainerPalette(
 			collection.config.metadata?.map((meta) => meta.type),