diff --git a/src/app/components/MostRead/Canonical/Item/index.test.tsx b/src/app/components/MostRead/Canonical/Item/index.test.tsx index 31821401886..0dd3eb7cd15 100755 --- a/src/app/components/MostRead/Canonical/Item/index.test.tsx +++ b/src/app/components/MostRead/Canonical/Item/index.test.tsx @@ -70,6 +70,31 @@ describe('MostReadLink', () => { ); expect(container).toMatchSnapshot(); }); + + it('should render a live pulse icon if the item refers to a live page', () => { + const { container } = render( + , + { + service: 'hausa', + toggles: { + eventTracking: { enabled: true }, + }, + }, + ); + + const livePulse = container.querySelector( + '[data-e2e=most-read-live-pulse]', + ); + expect(livePulse).not.toBeNull(); + }); }); describe('MostReadItemWrapper', () => { diff --git a/src/app/components/MostRead/Canonical/Item/index.tsx b/src/app/components/MostRead/Canonical/Item/index.tsx index b1d90026c1d..3f33e5668f4 100755 --- a/src/app/components/MostRead/Canonical/Item/index.tsx +++ b/src/app/components/MostRead/Canonical/Item/index.tsx @@ -1,6 +1,7 @@ import { forwardRef, PropsWithChildren } from 'react'; import { SerializedStyles, Theme } from '@emotion/react'; import useClickTrackerHandler from '#hooks/useClickTrackerHandler'; +import LiveLabel from '#app/components/LiveLabel'; import styles from './index.styles'; import { mostReadListGridProps, @@ -62,6 +63,7 @@ export const MostReadLink = ({ }; const clickTrackerHandler = useClickTrackerHandler(eventTrackingDataExtended); + const isLiveLink = href.includes('live'); return ( // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -71,6 +73,11 @@ export const MostReadLink = ({ href={href} {...clickTrackerHandler} > + {isLiveLink && ( + + + + )} {title} {children &&
{children}
}