@capillarytech/creatives-library 9.0.15-alpha.1 → 9.0.16

package/v2Components/CommonTestAndPreview/UnifiedPreview/index.js

@@ -11,7 +11,6 @@ import PropTypes from 'prop-types';
 import CapRow from '@capillarytech/cap-ui-library/CapRow';
 import CapSpin from '@capillarytech/cap-ui-library/CapSpin';
 import CapIcon from '@capillarytech/cap-ui-library/CapIcon';
-import CapLabel from '@capillarytech/cap-ui-library/CapLabel';
 import PreviewHeader from './PreviewHeader';
 import DeviceFrame from './DeviceFrame';
 import EmailPreviewContent from './EmailPreviewContent';
@@ -23,21 +22,8 @@ import MobilePushPreviewContent from './MobilePushPreviewContent';
 import ViberPreviewContent from './ViberPreviewContent';
 import ZaloPreviewContent from './ZaloPreviewContent';
 import WebPushPreviewContent from './WebPushPreviewContent';
-import CapTab from '@capillarytech/cap-ui-library/CapTab';
-import {
-  CHANNELS,
-  DESKTOP,
-  TABLET,
-  MOBILE,
-  ANDROID,
-  IOS,
-  PREVIEW_TAB_RCS,
-  PREVIEW_TAB_SMS_FALLBACK,
-  PREVIEW_TAB_KEYS,
-  RCS_SMS_FALLBACK_VAR_MAPPED_PROP,
-} from '../constants';
+import { CHANNELS, DESKTOP, TABLET, MOBILE, ANDROID, IOS } from '../constants';
 import messages from '../messages';
-import { getFallbackResolvedContent } from '../../../utils/templateVarUtils';
 import './_unifiedPreview.scss';
 
 const UnifiedPreview = ({
@@ -53,24 +39,7 @@ const UnifiedPreview = ({
   lastModified,
   updatedByName,
   showHeader, // Default to true for Test and Preview flow, false for channel component previews
-  smsFallbackContent,
-  smsFallbackResolvedText,
-  activePreviewTab,
-  onPreviewTabChange,
 }) => {
-  const hasFallbackSmsTemplate = !!(smsFallbackContent?.templateContent || smsFallbackContent?.content);
-  const showRcsSmsFallbackTabs = channel === CHANNELS.RCS && hasFallbackSmsTemplate;
-  const rawFallbackTemplate = smsFallbackContent?.templateContent ?? smsFallbackContent?.content ?? '';
-  const rcsFallbackVarMapped = smsFallbackContent?.[RCS_SMS_FALLBACK_VAR_MAPPED_PROP] ?? {};
-  const hasRcsFallbackVarMapped = Object.keys(rcsFallbackVarMapped).length > 0;
-  // When no varmap is present, show raw template so {{tags}} remain visible in the preview.
-  // Only apply slot substitution when varmap entries exist or a resolved text is available.
-  const smsFallbackDisplayContent =
-    smsFallbackResolvedText != null && smsFallbackResolvedText !== ''
-      ? smsFallbackResolvedText
-      : hasRcsFallbackVarMapped
-        ? getFallbackResolvedContent(rawFallbackTemplate, rcsFallbackVarMapped)
-        : rawFallbackTemplate;
   /**
    * Render channel-specific preview content
    * For Phase 5, we'll render placeholders
@@ -157,21 +126,6 @@ const UnifiedPreview = ({
       case CHANNELS.RCS: {
         // RCS content is an object with rcsTitle, rcsDesc, rcsImageSrc, suggestions, etc.
         const rcsContent = typeof content === 'object' ? content : {};
-
-        if (showRcsSmsFallbackTabs && activePreviewTab === PREVIEW_TAB_SMS_FALLBACK) {
-          return (
-            <SmsPreviewContent
-              content={smsFallbackDisplayContent}
-              device={ANDROID}
-              isUpdating={isUpdating}
-              error={error}
-              formatMessage={formatMessage}
-              senderId={smsFallbackContent?.senderId}
-              showHeader={showHeader}
-            />
-          );
-        }
-
         return (
           <RcsPreviewContent
             content={rcsContent}
@@ -359,96 +313,6 @@ const UnifiedPreview = ({
    * PreviewHeader is shown only when showHeader is true (for Test and Preview flow)
    * Channel-specific content will be in separate files in future phases
    */
-  if (showRcsSmsFallbackTabs) {
-    const renderPane = ({ paneChannel, paneDevice, paneShowDeviceToggle, paneContent }) => (
-      <CapRow className="unified-preview-tab-pane">
-        {showHeader && (
-          <PreviewHeader
-            selectedCustomer={selectedCustomer}
-            device={paneDevice}
-            showDeviceToggle={paneShowDeviceToggle}
-            onDeviceChange={onDeviceChange}
-            channel={paneChannel}
-          />
-        )}
-
-        <CapRow className={`preview-content-container ${!showHeader ? 'preview-content-container-no-header' : ''}`}>
-          {paneContent}
-        </CapRow>
-
-       
-      </CapRow>
-    );
-
-    return (
-      <CapRow className="unified-preview unified-preview-rcs-tabs">
-        <CapTab
-          activeKey={activePreviewTab}
-          onChange={onPreviewTabChange}
-          panes={[
-            {
-              tab: formatMessage(messages.rcsTab),
-              key: PREVIEW_TAB_RCS,
-              content: renderPane({
-                paneChannel: CHANNELS.RCS,
-                paneDevice: device,
-                paneShowDeviceToggle: showDeviceToggle,
-                paneContent: (
-                  <RcsPreviewContent
-                    content={typeof content === 'object' ? content : {}}
-                    device={device}
-                    isUpdating={isUpdating}
-                    error={error}
-                    formatMessage={formatMessage}
-                    senderId={content?.senderId}
-                    showHeader={showHeader}
-                  />
-                ),
-              }),
-            },
-            {
-              tab: formatMessage(messages.smsFallbackTab),
-              key: PREVIEW_TAB_SMS_FALLBACK,
-              content: renderPane({
-                paneChannel: CHANNELS.SMS,
-                paneDevice: device,
-                paneShowDeviceToggle: showDeviceToggle,
-                paneContent: (
-                  <SmsPreviewContent
-                    content={smsFallbackDisplayContent}
-                    device={device}
-                    isUpdating={isUpdating}
-                    error={error}
-                    formatMessage={formatMessage}
-                    senderId={smsFallbackContent?.senderId}
-                    showHeader={showHeader}
-                  />
-                ),
-              }),
-            },
-          ]}
-        />
-        {(lastModified || updatedByName) && (
-          <CapRow className="preview-metadata">
-            {lastModified && (
-              <CapLabel className="metadata-item">
-                {formatMessage(messages.lastModified)}
-                :
-                {' '}
-                {lastModified}
-              </CapLabel>
-            )}
-            {updatedByName && (
-              <CapLabel className="metadata-item">
-                {formatMessage(messages.byAuthor, { name: updatedByName })}
-              </CapLabel>
-            )}
-          </CapRow>
-        )}
-      </CapRow>
-    );
-  }
-
   return (
     <CapRow className="unified-preview">
       {/* PreviewHeader - shown only in Test and Preview flow, hidden in channel component previews */}
@@ -478,17 +342,19 @@ const UnifiedPreview = ({
       {(lastModified || updatedByName) && (
         <CapRow className="preview-metadata">
           {lastModified && (
-            <CapLabel className="metadata-item">
+            <span className="metadata-item">
               {formatMessage(messages.lastModified)}
               :
               {' '}
               {lastModified}
-            </CapLabel>
+            </span>
           )}
           {updatedByName && (
-            <CapLabel className="metadata-item">
-              {formatMessage(messages.byAuthor, { name: updatedByName })}
-            </CapLabel>
+            <span className="metadata-item">
+              {formatMessage(messages.by)}
+              {' '}
+              {updatedByName}
+            </span>
           )}
         </CapRow>
       )}
@@ -528,15 +394,6 @@ UnifiedPreview.propTypes = {
 
   // Header display
   showHeader: PropTypes.bool, // Show PreviewHeader (true for Test and Preview flow, false for channel component previews)
-
-  // RCS: SMS fallback preview support (same shape as SmsFallback / RCS smsFallbackData)
-  smsFallbackContent: PropTypes.shape({
-    templateContent: PropTypes.string,
-    senderId: PropTypes.string,
-    templateName: PropTypes.string,
-  }),
-  activePreviewTab: PropTypes.oneOf(PREVIEW_TAB_KEYS),
-  onPreviewTabChange: PropTypes.func,
 };
 
 UnifiedPreview.defaultProps = {
@@ -549,10 +406,6 @@ UnifiedPreview.defaultProps = {
   lastModified: null,
   updatedByName: null,
   showHeader: true, // Default to true for Test and Preview flow
-  smsFallbackContent: null,
-  smsFallbackResolvedText: undefined,
-  activePreviewTab: PREVIEW_TAB_RCS,
-  onPreviewTabChange: () => {},
 };
 
 export default UnifiedPreview;

package/v2Components/CommonTestAndPreview/_commonTestAndPreview.scss

@@ -211,10 +211,6 @@
   margin-right: 0.5rem;
 }
 
-.cap-slide-box-v2.common-test-and-preview-slidebox .cap-slide-box-v2-container {
-  z-index: 10030;
-}
-
 .common-test-and-preview-slidebox {
 
   .ant-modal-mask,
@@ -489,13 +485,6 @@
       }
     }
 
-    .tags-section-title {
-      margin: $CAP_SPACE_12 0;
-      display: block;
-      color: $CAP_G01;
-      font-weight: $FONT_WEIGHT_MEDIUM;
-    }
-
     .values-table {
       margin-bottom: $CAP_SPACE_16;
       border: $CAP_SPACE_01 solid $CAP_G12;

package/v2Components/CommonTestAndPreview/constants.js

@@ -66,6 +66,7 @@ export const GET_WECRM_ACCOUNTS_REQUESTED = 'app/CommonTestAndPreview/GET_WECRM_
 export const GET_WECRM_ACCOUNTS_SUCCESS = 'app/CommonTestAndPreview/GET_WECRM_ACCOUNTS_SUCCESS';
 export const GET_WECRM_ACCOUNTS_FAILURE = 'app/CommonTestAndPreview/GET_WECRM_ACCOUNTS_FAILURE';
 
+
 // ============================================
 // CUSTOMER MODAL TYPE (test customer addition)
 // ============================================
@@ -86,44 +87,7 @@ export const CHANNELS = {
   ZALO: 'ZALO',
   WEBPUSH: 'WEBPUSH',
 };
-
-/** Unified preview tab keys when RCS shows RCS + SMS fallback panes. */
-export const PREVIEW_TAB_RCS = 'rcs';
-export const PREVIEW_TAB_SMS_FALLBACK = 'smsFallback';
-export const PREVIEW_TAB_KEYS = [PREVIEW_TAB_RCS, PREVIEW_TAB_SMS_FALLBACK];
-
-/** Channels whose Test & Preview defaults to Android/iOS device frame (not desktop). */
-export const CHANNELS_USING_ANDROID_PREVIEW_DEVICE = [
-  CHANNELS.SMS,
-  CHANNELS.WHATSAPP,
-  CHANNELS.RCS,
-  CHANNELS.INAPP,
-  CHANNELS.MOBILEPUSH,
-  CHANNELS.VIBER,
-];
-
-/** RCS createMessageMeta test payload — rich card envelope literals. */
-export const RCS_TEST_META_CONTENT_TYPE_RICHCARD = 'RICHCARD';
-export const RCS_TEST_META_CARD_TYPE_STANDALONE = 'STANDALONE';
-export const RCS_TEST_META_CARD_ORIENTATION_VERTICAL = 'VERTICAL';
-export const RCS_TEST_META_CARD_WIDTH_SMALL = 'SMALL';
-
-/** React key fallback when a custom-values section has no `key` or title id. */
-export const CUSTOM_VALUES_EDITOR_SECTION_FALLBACK_KEY = 'section';
-
-/**
- * Matches at least one `{{variableName}}` token in SMS / RCS fallback template text.
- */
-export const SMS_MUSTACHE_TAG_PATTERN = /\{\{[^}]+\}\}/;
-
-/** TRAI DLT `{#…#}` placeholders (same idea as `COMBINED_SMS_TEMPLATE_VAR_REGEX` in unified constants). */
-export const SMS_DLT_HASH_TAG_PATTERN = /\{\#[^#]*\#\}/;
-
-/**
- * Key on `smsFallbackContent` passed into Test & Preview — RCS slot map from SmsTraiEdit
- * (`onRcsFallbackEditorStateChange`), merged before tag extraction like the embedded SMS editor.
- */
-export const RCS_SMS_FALLBACK_VAR_MAPPED_PROP = 'rcsSmsFallbackVarMapped';
+export const CHANNELS_USING_ANDROID_PREVIEW_DEVICE = [CHANNELS.SMS, CHANNELS.RCS, CHANNELS.WHATSAPP, CHANNELS.VIBER, CHANNELS.ZALO, CHANNELS.INAPP, CHANNELS.MOBILEPUSH];
 
 // ============================================
 // DEVICE CONSTANTS