Merge pull request #11485 from guardian/dina/set-live-logo-styling-be…

…hind-a-switch Set live updated logo styling for Advertising Partner
guardian · May 30, 2024 · c4e4c52 · c4e4c52
2 parents 8141d77 + 9e80f8c
commit c4e4c52
Show file tree

Hide file tree

Showing 30 changed files with 104 additions and 112 deletions.
diff --git a/dotcom-rendering/src/components/ArticleMeta.test.tsx b/dotcom-rendering/src/components/ArticleMeta.test.tsx
@@ -19,7 +19,7 @@ describe('ArticleMeta', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -66,7 +66,7 @@ describe('ArticleMeta', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>

diff --git a/dotcom-rendering/src/components/Badge.tsx b/dotcom-rendering/src/components/Badge.tsx
@@ -47,7 +47,7 @@ type Props = {
 	ophanComponentName?: string;
 	isInLabsSection?: boolean;
 	isAdvertisingPartner?: boolean;
-	inAdvertisingPartnerABTest?: boolean;
+	updateLogoAdPartnerSwitch?: boolean;
 };
 
 export const Badge = ({
@@ -57,7 +57,7 @@ export const Badge = ({
 	ophanComponentName,
 	isInLabsSection = false,
 	isAdvertisingPartner = false,
-	inAdvertisingPartnerABTest = false,
+	updateLogoAdPartnerSwitch = false,
 }: Props) => {
 	return (
 		<a
@@ -73,7 +73,7 @@ export const Badge = ({
 						? labsSectionBadgeSizingStyles
 						: frontsSectionBadgeSizingStyles,
 					isAdvertisingPartner &&
-						inAdvertisingPartnerABTest &&
+						updateLogoAdPartnerSwitch &&
 						imageAdvertisingPartnerStyles,
 				]}
 				src={imageSrc}

diff --git a/dotcom-rendering/src/components/Branding.importable.tsx b/dotcom-rendering/src/components/Branding.importable.tsx
@@ -209,7 +209,7 @@ export const Branding = ({ branding, format }: Props) => {
 		locationPrefix: 'article-meta',
 	});
 
-	const { darkModeAvailable, inAdvertisingPartnerABTest } = useConfig();
+	const { darkModeAvailable, updateLogoAdPartnerSwitch } = useConfig();
 
 	const isAdvertisingPartnerOrExclusive =
 		branding.logo.label.toLowerCase() === 'advertising partner' ||
@@ -223,18 +223,18 @@ export const Branding = ({ branding, format }: Props) => {
 			css={[
 				brandingStyle,
 				isAdvertisingPartnerOrExclusive &&
-					inAdvertisingPartnerABTest &&
+					updateLogoAdPartnerSwitch &&
 					brandingAdvertisingPartnerStyle,
 				isAdvertisingPartnerAndInteractive &&
-					inAdvertisingPartnerABTest &&
+					updateLogoAdPartnerSwitch &&
 					brandingInteractiveStyle,
 			]}
 		>
 			<div
 				css={[
 					labelStyle,
 					isAdvertisingPartnerOrExclusive &&
-						inAdvertisingPartnerABTest &&
+						updateLogoAdPartnerSwitch &&
 						labelAdvertisingPartnerStyle,
 					isLiveBlog && liveBlogLabelStyle,
 				]}
@@ -245,8 +245,8 @@ export const Branding = ({ branding, format }: Props) => {
 				css={[
 					brandingLogoStyle,
 					isAdvertisingPartnerOrExclusive &&
+						updateLogoAdPartnerSwitch &&
 						!isInteractive &&
-						inAdvertisingPartnerABTest &&
 						brandingLogoAdvertisingPartnerStyle,
 				]}
 			>
@@ -269,7 +269,7 @@ export const Branding = ({ branding, format }: Props) => {
 				css={[
 					aboutLinkStyle,
 					isAdvertisingPartnerOrExclusive &&
-						inAdvertisingPartnerABTest &&
+						updateLogoAdPartnerSwitch &&
 						aboutLinkAdvertisingPartnerStyle,
 					isLiveBlog && liveBlogAboutLinkStyle,
 				]}

diff --git a/dotcom-rendering/src/components/BylineLink.test.tsx b/dotcom-rendering/src/components/BylineLink.test.tsx
@@ -108,7 +108,7 @@ describe('BylineLink', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -151,7 +151,7 @@ describe('BylineLink', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -196,7 +196,7 @@ describe('BylineLink', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -237,7 +237,7 @@ describe('BylineLink', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -269,7 +269,7 @@ describe('BylineLink', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>

diff --git a/dotcom-rendering/src/components/ConfigContext.test.tsx b/dotcom-rendering/src/components/ConfigContext.test.tsx
@@ -24,19 +24,19 @@ describe('ConfigContext', () => {
 			{
 				renderingTarget: 'Web',
 				darkModeAvailable: false,
-				inAdvertisingPartnerABTest: false,
+				updateLogoAdPartnerSwitch: false,
 				assetOrigin: '/',
 			},
 			{
 				renderingTarget: 'Apps',
 				darkModeAvailable: true,
-				inAdvertisingPartnerABTest: false,
+				updateLogoAdPartnerSwitch: false,
 				assetOrigin: '/',
 			},
 			{
 				renderingTarget: 'Apps',
 				darkModeAvailable: false,
-				inAdvertisingPartnerABTest: false,
+				updateLogoAdPartnerSwitch: false,
 				assetOrigin: '/',
 			},
 		] as const satisfies ReadonlyArray<Config>)(

diff --git a/dotcom-rendering/src/components/Contributor.test.tsx b/dotcom-rendering/src/components/Contributor.test.tsx
@@ -19,7 +19,7 @@ describe('Contributor', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -54,7 +54,7 @@ describe('Contributor', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>

diff --git a/dotcom-rendering/src/components/Discussion/Discussion.test.tsx b/dotcom-rendering/src/components/Discussion/Discussion.test.tsx
@@ -18,7 +18,7 @@ describe('App', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>

diff --git a/dotcom-rendering/src/components/Dropdown.test.tsx b/dotcom-rendering/src/components/Dropdown.test.tsx
@@ -45,7 +45,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -67,7 +67,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -92,7 +92,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -116,7 +116,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -142,7 +142,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -169,7 +169,7 @@ describe('Dropdown', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>

diff --git a/dotcom-rendering/src/components/FrontSection.tsx b/dotcom-rendering/src/components/FrontSection.tsx
@@ -87,7 +87,7 @@ type Props = {
 	discussionApiUrl: string;
 	collectionBranding?: CollectionBranding;
 	isTagPage?: boolean;
-	inAdvertisingPartnerABTest?: boolean;
+	updateLogoAdPartnerSwitch?: boolean;
 };
 
 const width = (columns: number, columnWidth: number, columnGap: number) =>
@@ -463,7 +463,7 @@ export const FrontSection = ({
 	discussionApiUrl,
 	collectionBranding,
 	isTagPage = false,
-	inAdvertisingPartnerABTest = false,
+	updateLogoAdPartnerSwitch = false,
 }: Props) => {
 	const overrides =
 		containerPalette && decideContainerOverrides(containerPalette);
@@ -541,7 +541,7 @@ export const FrontSection = ({
 						/>
 					}
 					collectionBranding={collectionBranding}
-					inAdvertisingPartnerABTest={inAdvertisingPartnerABTest}
+					updateLogoAdPartnerSwitch={updateLogoAdPartnerSwitch}
 				/>
 
 				{leftContent}

diff --git a/dotcom-rendering/src/components/FrontSectionTitle.tsx b/dotcom-rendering/src/components/FrontSectionTitle.tsx
@@ -14,7 +14,7 @@ import { Badge } from './Badge';
 type Props = {
 	title: React.ReactNode;
 	collectionBranding: CollectionBranding | undefined;
-	inAdvertisingPartnerABTest: boolean;
+	updateLogoAdPartnerSwitch: boolean;
 };
 
 const titleStyle = css`
@@ -81,7 +81,7 @@ const aboutThisLinkAdvertisingPartnerStyles = css`
 export const FrontSectionTitle = ({
 	title,
 	collectionBranding,
-	inAdvertisingPartnerABTest,
+	updateLogoAdPartnerSwitch,
 }: Props) => {
 	switch (collectionBranding?.kind) {
 		case 'foundation': {
@@ -168,21 +168,21 @@ export const FrontSectionTitle = ({
 					<div css={titleStyle}>
 						{title}
 						{isAdvertisingPartnerOrExclusive &&
-						inAdvertisingPartnerABTest ? (
+						updateLogoAdPartnerSwitch ? (
 							<hr css={advertisingPartnerDottedBorder} />
 						) : null}
 						<div
 							css={
 								isAdvertisingPartnerOrExclusive &&
-								inAdvertisingPartnerABTest &&
+								updateLogoAdPartnerSwitch &&
 								brandingAdvertisingPartnerStyle
 							}
 						>
 							<p
 								css={[
 									labelStyles,
 									isAdvertisingPartnerOrExclusive &&
-										inAdvertisingPartnerABTest &&
+										updateLogoAdPartnerSwitch &&
 										labelAdvertisingPartnerStyles,
 								]}
 							>
@@ -194,16 +194,16 @@ export const FrontSectionTitle = ({
 								isAdvertisingPartner={
 									isAdvertisingPartnerOrExclusive
 								}
-								inAdvertisingPartnerABTest={
-									inAdvertisingPartnerABTest
+								updateLogoAdPartnerSwitch={
+									updateLogoAdPartnerSwitch
 								}
 							/>
 							<a
 								href={aboutThisLink}
 								css={[
 									aboutThisLinkStyles,
 									isAdvertisingPartnerOrExclusive &&
-										inAdvertisingPartnerABTest &&
+										updateLogoAdPartnerSwitch &&
 										aboutThisLinkAdvertisingPartnerStyles,
 								]}
 							>

diff --git a/dotcom-rendering/src/components/GuideAtom/GuideAtom.test.tsx b/dotcom-rendering/src/components/GuideAtom/GuideAtom.test.tsx
@@ -11,7 +11,7 @@ describe('GuideAtom', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -37,7 +37,7 @@ describe('GuideAtom', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>
@@ -64,7 +64,7 @@ describe('GuideAtom', () => {
 				value={{
 					renderingTarget: 'Web',
 					darkModeAvailable: false,
-					inAdvertisingPartnerABTest: false,
+					updateLogoAdPartnerSwitch: false,
 					assetOrigin: '/',
 				}}
 			>