@capillarytech/creatives-library 8.0.340-0 → 8.0.340-beta.0

package/v2Containers/MobilePushNew/index.scss

@@ -67,14 +67,16 @@
 
 .input-group {
   display: flex;
-  flex-direction: column;
+  flex-direction: column !important;
+  flex-flow: column nowrap;
   gap: $CAP_SPACE_16;
 }
 
 .creatives-mpush-title,
 .creatives-mpush-message {
   display: flex;
-  flex-direction: column;
+  flex-direction: column !important;
+  flex-flow: column nowrap;
   gap: $CAP_SPACE_08;
 }
 
@@ -122,8 +124,9 @@
   background: #fafafa;
 }
 
+/* TODO: cap-react-ui-library class removed — review this override */
 .button-form .cap-input,
-.button-form .cap-select {
+.button-form .cap-select-v2 {
   margin-bottom: $CAP_SPACE_16;
 }
 

package/v2Containers/Rcs/index.js

@@ -16,6 +16,7 @@ import CapInput from '@capillarytech/cap-ui-library/CapInput';
 import CapAlert from '@capillarytech/cap-ui-library/CapAlert';
 import CapHeading from '@capillarytech/cap-ui-library/CapHeading';
 import CapRadioGroup from '@capillarytech/cap-ui-library/CapRadioGroup';
+import ConfigProvider from 'antd/lib/config-provider';
 import CapTooltip from '@capillarytech/cap-ui-library/CapTooltip';
 import CapLabel from '@capillarytech/cap-ui-library/CapLabel';
 import CapHeader from '@capillarytech/cap-ui-library/CapHeader';
@@ -1144,7 +1145,7 @@ const splitTemplateVarString = (str) => {
             ) : (
               <CapButton
                 data-testid="suffix-button"
-                type="flat"
+                type="link"
                 isAddBtn
                 onClick={onTitleAddVar}
                 disabled={!!templateTitleError}
@@ -1183,7 +1184,7 @@ const splitTemplateVarString = (str) => {
   )}
 
 {/* Template Message */}
-       <CapRow id="rcs-template-message-label">
+       <CapRow useLegacy id="rcs-template-message-label">
          <CapHeader
             title={(
               <CapRow type="flex">
@@ -1206,7 +1207,7 @@ const splitTemplateVarString = (str) => {
               ) : (
                 <CapButton
                   data-testid="suffix-button"
-                  type="flat"
+                  type="link"
                   isAddBtn
                   onClick={onMessageAddVar}
                   disabled={templateDescError && templateDesc}
@@ -1217,7 +1218,7 @@ const splitTemplateVarString = (str) => {
             }
           />
         </CapRow>
-        <CapRow className="rcs-create-template-message-input">
+        <CapRow useLegacy className="rcs-create-template-message-input">
           <div className="rcs_text_area_wrapper">
             {(isEditFlow || !isFullMode)
               ? renderedRCSEditMessage(splitTemplateVarString(templateDesc), MESSAGE_TEXT)
@@ -2276,7 +2277,7 @@ const splitTemplateVarString = (str) => {
 
     return (
       <>
-        {templateStatus !== '' && (<CapRow className="template-status-container">
+        {templateStatus !== '' && (<CapRow useLegacy className="template-status-container">
           <CapLabel type="label2">
             {formatMessage(messages.templateStatusLabel)}
           </CapLabel>
@@ -2308,25 +2309,29 @@ const splitTemplateVarString = (str) => {
               />
             )}
             {renderLabel('templateTypeLabel')}
-            <CapRadioGroup
-              id="select-rcs-template-type"
-              options={TEMPLATE_TYPE_OPTIONS}
-              onChange={onTemplateTypeChange}
-              value={templateType}
-              disabled={(isEditFlow || !isFullMode)}
-            />
+            <ConfigProvider theme={{ components: { Radio: { radioSize: 20, dotSize: 8 } } }}>
+              <CapRadioGroup
+                id="select-rcs-template-type"
+                options={TEMPLATE_TYPE_OPTIONS}
+                onChange={onTemplateTypeChange}
+                value={templateType}
+                disabled={(isEditFlow || !isFullMode)}
+              />
+            </ConfigProvider>
 
             {/* Show media only for rich_card or carousel */}
             {(templateType === contentType.rich_card || templateType === contentType.carousel) && (
               <>
                 {renderLabel('mediaLabel')}
-                  <CapRadioGroup
-                    options={mediaRadioOptions || []}
-                    value={templateMediaType}
-                    onChange={onTemplateMediaTypeChange}
-                    disabled={(isEditFlow || !isFullMode)}
-                    className="rcs-radio"
-                  />
+                  <ConfigProvider theme={{ components: { Radio: { radioSize: 20, dotSize: 8 } } }}>
+                    <CapRadioGroup
+                      options={mediaRadioOptions || []}
+                      value={templateMediaType}
+                      onChange={onTemplateMediaTypeChange}
+                      disabled={(isEditFlow || !isFullMode)}
+                      className="rcs-radio"
+                    />
+                  </ConfigProvider>
                 <div className="rcs-container-image">
                   {getMediaBasedComponent()}
                 </div>

package/v2Containers/Rcs/index.scss

@@ -44,13 +44,6 @@
     margin-right: 50px;
   }
 
-  .ant-radio-inner::after{
-    top: 3px;
-    left: 3px;
-  }
-  .ant-radio-inner{
-    border: 1px solid #d9d9d9;
-  }
   .ant-radio-checked .ant-radio-inner{
     border: 1px solid #47af46;
   }

package/v2Containers/SmsTrai/Edit/index.js

@@ -646,7 +646,7 @@ export const SmsTraiEdit = (props) => {
             </TraiEditTemplateDetails>
           )}
           <CapColumn span={14}>
-            <CapRow>
+            <CapRow useLegacy>
               <CapHeader
                 title={formatMessage(messages.traiEditTitle)}
                 size="regular"
@@ -668,6 +668,7 @@ export const SmsTraiEdit = (props) => {
             </CapRow>
 
             <CapRow
+              useLegacy
               style={{
                 backgroundColor: CAP_G10,
                 padding: CAP_SPACE_16,
@@ -675,7 +676,7 @@ export const SmsTraiEdit = (props) => {
             >
               {renderedContent()}
             </CapRow>
-            <CapRow>
+            <CapRow useLegacy>
               {smsLengthForVar()}
             </CapRow>
             <CapCheckbox onChange={unicodeHandler} checked={isUnicodeAllowed} disabled={disablehandler()}>

package/v2Containers/Templates/index.js

@@ -1906,7 +1906,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           <span title={template?.name}>
             {template?.name}
             {currentChannel === INAPP && (
-              <CapRow>
+              <CapRow useLegacy>
                 <CapColoredTag
                   tagColor={INAPP_LAYOUT_DETAILS[inappBodyType]?.tagColor}
                   tagTextColor={
@@ -1937,7 +1937,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             // Show preview icon for other channels (e.g., WeChat, Line, Facebook, Ebill)
             if (currentChannel === ZALO && isZaloPreviewLoading) {
               return (
-                <CapSpin style={{ marginRight: "16px", position: "static", display: "inline" }} spinning />
+                <CapSpin style={{ position: "static", display: "inline" }} spinning />
               );
             }
             
@@ -2312,7 +2312,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         case WHATSAPP: {
           const { whatsappImageSrc = '', templateMsg, docPreview, whatsappVideoPreviewImg = '', templateHeaderPreview, templateFooterPreview, carouselData = [] } = getWhatsappContent(template);
           templateData.title = (
-            <CapRow>
+            <CapRow useLegacy>
               <CapLabel className="whatsapp-rcs-template-name">{template?.name}</CapLabel>
               <WhatsappStatusContainer template={template} />
             </CapRow>
@@ -2405,15 +2405,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           const name = get(template, "name", "");
           const statusDisplay=getRcsStatusType(status);
           templateData.title = (
-            <CapRow>
+            <CapRow useLegacy>
               <CapLabel className="whatsapp-rcs-template-name">{name}</CapLabel>
-              <CapRow type="flex" align="middle" className="rcs-status-container zalo-status-color">
+              <CapColumn type="flex" align="middle" className="rcs-status-container zalo-status-color">
                 <CapStatus
                   type={statusDisplay}
                   text={statusDisplay && this.props.intl.formatMessage(rcsMessages?.[`${statusDisplay}_STATUS`])}
                   labelType="label3"
                 />
-              </CapRow>
+              </CapColumn>
             </CapRow>
           );
         
@@ -2431,11 +2431,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             } = {},
           } = template;
           templateData.title = (
-            <CapRow>
+            <CapRow useLegacy>
               <CapLabel className="zalo-template-name">
                 {templateId}
               </CapLabel>
-              <CapRow
+              <CapColumn
                 type="flex"
                 align="middle"
                 className="zalo-status-container zalo-status-color"
@@ -2451,7 +2451,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
                   text={status && this.props.intl.formatMessage(zaloMessages?.[`${status}_STATUS`])}
                   labelType="label3"
                 />
-              </CapRow>
+              </CapColumn>
             </CapRow>
           );
           templateData.content = <CapLabel type="label19" className="zalo-listing-content desc">{template.name}</CapLabel>;
@@ -3477,8 +3477,8 @@ return (<div>
         content = (<div className="sms-template-content">
           <div style={{textAlign: 'center', lineHeight: '260px'}} className="sms-text">
             <div>
-              <button type="button" className="ant-btn cap-button edit-button ant-btn-ghost" onClick={() => this.handleBlankTemplateAction('uploadFile')}><span>Upload File</span></button>
-              <button type="button" className="ant-btn cap-button preview-button ant-btn-danger" onClick={() => this.handleBlankTemplateAction('editor')}><span>Use Editor</span></button>
+              <button type="button" className="ant-btn cap-button-v2 edit-button ant-btn-ghost" onClick={() => this.handleBlankTemplateAction('uploadFile')}><span>Upload File</span></button>
+              <button type="button" className="ant-btn cap-button-v2 preview-button ant-btn-danger" onClick={() => this.handleBlankTemplateAction('editor')}><span>Use Editor</span></button>
             </div>
           </div>
         </div>);
@@ -3488,13 +3488,13 @@ return (<div>
             <div>
               <button
                 type="button"
-                className="ant-btn cap-button edit-button ant-btn-ghost"
+                className="ant-btn cap-button-v2 edit-button ant-btn-ghost"
                 onClick={() => this.handleBlankTemplateAction('textTemplate', channel)}>
                 <span>{this.props.intl.formatMessage(messages.textTemplate)}</span>
               </button>
               <button
                 type="button"
-                className="ant-btn cap-button preview-button ant-btn-danger"
+                className="ant-btn cap-button-v2 preview-button ant-btn-danger"
                 onClick={() => this.handleBlankTemplateAction('imageTemplate', channel)}>
                 <span>{this.props.intl.formatMessage(messages.imageTemplate)}</span>
               </button>
@@ -4453,7 +4453,7 @@ return (<div>
               message={formatMessage(messages.zaloOnlyApprovedTemplates)}
             />
           ) : null}
-          <CapRow>
+          <CapRow useLegacy>
             <Pagination
               templateInProgress={
                 this.props.Templates.getAllTemplatesInProgress
@@ -4493,7 +4493,7 @@ return (<div>
             )}
           </CapRow>
 
-          <CapRow>
+          <CapRow useLegacy>
             {!isEmpty(creativesParams.mode) &&
             isFullMode && ( //creatives container for fullmode
                 <CreativesContainer
@@ -4517,7 +4517,7 @@ return (<div>
                 />
               )}
           </CapRow>
-          <CapRow>
+          <CapRow useLegacy>
             {(this.state.channel.toLowerCase() === "ebill" ||
               this.state.channel.toLowerCase() === "email") &&
               htmlPreviewContent && (

package/v2Containers/Viber/constants.js

@@ -3,7 +3,6 @@ import React from 'react';
 import CapHeading from "@capillarytech/cap-ui-library/CapHeading";
 import CapLabel from "@capillarytech/cap-ui-library/CapLabel";
 import messages from "./messages";
-import { createAsyncAssetUploadConstants } from '../../utils/asyncAssetUpload';
 
 export const DEFAULT_ACTION = 'app/v2Containers/Viber/DEFAULT_ACTION';
 export const ALLOWED_EXTENSIONS_REGEX = (/\.(jpe?g|png)$/i);
@@ -17,13 +16,6 @@ export const UPLOAD_VIBER_ASSET_REQUEST = 'app/v2Containers/Viber/UPLOAD_ASSET_R
 export const UPLOAD_VIBER_ASSET_SUCCESS = 'app/v2Containers/Viber/UPLOAD_ASSET_SUCCESS';
 export const UPLOAD_VIBER_ASSET_FAILURE = 'app/v2Containers/Viber/UPLOAD_ASSET_FAILURE';
 
-const viberAsyncPrefix = 'app/v2Containers/Viber';
-const asyncUploadConstants = createAsyncAssetUploadConstants('VIBER', viberAsyncPrefix);
-export const UPLOAD_VIBER_ASSET_PROCESSING = asyncUploadConstants.UPLOAD_VIBER_ASSET_PROCESSING;
-export const UPLOAD_VIBER_ASSET_COMPLETED = asyncUploadConstants.UPLOAD_VIBER_ASSET_COMPLETED;
-export const UPLOAD_VIBER_ASSET_FAILED = asyncUploadConstants.UPLOAD_VIBER_ASSET_FAILED;
-export const UPLOAD_VIBER_ASSET_TIMEOUT = asyncUploadConstants.UPLOAD_VIBER_ASSET_TIMEOUT;
-
 
 export const CREATE_VIBER_TEMPLATE_REQUEST = 'app/v2Containers/Viber/CREATE_VIBER_TEMPLATE_REQUEST';
 export const CREATE_VIBER_TEMPLATE_SUCCESS = 'app/v2Containers/Viber/CREATE_VIBER_TEMPLATE_SUCCESS';

package/v2Containers/Viber/index.js

@@ -16,6 +16,7 @@ import CapNotification from '@capillarytech/cap-ui-library/CapNotification';
 import CapTooltip from '@capillarytech/cap-ui-library/CapTooltip';
 import CapIcon from '@capillarytech/cap-ui-library/CapIcon';
 import CapRadioGroup from '@capillarytech/cap-ui-library/CapRadioGroup';
+import ConfigProvider from 'antd/lib/config-provider';
 import CapAskAira from '@capillarytech/cap-ui-library/CapAskAira';
 import { GA } from '@capillarytech/cap-ui-utils';
 import * as globalActions from '../Cap/actions';
@@ -375,13 +376,15 @@ export const Viber = (props) => {
       <CapHeading type="h4" className="viber-render-heading">
         {formatMessage(messages.mediaLabel)}
       </CapHeading>
-      <CapRadioGroup
-        id="viber-media-radio"
-        options={mediaRadioOptions}
-        value={templateMediaType}
-        onChange={onTemplateMediaTypeChange}
-        className="viber-media-radio"
-      />
+      <ConfigProvider theme={{ components: { Radio: { radioSize: 20, dotSize: 8 } } }}>
+        <CapRadioGroup
+          id="viber-media-radio"
+          options={mediaRadioOptions}
+          value={templateMediaType}
+          onChange={onTemplateMediaTypeChange}
+          className="viber-media-radio"
+        />
+      </ConfigProvider>
     </>
   );
 
@@ -419,7 +422,6 @@ export const Viber = (props) => {
       channel={VIBER}
       errorMessage={formatMessage(messages.videoErrorMessage)}
       showVideoNameAndDuration
-      assetUploading={viber?.assetUploading}
     />
   );
 
@@ -655,13 +657,15 @@ export const Viber = (props) => {
           {formatMessage(messages.videoButtonDisabled)}
         </CapLabel>
       )}
-      <CapRadioGroup
-        options={buttonRadioOptions}
-        value={buttonType}
-        onChange={onChangeButtonType}
-        disabled={templateMediaType === VIBER_MEDIA_TYPES.VIDEO}
-        className="viber-btn-radio-group"
-      />
+      <ConfigProvider theme={{ components: { Radio: { radioSize: 20, dotSize: 8 } } }}>
+        <CapRadioGroup
+          options={buttonRadioOptions}
+          value={buttonType}
+          onChange={onChangeButtonType}
+          disabled={templateMediaType === VIBER_MEDIA_TYPES.VIDEO}
+          className="viber-btn-radio-group"
+        />
+      </ConfigProvider>
       {isBtnTypeCta && ButtonViber}
     </div>
   );
@@ -796,10 +800,6 @@ export const Viber = (props) => {
     ) {
       return true;
     }
-    // block submit while a media asset upload is still in progress
-    if ((isMediaTypeImage || isMediaTypeVideo) && viber?.assetUploading) {
-      return true;
-    }
     if (isBtnTypeCta && !isCtaSaved) {
       return true;
     }

package/v2Containers/Viber/index.scss

@@ -7,13 +7,6 @@
   margin-right: $CAP_SPACE_24;
 }
 
-.ant-radio-inner::after{
-  top: 3px;
-  left: 3px;
-}
-.ant-radio-inner{
-  border: 1px solid #d9d9d9;
-}
 .ant-radio-checked .ant-radio-inner{
   border: 1px solid #47af46;
 }

package/v2Containers/Viber/reducer.js

@@ -6,71 +6,51 @@
 
 import { fromJS } from 'immutable';
 import * as types from './constants';
-import { createAsyncAssetUploadReducerCases } from '../../utils/asyncAssetUpload';
-
-const asyncUploadCases = createAsyncAssetUploadReducerCases({
-  PROCESSING: types.UPLOAD_VIBER_ASSET_PROCESSING,
-  COMPLETED: types.UPLOAD_VIBER_ASSET_COMPLETED,
-  FAILED: types.UPLOAD_VIBER_ASSET_FAILED,
-  TIMEOUT: types.UPLOAD_VIBER_ASSET_TIMEOUT,
-});
 
 const initialState = fromJS({
   uploadedAssetData: {},
   createTemplateInProgress: false,
-  assetProcessing: {},
 });
 
 function viberReducer(state = initialState, action) {
   switch (action.type) {
     case types.CREATE_VIBER_TEMPLATE_REQUEST:
       return state
-        .set('createTemplateInProgress', true)
-        .set('createTemplateError', false)
-        .set('createTemplateErrorMessage', fromJS(""));
+      .set('createTemplateInProgress', true)
+      .set('createTemplateError', false)
+      .set('createTemplateErrorMessage', fromJS(""));
     case types.CREATE_VIBER_TEMPLATE_SUCCESS:
       return state.set('createTemplateInProgress', false)
-        .set('response', action.data)
-        .set('createTemplateError', (action.statusCode !== undefined && action.statusCode > 300))
-        .set('createTemplateErrorMessage', fromJS(action.errorMsg));
+      .set('response', action.data)
+      .set('createTemplateError', (action.statusCode !== undefined && action.statusCode > 300))
+      .set('createTemplateErrorMessage', fromJS(action.errorMsg));
     case types.CREATE_VIBER_TEMPLATE_FAILURE:
       return state
-        .set('createTemplateInProgress', false)
-        .set('createTemplateError', true)
-        .set('createTemplateErrorMessage', fromJS(action.errorMsg));
+      .set('createTemplateInProgress', false)
+      .set('createTemplateError', true)
+      .set('createTemplateErrorMessage', fromJS(action.errorMsg));
     case types.UPLOAD_VIBER_ASSET_REQUEST:
       return state
-        .set('uploadAssetSuccess', false)
-        .set('assetUploading', true);
+      .set('uploadAssetSuccess', false)
+      .set('assetUploading', true);
     case types.UPLOAD_VIBER_ASSET_SUCCESS:
       return state
-        .set('uploadAssetSuccess', (action.statusCode !== undefined && action.statusCode !== '' && action.statusCode < 300))
-        .set('assetUploading', false)
-        .set(action.templateType !== undefined ? `uploadedAssetData${action.templateType}` : 'uploadedAssetData', fromJS(action.data));
+      .set('uploadAssetSuccess', (action.statusCode !== undefined && action.statusCode !== '' && action.statusCode < 300))
+      .set('assetUploading', false)
+      .set(action.templateType !== undefined ? `uploadedAssetData${action.templateType}` : 'uploadedAssetData', action.data);
     case types.UPLOAD_VIBER_ASSET_FAILURE:
       return state
-        .set('uploadAssetSuccess', false)
-        .set('assetUploading', false);
-    case asyncUploadCases.PROCESSING:
-      return asyncUploadCases.handleProcessing(state, action);
-    case asyncUploadCases.COMPLETED:
-      return asyncUploadCases.handleCompleted(state, action);
-    case asyncUploadCases.FAILED:
-      return asyncUploadCases.handleFailed(state, action);
-    case asyncUploadCases.TIMEOUT:
-      return asyncUploadCases.handleTimeout(state, action);
+      .set('uploadAssetSuccess', false)
+      .set('assetUploading', false);
     case types.CLEAR_VIBER_ASSET:
       return state
-        .delete(action.templateType !== undefined ? `uploadedAssetData${action.templateType}` : 'uploadedAssetData')
-        .set('assetProcessing', fromJS({}))
-        .set('assetUploading', false)
-        .set('uploadAssetSuccess', false);
+        .delete(action.templateType !== undefined ? `uploadedAssetData${action.templateType}` : 'uploadedAssetData');
     // FOR EDIT
     case types.EDIT_VIBER_TEMPLATE_REQUEST:
       return state
-        .set('editTemplateInProgress', true)
-        .set('editTemplateError', false)
-        .set('editTemplateErrorMessage', fromJS(""));
+      .set('editTemplateInProgress', true)
+      .set('editTemplateError', false)
+      .set('editTemplateErrorMessage', fromJS(""));
     case types.EDIT_VIBER_TEMPLATE_SUCCESS:
       return state.set('editTemplateInProgress', false)
         .set('editResponse', action.data)
@@ -95,10 +75,7 @@ function viberReducer(state = initialState, action) {
       return state
         .delete('uploadedAssetData')
         .delete('metaEntities')
-        .delete('templateDetails')
-        .set('assetProcessing', fromJS({}))
-        .set('assetUploading', false)
-        .set('uploadAssetSuccess', false);
+        .delete('templateDetails');
     default:
       return state;
   }

package/v2Containers/Viber/sagas.js

@@ -2,58 +2,17 @@ import {
   call, put, takeLatest, all,
 } from 'redux-saga/effects';
 import * as Api from '../../services/api';
-import { pollAssetStatus } from '../../sagas/assetPolling';
-import { createPollingConfig } from '../../utils/asyncAssetUpload';
-import { ASSET_STATUS } from '../../utils/assetStatusConstants';
 import * as types from './constants';
 
-export function* uploadViberAsset(params) {
+export function* uploadViberAsset(file, assetType, fileParams ) {
   try {
-    const result = yield call(Api.uploadFile, params);
-    const responseData = result.response || {};
-    const statusCode = result?.status?.code || result?.statusCode || 200;
-
-    if (statusCode === 202 || responseData?.processingStatus === ASSET_STATUS.PROCESSING) {
-      const assetId = responseData.assetId || responseData.asset?._id;
-      const { templateType } = params;
-      const assetType = params.assetType || responseData.asset?.type?.toLowerCase() || 'image';
-
-      if (assetId) {
-        yield put({
-          type: types.UPLOAD_VIBER_ASSET_PROCESSING,
-          payload: {
-            assetId,
-            asset: responseData.asset,
-            processingStatus: ASSET_STATUS.PROCESSING,
-          },
-        });
-
-        const actionTypes = {
-          COMPLETED: types.UPLOAD_VIBER_ASSET_COMPLETED,
-          FAILED: types.UPLOAD_VIBER_ASSET_FAILED,
-          TIMEOUT: types.UPLOAD_VIBER_ASSET_TIMEOUT,
-        };
-        const pollingConfig = createPollingConfig(assetType, assetId, actionTypes, templateType);
-        yield call(pollAssetStatus, pollingConfig);
-      } else {
-        const errorMessage = 'Asset upload initiated but no asset ID was returned from the server. Unable to track processing status.';
-        yield put({
-          type: types.UPLOAD_VIBER_ASSET_FAILED,
-          payload: {
-            assetId: undefined,
-            error: errorMessage,
-          },
-          templateType,
-        });
-      }
-    } else {
-      yield put({
-        type: types.UPLOAD_VIBER_ASSET_SUCCESS,
-        data: responseData.asset,
-        statusCode,
-        templateType: params.templateType,
-      });
-    }
+    const result = yield call(Api.uploadFile, file, assetType, fileParams);
+    yield put({
+      type: types.UPLOAD_VIBER_ASSET_SUCCESS,
+      data: result.response.asset,
+      statusCode: result.status ? result.status.code : '',
+      templateType: file.templateType,
+    });
   } catch (error) {
     yield put({ type: types.UPLOAD_VIBER_ASSET_FAILURE, error });
   }
@@ -67,12 +26,7 @@ export function* createViberTemplate({ template, callback }) {
       errorMsg = result.message;
       throw errorMsg;
     }
-    yield put({
-      type: types.CREATE_VIBER_TEMPLATE_SUCCESS,
-      data: result.response,
-      statusCode: result.status ? result.status.code : '',
-      errorMsg,
-    });
+    yield put({ type: types.CREATE_VIBER_TEMPLATE_SUCCESS, data: result.response, statusCode: result.status ? result.status.code : '', errorMsg });
     if (callback) {
       callback(result.response);
     }
@@ -96,12 +50,7 @@ export function* editTemplate({ template, callback }) {
     if (callback) {
       callback(result.response);
     }
-    yield put({
-      type: types.EDIT_VIBER_TEMPLATE_SUCCESS,
-      data: result.response,
-      statusCode: result.status ? result.status.code : '',
-      errorMsg,
-    });
+    yield put({ type: types.EDIT_VIBER_TEMPLATE_SUCCESS, data: result.response, statusCode: result.status ? result.status.code : '', errorMsg });
   } catch (error) {
     yield put({ type: types.EDIT_VIBER_TEMPLATE_FAILURE, error, errorMsg });
     if (callback) {
@@ -112,6 +61,7 @@ export function* editTemplate({ template, callback }) {
 
 export function* getTemplateDetails({id, callback}) {
   try {
+    
     const result = yield call(Api.getTemplateDetails, {id, channel: 'VIBER'});
     yield put({ type: types.GET_VIBER_TEMPLATE_DETAILS_SUCCESS, data: result.response });
     if (callback) {
@@ -125,19 +75,28 @@ export function* getTemplateDetails({id, callback}) {
 
 function* watchUploadViberAsset() {
   yield takeLatest(types.UPLOAD_VIBER_ASSET_REQUEST, uploadViberAsset);
+  
+  
 }
 
 
 function* watchCreateTemplate() {
+  
   yield takeLatest(types.CREATE_VIBER_TEMPLATE_REQUEST, createViberTemplate);
+  
+  
 }
 
 function* watchGetTemplateDetails() {
   yield takeLatest(types.GET_VIBER_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
+  
+  
 }
 
 function* watchEditTemplate() {
   yield takeLatest(types.EDIT_VIBER_TEMPLATE_REQUEST, editTemplate);
+  
+  
 }
 
 export default [
@@ -154,4 +113,4 @@ export function* v2ViberSagas() {
     watchGetTemplateDetails(),
     watchEditTemplate(),
   ]);
-}
+}