@capillarytech/creatives-library 9.0.55-alpha.0 → 9.0.55-alpha.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "9.0.55-alpha.0",
+  "version": "9.0.55-alpha.2",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/services/api.js

@@ -701,21 +701,13 @@ export const createCentralCommsMetaId = (payload, metaType = TRANSACTION) => {
   return request(url, getAPICallObject('POST', payload, false, false, false, true));
 };
 
-// CCS CommDefinition API (new Veyron /api/v1/commdefinition surface, proxied
-// through cap-creatives-api's /comm-definitions). Used by CommunicationFlow's
-// own Save action — separate from the legacy messageMeta functions above,
-// which remain in use by CreativesContainer's own save flow (Cap/sagas.js).
+// CCS CommDefinition API (new Veyron /api/v1/commdefinition surface, proxied through cap-creatives-api /comm-definitions); used by CommunicationFlow's Save, while legacy messageMeta functions remain for CreativesContainer's save flow (Cap/sagas.js).
 export const createCommDefinition = (payload) => {
   const url = `${API_ENDPOINT}/comm-definitions`;
   return request(url, getAPICallObject('POST', payload, false, false, false, true));
 };
 
-// Opens a new DRAFT version with the given content on an EXISTING
-// CommDefinition (same id/referenceId) — used by CommunicationFlow's edit-mode
-// save (re-editing a rejected alert) instead of createCommDefinition, so the
-// alert keeps its identity rather than becoming a brand-new CommDefinition.
-// Route verified against a real Postman sample against Veyron's own
-// /commdefinition/{id}/edit endpoint.
+// Opens a new DRAFT version with the supplied content on an existing CommDefinition (same id/referenceId); used by CommunicationFlow edit-mode saves to preserve the alert's identity instead of creating a new CommDefinition. Route verified against Veyron's /commdefinition/{id}/edit endpoint.
 export const editCommDefinition = (commDefinitionId, payload) => {
   const url = `${API_ENDPOINT}/comm-definitions/${commDefinitionId}/edit`;
   return request(url, getAPICallObject('POST', payload, false, false, false, true));

package/styles/containers/layout/_layoutPage.scss

@@ -77,7 +77,8 @@
     -webkit-flex: 1 1 auto;
     -ms-flex: 1 1 auto;
     flex: 1;
-    height: calc(100vh - 50px);
+    // No height: flex stretch inside `.main` sizes this. A hardcoded
+    // calc(100vh - 50px) under-counted the chrome and overhung it by ~83px.
     overflow: auto;
     color: #333333;
 }

package/translations/en.json

@@ -63,8 +63,8 @@
   "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
   "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
   "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-  "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
-  "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
+  "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
+  "creatives.components.AccessForbidden.forbiddenHeader": "Access Denied",
   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
   "creatives.components.CapTagList.Cancel": "Cancel",
   "creatives.components.CapTagList.Ok": "Ok",

package/v2Components/AccessForbidden/_accessForbidden.scss

@@ -1,14 +1,24 @@
-// Access-denied screen: rbac-lock icon + heading + subtext (matches the shared
-// "no access" screen used across Loyalty+ / Org Settings).
-.no-access-icon {
-  font-size: 48px;
-  color: #8c8c8c;
-}
-.no-access-title {
+@import '~@capillarytech/cap-ui-library/styles/_variables';
+
+.access-denied {
+  width: 100%;
+  // This module's ComponentWrapper has no padding, unlike the other MFEs'.
   margin-top: 16px;
-}
-.no-access-text {
-  margin-top: 8px;
-  color: #6b778c;
-  max-width: 420px;
+  padding-top: $CAP_SPACE_80;
+  text-align: center;
+
+  .access-denied-illustration {
+    width: 20rem;
+    height: 20rem;
+    margin-bottom: $CAP_SPACE_12;
+  }
+
+  .access-denied-title-container {
+    gap: $CAP_SPACE_08;
+    margin-bottom: $CAP_SPACE_08;
+  }
+
+  .access-denied-description {
+    color: $CAP_G04;
+  }
 }

package/v2Components/AccessForbidden/index.js

@@ -1,18 +1,37 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
-import { CapRow, CapHeading, CapIcon } from '@capillarytech/cap-ui-library';
+import {
+  CapRow,
+  CapImage,
+  CapIcon,
+  CapHeading,
+  CapLabel,
+} from '@capillarytech/cap-ui-library';
+import accessDeniedIllustration from '@capillarytech/cap-ui-library/assets/images/createNewIllustration.svg';
 import messages from './messages';
 import './_accessForbidden.scss';
 
 const AccessForbidden = () => (
-  <CapRow type='flex' vertical justify='center' align='middle' className="margin-t-32 text-align-center">
-    <CapIcon type="rbac-lock" className="no-access-icon" />
-    <CapHeading type="h3" className="no-access-title">
-      <FormattedMessage {...messages.forbiddenHeader} />
-    </CapHeading>
-    <CapHeading type="h6" className="no-access-text">
+  <CapRow vertical align="middle" justify="center" className="access-denied">
+    <CapImage
+      src={accessDeniedIllustration}
+      className="access-denied-illustration"
+      alt=""
+    />
+    <CapRow
+      type="flex"
+      align="middle"
+      justify="center"
+      className="access-denied-title-container"
+    >
+      <CapIcon type="rbac-lock" size="m" />
+      <CapHeading type="h2">
+        <FormattedMessage {...messages.forbiddenHeader} />
+      </CapHeading>
+    </CapRow>
+    <CapLabel type="label2" className="access-denied-description">
       <FormattedMessage {...messages.forbiddenDesc} />
-    </CapHeading>
+    </CapLabel>
   </CapRow>
 );
 

package/v2Components/AccessForbidden/messages.js

@@ -5,11 +5,10 @@ const prefix = 'creatives.components.AccessForbidden';
 export default defineMessages({
   forbiddenHeader: {
     id: `${prefix}.forbiddenHeader`,
-    defaultMessage: "You don't have permission to view this page.",
+    defaultMessage: 'Access Denied',
   },
   forbiddenDesc: {
     id: `${prefix}.forbiddenDesc`,
-    defaultMessage:
-      'Please contact your organisation administrator to request access.',
+    defaultMessage: 'This page access has not been provided to you.',
   },
 });

package/v2Components/CommonTestAndPreview/UnifiedPreview/index.js

@@ -139,6 +139,19 @@ const UnifiedPreview = ({
         );
       }
 
+      case CHANNELS.LINE:
+        // LINE currently carries a single text message; CCS stores lineMessageContent.messageBody as JSON for LINE's native messages[] (see testAndPreviewDataTransform.js), already reduced to plain text before this point, so reuse the SMS chat-bubble preview. Rich LINE types (image/video/sticker/imageMap/carousel/flex) are not specially rendered yet.
+        return (
+          <SmsPreviewContent
+            content={typeof content === 'string' ? content : (content?.resolvedBody || '')}
+            device={device}
+            isUpdating={isUpdating}
+            error={error}
+            formatMessage={formatMessage}
+            showHeader={showHeader}
+          />
+        );
+
       case CHANNELS.WHATSAPP: {
         // WhatsApp content is an object with templateMsg, media, CTA, etc.
         const whatsappContent = typeof content === 'object' ? content : {};

package/v2Components/CommonTestAndPreview/constants.js

@@ -85,6 +85,7 @@ export const CHANNELS = {
   VIBER: 'VIBER',
   ZALO: 'ZALO',
   WEBPUSH: 'WEBPUSH',
+  LINE: 'LINE',
 };
 
 /** Unified preview tab keys when RCS shows RCS + SMS fallback panes. */
@@ -100,6 +101,7 @@ export const CHANNELS_USING_ANDROID_PREVIEW_DEVICE = [
   CHANNELS.INAPP,
   CHANNELS.MOBILEPUSH,
   CHANNELS.VIBER,
+  CHANNELS.LINE,
 ];
 
 /** RCS createMessageMeta test payload — rich card envelope literals. */

package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/index.test.js

@@ -479,6 +479,112 @@ describe('UnifiedPreview', () => {
     });
   });
 
+  describe('Channel Routing - LINE', () => {
+    it('should render SmsPreviewContent for LINE channel with string content', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: 'Hello world',
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+      expect(screen.getByTestId('sms-content')).toHaveTextContent('Hello world');
+    });
+
+    it('should handle object content with resolvedBody for LINE channel', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: {
+          resolvedBody: 'some text',
+        },
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+      expect(screen.getByTestId('sms-content')).toHaveTextContent('some text');
+    });
+
+    it('should not crash and render empty content for LINE channel when content is undefined', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: undefined,
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+      expect(screen.getByTestId('sms-content')).toHaveTextContent('');
+    });
+
+    it('should not crash and render empty content for LINE channel when content is null', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: null,
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+      expect(screen.getByTestId('sms-content')).toHaveTextContent('');
+    });
+
+    it('should render empty content for LINE channel when content is not a string and has no resolvedBody', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: { someOtherField: 'value' },
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+      expect(screen.getByTestId('sms-content')).toHaveTextContent('');
+    });
+
+    it('should not render the Unknown Channel fallback for LINE channel', () => {
+      const props = {
+        ...defaultProps,
+        channel: CHANNELS.LINE,
+        content: 'Hello world',
+      };
+
+      render(
+        <TestWrapper>
+          <ComponentToRender {...props} />
+        </TestWrapper>
+      );
+
+      expect(screen.queryByText('Unknown Channel')).toBeNull();
+      expect(screen.getByTestId('sms-preview')).toBeTruthy();
+    });
+  });
+
   describe('Channel Routing - WHATSAPP', () => {
     it('should render WhatsAppPreviewContent for WHATSAPP channel', () => {
       const props = {

package/v2Components/CommonTestAndPreview/tests/constants.test.js

@@ -42,6 +42,7 @@ import {
   CLEAR_PREVIEW_ERRORS,
   // Channel Constants
   CHANNELS,
+  CHANNELS_USING_ANDROID_PREVIEW_DEVICE,
   // Device Constants
   DESKTOP,
   MOBILE,
@@ -180,15 +181,22 @@ describe('CommonTestAndPreview Constants', () => {
       expect(CHANNELS.VIBER).toBe('VIBER');
       expect(CHANNELS.ZALO).toBe('ZALO');
       expect(CHANNELS.WEBPUSH).toBe('WEBPUSH');
+      expect(CHANNELS.LINE).toBe('LINE');
     });
 
     it('should have all required channel keys', () => {
-      const expectedChannels = ['EMAIL', 'SMS', 'RCS', 'WHATSAPP', 'INAPP', 'MOBILEPUSH', 'VIBER', 'ZALO', 'WEBPUSH'];
+      const expectedChannels = ['EMAIL', 'SMS', 'RCS', 'WHATSAPP', 'INAPP', 'MOBILEPUSH', 'VIBER', 'ZALO', 'WEBPUSH', 'LINE'];
       expect(Object.keys(CHANNELS)).toEqual(expect.arrayContaining(expectedChannels));
       expect(Object.keys(CHANNELS).length).toBe(expectedChannels.length);
     });
   });
 
+  describe('CHANNELS_USING_ANDROID_PREVIEW_DEVICE', () => {
+    it('should include CHANNELS.LINE', () => {
+      expect(CHANNELS_USING_ANDROID_PREVIEW_DEVICE).toContain(CHANNELS.LINE);
+    });
+  });
+
   describe('Device Constants', () => {
     it('should export all device constants with correct values', () => {
       expect(DESKTOP).toBe('desktop');

package/v2Components/NavigationBar/mfeModuleHeader.config.js

@@ -4,7 +4,7 @@ export const MFE_MODULE_HEADER = {
   header: {
     name: 'app.commonUtils.capUiLibrary.navigationSPA.moduleHeader.creatives.default.name',
     description: 'app.commonUtils.capUiLibrary.navigationSPA.moduleHeader.creatives.default.description',
-    showBorder: false,
+    showBorder: true,
     showSettings: false,
   },
   landingRoutes: [

package/v2Containers/Cap/tests/__snapshots__/index.test.js.snap

@@ -141,8 +141,8 @@ exports[`<Cap /> should render correct component 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
+        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "Access Denied",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",

package/v2Containers/CommunicationFlow/CommunicationFlow.js

@@ -67,15 +67,11 @@ const hasDeliverySettingForChannel = (channelSetting, channel) => {
   return !!settings && Object.values(settings).some((v) => v !== null && v !== '' && v !== undefined);
 };
 
-// createCommDefinition resolves (rather than rejects) with the CCS error envelope
-// for 4xx/5xx responses — see api.js's request()/checkStatus. A duplicate
-// referenceId within the org comes back as this specific 409.
+// createCommDefinition resolves with the CCS error envelope for 4xx/5xx responses (see api.js request()/checkStatus); duplicate referenceId within the org returns a 409.
 const isDuplicateReferenceIdError = (res) => res?.success === false && res?.status?.message === 'REFERENCE_ID_EXISTS';
 
 /**
- * CCS requires referenceId on create; the consumer-supplied Alert/comm name is
- * mandatory but referenceId is optional in every consumer's own form. Generate
- * a stable fallback from the name rather than failing the save.
+ * CCS requires referenceId on create, while consumers require only the Alert/comm name; generate a stable fallback from the name when referenceId is omitted instead of failing the save.
  */
 const buildCcsReferenceId = (name) => {
   const slug = (name || 'COMM')
@@ -215,19 +211,14 @@ const CommunicationFlow = ({
           singleChannelStrategy: {
             variant: {
               channel,
-              // `channel` spreads LAST in both objects below — contentItem.templateData
-              // (e.g. mobile push) carries the UI's own internal channel identifier
-              // (MOBILEPUSH), which must never win over CCS's normalized enum value
-              // (PUSH) once spread order puts it after.
+              // `channel` must be spread last in both objects so CCS's normalized enum (e.g. `PUSH`) overrides the UI's internal identifier (e.g. `MOBILEPUSH`) from templateData.
               ...(contentKey && { [contentKey]: { ...contentPayload, channel } }),
               ...(deliveryKey && { [deliveryKey]: { channelSettings: { ...channelSettings, channel } } }),
             },
           },
         };
 
-        // Editing an existing (e.g. rejected) alert: config.context.existingCommDefinitionId
-        // opens a new DRAFT version on that SAME CommDefinition instead of creating a
-        // brand-new one, so the alert keeps its id/referenceId across the edit.
+        // Editing an existing alert (e.g. rejected) uses config.context.existingCommDefinitionId to create a new DRAFT version on the same CommDefinition, preserving its id/referenceId instead of creating a new alert.
         const { existingCommDefinitionId } = config?.context || {};
 
         try {

package/v2Containers/CommunicationFlow/Tests/constants.test.js

@@ -0,0 +1,85 @@
+import {
+  CCS_CONTENT_TRANSFORMS,
+  CCS_CHANNEL_NAME_MAP,
+  CCS_CHANNEL_CONTENT_KEY_MAP,
+  CCS_CHANNEL_DELIVERY_KEY_MAP,
+} from '../constants';
+
+describe('CCS_CONTENT_TRANSFORMS', () => {
+  describe('EMAIL', () => {
+    it('prefers emailBody over emailHtml when both are present', () => {
+      expect(
+        CCS_CONTENT_TRANSFORMS.EMAIL({
+          emailSubject: 'Subject', emailBody: '<p>Body</p>', emailHtml: '<p>Html</p>',
+        }),
+      ).toEqual({ messageSubject: 'Subject', messageBody: '<p>Body</p>' });
+    });
+
+    it('falls back to emailHtml when emailBody is absent', () => {
+      expect(
+        CCS_CONTENT_TRANSFORMS.EMAIL({ emailSubject: 'Subject', emailHtml: '<p>Html</p>' }),
+      ).toEqual({ messageSubject: 'Subject', messageBody: '<p>Html</p>' });
+    });
+
+    it('defaults templateData to {} when called with no argument', () => {
+      expect(CCS_CONTENT_TRANSFORMS.EMAIL()).toEqual({
+        messageSubject: undefined, messageBody: undefined,
+      });
+    });
+  });
+
+  describe('SMS', () => {
+    it('uses messageBody when present', () => {
+      expect(CCS_CONTENT_TRANSFORMS.SMS({ messageBody: 'Hello' })).toEqual({ message: 'Hello' });
+    });
+
+    it('falls back to an empty string when messageBody is absent', () => {
+      expect(CCS_CONTENT_TRANSFORMS.SMS({})).toEqual({ message: '' });
+    });
+
+    it('defaults templateData to {} when called with no argument', () => {
+      expect(CCS_CONTENT_TRANSFORMS.SMS()).toEqual({ message: '' });
+    });
+  });
+
+  describe('WEBPUSH', () => {
+    it('extracts fields from the nested messageContent.content wrapper', () => {
+      expect(
+        CCS_CONTENT_TRANSFORMS.WEBPUSH({
+          messageContent: {
+            content: {
+              messageSubject: 'Subject', accountId: 'acc_1', content: 'Body', offers: [{ id: 1 }],
+            },
+          },
+        }),
+      ).toEqual({ messageSubject: 'Subject', accountId: 'acc_1', content: 'Body' });
+    });
+
+    it('falls back to the flat templateData when messageContent.content is absent', () => {
+      expect(
+        CCS_CONTENT_TRANSFORMS.WEBPUSH({
+          messageSubject: 'Subject', accountId: 'acc_1', content: 'Body',
+        }),
+      ).toEqual({ messageSubject: 'Subject', accountId: 'acc_1', content: 'Body' });
+    });
+
+    it('defaults templateData to {} when called with no argument', () => {
+      expect(CCS_CONTENT_TRANSFORMS.WEBPUSH()).toEqual({
+        messageSubject: undefined, accountId: undefined, content: undefined,
+      });
+    });
+  });
+});
+
+describe('CCS_CHANNEL_NAME_MAP', () => {
+  it('normalizes the UI\'s MOBILEPUSH identifier to CCS\'s PUSH enum value', () => {
+    expect(CCS_CHANNEL_NAME_MAP.MOBILEPUSH).toBe('PUSH');
+  });
+});
+
+describe('CCS_CHANNEL_CONTENT_KEY_MAP / CCS_CHANNEL_DELIVERY_KEY_MAP', () => {
+  it('maps the PUSH channel to its mpush-prefixed content and delivery keys', () => {
+    expect(CCS_CHANNEL_CONTENT_KEY_MAP.PUSH).toBe('mpushMessageContent');
+    expect(CCS_CHANNEL_DELIVERY_KEY_MAP.PUSH).toBe('mpushDeliverySettings');
+  });
+});

package/v2Containers/CommunicationFlow/constants.js

@@ -38,21 +38,15 @@ export const CHANNEL_PRIORITY = 'CHANNEL_PRIORITY';
 export const AB_TEST = 'AB_TEST';
 export const SINGLE_TEMPLATE = 'SINGLE_TEMPLATE';
 
-// CCS CommDefinition strategyType — distinct from SINGLE_TEMPLATE above, which
-// is this UI's own communicationStrategy value. Only SINGLE is supported this
-// phase; CCS create is skipped entirely for CHANNEL_PRIORITY/AB_TEST.
+// CCS CommDefinition strategyType — distinct from SINGLE_TEMPLATE above, which is this UI's own communicationStrategy value. Only SINGLE is supported this phase; CCS create is skipped entirely for CHANNEL_PRIORITY/AB_TEST.
 export const CCS_STRATEGY_TYPE_SINGLE = 'SINGLE';
 
-// Mirrors CCS's SingleChannelStrategy field names exactly (Cap Notify API
-// Design doc sample payloads, verified against real create responses). Kept
-// separate from CHANNEL_CONTENT_KEY_MAP/CHANNEL_DELIVERY_KEY_MAP below, which
-// are the legacy messageMeta payload's keys.
+// Mirrors CCS SingleChannelStrategy field names exactly (per Cap Notify API design samples and real create responses); kept separate from the legacy messageMeta CHANNEL_CONTENT_KEY_MAP/CHANNEL_DELIVERY_KEY_MAP.
 export const CCS_CHANNEL_CONTENT_KEY_MAP = {
   SMS: 'smsMessageContent',
   EMAIL: 'emailMessageContent',
   WHATSAPP: 'whatsappMessageContent',
-  // CCS's channel enum value for mobile push is 'PUSH' (verified against real
-  // create responses), even though the content/delivery keys stay 'mpush*'.
+  // CCS's channel enum value for mobile push is 'PUSH' (verified against real create responses), even though the content/delivery keys stay 'mpush*'.
   PUSH: 'mpushMessageContent',
   INAPP: 'inAppMessageContent',
   ANDROID: 'androidMessageContent',
@@ -64,34 +58,17 @@ export const CCS_CHANNEL_CONTENT_KEY_MAP = {
   RCS: 'rcsMessageContent',
 };
 
-// contentItem.templateData is built by the legacy CreativesContainer content
-// editor (messageMeta-oriented field names) — for channels whose legacy field
-// names don't match CCS's own content schema, transform before sending rather
-// than dumping templateData as-is. EMAIL: legacy stores the subject as
-// `emailSubject` and the HTML body as `emailBody` (see
-// extractContentForPreview.js and CreativesContainer/index.js, where the Bee
-// editor's output is written back into templateData.emailBody — also
-// mirrored by the existing legacy emailMessageContent builder in
-// utils/transformerUtils.js). CCS expects `messageSubject`/`messageBody`.
+// contentItem.templateData uses legacy messageMeta field names, so transform mismatched channel fields before sending to CCS; for EMAIL, map legacy `emailSubject`/`emailBody` to CCS's `messageSubject`/`messageBody`.
 export const CCS_CONTENT_TRANSFORMS = {
   EMAIL: (templateData = {}) => ({
     messageSubject: templateData.emailSubject,
     messageBody: templateData.emailBody || templateData.emailHtml,
   }),
-  // SMS: legacy stores the typed text as `messageBody` (see
-  // CreativesContainer/index.js's getCreativesData SMS case, and the existing
-  // legacy smsMessageContent builder in utils/transformerUtils.js, both of
-  // which read/write this same field) — CCS's schema expects it as `message`
-  // (confirmed against a real CCS response showing smsMessageContent.message
-  // stayed null when messageBody was sent instead).
+  // SMS: legacy stores text as `messageBody`, while CCS expects `message`; map the field explicitly to avoid CCS returning smsMessageContent.message as null.
   SMS: (templateData = {}) => ({
     message: templateData.messageBody || '',
   }),
-  // WEBPUSH: the legacy editor nests the real data under
-  // messageContent.content (see CommunicationFlowCard.js's own comment on
-  // this same wrapping, for the edit-mode case) — extracting it flat here
-  // matches CCS's shape ({ messageSubject, accountId, content }); `offers`
-  // (a legacy-only field) is deliberately dropped, not part of CCS's schema.
+  // WEBPUSH: the legacy editor nests data under messageContent.content; flatten it to CCS's { messageSubject, accountId, content } shape and drop the legacy-only `offers` field.
   WEBPUSH: (templateData = {}) => {
     const inner = templateData.messageContent?.content || templateData;
     return {
@@ -117,19 +94,12 @@ export const CCS_CHANNEL_DELIVERY_KEY_MAP = {
   RCS: 'rcsDeliverySettings',
 };
 
-// The UI's own internal channel identifier for mobile push is 'MOBILEPUSH'
-// (see CreativesContainer/constants.js MOBILE_PUSH), but CCS's channel enum
-// value is 'PUSH' (verified against real create responses — the content/
-// delivery KEYS still say 'mpush*', only the enum VALUE is 'PUSH') —
-// normalize before building the CCS payload. Every other channel identifier
-// matches CCS as-is.
+// The UI uses `MOBILEPUSH`, while CCS uses `PUSH` for the channel enum (verified against real create responses); normalize this value before building the CCS payload, while retaining the `mpush*` content/delivery keys. All other channel identifiers pass through unchanged.
 export const CCS_CHANNEL_NAME_MAP = {
   MOBILEPUSH: 'PUSH',
 };
 
-// Channel config - single source of truth for CreativesContainer and TemplatesV2
-// paneKey: TemplatesV2 defaultPanes object key (for channelsToHide)
-// channelProp: CreativesContainer channel prop (must match pane.key for tab to be active)
+// Channel config — single source of truth for CreativesContainer and TemplatesV2; paneKey is the TemplatesV2 defaultPanes key used by channelsToHide, and channelProp is the CreativesContainer channel prop that must match pane.key for the tab to be active.
 export const CHANNELS = [
   {
     value: 'SMS',

package/v2Containers/CommunicationFlow/steps/DeliverySettingsStep/deliverySettingsConfig.js

@@ -181,9 +181,7 @@ const getEmailDomainValue = (entity) => {
   return emailData.domainProperties?.id ?? emailData.domainId ?? emailData.id ?? '';
 };
 
-// CCS's domainGatewayMapId is the domainProperties API's own outer `id`
-// (distinct from `domainProperties.id`, which is the numeric domainId) - the
-// domain-gateway-mapping id for the selected domain entry.
+// CCS's domainGatewayMapId is the domainProperties API's outer `id`, distinct from domainProperties.id (the numeric domainId); it identifies the domain-gateway mapping for the selected domain.
 const getEmailDomainGatewayMapIdByDomainId = (entity, domainId) => {
   const domainEntry = getEmailDomainById(entity, domainId);
   return domainEntry?.id ?? '';
@@ -584,8 +582,7 @@ export const parseEntityForDisplay = (entity, context = {}) => {
     senderDetails: entity,
     smsSenderId: getSmsSenderIdValue(entity),
     smsDomain: getSmsDomainValue(entity),
-    // emailDomain here is the domain NAME (for display only) - buildChannelSettingFromFieldValues
-    // needs the numeric domainId/domainGatewayMapId, sourced separately below.
+    // emailDomain here is the domain NAME (for display only) - buildChannelSettingFromFieldValues needs the numeric domainId/domainGatewayMapId, sourced separately below.
     emailDomain: getEmailDomainNameForDisplay(entity),
     emailDomainId: getEmailDomainValue(entity),
     emailDomainGatewayMapId: getEmailDomainGatewayMapIdByDomainId(entity, getEmailDomainValue(entity)),
@@ -614,9 +611,7 @@ export const buildChannelSettingFromFieldValues = (fieldValues = {}) => {
   }
   if (fieldValues.emailDomain != null || fieldValues.emailSenderId != null || fieldValues.emailSenderName != null || fieldValues.emailReplyToId != null) {
     channelSetting.EMAIL = {
-      // emailDomainId (numeric, from the auto-save-defaults path via parseEntityForDisplay)
-      // takes priority over emailDomain, which is numeric when sourced from SenderDetails'
-      // own field state but a display NAME string when sourced from parseEntityForDisplay.
+      // emailDomainId (numeric, from auto-save defaults via parseEntityForDisplay) takes precedence over emailDomain, which may be a numeric ID in SenderDetails state or a display name from parseEntityForDisplay.
       domainId: fieldValues.emailDomainId ?? fieldValues.emailDomain,
       domainGatewayMapId: fieldValues.emailDomainGatewayMapId,
       senderId: fieldValues.emailSenderId,

package/v2Containers/CreativesContainer/tests/__snapshots__/index.test.js.snap

@@ -89,7 +89,7 @@ exports[`Test SlideBoxContent container campaign message, add creative click rcs
       />
     }
     show={true}
-    size="size-xl"
+    size="size-l"
   />
 </CreativesSlideBoxWrapper>
 `;
@@ -183,7 +183,7 @@ exports[`Test SlideBoxContent container campaign message, add creative click wha
       />
     }
     show={true}
-    size="size-xl"
+    size="size-l"
   />
 </CreativesSlideBoxWrapper>
 `;
@@ -320,7 +320,7 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit all data
       />
     }
     show={false}
-    size="size-xl"
+    size="size-l"
   />
 </CreativesSlideBoxWrapper>
 `;
@@ -457,7 +457,7 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit min data
       />
     }
     show={false}
-    size="size-xl"
+    size="size-l"
   />
 </CreativesSlideBoxWrapper>
 `;
@@ -594,7 +594,7 @@ exports[`Test SlideBoxContent container it should clear the url, on channel chan
       />
     }
     show={false}
-    size="size-xl"
+    size="size-l"
   />
 </CreativesSlideBoxWrapper>
 `;