Merge branch 'main' into storybook-9

DanielCliftonGuardian · web-flow · commit 80b9ff21b20c · 2025-10-13T14:30:57.000+01:00
diff --git a/apps-rendering/package.json b/apps-rendering/package.json
@@ -46,7 +46,7 @@
 		"@guardian/cdk": "61.4.0",
 		"@guardian/content-api-models": "31.0.0",
 		"@guardian/content-atom-model": "6.1.0",
-		"@guardian/eslint-config-typescript": "9.0.1",
+		"@guardian/eslint-config-typescript": "10.0.1",
 		"@guardian/libs": "22.0.0",
 		"@guardian/renditions": "0.2.0",
 		"@guardian/source": "9.0.0",
diff --git a/apps-rendering/src/atoms.ts b/apps-rendering/src/atoms.ts
@@ -21,9 +21,13 @@ interface TimelineEvent {
 }
 
 function formatOptionalDate(date: Int64 | undefined): string | undefined {
-	if (date === undefined) return undefined;
+	if (date === undefined) {
+		return undefined;
+	}
 	const d = new Date(date.toNumber());
-	if (!isValidDate(d)) return undefined;
+	if (!isValidDate(d)) {
+		return undefined;
+	}
 	return d.toDateString();
 }
 
diff --git a/apps-rendering/src/client/article.ts b/apps-rendering/src/client/article.ts
@@ -78,7 +78,9 @@ function followToggle(
 	bridgetClient: NotificationsClient<void> | TagClient<void>,
 ): void {
 	const followStatus = document.querySelector(querySelector);
-	if (!followStatus) return;
+	if (!followStatus) {
+		return;
+	}
 	void bridgetClient.isFollowing(topic).then((isFollowing) => {
 		if (isFollowing) {
 			void bridgetClient.unfollow(topic).then((unfollow) => {
diff --git a/apps-rendering/src/client/callouts.ts b/apps-rendering/src/client/callouts.ts
@@ -120,8 +120,12 @@ const makeArticleFormat = (theme: ArticleTheme): ArticleFormatProps => ({
 const themeParser: Parser<ArticleTheme> = pipe(
 	numberParser,
 	andThen((num) => {
-		if (Pillar[num]) return succeed(num);
-		if (ArticleSpecial[num]) return succeed(num);
+		if (Pillar[num]) {
+			return succeed(num);
+		}
+		if (ArticleSpecial[num]) {
+			return succeed(num);
+		}
 		return fail(`I was not able to parse '${num}' as a valid theme`);
 	}),
 );
diff --git a/apps-rendering/src/client/editions.ts b/apps-rendering/src/client/editions.ts
@@ -33,7 +33,9 @@ const adjustGalleryImages = (): void => {
 	const figures: NodeListOf<HTMLElement> = document.querySelectorAll(
 		'.editions-gallery-figure',
 	);
-	if (figures.length === 0) return;
+	if (figures.length === 0) {
+		return;
+	}
 
 	Array.from(figures).forEach((figure) => {
 		const imageEl = figure.querySelector('img');
diff --git a/apps-rendering/src/client/nativeCommunication.ts b/apps-rendering/src/client/nativeCommunication.ts
@@ -29,7 +29,9 @@ function areRectsEqual(rectA: IRect, rectB: IRect): boolean {
 }
 
 function positionChanged(slotsA: Slot[], slotsB: Slot[]): boolean {
-	if (slotsA.length !== slotsB.length) return true;
+	if (slotsA.length !== slotsB.length) {
+		return true;
+	}
 	return !slotsA.every((slot, index) =>
 		areRectsEqual(slot.rect, slotsB[index].rect),
 	);
diff --git a/apps-rendering/src/client/newsletterSignupForm.ts b/apps-rendering/src/client/newsletterSignupForm.ts
@@ -14,10 +14,10 @@ interface FormBundle {
 }
 
 // ----- Constants ----- //
-const SIGNUP_CONTAINER_CLASSNAME = 'js-signup-form-container' as const;
-const FALLBACK_CONTENT_CLASSNAME = 'js-signup-form-fallback-container' as const;
-const LOADING_CONTENT_CLASSNAME = 'js-signup-form-loading-content' as const;
-const SIGNUP_COMPONENT_BASE_CLASSNAME = 'js-signup-form' as const;
+const SIGNUP_CONTAINER_CLASSNAME = 'js-signup-form-container';
+const FALLBACK_CONTENT_CLASSNAME = 'js-signup-form-fallback-container';
+const LOADING_CONTENT_CLASSNAME = 'js-signup-form-loading-content';
+const SIGNUP_COMPONENT_BASE_CLASSNAME = 'js-signup-form';
 const MODIFIER_CLASSNAME = {
 	waiting: `${SIGNUP_COMPONENT_BASE_CLASSNAME}--waiting`,
 	success: `${SIGNUP_COMPONENT_BASE_CLASSNAME}--success`,
diff --git a/apps-rendering/src/components/Callout/calloutContact.tsx b/apps-rendering/src/components/Callout/calloutContact.tsx
@@ -31,7 +31,9 @@ export const formatContactNumbers = (contacts: Contact[]): string => {
 
 	// Group each contact by its value, so we can display multiple names for the same number.
 	contacts.forEach(({ name, value }) => {
-		if (!contactNumbers.has(value)) contactNumbers.set(value, []);
+		if (!contactNumbers.has(value)) {
+			contactNumbers.set(value, []);
+		}
 		contactNumbers.get(value)?.push(name);
 	});
 
diff --git a/apps-rendering/src/components/Callout/calloutForm.tsx b/apps-rendering/src/components/Callout/calloutForm.tsx
@@ -94,7 +94,9 @@ const CalloutForm = ({ id, fields }: CalloutFormProps) => {
 		// Reset error for new submission attempt
 		setSubmissionError('');
 		const isValid = validateForm();
-		if (!isValid) return;
+		if (!isValid) {
+			return;
+		}
 
 		// need to add prefix `field_` to all keys in form (as is required by formstack api)
 		const formDataWithFieldPrefix = Object.keys(formData).reduce(
diff --git a/apps-rendering/src/components/Callout/formFields.tsx b/apps-rendering/src/components/Callout/formFields.tsx
@@ -62,7 +62,9 @@ export const FormField = ({
 		);
 	}
 
-	if (formField.hidden) return <input type="hidden" />;
+	if (formField.hidden) {
+		return <input type="hidden" />;
+	}
 
 	switch (type) {
 		case 'text':
diff --git a/apps-rendering/src/components/Callout/shareLink.tsx b/apps-rendering/src/components/Callout/shareLink.tsx
@@ -23,7 +23,9 @@ export const ShareLink = ({
 	const onShare = async (): Promise<void> => {
 		const url = window.location.href;
 		let shareTitle = `Share your experience`;
-		if (title) shareTitle += `: ${title}`;
+		if (title) {
+			shareTitle += `: ${title}`;
+		}
 
 		const shareText = `
 I saw this callout in an article: ${url}#${urlAnchor}
diff --git a/apps-rendering/src/components/Callout/theme.ts b/apps-rendering/src/components/Callout/theme.ts
@@ -85,7 +85,9 @@ export const darkTheme = {
 };
 
 const getPrefersDark = (): boolean => {
-	if (typeof window === 'undefined') return false;
+	if (typeof window === 'undefined') {
+		return false;
+	}
 	return window.matchMedia('(prefers-color-scheme: dark)').matches;
 };
 
diff --git a/apps-rendering/src/components/Deadline/index.tsx b/apps-rendering/src/components/Deadline/index.tsx
@@ -22,16 +22,26 @@ export const getDeadlineText = (
 ): string | undefined => {
 	const maxDays = 7;
 	const daysBetween = getDaysBetween(date1, date2);
-	if (daysBetween <= 0 || daysBetween > maxDays) return;
-	if (daysBetween <= 1) return 'Closing today';
-	if (Math.round(daysBetween) === 1) return 'Open for 1 more day';
+	if (daysBetween <= 0 || daysBetween > maxDays) {
+		return;
+	}
+	if (daysBetween <= 1) {
+		return 'Closing today';
+	}
+	if (Math.round(daysBetween) === 1) {
+		return 'Open for 1 more day';
+	}
 	return `Open for ${Math.round(daysBetween)} more days`;
 };
 
 function formatOptionalDate(date: number | undefined): Date | undefined {
-	if (date === undefined) return undefined;
+	if (date === undefined) {
+		return undefined;
+	}
 	const d = new Date(date);
-	if (!isValidDate(d)) return undefined;
+	if (!isValidDate(d)) {
+		return undefined;
+	}
 	return d;
 }
 
@@ -44,10 +54,14 @@ function isCalloutActive(until?: number): boolean {
 
 const DeadlineDate = ({ until }: { until?: number }) => {
 	const untilDate = formatOptionalDate(until);
-	if (!untilDate) return null;
+	if (!untilDate) {
+		return null;
+	}
 	const now = new Date();
 	const deadlineText = getDeadlineText(now, untilDate);
-	if (!deadlineText) return null;
+	if (!deadlineText) {
+		return null;
+	}
 	return (
 		<Highlight>
 			<SvgClockFilled size="xsmall" />
diff --git a/apps-rendering/src/renderer.ts b/apps-rendering/src/renderer.ts
@@ -118,8 +118,12 @@ const TweetStyles = css`
 `;
 
 const allowsDropCaps = (format: ArticleFormat): boolean => {
-	if (format.theme === ArticleSpecial.Labs) return false;
-	if (format.display === ArticleDisplay.Immersive) return true;
+	if (format.theme === ArticleSpecial.Labs) {
+		return false;
+	}
+	if (format.display === ArticleDisplay.Immersive) {
+		return true;
+	}
 	switch (format.design) {
 		case ArticleDesign.Feature:
 		case ArticleDesign.Comment:
@@ -396,7 +400,9 @@ const calloutDescriptionText = (
 	format: ArticleFormat,
 	doc?: DocumentFragment,
 ): ReactNode[] => {
-	if (!doc) return [];
+	if (!doc) {
+		return [];
+	}
 	const nodes = Array.from(doc.childNodes);
 	const filteredNodes = nodes.filter(
 		(node) => !['A'].includes(node.nodeName),
diff --git a/dotcom-rendering/package.json b/dotcom-rendering/package.json
@@ -34,7 +34,7 @@
 		"@guardian/cdk": "61.4.0",
 		"@guardian/commercial-core": "28.0.0",
 		"@guardian/core-web-vitals": "7.0.0",
-		"@guardian/eslint-config-typescript": "9.0.1",
+		"@guardian/eslint-config-typescript": "10.0.1",
 		"@guardian/identity-auth": "6.0.1",
 		"@guardian/identity-auth-frontend": "8.1.0",
 		"@guardian/libs": "26.0.0",
diff --git a/dotcom-rendering/src/model/enhanceCards.ts b/dotcom-rendering/src/model/enhanceCards.ts
@@ -219,15 +219,15 @@ export const getActiveMediaAtom = (
 			/**
 			 * Take one source for each supported video file type.
 			 */
-			const sources = supportedVideoFileTypes.reduce(
+			const sources = supportedVideoFileTypes.reduce<typeof assets>(
 				(acc, type) => {
 					const source = assets.find(
 						({ mimeType }) => mimeType === type,
 					);
 					if (source) acc.push(source);
 					return acc;
 				},
-				[] as typeof assets,
+				[],
 			);
 			if (!sources.length) return undefined;
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml

Original file line number	Diff line number	Diff line change
`@@ -21,9 +21,13 @@ interface TimelineEvent {`
`21`	`21`	`}`
`22`	`22`
`23`	`23`	`function formatOptionalDate(date: Int64 \| undefined): string \| undefined {`
`24`		`- if (date === undefined) return undefined;`
	`24`	`+ if (date === undefined) {`
	`25`	`+ return undefined;`
	`26`	`+ }`
`25`	`27`	`const d = new Date(date.toNumber());`
`26`		`- if (!isValidDate(d)) return undefined;`
	`28`	`+ if (!isValidDate(d)) {`
	`29`	`+ return undefined;`
	`30`	`+ }`
`27`	`31`	`return d.toDateString();`
`28`	`32`	`}`
`29`	`33`
Original file line number	Diff line number	Diff line change
`@@ -62,7 +62,9 @@ export const FormField = ({`
`62`	`62`	`);`
`63`	`63`	`}`
`64`	`64`
`65`		`- if (formField.hidden) return <input type="hidden" />;`
	`65`	`+ if (formField.hidden) {`
	`66`	`+ return <input type="hidden" />;`
	`67`	`+ }`
`66`	`68`
`67`	`69`	`switch (type) {`
`68`	`70`	`case 'text':`