@capillarytech/creatives-library 7.17.118-alpha.0 → 7.17.118

package/package.json

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

package/tests/integration/TemplateCreation/TemplateCreation.integration.test.js

@@ -273,8 +273,12 @@ describe("Creatives testing template creation", () => {
     fireEvent.change(templateNameInput, {
       target: { value: 'viber_test_template' },
     });
-    const msgBox = screen.getByPlaceholderText(/Enter message/i);
-    msgBox.focus();
+
+    const templateTextInput = await creativesScreen.getByText(
+      /Text message/,
+      {},
+    );
+    const msgBox = templateTextInput.parentElement.nextSibling.firstChild;
     //Enter a template text message
     fireEvent.change(msgBox, {
       target: { value: 'viber_template_message' },
@@ -302,32 +306,24 @@ describe("Creatives testing template creation", () => {
     // first click opens the popup, and second click closes it, clicking twice is intentional
     userEvent.click(addLabel);
     userEvent.click(addLabel);
-    const imageRadio = creativesScreen.getByRole('radio', {name: /image/i});
-    fireEvent.click(imageRadio);
     const imageUploader = creativesScreen.getByRole('button', {
-      name: /drag and drop image here or select from computer gallery/i,
+      name: /drag and drop image here or your computer gallery/i,
     });
     expect(within(imageUploader).getByRole('button', {
-      name: /select from computer/i,
+      name: /your computer/i,
     })).toBeInTheDocument();
     const galleryBtn = within(imageUploader).getByRole('button', {
       name: globalMessages.gallery.defaultMessage,
     });
 
     //configuring CTA button
-    const ctaRadioBtn = creativesScreen.getByRole('radio', {
-      name: /call to action create a button that lets customers respond to your messages or take action/i,
-    });
-    fireEvent.click(ctaRadioBtn);
-    const btnTextBox = await creativesScreen.findByPlaceholderText(
-      'Enter button text',
-    );
+    const btnText = creativesScreen.getByText(/button text/i);
+    const btnTextBox = btnText.nextSibling.firstChild;
     fireEvent.change(btnTextBox, {
       target: { value: 'button' },
     });
-    const btnUrlBox = await creativesScreen.findByPlaceholderText(
-      'Enter button url',
-    );
+    const btnUrl = creativesScreen.getByText(/button url/i);
+    const btnUrlBox = btnUrl.nextSibling.firstChild;
     fireEvent.change(btnUrlBox, {
       target: { value: 'button' },
     });

package/v2Components/CapImageUpload/index.js

@@ -20,8 +20,7 @@ import { injectIntl, FormattedMessage, intlShape} from 'react-intl';
 import { isEmpty, get } from 'lodash';
 import './index.scss';
 import Gallery from '../../v2Containers/Assets/Gallery';
-import { MAX_SUPPORTED_IMAGE_SIZE } from './constants';
-import { FACEBOOK, INAPP, RCS, WHATSAPP, VIBER } from "../../v2Containers/CreativesContainer/constants";
+import { FACEBOOK, INAPP, RCS, WHATSAPP } from "../../v2Containers/CreativesContainer/constants";
 
 import messages from './messages';
 function CapImageUpload(props) {
@@ -174,17 +173,6 @@ function CapImageUpload(props) {
     );
   }, []);
 
-  const getImageSizeLabel = () => (
-    <CapHeadingSpan type="label2">
-      <FormattedMessage
-        {...messages.imageSize}
-        values={{
-          size: MAX_SUPPORTED_IMAGE_SIZE[channel],
-        }}
-      />
-    </CapHeadingSpan>
-  );
-
   const getImageSection = useCallback(() => {
     if (imageSrc === "") {
       return (<>
@@ -256,7 +244,9 @@ function CapImageUpload(props) {
       <div className="image-info-wrapper">
         {channel === WHATSAPP && (
           <>
-            {getImageSizeLabel}
+            <CapHeadingSpan type="label2">
+              <FormattedMessage {...messages.maxImageSize} />
+            </CapHeadingSpan>
             <CapHeadingSpan type="label2">
               <FormattedMessage {...messages.whatsappAspectRatio} />
             </CapHeadingSpan>
@@ -272,7 +262,18 @@ function CapImageUpload(props) {
             <FormattedMessage {...messages.aspectRatio} />
           </CapHeadingSpan>
         )}
-        {[RCS, VIBER, INAPP].includes(channel) && getImageSizeLabel()}
+        {channel === RCS && (
+          <CapHeadingSpan type="label2" className="image-size">
+            <FormattedMessage {...messages.imageSize} />
+          </CapHeadingSpan>
+        )}
+        {
+          channel === INAPP && (
+            <CapHeadingSpan type="label2" className="image-size">
+              <FormattedMessage {...messages.maxImageSize} />
+            </CapHeadingSpan>
+          )
+        }
         <CapHeadingSpan type="label2" className="image-format">
           {channel === INAPP ? <FormattedMessage {...messages.format2} /> : <FormattedMessage {...messages.format} />}
         </CapHeadingSpan>

package/v2Components/CapImageUpload/messages.js

@@ -2,6 +2,10 @@ import { defineMessages } from 'react-intl';
 const scope = `creatives.componentsV2.CapImageUpload`;
 
 export default defineMessages({
+  maxImageSize: {
+    id: `${scope}.maxImageSize`,
+    defaultMessage: 'Size upto: 5MB',
+  },
   whatsappAspectRatio: {
     id: `${scope}.whatsappAspectRatio`,
     defaultMessage: 'Max aspect ratio: 1.91:1',
@@ -57,6 +61,6 @@ export default defineMessages({
   },
   imageSize: {
     id: `${scope}.imageSize`,
-    defaultMessage: 'Size upto: {size}MB',
+    defaultMessage: 'Size upto: 2MB',
   },
 });

package/v2Components/CapVideoUpload/constants.js

@@ -1,6 +1 @@
 export const WHATSAPP = 'WHATSAPP';
-export const DEFAULT = 'DEFAULT';
-export const SUPPORTED_FILE_FORMATS = {
-  VIBER: '3GP, MP4, MOV, M4V',
-  DEFAULT: 'MP4',
-};

package/v2Components/CapVideoUpload/index.js

@@ -19,9 +19,8 @@ import {
 } from '@capillarytech/cap-ui-library';
 import messages from './messages';
 import {bytes2Size, getDecodedFileName} from '../../utils/common';
-import { SUPPORTED_FILE_FORMATS, WHATSAPP, DEFAULT } from './constants';
+import { WHATSAPP } from './constants';
 import './index.scss';
-import { VIBER } from '../../v2Containers/CreativesContainer/constants';
 
 function CapVideoUpload(props) {
   const {
@@ -231,7 +230,6 @@ function CapVideoUpload(props) {
               videoWidth: metaVideoWidth,
               previewUrl,
               fileHandle,
-              videoDuration,
             }
           );
         }
@@ -278,16 +276,6 @@ function CapVideoUpload(props) {
       </Fragment>
     );
   };
-
-  const getVideoSizeDescription = () => (
-    <CapHeading.CapHeadingSpan type="label2">
-      <FormattedMessage
-        {...messages.videoSizeDescription}
-        values={{ size: bytes2Size(videoSize) }}
-      />
-    </CapHeading.CapHeadingSpan>
-  );
-
   return (
     <CapSpin spinning={isSpinning}>
       <div style={style} className="cap-custom-video-upload">
@@ -307,34 +295,26 @@ function CapVideoUpload(props) {
             onClose={() => updateTemplateDrawerRequirement(false)}
         />
         </form>
-        {![WHATSAPP, VIBER].includes(channel) &&
+        {channel !== WHATSAPP ?
         <>
           <CapHeading.CapHeadingSpan type="h6" className="video-description">
             <FormattedMessage {...messages.videoRatioDescription} />
           </CapHeading.CapHeadingSpan>
           {' '}
           <CapHeading.CapHeadingSpan type="h6" className="video-description file-format">
-            <FormattedMessage {...messages.fileFormat} values={{ format: SUPPORTED_FILE_FORMATS[DEFAULT] }} />
+            <FormattedMessage {...messages.fileFormat} />
+
           </CapHeading.CapHeadingSpan>
           <CapHeading.CapHeadingSpan type="h6" className="video-description video-details">
             <FormattedMessage {...messages.videoSizeDescription} values={{size: bytes2Size(videoSize)}} />
           </CapHeading.CapHeadingSpan>
-        </>}
-        {channel === WHATSAPP &&
+        </> :
         <>
-          {getVideoSizeDescription()}
-          <CapHeading.CapHeadingSpan type="label2" className="whatsapp-format">
-            <FormattedMessage {...messages.fileFormat} values={{ format: SUPPORTED_FILE_FORMATS[DEFAULT] }} />
+          <CapHeading.CapHeadingSpan type="label2" className="">
+            <FormattedMessage {...messages.videoSizeDescription} values={{size: bytes2Size(videoSize)}} />
           </CapHeading.CapHeadingSpan>
-        </>}
-        {channel === VIBER &&
-        <>
-          {getVideoSizeDescription()}
           <CapHeading.CapHeadingSpan type="label2" className="whatsapp-format">
-            <FormattedMessage {...messages.fileFormat} values={{ format: SUPPORTED_FILE_FORMATS[channel] }} />
-          </CapHeading.CapHeadingSpan>
-          <CapHeading.CapHeadingSpan type="label2" className="video-duration">
-            <FormattedMessage {...messages.viberMaxDuration} />
+            <FormattedMessage {...messages.whatsappFileFormat} />
           </CapHeading.CapHeadingSpan>
         </>}
       </div>

package/v2Components/CapVideoUpload/index.scss

@@ -46,7 +46,4 @@ $classPrefix: cap-custom-video-upload;
 }
 .video-panel {
     display: flex;
-}  
-.video-duration {
-    margin-left: 8rem;
-}
+}  

package/v2Components/CapVideoUpload/messages.js

@@ -57,10 +57,10 @@ export default defineMessages({
   },
   fileFormat: {
     id: `${scope}.fileFormat`,
-    defaultMessage: 'Format: {format}',
+    defaultMessage: 'Format: MP4',
   },
-  viberMaxDuration: {
-    id: `${scope}.viberMaxDuration`,
-    defaultMessage: 'Max Duration: 600 seconds',
+  whatsappFileFormat: {
+    id: `${scope}.whatsappFileFormat`,
+    defaultMessage: 'Format: MP4',
   },
 });

package/v2Components/FormBuilder/constants.js

@@ -1,2 +1,3 @@
 export const AI_SUGGESTION_API_URL = `wss://${window.location.host}/arya/api/v1/ask-aira-service/content_gen/get_ai_suggestions`;
 export const CONTENT_RECOMMENDATION_BOT = "CONTENT_RECOMMENDATION_BOT";
+export const OUTBOUND = 'OUTBOUND';

package/v2Components/FormBuilder/index.js

@@ -51,7 +51,7 @@ import { SMS, MOBILE_PUSH, LINE, ENABLE_AI_SUGGESTIONS } from '../../v2Container
 import { validateIfTagClosed } from '../../utils/tagValidations';
 import globalMessages from '../../v2Containers/Cap/messages';
 import { convert } from 'html-to-text';
-import { AI_SUGGESTION_API_URL, CONTENT_RECOMMENDATION_BOT } from './constants';
+import { AI_SUGGESTION_API_URL, CONTENT_RECOMMENDATION_BOT, OUTBOUND } from './constants';
 import { GET_TRANSLATION_MAPPED } from '../../containers/TagList/constants';
 import moment from 'moment';
 import { CUSTOMER_BARCODE_TAG , COPY_OF} from '../../containers/App/constants';
@@ -1152,7 +1152,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       let matchCustomerBarcode = regexCustomerBarcode.exec(content);
       // \S matches anything other than a space, a tab, a newline, or a carriage return.
       const validString= /\S/.test(contentForValidation);
-      if (isEmailUnsubscribeTagMandatory() && isEmail) {
+      if (isEmailUnsubscribeTagMandatory() && isEmail && this.props?.moduleType === OUTBOUND) {
         const missingTagIndex = response?.missingTags?.indexOf("unsubscribe");
         if(missingTagIndex != -1) { //skip regex tags for mandatory tags also
           response?.missingTags?.splice(missingTagIndex, 1);

package/v2Components/TemplatePreview/_templatePreview.scss

@@ -991,25 +991,4 @@
 .media-img-inapp {
   width: 100%;
   height: 100%;
-}
-.empty-placeholder {
-  padding-bottom: $CAP_SPACE_16;
-}
-.viber-button-base {
-  border-radius: $CAP_SPACE_16;
-  background-color: $CAP_PURPLE01;
-  margin-top: $CAP_SPACE_12;
-  text-align: center;
-  width: 8.75rem;
-  height: $CAP_SPACE_20;
-  margin-left: $CAP_SPACE_08;
-}
-.viber-button-card-text {
-  font-size: $CAP_SPACE_12;
-  font-weight: 500;
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  color: $CAP_WHITE;
 }

package/v2Components/TemplatePreview/index.js

@@ -11,17 +11,7 @@ import _ from 'lodash';
 import { injectIntl, FormattedMessage, intlShape } from 'react-intl';
 // import styled from 'styled-components';
 import { CapColumn, CapRow, CapHeading, CapIcon, CapButton, CapImage, CapLabel, CapDivider, CapTooltip } from '@capillarytech/cap-ui-library';
-import {
-  CAP_COLOR_03,
-  CAP_WHITE,
-  FONT_COLOR_01,
-  CAP_G06,
-  CAP_G15,
-  CAP_PURPLE01,
-  CAP_G16,
-  CAP_SPACE_08,
-} from '@capillarytech/cap-ui-library/styled/variables';
-import isEmpty from 'lodash/isEmpty';
+import { isEmpty } from 'lodash';
 import './_templatePreview.scss';
 import {updateCharCount} from '../../utils/smsCharCountV2';
 import messages from './messages';
@@ -46,13 +36,6 @@ import inAppMobileIOSFull from './assets/images/inapp_mobile_ios_full.svg';
 import videoPlay from '../../assets/videoPlay.svg';
 import zaloMessage from '../../v2Containers/Zalo/messages';
 import { handlePreviewInNewTab } from '../../utils/common';
-import { TEMPLATE, IMAGE_CAROUSEL, IMAGE, STICKER, TEXT, IMAGE_MAP, VIDEO } from '../../v2Containers/Line/Container/constants';
-import CapFacebookPreview from '../../v2Containers/CapFacebookPreview';
-import WhatsappStatusContainer from '../WhatsappStatusContainer';
-import { getWhatsappQuickReply } from '../../v2Containers/Whatsapp/utils';
-import { QUICK_REPLY } from '../../v2Containers/Whatsapp/constants';
-import { ANDROID, INAPP_MESSAGE_LAYOUT_TYPES } from '../../v2Containers/InApp/constants';
-
 const wechatBodyNew = require('./assets/images/wechat_mobile_android.svg');
 const smsMobileAndroid = require('./assets/images/sms_mobile_android.svg');
 const smsMobileIos = require('./assets/images/sms_mobile_ios.svg');
@@ -66,6 +49,23 @@ const lineVideoPlaceholder = require('../../assets/rich-video-placeholder.svg');
 const androidPushMessagePhone = require('./assets/images/androidPushMessage.svg');
 const iPhonePushMessagePhone = require('./assets/images/iPhonePushMessage.svg');
 
+import {
+  CAP_COLOR_03,
+  CAP_WHITE,
+  FONT_COLOR_01,
+  CAP_G06,
+  CAP_G15,
+  CAP_PURPLE01,
+  CAP_G16,
+  CAP_SPACE_08,
+} from '@capillarytech/cap-ui-library/styled/variables';
+import { TEMPLATE, IMAGE_CAROUSEL, IMAGE, STICKER, TEXT, IMAGE_MAP, VIDEO } from '../../v2Containers/Line/Container/constants';
+import CapFacebookPreview from '../../v2Containers/CapFacebookPreview';
+import WhatsappStatusContainer from '../WhatsappStatusContainer';
+import { getWhatsappQuickReply } from '../../v2Containers/Whatsapp/utils';
+import { QUICK_REPLY } from '../../v2Containers/Whatsapp/constants';
+import { ANDROID, INAPP_MESSAGE_LAYOUT_TYPES } from '../../v2Containers/InApp/constants';
+
 export class TemplatePreview extends React.Component { // eslint-disable-line react/prefer-stateless-function
   onPreviewContentClicked = (channel) => {
     const IOSContent = (this.props.templateDataRaw && this.props.templateDataRaw.versions.base.IOS) ||
@@ -184,14 +184,8 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
     } = this.props;
     let content = channel && channel.toLowerCase() === 'sms' ? [this.props.content] : this.props.content;
     const { formatMessage } = intl;
-    const { rcsPreviewContent, inAppPreviewContent, viberPreviewContent } = content || {};
+    const { buttonText, imageURL, rcsPreviewContent, inAppPreviewContent, messageContent: viberMessageContent } = content || {};
     const { rcsImageSrc, rcsTitle, rcsDesc, buttonText: rcsButtonText } = rcsPreviewContent || {};
-    const {
-      videoParams,
-      imageURL,
-      buttonText: viberButtonText,
-      messageContent: viberMessageContent,
-    } = viberPreviewContent || {};
     const {mediaPreview = {}, templateTitle = "", templateMsg = "", ctaData} = inAppPreviewContent || {};
     let smsDetails = {};
     // let smsText = '';
@@ -926,40 +920,35 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
                         }}
                       />
                     )}
-                    {/* Video Viber preview */}
-                    {videoParams?.viberVideoSrc && (
-                      <CapTooltip
-                        title={formatMessage(messages.videoPreviewTooltip)}
-                      >
-                        <div className="video-preview">
-                          <CapImage
-                            src={videoParams?.viberVideoPreviewImg}
-                            className="whatsapp-image"
-                            alt={formatMessage(messages.previewGenerated)}
-                            rest={{
-                              style: {
-                                maxWidth: "100%",
-                                marginBottom: 5,
-                              },
-                            }}
-                          />
-                          <div className="icon-position">
-                            <CapImage
-                              className="video-icon"
-                              src={videoPlay} />
-                          </div>
-                        </div>
-                      </CapTooltip>
-                    )}
                     {/* button viber preview */}
-                    {viberButtonText && (
-                      <CapLabel className="viber-button-base">
-                        <p className="viber-button-card-text">
-                          {viberButtonText || ""}
+                    {buttonText && (
+                      <div
+                        style={{
+                          "border-radius": "16px",
+                          "background-color": CAP_PURPLE01,
+                          "margin-top": "14px",
+                          "text-align": "center",
+                          width: "140px",
+                          height: "20px",
+                          "margin-left": "8px",
+                        }}
+                      >
+                        <p
+                          style={{
+                            "font-size": "12px",
+                            "font-weight": "500",
+                            display: "-webkit-box",
+                            "-webkit-line-clamp": "1",
+                            "-webkit-box-orient": "vertical",
+                            overflow: "hidden",
+                            color: CAP_WHITE,
+                          }}
+                        >
+                          {buttonText || ""}
                         </p>
-                      </CapLabel>
+                      </div>
                     )}
-                    <div className="empty-placeholder"></div>
+                    <div style={{ paddingBottom: 32 }}></div>
                   </div>
                 </div>
               </div>

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -2,7 +2,6 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
 import get from 'lodash/get';
-import isEmpty from 'lodash/isEmpty';
 import cloneDeep from 'lodash/cloneDeep';
 import TemplatesV2 from '../TemplatesV2';
 import TemplatePreview from '../../v2Components/TemplatePreview';
@@ -152,6 +151,7 @@ export function SlideBoxContent(props) {
       enableNewChannels,
       hideTestAndPreviewBtn,
       getCmsTemplatesInProgress = false,
+      moduleType,
     } = props;
   const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
   const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
@@ -309,16 +309,11 @@ export function SlideBoxContent(props) {
       }
       case constants.VIBER: {
         const template = cloneDeep(templateDataObject);
-        const { text = "", button = {}, image = {}, video = {} } = get(template, 'versions.base.content.content', {});
-        const { url: viberImageUrl = "" } = image;
-        const { url: viberVideoUrl = "", thumbnailUrl = '' } = video;
+        const { text = "", imageURL = "", buttonText = "" } = get(template, 'versions.base.content.viber', {});
         template.content = {
-          viberPreviewContent: {
-            ...(!isEmpty(image) && { imageURL: viberImageUrl }),
-            ...(!isEmpty(video) && { videoParams: { viberVideoSrc: viberVideoUrl, viberVideoPreviewImg: thumbnailUrl }}),
-            buttonText: button?.text,
-            messageContent: text,
-          },
+          messageContent: text,
+          imageURL,
+          buttonText,
         };
         return template.content;
       }
@@ -597,6 +592,7 @@ export function SlideBoxContent(props) {
         onPreviewContentClicked={onPreviewContentClicked}
         onTestContentClicked={onTestContentClicked}
         getCmsTemplatesInProgress={getCmsTemplatesInProgress}
+        moduleType={moduleType}
       />
         )}
       {(isEditEmailWithId || isEmailEditWithContent) && (
@@ -623,6 +619,7 @@ export function SlideBoxContent(props) {
         selectedOfferDetails={selectedOfferDetails}
         onPreviewContentClicked={onPreviewContentClicked}
         onTestContentClicked={onTestContentClicked}
+        moduleType={moduleType}
       />
         )}
       {isEditMPush &&
@@ -911,5 +908,6 @@ SlideBoxContent.propTypes = {
   orgUnitId: PropTypes.any,
   smsRegister: PropTypes.any,
   getCmsTemplatesInProgress: PropTypes.bool,
+  moduleType: PropTypes.string,
 };
 export default SlideBoxContent;

package/v2Containers/CreativesContainer/SlideBoxHeader.js

@@ -70,7 +70,6 @@ export function SlideBoxHeader(props) {
       whatsapp: <FormattedMessage {...messages.whatsappTemplate} />,
       rcs: <FormattedMessage {...messages.rcsCreative} />,
       zalo: <FormattedMessage {...messages.zaloTemplate} />,
-      viber: <FormattedMessage {...messages.viberTemplate} />,
     };
     return labels[currentChannel.toLowerCase()];
   };

package/v2Containers/CreativesContainer/index.js

@@ -1260,6 +1260,7 @@ export class Creatives extends React.Component {
               enableNewChannels={enableNewChannels}
               hideTestAndPreviewBtn={this.props.hideTestAndPreviewBtn}
               getCmsTemplatesInProgress={this.props.Templates?.getCmsTemplatesInProgress}
+              moduleType={this.props.messageDetails?.type}
           />
           }
           footer={this.shouldShowFooter() &&

package/v2Containers/CreativesContainer/messages.js

@@ -322,10 +322,6 @@ export default defineMessages({
     id: `${scope}.zaloTemplate`,
     defaultMessage: `Zalo template`,
   },
-  "viberTemplate": {
-    id: `${scope}.viberTemplate`,
-    defaultMessage: `Viber template`,
-  },
   "learnTips": {
     id: `${scope}.learnTips`,
     defaultMessage: `Learn tips to get approved`,

package/v2Containers/CreativesContainer/tests/SlideBoxContent.test.js

@@ -3,7 +3,6 @@ import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
 
 import { SlideBoxContent } from '../SlideBoxContent';
 import mockdata from '../../mockdata';
-import { templateDetailsImage, templateDetailsVideo, templateDetailsText, templateDetails_ } from '../../Viber/tests/mockData';
 
 const {
   whatsappEditTemplateData,
@@ -87,14 +86,4 @@ describe('Test SlideBoxContent container', () => {
     renderFunction('LINE', 'preview', linePreviewTemplateData2);
     expect(renderedComponent).toMatchSnapshot();
   });
-  it('Should render correct component for viber channel preview mode', () => {
-    renderFunction('VIBER', 'preview', templateDetails_);
-    expect(renderedComponent).toMatchSnapshot();
-    renderFunction('VIBER', 'preview', templateDetailsImage);
-    expect(renderedComponent).toMatchSnapshot();
-    renderFunction('VIBER', 'preview', templateDetailsVideo);
-    expect(renderedComponent).toMatchSnapshot();
-    renderFunction('VIBER', 'preview', templateDetailsText);
-    expect(renderedComponent).toMatchSnapshot();
-  });
 });