use index if available for promo id

src/app/containers/StoryPromo/index.jsx

@@ -24,7 +24,7 @@ import MediaIndicatorContainer from './MediaIndicator';
 import IndexAlsosContainer from './IndexAlsos';
 import loggerNode from '#lib/logger.node';
 import { MEDIA_MISSING } from '#lib/logger.const';
-import { getHeadingTagOverride, getUniqueLinkId } from './utilities';
+import { getHeadingTagOverride, buildUniquePromoId } from './utilities';
 import { MEDIA_ASSET_PAGE } from '#app/routes/utils/pageTypes';
 import useCombinedClickTrackerHandler from './useCombinedClickTrackerHandler';
 import PromoTimestamp from './Timestamp';
@@ -105,7 +105,7 @@ const StoryPromoContainer = ({
   const { pageType } = useContext(RequestContext);
   const handleClickTracking = useCombinedClickTrackerHandler(eventTrackingData);
 
-  const linkId = getUniqueLinkId(item, labelId);
+  const linkId = buildUniquePromoId(item, labelId);
 
   const liveLabel = pathOr('LIVE', ['media', 'liveLabel'], translations);
 

src/app/containers/StoryPromo/index.test.jsx

@@ -28,7 +28,7 @@ import {
 } from './helpers/fixtureData';
 import StoryPromoContainer from '.';
 import { ARTICLE_PAGE } from '#app/routes/utils/pageTypes';
-import { getUniqueLinkId } from './utilities';
+import { buildUniquePromoId } from './utilities';
 
 const onlyOneRelatedItem = {
   ...indexAlsosItem,
@@ -157,8 +157,8 @@ describe('StoryPromo Container', () => {
     it('should render h3, a, p, time', () => {
       const labelId = `unlabelled`;
 
-      const uriLabelId = getUniqueLinkId(assetTypeItem, labelId);
-      const assetUriId = getUniqueLinkId(cpsItem, labelId);
+      const uriLabelId = buildUniquePromoId(assetTypeItem, labelId);
+      const assetUriId = buildUniquePromoId(cpsItem, labelId);
 
       expect(cpsContainer.querySelectorAll('h3 a')[0].innerHTML).toEqual(
         `<span id="${assetUriId}">${cpsItem.headlines.headline}</span>`,

src/app/containers/StoryPromo/utilities/index.js

@@ -25,12 +25,15 @@ export const getHeadingTagOverride = ({ pageType, isContentTypeGuide }) => {
 
 export const isPgl = item => pathOr(null, ['cpsType'], item) === 'PGL';
 
-export const getUniqueLinkId = (item, labelId) => {
+export const buildUniquePromoId = (item, labelId) => {
+  const id = pathOr('', ['id'], item);
   const assetUri = pathOr('', ['locators', 'assetUri'], item);
-  const contentType = pathOr('', ['contentType'], item);
   const uri = pathOr('', ['uri'], item);
-  const uniqueId = assetUri || uri;
-  const assetId = uniqueId.split('/').pop();
-  const sanitisedId = assetId.replace(/\W/g, '');
-  return `promo-link-${labelId}${sanitisedId || ''}${contentType}`;
+  const assetId = (id || assetUri || uri).replace(/\W/g, '').split('/').pop();
+  const contentType = pathOr('', ['contentType'], item);
+
+  return ['promo', labelId, assetId, contentType]
+    .filter(Boolean)
+    .join('-')
+    .toLowerCase();
 };

src/app/containers/StoryPromo/utilities/index.test.js

@@ -1,4 +1,4 @@
-import { isMap, isPgl, getHeadingTagOverride, getUniqueLinkId } from '.';
+import { isMap, isPgl, getHeadingTagOverride, buildUniquePromoId } from '.';
 import {
   MOST_WATCHED_PAGE,
   PHOTO_GALLERY_PAGE,
@@ -77,35 +77,38 @@ describe('getHeadingTagOverride', () => {
   });
 });
 
-describe('getUniqueLinkId', () => {
+describe('buildUniquePromoId', () => {
   const labelId = 'unlabelled';
   it('should return id of promo-link with contentType and URI if contentType exists', () => {
-    expect(getUniqueLinkId(secondaryColumnNoAssetURI, labelId)).toEqual(
-      'promo-link-unlabellednewsRadioBulletin',
+    expect(buildUniquePromoId(secondaryColumnNoAssetURI, labelId)).toEqual(
+      'promo-unlabelled-httpswwwbbccouknews-radiobulletin',
     );
   });
 
   it('should return id using URI if assetURI does not exist', () => {
-    expect(getUniqueLinkId(standardLinkItem, labelId)).toEqual(
-      'promo-link-unlabelledazeriText',
+    expect(buildUniquePromoId(standardLinkItem, labelId)).toEqual(
+      'promo-unlabelled-httpwwwbbccomazeri-text',
     );
   });
 
   it('should return id using assetURI does not exist and contentType does not exist', () => {
-    expect(getUniqueLinkId(completeItem, labelId)).toEqual(
-      'promo-link-unlabelledwwwbbccouk',
+    expect(buildUniquePromoId(completeItem, labelId)).toEqual(
+      'promo-unlabelled-httpswwwbbccouk',
     );
   });
 
   it('should return id with contentType only if assetURI and URI do not exist', () => {
-    expect(getUniqueLinkId(secondaryColumnContentType, labelId)).toEqual(
-      'promo-link-unlabelledRadioBulletin',
+    expect(buildUniquePromoId(secondaryColumnContentType, labelId)).toEqual(
+      'promo-unlabelled-radiobulletin',
     );
   });
 
   it('should sanitise link from item and split from last forward slash', () => {
     expect(
-      getUniqueLinkId({ locators: { assetUri: 'a/a/ab.b.b@c@c@c' } }, labelId),
-    ).toEqual('promo-link-unlabelledabbbccc');
+      buildUniquePromoId(
+        { locators: { assetUri: 'a/a/ab.b.b@c@c@c' } },
+        labelId,
+      ),
+    ).toEqual('promo-unlabelled-aaabbbccc');
   });
 });