MWPW-195996: Flex card configurations updates

libs/blocks/caas-config/caas-config.js

@@ -92,7 +92,8 @@ const defaultOptions = {
     'image-small-left': 'Small Left',
   },
   flexCardTextAlign: {
-    'text-left': 'Default',
+    default: 'Default',
+    'text-left': 'Left',
     'text-center': 'Center',
     'text-justify': 'Justify',
     'text-right': 'Right',
@@ -240,6 +241,7 @@ const defaultOptions = {
   },
   detailsTextOption: {
     default: 'Default',
+    hidden: 'Hidden',
     createdDate: 'Created Date',
     modifiedDate: 'Modified Date',
     staticDate: 'Static Date',
@@ -437,7 +439,7 @@ const UiPanel = () => {
       <${Input} label="Hide Details Text" prop="flexCardHideDetails" type="checkbox" />
       <${Input} label="Hide Title" prop="flexCardHideTitle" type="checkbox" />
       <${Input} label="Hide Description" prop="flexCardHideDescription" type="checkbox" />
-      <${Input} label="Hide Footer (CTA)" prop="flexCardHideFooter" type="checkbox" />
+      <${Input} label="Show Date on Footer" prop="flexCardShowDateOnFooter" type="checkbox" />
     </div>
   `;
 

libs/blocks/caas/utils.js

@@ -1126,7 +1126,7 @@ export const getConfig = async (originalState, strs = {}) => {
           || state.flexCardHideDetails
           || state.flexCardHideTitle
           || state.flexCardHideDescription
-          || state.flexCardHideFooter))
+          || state.flexCardShowDateOnFooter))
         && {
           flexCard: {
             imageOption: state.flexCardImageOptions,
@@ -1135,7 +1135,7 @@ export const getConfig = async (originalState, strs = {}) => {
             hideDetails: !!state.flexCardHideDetails,
             hideTitle: !!state.flexCardHideTitle,
             hideDescription: !!state.flexCardHideDescription,
-            hideFooter: !!state.flexCardHideFooter,
+            showDateOnFooter: !!state.flexCardShowDateOnFooter,
           },
         }
       ),
@@ -1394,7 +1394,7 @@ export const defaultState = {
   flexCardHideDetails: false,
   flexCardHideTitle: false,
   flexCardHideDescription: false,
-  flexCardHideFooter: false,
+  flexCardShowDateOnFooter: false,
   detailsTextOption: 'default',
   titleHeadingLevel: 'h3',
   totalCardsToShow: 10,

test/blocks/caas/utils.test.js

@@ -2,6 +2,7 @@ import { expect } from '@esm-bundle/chai';
 import { stub } from 'sinon';
 import { setConfig } from '../../../libs/utils/utils.js';
 import { getLingoActive } from '../../../libs/utils/lingo-active.js';
+import caasTags from '../../../libs/blocks/caas-config/caas-tags.js';
 import {
   defaultState,
   getConfig,
@@ -999,6 +1000,47 @@ describe('getCountryAndLang', () => {
     expect(config.collection).to.not.have.property('editorialOpenVariant');
   });
 
+  it('should include flexCard.showDateOnFooter in the config when enabled', async () => {
+    const state = {
+      ...defaultState,
+      cardStyle: 'flex-card',
+      flexCardShowDateOnFooter: true,
+    };
+    const config = await getConfig(state, strings);
+    expect(config.collection.flexCard).to.deep.equal({
+      imageOption: 'default',
+      textAlign: 'text-left',
+      textSize: 'default',
+      hideDetails: false,
+      hideTitle: false,
+      hideDescription: false,
+      showDateOnFooter: true,
+    });
+  });
+
+  it('should NOT include flexCard in the config when flexCardShowDateOnFooter is disabled and all other flexCard options are default', async () => {
+    const state = {
+      ...defaultState,
+      cardStyle: 'flex-card',
+      flexCardShowDateOnFooter: false,
+    };
+    const config = await getConfig(state, strings);
+    expect(config.collection).to.not.have.property('flexCard');
+  });
+
+  it('should populate products from getProducts when detailsTextOption is productName', async () => {
+    const state = { ...defaultState, detailsTextOption: 'productName' };
+    const config = await getConfig(state, strings);
+    expect(config.products).to.deep.equal(caasTags.namespaces.caas.tags.mnemonics.tags);
+    expect(config.products).to.not.be.empty;
+  });
+
+  it('should NOT call getProducts when detailsTextOption is not productName', async () => {
+    const state = { ...defaultState, detailsTextOption: 'default' };
+    const config = await getConfig(state, strings);
+    expect(config.products).to.deep.equal({});
+  });
+
   it('should include localFirst sort option when sortLocalFirst is enabled', async () => {
     const state = { ...defaultState, sortLocalFirst: true };
     const config = await getConfig(state, strings);