@capillarytech/creatives-library 9.0.55-alpha.1 → 9.0.55

package/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "eslint.enable": false
+}

package/constants/unified.js

@@ -63,6 +63,7 @@ export const ENABLE_AI_SUGGESTIONS = 'ENABLE_AI_SUGGESTIONS';
 export const AI_CONTENT_BOT_DISABLED = 'AI_CONTENT_BOT_DISABLED';
 export const AI_DOCUMENTATION_BOT_ENABLED = 'AI_DOCUMENTATION_BOT_ENABLED';
 export const ENABLE_PRODUCT_SUPPORT_VIDEOS = 'ENABLE_PRODUCT_SUPPORT_VIDEOS';
+export const SUPPORT_ENGAGEMENT_MODULE = 'SUPPORT_ENGAGEMENT_MODULE';
 export const EMBEDDED = 'embedded';
 // --- Tag/Validation Constants ---
 export const CARD_RELATED_TAGS = [

package/package.json

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

package/services/api.js

@@ -701,26 +701,6 @@ 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).
-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.
-export const editCommDefinition = (commDefinitionId, payload) => {
-  const url = `${API_ENDPOINT}/comm-definitions/${commDefinitionId}/edit`;
-  return request(url, getAPICallObject('POST', payload, false, false, false, true));
-};
-
 export const getCentralCommsMetaIds = (metaIds, metaType = TRANSACTION) => {
   const url = `${API_ENDPOINT}/common/central-comms/meta-id/${metaType}?metaIds=${metaIds}`;
   return request(url, getAPICallObject('GET', null, 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/utils/common.js

@@ -99,6 +99,10 @@ export const hasSupportCKEditor = Auth.hasFeatureAccess.bind(
   null,
   SUPPORT_CK_EDITOR,
 );
+export const hasSupportEngagementModule = Auth.hasFeatureAccess.bind(
+  null,
+  SUPPORT_ENGAGEMENT_MODULE,
+);
 
 export const hasGiftVoucherFeature = Auth.hasFeatureAccess.bind(
   null,

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,26 +139,6 @@ const UnifiedPreview = ({
         );
       }
 
-      case CHANNELS.LINE:
-        // LINE's real content today is a single text message (CCS's
-        // lineMessageContent.messageBody is a JSON string of LINE's native
-        // messages[] array — see testAndPreviewDataTransform.js's LINE case,
-        // which already resolves it down to plain text before it reaches
-        // here) — reuse the same simple chat-bubble preview as SMS. Rich LINE
-        // message types (image/video/sticker/imageMap/carousel/flex) are NOT
-        // rendered specially yet; they'll show as empty/raw text until this
-        // gets richer LINE-specific handling.
-        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,7 +85,6 @@ export const CHANNELS = {
   VIBER: 'VIBER',
   ZALO: 'ZALO',
   WEBPUSH: 'WEBPUSH',
-  LINE: 'LINE',
 };
 
 /** Unified preview tab keys when RCS shows RCS + SMS fallback panes. */
@@ -101,7 +100,6 @@ 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/index.js

@@ -1275,6 +1275,7 @@ const CommonTestAndPreview = (props) => {
         ...(suggestionsFormattedForTestMeta.length > 0 && {
           suggestions: suggestionsFormattedForTestMeta,
         }),
+        ...(singleRcsCardPayload?.cardVarMapped && { cardVarMapped: singleRcsCardPayload.cardVarMapped }),
       };
     });
     // Use the component-level smsFallbackContent prop (has rcsSmsFallbackVarMapped) so DLT
@@ -1341,9 +1342,11 @@ const CommonTestAndPreview = (props) => {
       ...(cardContentForTestMetaApi.length > 0 && { cardContent: cardContentForTestMetaApi }),
     };
 
+    const vfTemplateId = rcsContentFromForm?.vfTemplateId;
     const rcsMessageContent = {
       channel: CHANNELS.RCS,
       ...(accountIdForMeta && { accountId: accountIdForMeta }),
+      ...(vfTemplateId && { templateId: vfTemplateId }),
       rcsRichCardContent,
       ...(smsFallBackContent && { smsFallBackContent }),
     };
@@ -3813,7 +3816,7 @@ const CommonTestAndPreview = (props) => {
       header={slideboxHeader}
       handleClose={handleClose}
       show={show}
-      size="size-l"
+      size="size-xl"
       content={(
         <CapSpin
           spinning={isCustomerDataLoading}

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

@@ -479,112 +479,6 @@ 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,7 +42,6 @@ import {
   CLEAR_PREVIEW_ERRORS,
   // Channel Constants
   CHANNELS,
-  CHANNELS_USING_ANDROID_PREVIEW_DEVICE,
   // Device Constants
   DESKTOP,
   MOBILE,
@@ -181,22 +180,15 @@ 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', 'LINE'];
+      const expectedChannels = ['EMAIL', 'SMS', 'RCS', 'WHATSAPP', 'INAPP', 'MOBILEPUSH', 'VIBER', 'ZALO', 'WEBPUSH'];
       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",