@capillarytech/creatives-library 9.0.29 → 9.0.31

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

@@ -0,0 +1,151 @@
+import {
+  getPersonalizationTagColumnLabel,
+  smsTemplateHasMustacheTags,
+  buildSyntheticSmsMustacheTags,
+  normalizeRcsTestCardMedia,
+  mapRcsSuggestionForTestMeta,
+  typeMatches,
+  unwrapEntity,
+} from '../utils';
+
+describe('CommonTestAndPreview/utils', () => {
+  describe('getPersonalizationTagColumnLabel', () => {
+    it('prefers fullPath over name', () => {
+      expect(getPersonalizationTagColumnLabel({ fullPath: 'a.b', name: 'b' })).toBe('a.b');
+    });
+
+    it('falls back to name when fullPath is absent', () => {
+      expect(getPersonalizationTagColumnLabel({ name: 'b' })).toBe('b');
+    });
+
+    it('returns empty string when both are absent', () => {
+      expect(getPersonalizationTagColumnLabel({})).toBe('');
+      expect(getPersonalizationTagColumnLabel(undefined)).toBe('');
+    });
+  });
+
+  describe('smsTemplateHasMustacheTags', () => {
+    it('returns true when body contains a mustache tag', () => {
+      expect(smsTemplateHasMustacheTags('Hello {{name}}')).toBe(true);
+    });
+
+    it('returns false when body has no mustache tag', () => {
+      expect(smsTemplateHasMustacheTags('Hello there')).toBe(false);
+    });
+
+    it('returns false for non-string body', () => {
+      expect(smsTemplateHasMustacheTags(null)).toBe(false);
+      expect(smsTemplateHasMustacheTags(undefined)).toBe(false);
+      expect(smsTemplateHasMustacheTags(123)).toBe(false);
+    });
+  });
+
+  describe('buildSyntheticSmsMustacheTags', () => {
+    it('returns empty array for empty/non-string body', () => {
+      expect(buildSyntheticSmsMustacheTags('')).toEqual([]);
+      expect(buildSyntheticSmsMustacheTags(undefined)).toEqual([]);
+      expect(buildSyntheticSmsMustacheTags(42)).toEqual([]);
+    });
+
+    it('builds one synthetic tag row per unique mustache token', () => {
+      const result = buildSyntheticSmsMustacheTags('Hi {{name}}, your code is {{otp}}');
+      expect(result).toEqual([
+        { name: 'name', metaData: { userDriven: false }, children: [] },
+        { name: 'otp', metaData: { userDriven: false }, children: [] },
+      ]);
+    });
+  });
+
+  describe('normalizeRcsTestCardMedia', () => {
+    it('returns undefined for non-object media', () => {
+      expect(normalizeRcsTestCardMedia(null)).toBeUndefined();
+      expect(normalizeRcsTestCardMedia('not-an-object')).toBeUndefined();
+    });
+
+    it('prefers mediaUrl over url', () => {
+      const result = normalizeRcsTestCardMedia({ mediaUrl: 'a.png', url: 'b.png', thumbnailUrl: 't.png', height: 100 });
+      expect(result).toEqual({ mediaUrl: 'a.png', thumbnailUrl: 't.png', height: '100' });
+    });
+
+    it('falls back to url when mediaUrl is blank', () => {
+      const result = normalizeRcsTestCardMedia({ mediaUrl: '  ', url: 'b.png' });
+      expect(result).toEqual({ mediaUrl: 'b.png', thumbnailUrl: '' });
+    });
+
+    it('omits height when not provided', () => {
+      const result = normalizeRcsTestCardMedia({ mediaUrl: 'a.png' });
+      expect(result).toEqual({ mediaUrl: 'a.png', thumbnailUrl: '' });
+      expect(result.height).toBeUndefined();
+    });
+
+    it('returns empty mediaUrl when neither mediaUrl nor url are usable', () => {
+      const result = normalizeRcsTestCardMedia({ thumbnailUrl: 't.png' });
+      expect(result).toEqual({ mediaUrl: '', thumbnailUrl: 't.png' });
+    });
+  });
+
+  describe('mapRcsSuggestionForTestMeta', () => {
+    it('maps a fully populated suggestion row', () => {
+      expect(mapRcsSuggestionForTestMeta({
+        type: 'reply', text: 'Yes', phoneNumber: '123', url: 'https://x.com', postback: 'pb',
+      }, 0)).toEqual({
+        index: 0, type: 'reply', text: 'Yes', phoneNumber: '123', url: 'https://x.com', postback: 'pb',
+      });
+    });
+
+    it('falls back to phone_number and text-as-postback when fields are missing', () => {
+      expect(mapRcsSuggestionForTestMeta({ text: 'Call', phone_number: '456' }, 1)).toEqual({
+        index: 1, type: '', text: 'Call', phoneNumber: '456', url: null, postback: 'Call',
+      });
+    });
+
+    it('handles a completely empty suggestion row', () => {
+      expect(mapRcsSuggestionForTestMeta(undefined, 2)).toEqual({
+        index: 2, type: '', text: '', phoneNumber: '', url: null, postback: '',
+      });
+    });
+  });
+
+  describe('typeMatches', () => {
+    it('returns false when either argument is missing', () => {
+      expect(typeMatches('', 'gsm_sender_id')).toBe(false);
+      expect(typeMatches('gsm-sender-id', '')).toBe(false);
+    });
+
+    it('matches regardless of case and hyphen/underscore style', () => {
+      expect(typeMatches('GSM-SENDER-ID', 'gsm_sender_id')).toBe(true);
+    });
+
+    it('returns false for genuinely different types', () => {
+      expect(typeMatches('email', 'gsm_sender_id')).toBe(false);
+    });
+  });
+
+  describe('unwrapEntity', () => {
+    it('returns null for non-object response', () => {
+      expect(unwrapEntity(null)).toBeNull();
+      expect(unwrapEntity('str')).toBeNull();
+    });
+
+    it('returns top-level entity when present', () => {
+      expect(unwrapEntity({ entity: { id: 1 } })).toEqual({ id: 1 });
+    });
+
+    it('returns nested result.entity when top-level entity is absent', () => {
+      expect(unwrapEntity({ result: { entity: { id: 2 } } })).toEqual({ id: 2 });
+    });
+
+    it('returns nested data.entity when result.entity is absent', () => {
+      expect(unwrapEntity({ data: { entity: { id: 3 } } })).toEqual({ id: 3 });
+    });
+
+    it('returns null when entity is explicitly null', () => {
+      expect(unwrapEntity({ entity: null })).toBeNull();
+    });
+
+    it('returns the response itself when no entity shape matches', () => {
+      const response = { foo: 'bar' };
+      expect(unwrapEntity(response)).toBe(response);
+    });
+  });
+});

package/v2Components/CommonTestAndPreview/utils.js

@@ -0,0 +1,84 @@
+import get from 'lodash/get';
+import { extractTemplateVariables } from '../../utils/templateVarUtils';
+import { SMS_MUSTACHE_TAG_PATTERN } from './constants';
+
+/** Show token path from extract-tags (fullPath preferred, falls back to name). */
+export const getPersonalizationTagColumnLabel = (tagNode) =>
+  tagNode?.fullPath ?? tagNode?.name ?? '';
+
+/** Non-global so ensureGlobalRegexForExecLoop creates a fresh instance on each call. */
+const SMS_MUSTACHE_VAR_REGEX = /\{\{([^}]+)\}\}/;
+
+/** True if the SMS body contains at least one `{{…}}` mustache token (DLT `{#…#}` slots excluded). */
+export const smsTemplateHasMustacheTags = (body) =>
+  typeof body === 'string' && SMS_MUSTACHE_TAG_PATTERN.test(body);
+
+/**
+ * Build tag rows from `{{…}}` mustache tokens only — DLT `{#…#}` slots are excluded because
+ * they are pre-bound template variables, not user-fillable personalization tags.
+ * Passing a mustache-only captureRegex to extractTemplateVariables skips the DLT branch.
+ */
+export const buildSyntheticSmsMustacheTags = (body = '') => {
+  if (!body || typeof body !== 'string') return [];
+  return extractTemplateVariables(body, SMS_MUSTACHE_VAR_REGEX).map((name) => ({
+    name,
+    metaData: { userDriven: false },
+    children: [],
+  }));
+};
+
+/** RCS createMessageMeta: normalize media shape (mediaUrl, thumbnailUrl, height string). */
+export const normalizeRcsTestCardMedia = (media) => {
+  if (!media || typeof media !== 'object') return undefined;
+  const mediaUrl =
+    media.mediaUrl != null && String(media.mediaUrl).trim() !== ''
+      ? String(media.mediaUrl)
+      : media.url != null && String(media.url).trim() !== ''
+        ? String(media.url)
+        : '';
+  const thumbnailUrl = media.thumbnailUrl != null ? String(media.thumbnailUrl) : '';
+  const height = media.height != null ? String(media.height) : undefined;
+  const out = { mediaUrl, thumbnailUrl };
+  if (height) out.height = height;
+  return out;
+};
+
+/** RCS createMessageMeta: normalize suggestion shape (index, type, text, phoneNumber, url, postback). */
+export const mapRcsSuggestionForTestMeta = (suggestionRow, index) => ({
+  index,
+  type: suggestionRow?.type ?? '',
+  text: suggestionRow?.text != null ? String(suggestionRow.text) : '',
+  phoneNumber:
+    suggestionRow?.phoneNumber != null
+      ? String(suggestionRow.phoneNumber)
+      : suggestionRow?.phone_number != null
+        ? String(suggestionRow.phone_number)
+        : '',
+  url: suggestionRow?.url !== undefined ? suggestionRow.url : null,
+  postback:
+    suggestionRow?.postback != null
+      ? String(suggestionRow.postback)
+      : suggestionRow?.text != null
+        ? String(suggestionRow.text)
+        : '',
+});
+
+/** Match API contactInfo.type (some envs use different casing). */
+export const typeMatches = (itemType, expectedKey) => {
+  if (!itemType || !expectedKey) return false;
+  const normalizedItemType = String(itemType).toLowerCase().replace(/-/g, '_');
+  const normalizedExpectedType = String(expectedKey).toLowerCase().replace(/-/g, '_');
+  return normalizedItemType === normalizedExpectedType;
+};
+
+/**
+ * Campaigns domainProperties may return { entity } or { result: { entity } } / { data: { entity } }.
+ */
+export const unwrapEntity = (response) => {
+  if (!response || typeof response !== 'object') return null;
+  if (response.entity != null) return response.entity;
+  const nested = get(response, 'result.entity') ?? get(response, 'data.entity');
+  if (nested != null) return nested;
+  if (response.entity === null) return null;
+  return response;
+};

package/v2Components/SmsFallback/SmsFallbackLocalSelector.js

@@ -0,0 +1,91 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import CreativesContainer from '../../v2Containers/CreativesContainer';
+import CapPageSpinner from '../CapPageSpinner';
+import {
+  EMBEDDED_SMS_CREATIVES_LOCATION,
+  SMS_FALLBACK_CHANNEL_KEY,
+  SMS_FALLBACK_CREATIVE_EDITOR,
+  SMS_FALLBACK_ENABLE_NEW_CHANNELS,
+} from './constants';
+
+/**
+ * Reuse the exact embedded CreativesContainer SMS flow (same as normal SMS create).
+ * Avoid overriding Templates with local config so "Create new" follows built-in createTemplate path.
+ */
+export function SmsFallbackLocalSelector({
+  hidden,
+  fetchDetailsLoading,
+  templateList,
+  channelsToHide,
+  smsRegister,
+  onCloseCreatives,
+  onSelectTemplate,
+  filterContent,
+  location,
+  /** Required when user completes embedded SMS create/edit — `CreativesContainer` calls this on save (see `processCentralCommsMetaId`). */
+  getCreativesData,
+}) {
+  const rootClassName = [
+    'sms-fallback-selector',
+    hidden ? 'sms-fallback-selector--visually-hidden' : '',
+  ]
+    .filter(Boolean)
+    .join(' ');
+
+  return (
+    <div
+      className={rootClassName}
+      aria-hidden={hidden}
+      inert={hidden ? '' : undefined}
+    >
+      {fetchDetailsLoading && (
+        <div className="sms-fallback-selector__loading" aria-busy="true" aria-live="polite">
+          <CapPageSpinner spinning />
+        </div>
+      )}
+      <CreativesContainer
+        creativesMode="create"
+        location={location || EMBEDDED_SMS_CREATIVES_LOCATION}
+        templateData={null}
+        handleCloseCreatives={onCloseCreatives}
+        isFullMode={false}
+        smsRegister={smsRegister}
+        editor={SMS_FALLBACK_CREATIVE_EDITOR}
+        enableNewChannels={SMS_FALLBACK_ENABLE_NEW_CHANNELS}
+        channel={SMS_FALLBACK_CHANNEL_KEY}
+        channelsToHide={channelsToHide}
+        selectedBadges={[]}
+        localTemplatesConfig={{
+          useLocalTemplates: true,
+          localTemplates: templateList.templates,
+          localTemplatesLoading: templateList.loading,
+          localTemplatesFilterContent: filterContent,
+          localTemplatesOnPageChange: templateList.loadMore,
+          localTemplatesUseSkeleton: true,
+        }}
+        onSelectTemplate={onSelectTemplate}
+        getCreativesData={getCreativesData}
+      />
+    </div>
+  );
+}
+
+SmsFallbackLocalSelector.propTypes = {
+  hidden: PropTypes.bool,
+  fetchDetailsLoading: PropTypes.bool,
+  templateList: PropTypes.shape({
+    templates: PropTypes.array,
+    loading: PropTypes.bool,
+    loadMore: PropTypes.func,
+  }).isRequired,
+  channelsToHide: PropTypes.arrayOf(PropTypes.string),
+  smsRegister: PropTypes.any,
+  onCloseCreatives: PropTypes.func.isRequired,
+  onSelectTemplate: PropTypes.func.isRequired,
+  filterContent: PropTypes.node,
+  location: PropTypes.object,
+  getCreativesData: PropTypes.func.isRequired,
+};
+
+export default SmsFallbackLocalSelector;

package/v2Components/SmsFallback/constants.js

@@ -0,0 +1,94 @@
+import {
+  WHATSAPP,
+  RCS,
+  ZALO,
+  WEBPUSH,
+} from '../../v2Containers/CreativesContainer/constants';
+
+/**
+ * View modes for the SMS fallback slidebox (template list, create, edit).
+ * Used by SmsFallback and any channel that reuses it (RCS, etc.).
+ */
+export const SMS_FALLBACK_VIEW = {
+  SELECTING: 'selecting',
+  CREATING: 'creating',
+  EDITING: 'editing',
+};
+
+/**
+ * Channel keys to hide in TemplatesV2 so only SMS tab is shown.
+ * Uses normalized keys matching TemplatesV2 pane.key normalization (lowercase).
+ * Parent can override via channelsToHide prop.
+ */
+export const CHANNELS_TO_HIDE_FOR_SMS_ONLY = [
+  'email',
+  'mobilepush',
+  'webpush',
+  'viber',
+  'whatsapp',
+  'zalo',
+  'facebook',
+  'rcs',
+  'inapp',
+  'line',
+  'wechat',
+  'call_task',
+  'ftp',
+  'assets',
+];
+
+/** DLT category filter values — aligned with Templates `SMS_FILTERS` / `filterSMSTemplates`. */
+export const SMS_CATEGORY_FILTERS = {
+  ALL: 'all',
+  PROMOTIONAL: 'promo',
+  SERVICE_EXPLICIT: 'explicit',
+  SERVICE_IMPLICIT: 'implicit',
+};
+
+/** `location` for embedded SMS creatives picker (CreativesContainer / TemplatesV2). */
+export const EMBEDDED_SMS_CREATIVES_LOCATION = {
+  pathname: '/sms/create',
+  query: { type: 'embedded', module: 'library' },
+  search: '',
+};
+
+/** `location` for embedded SMS TRAI edit inside slidebox. */
+export const EMBEDDED_SMS_CREATIVES_EDIT_LOCATION = {
+  pathname: '/sms/edit',
+  query: { type: 'embedded', module: 'library' },
+  search: '',
+};
+
+/** API `channel` param for `getTemplateDetails` when loading an SMS template by id. */
+export const SMS_TEMPLATE_DETAILS_API_CHANNEL = 'Sms';
+
+export const SMS_FALLBACK_CREATIVE_EDITOR = 'BEE';
+
+export const SMS_FALLBACK_CHANNEL_KEY = 'sms';
+
+/** Route shape passed to SmsWrapper / SmsTraiEdit for embedded SMS flows. */
+export const SMS_FALLBACK_ROUTE = { name: SMS_FALLBACK_CHANNEL_KEY };
+
+/** Channels enabled in the SMS-only embedded picker (hide others via `channelsToHide`). */
+export const SMS_FALLBACK_ENABLE_NEW_CHANNELS = [WHATSAPP, RCS, ZALO, WEBPUSH];
+
+/** Action types for the SmsFallback slidebox reducer. */
+export const SMS_FALLBACK_ACTIONS = {
+  OPEN_SELECTOR: 'OPEN_SELECTOR',
+  OPEN_EDITING: 'OPEN_EDITING',
+  OPEN_CREATING: 'OPEN_CREATING',
+  SELECT_TEMPLATE_START: 'SELECT_TEMPLATE_START',
+  SELECT_TEMPLATE_DONE: 'SELECT_TEMPLATE_DONE',
+  SET_FETCH_LOADING: 'SET_FETCH_LOADING',
+  GO_BACK_TO_LIST: 'GO_BACK_TO_LIST',
+  CLOSE: 'CLOSE',
+  SET_IS_GET_FORM_DATA: 'SET_IS_GET_FORM_DATA',
+  SET_LIQUID_ERROR: 'SET_LIQUID_ERROR',
+  SET_LOADING_CONTENT: 'SET_LOADING_CONTENT',
+  OPEN_TEST_PREVIEW: 'OPEN_TEST_PREVIEW',
+  CLOSE_TEST_PREVIEW: 'CLOSE_TEST_PREVIEW',
+  SET_CREATE_FIELDS_INVALID: 'SET_CREATE_FIELDS_INVALID',
+  SET_CATEGORY_FILTER: 'SET_CATEGORY_FILTER',
+};
+
+export const JS_TYPE_BOOLEAN = 'boolean';