Add isSensitive prop to reader revenue components

dotcom-rendering/package.json

@@ -43,7 +43,7 @@
 		"@guardian/shimport": "1.0.2",
 		"@guardian/source": "11.3.0",
 		"@guardian/source-development-kitchen": "18.1.1",
-		"@guardian/support-dotcom-components": "8.4.2",
+		"@guardian/support-dotcom-components": "8.5.0",
 		"@guardian/tsconfig": "0.2.0",
 		"@playwright/test": "1.58.0",
 		"@sentry/browser": "10.39.0",

dotcom-rendering/src/components/Island.test.tsx

@@ -287,6 +287,7 @@ describe('Island: server-side rendering', () => {
 					pageId={''}
 					keywordIds={''}
 					renderingTarget={'Web'}
+					isSensitive={false}
 				/>,
 			),
 		).not.toThrow();
@@ -430,6 +431,7 @@ describe('Island: server-side rendering', () => {
 						renderAds={true}
 						isLabs={false}
 						articleEndSlot={true}
+						isSensitive={false}
 					/>
 				</WithConfig>,
 			),

dotcom-rendering/src/components/LiveBlogEpic.island.tsx

@@ -33,6 +33,7 @@ type Props = {
 	pageId: string;
 	keywordIds: string;
 	renderingTarget: RenderingTarget;
+	isSensitive: boolean;
 };
 
 const useEpic = ({ name }: { name: string }) => {
@@ -90,13 +91,15 @@ const usePayload = ({
 	isPaidContent,
 	tags,
 	pageId,
+	isSensitive,
 }: {
 	shouldHideReaderRevenue: boolean;
 	sectionId: string;
 	isPaidContent: boolean;
 	tags: TagType[];
 	pageId: string;
 	keywordIds: string;
+	isSensitive: boolean;
 }): EpicPayload | undefined => {
 	const articleCounts = useArticleCounts(pageId, tags, 'LiveBlog');
 	const hasOptedOutOfArticleCount = useHasOptedOutOfArticleCount();
@@ -134,6 +137,7 @@ const usePayload = ({
 			isSignedIn,
 			pageId,
 			inHoldbackGroup,
+			isSensitive,
 		},
 	};
 };
@@ -243,6 +247,7 @@ export const LiveBlogEpic = ({
 	pageId,
 	keywordIds,
 	renderingTarget,
+	isSensitive,
 }: Props) => {
 	log('dotcom', 'LiveBlogEpic started');
 
@@ -262,6 +267,7 @@ export const LiveBlogEpic = ({
 		tags,
 		pageId,
 		keywordIds,
+		isSensitive,
 	});
 	if (!ophanPageViewId || !payload || !pageUrl) return null;
 

dotcom-rendering/src/components/LiveBlogRenderer.tsx

@@ -159,6 +159,7 @@ export const LiveBlogRenderer = ({
 						pageId={pageId}
 						keywordIds={keywordIds}
 						renderingTarget={renderingTarget}
+						isSensitive={isSensitive}
 					/>
 				</Island>
 			)}

dotcom-rendering/src/components/SlotBodyEnd.island.tsx

@@ -52,6 +52,7 @@ type Props = {
 	renderAds: boolean;
 	isLabs: boolean;
 	articleEndSlot: boolean;
+	isSensitive: boolean;
 };
 
 const slotStyles = css`
@@ -118,6 +119,7 @@ export const SlotBodyEnd = ({
 	renderAds,
 	isLabs,
 	articleEndSlot,
+	isSensitive,
 }: Props) => {
 	const { renderingTarget } = useConfig();
 	const { brazeMessages, braze } = useBraze(idApiUrl, renderingTarget);
@@ -175,6 +177,7 @@ export const SlotBodyEnd = ({
 					'growth-holdback-group',
 					'control',
 				) ?? false,
+			isSensitive,
 		});
 		const brazeArticleContext: BrazeArticleContext = {
 			section: sectionId,
@@ -230,6 +233,7 @@ export const SlotBodyEnd = ({
 		pageId,
 		braze,
 		abTests,
+		isSensitive,
 	]);
 
 	useEffect(() => {

dotcom-rendering/src/components/SlotBodyEnd/ReaderRevenueEpic.tsx

@@ -53,6 +53,7 @@ export type CanShowData = {
 	ophanPageViewId: string;
 	pageId?: string;
 	inHoldbackGroup?: boolean;
+	isSensitive: boolean;
 };
 
 const buildPayload = async (
@@ -75,6 +76,7 @@ const buildPayload = async (
 		isSignedIn: data.isSignedIn,
 		pageId: data.pageId,
 		inHoldbackGroup: data.inHoldbackGroup,
+		isSensitive: data.isSensitive,
 	},
 });
 

dotcom-rendering/src/components/StickyBottomBanner/ReaderRevenueBanner.tsx

@@ -131,6 +131,7 @@ const buildPayload = async ({
 	pageId,
 	inHoldbackGroup,
 	inAuxiaVariant,
+	isSensitive,
 }: BuildPayloadProps): Promise<BannerPayload> => {
 	const getBrowserId = (): string | undefined => {
 		if (!inAuxiaVariant) return undefined;
@@ -170,6 +171,7 @@ const buildPayload = async ({
 			pageId,
 			inHoldbackGroup,
 			browserId: getBrowserId(),
+			isSensitive,
 		},
 	};
 };

dotcom-rendering/src/layouts/AudioLayout.tsx

@@ -377,6 +377,9 @@ export const AudioLayout = (props: WebProps) => {
 												!!article.config.switches
 													.articleEndSlot
 											}
+											isSensitive={
+												article.config.isSensitive
+											}
 										/>
 									</Island>
 								)}

dotcom-rendering/src/layouts/CommentLayout.tsx

@@ -629,6 +629,9 @@ export const CommentLayout = (props: WebProps | AppsProps) => {
 													!!article.config.switches
 														.articleEndSlot
 												}
+												isSensitive={
+													article.config.isSensitive
+												}
 											/>
 										</Island>
 									)}

dotcom-rendering/src/layouts/ImmersiveLayout.tsx

@@ -719,6 +719,9 @@ export const ImmersiveLayout = (props: WebProps | AppProps) => {
 												!!article.config.switches
 													.articleEndSlot
 											}
+											isSensitive={
+												article.config.isSensitive
+											}
 										/>
 									</Island>
 								)}

dotcom-rendering/src/layouts/InteractiveLayout.tsx

@@ -565,6 +565,7 @@ export const InteractiveLayout = (props: WebProps | AppsProps) => {
 								articleEndSlot={
 									!!article.config.switches.articleEndSlot
 								}
+								isSensitive={article.config.isSensitive}
 							/>
 						</Island>
 					</div>

dotcom-rendering/src/layouts/ShowcaseLayout.tsx

@@ -604,6 +604,9 @@ export const ShowcaseLayout = (props: WebProps | AppsProps) => {
 												!!article.config.switches
 													.articleEndSlot
 											}
+											isSensitive={
+												article.config.isSensitive
+											}
 										/>
 									</Island>
 								)}

dotcom-rendering/src/layouts/StandardLayout.tsx

@@ -742,6 +742,9 @@ export const StandardLayout = (props: WebProps | AppProps) => {
 												!!article.config.switches
 													.articleEndSlot
 											}
+											isSensitive={
+												article.config.isSensitive
+											}
 										/>
 									</Island>
 								)}