diff --git a/dotcom-rendering/src/components/MultiByline.tsx b/dotcom-rendering/src/components/MultiByline.tsx
index 4b56ae8b68d..10fe5080ccd 100644
--- a/dotcom-rendering/src/components/MultiByline.tsx
+++ b/dotcom-rendering/src/components/MultiByline.tsx
@@ -52,7 +52,6 @@ export const MultiByline = ({
return (
{multiBylineItems.map((multiBylineItem, index) => (
- // eslint-disable-next-line react/no-array-index-key -- Title should usually be identical, but in case it isn't, also use array index
-
-
- {multiBylineItem.title}
-
+
{children}
@@ -97,6 +98,51 @@ export const MultiBylineItem = ({
);
};
+type BylineProps = {
+ title: string;
+ bylineHtml: string;
+ byline: string;
+ imageOverrideUrl?: string;
+ contributors: BlockContributor[];
+ format: ArticleFormat;
+};
+
+const Byline = ({
+ title,
+ bylineHtml,
+ byline,
+ imageOverrideUrl,
+ contributors,
+ format,
+}: BylineProps) => {
+ const sanitizedHtml = sanitise(bylineHtml, {});
+
+ return (
+
+
+
+ {title}
+
+ {bylineHtml ? (
+
+ ) : null}
+
+ {imageOverrideUrl ?? contributors[0]?.imageUrl ? (
+
+ ) : null}
+
+ );
+};
+
const Bio = ({ html }: { html?: string }) => {
if (!html) return null;
const sanitizedHtml = sanitise(html, {});