@capillarytech/creatives-library 8.0.268 → 8.0.270

package/v2Components/CapImageUrlUpload/messages.js

@@ -0,0 +1,47 @@
+import { defineMessages } from 'react-intl';
+
+const scope = 'app.v2Components.CapImageUrlUpload';
+
+export default defineMessages({
+  imageUrlPlaceholder: {
+    id: `${scope}.imageUrlPlaceholder`,
+    defaultMessage: 'Enter image URL',
+  },
+  imageUrlInvalid: {
+    id: `${scope}.imageUrlInvalid`,
+    defaultMessage: 'Please enter a valid image URL',
+  },
+  imageTypeInvalid: {
+    id: `${scope}.imageTypeInvalid`,
+    defaultMessage: 'Invalid image type. Only JPEG, JPG, and PNG formats are allowed',
+  },
+  imageSizeInvalid: {
+    id: `${scope}.imageSizeInvalid`,
+    defaultMessage: 'Image size exceeds the maximum limit',
+  },
+  imageLoadError: {
+    id: `${scope}.imageLoadError`,
+    defaultMessage: 'Failed to load image. Please check the URL and try again',
+  },
+  validatingUrl: {
+    id: `${scope}.validatingUrl`,
+    defaultMessage: 'Validating image URL...',
+  },
+  uploadingImage: {
+    id: `${scope}.uploadingImage`,
+    defaultMessage: 'Uploading image to gallery...',
+  },
+  recommendedDimensions: {
+    id: `${scope}.recommendedDimensions`,
+    defaultMessage: 'Recommended dimensions: {dimensions}',
+  },
+  sizeLimit: {
+    id: `${scope}.sizeLimit`,
+    defaultMessage: 'Size upto: {size}',
+  },
+  formatTypes: {
+    id: `${scope}.formatTypes`,
+    defaultMessage: 'Format: {formats}',
+  },
+});
+

package/v2Components/CommonTestAndPreview/UnifiedPreview/_unifiedPreview.scss

@@ -913,7 +913,7 @@
       // Colors adjusted to white for preview context (inside .message-pop with blue background)
       .whatsapp-template-header-preview {
         // From WhatsApp/index.scss: color: $CAP_G01, but use white for preview
-        color: $CAP_WHITE;
+        color: $CAP_G01;
         // From WhatsApp/index.scss: font-weight: $FONT_WEIGHT_MEDIUM
         font-weight: $FONT_WEIGHT_MEDIUM;
         // From WhatsApp/index.scss: font-size: $FONT_SIZE_VS
@@ -927,7 +927,7 @@
   
       .whatsapp-template-footer-preview {
         // From WhatsApp/index.scss: color: $CAP_G04, but use white for preview
-        color: $CAP_WHITE;
+        color: $CAP_G01;
         // From WhatsApp/index.scss: font-weight: $FONT_WEIGHT_REGULAR
         font-weight: $FONT_WEIGHT_REGULAR;
         // From WhatsApp/index.scss: font-size: 0.5rem

package/v2Components/CommonTestAndPreview/index.js

@@ -495,28 +495,19 @@ const CommonTestAndPreview = (props) => {
 
       case CHANNELS.SMS: {
         // Extract SMS message from content
-        const message = contentStr || formDataObj?.['sms-editor'] || formDataObj?.[0]?.['sms-editor'] || formDataObj?.messageBody || '';
+        // For SMS, contentStr should contain the message text
+        const message = contentStr || formDataObj?.['sms-editor'] || formDataObj?.[0]?.['sms-editor'] || '';
 
         // Resolve tags in message if custom values are provided
         const resolvedMessage = customValuesObj && Object.keys(customValuesObj).length > 0
           ? resolveTagsInText(message, customValuesObj)
           : message;
 
-        const baseData = formDataObj?.base || formDataObj?.[0]?.base || formDataObj?.[0] || {};
-        const templateId = formDataObj?.templateConfigs?.templateId || formDataObj?.template_id || formDataObj?.templateId || baseData?.template_id || '';
-        const templateRaw = formDataObj?.templateConfigs?.template || baseData?.['sms-editor'] || baseData?.['updated-sms-editor'] || '';
-        const templateContent = Array.isArray(templateRaw) ? templateRaw.join('') : (templateRaw || '');
-
-        const smsPayload = {
+        return {
           ...basePayload,
           smsMessageContent: {
             message: resolvedMessage,
-            ...(templateId && {
-              templateConfigs: {
-                templateId,
-                ...(templateContent && { template: templateContent }),
-              },
-            }),
+            templateConfigs: {},
           },
           smsDeliverySettings: {
             channelSettings: {
@@ -530,8 +521,6 @@ const CommonTestAndPreview = (props) => {
             },
           },
         };
-
-        return smsPayload;
       }
 
       case CHANNELS.WHATSAPP: {

package/v2Components/FormBuilder/index.js

@@ -726,7 +726,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
 
         let tagValidationResponse = false;
         if (content) {
-          tagValidationResponse = this.validateTags(content, tags, injectedTags);
+          tagValidationResponse = this.validateTags(content, tags, injectedTags, false, this.props?.isFullMode);
         }
         
         if (tagValidationResponse.valid) {
@@ -764,7 +764,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       if (this.state.formData['message-editor'] !== undefined ) {
         const content = this.state.formData['0']['message-editor'] || '';
         
-        const tagValidationResponse = this.validateTags((content), tags, injectedTags);
+        const tagValidationResponse = this.validateTags((content), tags, injectedTags, false, this.props?.isFullMode);
         
         if (tagValidationResponse.valid) {
           errorData = {
@@ -847,7 +847,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             errorData[index] = true;
             isValid = false;
           } else {
-            const tagValidationResponse = this.validateTags(content, tags, injectedTags);
+            const tagValidationResponse = this.validateTags(content, tags, injectedTags, false, this.props?.isFullMode);
             
             if (tagValidationResponse.valid) {
               errorData[index] = false;
@@ -910,7 +910,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 isCurrentTabValid = false;
               } else {
                 errorData[parseInt(index)][`message-editor${selector}`] = false;
-                const tagValidationResponse = this.validateTags(message, tags, injectedTags);
+                const tagValidationResponse = this.validateTags(message, tags, injectedTags, false, this.props?.isFullMode);
                 
                 if (tagValidationResponse.valid) {
                   errorData[parseInt(index)][`message-editor${selector}`] = false;
@@ -939,7 +939,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 isCurrentTabValid = false;
               } else {
                 errorData[parseInt(index)][`message-title${selector}`] = false;
-                const tagValidationResponse = this.validateTags(title, tags, injectedTags);
+                const tagValidationResponse = this.validateTags(title, tags, injectedTags, false, this.props?.isFullMode);
                 
                 if (tagValidationResponse.valid) {
                   errorData[parseInt(index)][`message-title${selector}`] = false;
@@ -1193,7 +1193,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             if (!content) {
               return false;
             }
-            const tagValidationResponse = this.validateTags(content, tags, injectedTags, isEmail);
+            const tagValidationResponse = this.validateTags(content, tags, injectedTags, isEmail, this.props?.isFullMode);
             
             // Check for base64 images in email content
             isEmail && containsBase64Images({content, callback:()=>{
@@ -1500,7 +1500,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     });
   }
 
-  validateTags(content, tagsParam, injectedTagsParams, isEmail = false) {
+  validateTags(content, tagsParam, injectedTagsParams, isEmail = false, isFullMode = this.props?.isFullMode) {
     const type = (this.props.location && this.props.location.query.type) ? this.props.location.query.type : 'full';
     let currentModule = this.props.location.query.module ? this.props.location.query.module : 'default';
     if (this.props.tagModule) {
@@ -1518,7 +1518,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     response.isBraceError = false;
     response.isContentEmpty = false;
     const contentForValidation = isEmail ? convert(content, GLOBAL_CONVERT_OPTIONS) : content ;
-    if(tags && tags.length) {
+    if(tags && tags.length && !isFullMode) {
       _.forEach(tags, (tag) => {
         _.forEach(tag.definition.supportedModules, (module) => {
           if (module.mandatory && (currentModule === module.context)) {

package/v2Containers/App/constants.js

@@ -40,6 +40,7 @@ export const TRACK_CREATE_IMAGE = 'createImage';
 export const TRACK_CREATE_LINE = 'createLine';
 export const TRACK_CREATE_VIBER = 'createViber';
 export const TRACK_CREATE_FACEBOOK = 'createFacebook';
+export const TRACK_CREATE_WEBPUSH = 'createWebPush';
 
 export const CREATE = 'create';
 export const EDIT = 'edit';
@@ -54,6 +55,7 @@ export const EMAIL = 'email';
 export const ASSETS = 'assets';
 export const ZALO = 'zalo';
 export const INAPP = 'inapp';
+export const WEBPUSH = 'webpush';
 
 export const JP_LOCALE_HIDE_FEATURE = 'JP_LOCALE_HIDE_FEATURE';
 
@@ -65,6 +67,7 @@ export const TRACK_EDIT_IMAGE = 'editImage';
 export const TRACK_EDIT_LINE = 'editLine';
 export const TRACK_EDIT_VIBER = 'editViber';
 export const TRACK_EDIT_FACEBOOK = 'editFacebook';
+export const TRACK_EDIT_WEBPUSH = 'editWebPush';
 
 export const CHANNEL_CREATE_TRACK_MAPPING = {
   sms: TRACK_CREATE_SMS,
@@ -75,6 +78,7 @@ export const CHANNEL_CREATE_TRACK_MAPPING = {
   line: TRACK_CREATE_LINE,
   viber: TRACK_CREATE_VIBER,
   facebook: TRACK_CREATE_FACEBOOK,
+  webpush: TRACK_CREATE_WEBPUSH,
 };
 
 export const CHANNEL_EDIT_TRACK_MAPPING = {
@@ -86,6 +90,7 @@ export const CHANNEL_EDIT_TRACK_MAPPING = {
   line: TRACK_EDIT_LINE,
   viber: TRACK_EDIT_VIBER,
   facebook: TRACK_EDIT_FACEBOOK,
+  webpush: TRACK_EDIT_WEBPUSH,
 };
 export const GTM_TRACKING_ID = 'UA-110024621-2';
 export const BEE_PLUGIN = 'BEE_PLUGIN';

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -28,6 +28,10 @@ import { getWhatsappContent } from '../Whatsapp/utils';
 import * as commonUtil from '../../utils/common';
 import Zalo from '../Zalo';
 import MobilePushNew from '../MobilePushNew';
+import WebPush from '../WebPush';
+import DevicePreviewContent from '../WebPush/Create/preview/DevicePreviewContent';
+import { LAYOUT_MODE } from '../WebPush/Create/preview/constants';
+import { WEBPUSH_CONTENT_FIELDS, WEBPUSH_TEMPLATE_PATHS } from '../WebPush/constants';
 const CreativesWrapper = styled.div`
   .ant-popover,
   .ant-notification,
@@ -129,6 +133,7 @@ export function SlideBoxContent(props) {
       onValidationFail,
       channelsToHide,
       forwardedTags,
+      supportedTags = [],
       selectedOfferDetails,
       channelsToDisable,
       weChatTemplateType,
@@ -200,6 +205,7 @@ export function SlideBoxContent(props) {
   const isCreateRcs = isCreate && channel === constants.RCS;
   const isCreateMPush = isCreate && channel === constants.MOBILE_PUSH;
   const isCreateCallTask = isCreate && channel === constants.CALL_TASK;
+  const isCreateWebPush = isCreate && channel === constants.WEBPUSH;
   let isEditSms = false;
   let isEditEmailWithId = false;
   let isEmailEditWithContent = false;
@@ -207,12 +213,14 @@ export function SlideBoxContent(props) {
   let isEmailPreview = false;
   let isMpushPreview = false;
   let isInappPreview = false;
+  let isWebPushPreview = false;
   let isEditCallTask = false;
   let isEditMPush = false;
   let isEditFacebook = false;
   let isEditFTP = false;
   let isEditWhatsapp = false;
   let isEditInApp = false;
+  let isEditWebPush = false;
   let isEditRcs = false;
   let isEditZalo = false;
   const isEmailCreate = isCreate && channel === constants.EMAIL;
@@ -226,10 +234,12 @@ export function SlideBoxContent(props) {
     isEditFacebook = isEdit && channel === constants.FACEBOOK;
     isEditWhatsapp = isEdit && channel === constants.WHATSAPP;
     isEditRcs = isEdit && channel === constants.RCS;
+    isEditWebPush = isEdit && channel === constants.WEBPUSH;
     isPreview = slidBoxContent === 'preview' && [constants.SMS, constants.LINE, constants.WHATSAPP, constants.FACEBOOK, constants.VIBER, constants.RCS].includes(channel);
     isEmailPreview = slidBoxContent === 'preview' && channel === constants.EMAIL;
     isMpushPreview = slidBoxContent === 'preview' && channel === constants.MOBILE_PUSH;
     isInappPreview = slidBoxContent === 'preview' && channel === constants.INAPP;
+    isWebPushPreview = slidBoxContent === 'preview' && channel === constants.WEBPUSH;
     isEditFTP = isEdit && [constants.NO_COMMUNICATION, constants.FTP].includes(channel);
     isEditZalo = isEdit && channel?.toUpperCase() === constants.ZALO;
     isEditInApp = isEdit && channel === constants.INAPP;
@@ -477,8 +487,30 @@ export function SlideBoxContent(props) {
           templateData={templateData}
           channel={channel}
           forwardedTags={forwardedTags}
-        />
+      />
       )}
+      {isWebPushPreview && (() => {
+        const webpushContent = get(templateData, WEBPUSH_TEMPLATE_PATHS.CONTENT, {});
+        const notificationTitle = webpushContent?.[WEBPUSH_CONTENT_FIELDS.TITLE] || '';
+        const notificationBody = webpushContent?.[WEBPUSH_CONTENT_FIELDS.MESSAGE] || '';
+        const imageSrc = webpushContent?.[WEBPUSH_CONTENT_FIELDS.IMAGE] || '';
+        const brandIconSrc = webpushContent?.[WEBPUSH_CONTENT_FIELDS.BRAND_ICON] || '';
+        // Extract URL from onClickAction or use empty string
+        const url = webpushContent?.[WEBPUSH_CONTENT_FIELDS.ON_CLICK_ACTION]?.url || '';
+        
+        return (
+          <div className="webpush-preview-container">
+            <DevicePreviewContent
+              notificationTitle={notificationTitle}
+              notificationBody={notificationBody}
+              url={url}
+              imageSrc={imageSrc}
+              brandIconSrc={brandIconSrc}
+              layoutMode={LAYOUT_MODE.COMPACT}
+            />
+          </div>
+        );
+      })()}
 
       {
         (currentChannel === constants.WECHAT && !!slidBoxContent) && <WechatWrapper
@@ -1014,6 +1046,28 @@ export function SlideBoxContent(props) {
       />
       )}
 
+      {(isCreateWebPush || isEditWebPush) && (
+        <WebPush
+          isFullMode={isFullMode}
+          handleClose={handleClose}
+          onCreateComplete={onCreateComplete}
+          getFormData={getFormData}
+          isGetFormData={isGetFormData}
+          templateData={isEditWebPush ? templateData : undefined}
+          creativesMode={creativesMode}
+          params={isEditWebPush && templateData ? { id: templateData._id } : undefined}
+          location={{
+            pathname: isEditWebPush ? '/webpush/edit' : '/webpush/create',
+            query,
+            search: '',
+          }}
+          getDefaultTags={type}
+          forwardedTags={forwardedTags}
+          supportedTags={supportedTags}
+          selectedOfferDetails={selectedOfferDetails}
+          eventContextTags={eventContextTags}
+        />
+      )}
       {isCreateRcs && (<Rcs
         {...rcsCommonProps}
         showLiquidErrorInFooter={showLiquidErrorInFooter}
@@ -1076,6 +1130,7 @@ SlideBoxContent.propTypes = {
   onValidationFail: PropTypes.func,
   channelsToHide: PropTypes.array,
   forwardedTags: PropTypes.object,
+  supportedTags: PropTypes.array,
   selectedOfferDetails: PropTypes.array,
   channelsToDisable: PropTypes.array,
   weChatTemplateType: PropTypes.string,
@@ -1091,7 +1146,7 @@ SlideBoxContent.propTypes = {
   onFTPSubmit: PropTypes.func,
   messageStrategy: PropTypes.string,
   fbAdManager: PropTypes.string,
-  showDisabledFBInfo: PropTypes.boolean,
+  showDisabledFBInfo: PropTypes.bool,
   orgUnitId: PropTypes.any,
   smsRegister: PropTypes.any,
   getCmsTemplatesInProgress: PropTypes.bool,

package/v2Containers/CreativesContainer/SlideBoxHeader.js

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

package/v2Containers/CreativesContainer/constants.js

@@ -21,6 +21,8 @@ export const PUSH = "PUSH";
 export const RCS = "RCS";
 export const ZALO = "ZALO";
 export const INAPP = "INAPP";
+export const WEBPUSH = "WEBPUSH";
+export const WEBPUSH_BRAND_ICON = "WEBPUSH_BRAND_ICON";
 export const PREVIEW = "preview";
 export const EDIT_TEMPLATE = "editTemplate";
 export const JOURNEY = "journey";
@@ -48,3 +50,4 @@ export const BIG_TEXT = "BIG_TEXT";
 export const GENERIC = "GENERIC";
 export const LIQUID_ERROR_MSG = "LIQUID_ERROR_MSG";
 export const STANDARD_ERROR_MSG = "STANDARD_ERROR_MSG";
+export const COMMON_CHANNELS = ['sms', 'email', 'wechat', 'mobilepush', 'webpush', 'line', 'viber', 'facebook', 'call_task', 'ftp', 'assets'];

package/v2Containers/CreativesContainer/index.js

@@ -42,6 +42,7 @@ import { makeSelectFetchingCmsData } from '../Email/selectors';
 import {
   IMAGE as LINE_IMAGE, IMAGE_MAP, IMAGE_CAROUSEL, VIDEO as LINE_VIDEO, TEMPLATE, STICKER,
 } from '../Line/Container/constants';
+import {EXTERNAL_URL, SITE_URL, WEBPUSH_MEDIA_TYPES} from '../WebPush/constants';
 import { IMAGE, VIDEO } from '../Facebook/Advertisement/constant';
 import {RCS_STATUSES} from '../Rcs/constants';
 import { CREATIVE } from '../Facebook/constants';
@@ -708,6 +709,73 @@ export class Creatives extends React.Component {
           };
           break;
         }
+        case constants.WEBPUSH: {
+          // Convert from campaign format (messageContent.content.content) to creatives format
+          const webpushContent = get(templateData, 'content', {});
+          const accountId = get(templateData, 'accountId');
+          const { 
+            title, 
+            message, 
+            iconImageUrl: brandIcon = "", 
+            cta, 
+            expandableDetails 
+          } = webpushContent || {};
+          
+          // Map cta to onClickAction
+          let onClickAction = null;
+          if (cta) {
+            if (cta?.type === EXTERNAL_URL) {
+              onClickAction = {
+                type: URL,
+                url: cta?.actionLink || '',
+              };
+            } else {
+              onClickAction = {
+                type: cta?.type || SITE_URL,
+              };
+            }
+          }
+          
+          // Map expandableDetails.ctas to ctas array
+          let ctas = [];
+          if (expandableDetails?.ctas && expandableDetails?.ctas?.length > 0) {
+            ctas = expandableDetails?.ctas?.map((ctaItem) => ({
+              actionText: ctaItem?.title || ctaItem?.actionText || '',
+              type: URL,
+              actionLink: ctaItem?.actionLink || '',
+            }));
+          }
+          
+          // Map expandableDetails.media to image if present
+          let image = null;
+          if (expandableDetails?.media && expandableDetails?.media?.length > 0) {
+            const firstMedia = expandableDetails?.media[0];
+            if (firstMedia?.type === WEBPUSH_MEDIA_TYPES.IMAGE && firstMedia?.url) {
+              image = firstMedia?.url;
+            }
+          }
+          
+          creativesTemplateData = {
+            type: channel,
+            name: templateData?.messageSubject,
+            versions: {
+              base: {
+                content: {
+                  webpush: {
+                    title: title || '',
+                    message: message || '',
+                    ...(brandIcon && { brandIcon }),
+                    ...(onClickAction && { onClickAction }),
+                    ...(ctas.length > 0 && { ctas }),
+                    ...(image && { image, mediaType: IMAGE }),
+                  },
+                },
+              },
+            },
+            definition: { accountId },
+          };
+          break;
+        }
         default:
           break;
       }
@@ -1122,6 +1190,105 @@ export class Creatives extends React.Component {
         }
       }
         break;
+      case constants.WEBPUSH: {
+        if (template.value) {
+          const channelTemplate = template.value;
+          const accountId = get(channelTemplate, 'definition.accountId');
+          const webpushContent = get(channelTemplate, 'versions.base.content.webpush', {});
+          const { 
+            title, 
+            message, 
+            brandIcon, 
+            iconImageUrl: templateImageUrl , 
+            onClickAction, 
+            ctas: templateCtas, 
+            cta: templateCta, 
+            expandableDetails: templateExpandableDetails, 
+            image 
+          } = webpushContent || {};
+          
+          const iconImageUrl = brandIcon || templateImageUrl || '';
+          
+          // Map onClickAction to cta
+          let cta = null;
+          if (onClickAction) {
+            if (onClickAction?.type === URL) {
+              cta = {
+                type: EXTERNAL_URL,
+                actionLink: onClickAction?.url || '',
+              };
+            } else {
+              cta = {
+                type: onClickAction?.type || SITE_URL,
+                actionLink: onClickAction?.url || '',
+              };
+            }
+          } else if (templateCta) {
+            // Fallback to cta if onClickAction is not present
+            cta = {
+              type: templateCta?.type || EXTERNAL_URL,
+              actionLink: templateCta?.actionLink || '',
+            };
+          }
+          
+          // Map ctas array to expandableDetails.ctas
+          let expandableDetails = null;
+          const hasCtas = templateCtas && templateCtas.length > 0;
+          const hasImage = image;
+          
+          if (hasCtas || hasImage) {
+            expandableDetails = {
+              media: [],
+              ctas: [],
+            };
+            
+            // Map image to expandableDetails.media
+            if (hasImage) {
+              expandableDetails.media = [{
+                url: image,
+                type: IMAGE,
+              }];
+            }
+            
+            // Map ctas array to expandableDetails.ctas
+            if (hasCtas) {
+              expandableDetails.ctas = templateCtas.map((ctaItem) => ({
+                type: ctaItem?.type === URL ? EXTERNAL_URL : ctaItem?.type,
+                action: ctaItem?.action || '',
+                title: ctaItem?.actionText || ctaItem?.title || '',
+                actionLink: ctaItem?.actionLink || '',
+              }));
+            }
+          } else if (templateExpandableDetails) {
+            // If expandableDetails already exists, use it
+            expandableDetails = {
+              media: templateExpandableDetails?.media || [],
+              ctas: templateExpandableDetails?.ctas || [],
+            };
+          }
+          
+          // Convert from creatives format to campaign format
+          templateData = {
+            channel,
+            messageContent: {
+              content: {
+                channel: constants.WEBPUSH,
+                accountId,
+                content: {
+                  title: title || '',
+                  message: message || '',
+                  ...(iconImageUrl && { iconImageUrl }),
+                  ...(cta && { cta }),
+                  ...(expandableDetails && { expandableDetails }),
+                },
+                messageSubject: channelTemplate?.name ? channelTemplate.name : 'messageSubject',
+                offers: [],
+              },
+            },
+          };
+        }
+        break;
+      }
       default:
         break;
     }
@@ -1173,6 +1340,7 @@ export class Creatives extends React.Component {
       case constants.SMS:
       case constants.WECHAT:
       case constants.VIBER:
+      case constants.WEBPUSH:
         break;
       case constants.EMAIL:
         gtmDetails = {

package/v2Containers/CreativesContainer/messages.js

@@ -338,6 +338,10 @@ export default defineMessages({
     id: `${scope}.rcsCreative`,
     defaultMessage: `RCS creative`,
   },
+  "webPushTemplate": {
+    id: `${scope}.webPushTemplate`,
+    defaultMessage: `Web Push Template`,
+  },
   "templateNameEmpty": {
     id: `${scope}.templateNameEmpty`,
     defaultMessage: `Template name cannot be empty`