feat(@dpc-sdp/ripple-tide-landing-page): allow for multiple content types in content collection UI

packages/ripple-tide-landing-page/mapping/components/content-collection-ui/content-collection-ui-mapping.test.ts

@@ -10,7 +10,7 @@ const mappedComponent = (index: number) =>
   contentCollectionUiMapping(rawData[index], {}, { site: 8888 })
 
 describe('contentCollectionUiMapping', () => {
-  it('maps a raw json for manual items - card with images', () => {
+  it('maps JSON for manual items - card with images', () => {
     const manualItems1: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -53,7 +53,7 @@ describe('contentCollectionUiMapping', () => {
     expect(mappedComponent(0)).toEqual(manualItems1)
   })
 
-  it('maps a raw json for manual items - carousel no images', () => {
+  it('maps JSON for manual items - carousel no images', () => {
     const manualItems2: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -97,7 +97,7 @@ describe('contentCollectionUiMapping', () => {
     expect(mappedComponent(1)).toEqual(manualItems2)
   })
 
-  it('maps a raw json for manual items - list', () => {
+  it('maps JSON for manual items - list', () => {
     const manualItems3: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -140,7 +140,7 @@ describe('contentCollectionUiMapping', () => {
     expect(mappedComponent(2)).toEqual(manualItems3)
   })
 
-  it('maps a raw json for auto items - cards with image', () => {
+  it('maps JSON for auto items - cards with image', () => {
     const autoItems1: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -173,7 +173,7 @@ describe('contentCollectionUiMapping', () => {
     expect(mappedComponent(3)).toEqual(autoItems1)
   })
 
-  it('maps a raw json for auto items - grant list', () => {
+  it('maps JSON for auto items - grant list', () => {
     const autoItems2: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -207,7 +207,7 @@ describe('contentCollectionUiMapping', () => {
     expect(mappedComponent(4)).toEqual(autoItems2)
   })
 
-  it('maps a raw json for auto items - landing pages carousel with image', () => {
+  it('maps JSON for auto items - landing pages carousel with image', () => {
     const autoItems3: TideDynamicPageComponent<TideContentCollectionUIComponent> =
       {
         component: 'TideLandingPageContentCollectionUI',
@@ -240,4 +240,37 @@ describe('contentCollectionUiMapping', () => {
 
     expect(mappedComponent(5)).toEqual(autoItems3)
   })
+
+  it('maps JSON for auto items - news and events', () => {
+    const autoItems4: TideDynamicPageComponent<TideContentCollectionUIComponent> =
+      {
+        component: 'TideLandingPageContentCollectionUI',
+        id: '5738548',
+        title: 'Auto items 4',
+        props: {
+          id: '5738548',
+          showImage: false,
+          displayType: 'list',
+          displayNumber: 12,
+          searchQuery: {
+            query: {
+              bool: {
+                filter: [
+                  { terms: { type: ['news', 'event'] } },
+                  { terms: { field_topic: [50] } },
+                  { term: { field_node_site: 8888 } }
+                ]
+              }
+            },
+            sort: [{ field_news_date: 'desc' }, { created: 'desc' }],
+            from: 0,
+            size: 12
+          },
+          description: '<p>An automated group of items - news and events</p>',
+          link: null
+        }
+      }
+
+    expect(mappedComponent(6)).toEqual(autoItems4)
+  })
 })

packages/ripple-tide-landing-page/mapping/components/content-collection-ui/content-collection-ui-mapping.ts

@@ -7,7 +7,7 @@ type TideContentCollectionUIQueryDSL = Record<string, any>
 
 export type TideContentCollectionUISource = {
   source: string
-  contentType: string
+  contentType: string[]
   filters: {
     taxonomy: number
     terms: number[]
@@ -33,12 +33,13 @@ const getFilters = (
   siteId?: string
 ): TideContentCollectionUIQueryDSL => {
   const filters = []
+  const contentType = Array.isArray(config.contentType)
+    ? config.contentType
+    : [config.contentType]
 
-  filters.push({
-    terms: {
-      type: [config.contentType]
-    }
-  })
+  if (contentType) {
+    filters.push({ terms: { type: contentType } })
+  }
 
   if (config.filters) {
     const contentFieldFilters = config.filters
@@ -63,7 +64,11 @@ const getFilters = (
 }
 
 const getAutoSort = (config: TideContentCollectionUISource) => {
-  if (config.contentType === 'news') {
+  const contentType = Array.isArray(config.contentType)
+    ? config.contentType
+    : [config.contentType]
+
+  if (contentType.includes('news')) {
     return [{ field_news_date: 'desc' }, { created: 'desc' }]
   }
   return [{ created: 'desc' }]

packages/ripple-tide-landing-page/mapping/components/content-collection-ui/test-data.js

@@ -133,7 +133,7 @@ export default [
     default_langcode: true,
     revision_translation_affected: true,
     field_content_collection_ui:
-      '{"source":"auto","contentType":"event","filters":[],"manualItems":[""],"showImage":true,"displayType":"card","displayNumber":2}',
+      '{"source":"auto","contentType":["event"],"filters":[],"manualItems":[""],"showImage":true,"displayType":"card","displayNumber":2}',
     field_paragraph_body: {
       value: '<p>An automated group of items - all event cards with image</p>',
       format: 'rich_text',
@@ -214,5 +214,38 @@ export default [
     field_paragraph_title: 'Auto items 3',
     id: '5a0c2747-5d2d-44c3-9397-dfd47a641fb4',
     type: 'paragraph--content_collection_ui'
+  },
+  {
+    links: {
+      self: {
+        href: 'https://nginx-php.pr-1951.content-vic.sdp4.sdp.vic.gov.au/api/v1/paragraph/content_collection_ui/5a0c5647-5d2d-44c3-9397-dfd47a641fb4?resourceVersion=id%3A7224319'
+      }
+    },
+    meta: {
+      target_revision_id: 764319,
+      drupal_internal__target_id: 5738548
+    },
+    drupal_internal__id: 5738548,
+    drupal_internal__revision_id: 764319,
+    langcode: 'en',
+    status: true,
+    created: '2026-01-05T04:02:20+00:00',
+    parent_id: '60130',
+    parent_type: 'node',
+    parent_field_name: 'field_landing_page_component',
+    behavior_settings: [],
+    default_langcode: true,
+    revision_translation_affected: true,
+    field_content_collection_ui:
+      '{"source":"auto","contentType":["news","event"],"filters":[{"taxonomy":"field_topic","terms":[50]}],"manualItems":[""],"showImage":false,"displayType":"list","displayNumber":12}',
+    field_paragraph_body: {
+      value: '<p>An automated group of items - news and events</p>',
+      format: 'rich_text',
+      processed: '<p>An automated group of items - news and events</p>'
+    },
+    field_paragraph_link: null,
+    field_paragraph_title: 'Auto items 4',
+    id: '5a0c5647-5d2d-44c3-9397-dfd47a641fb4',
+    type: 'paragraph--content_collection_ui'
   }
 ]