@capillarytech/creatives-library 8.0.87-alpha.21 → 8.0.87-alpha.22

package/v2Containers/EmailWrapper/tests/useEmailWrapper.test.js

@@ -0,0 +1,601 @@
+import React from 'react';
+import useEmailWrapper from '../hooks/useEmailWrapper';
+import { EmailWrapperMockData } from '../mockdata/mockdata';
+import _, { isEmpty, find } from 'lodash';
+import { renderHook, waitFor, act as reactAct } from '@testing-library/react';
+import { EMAIL_CREATE_MODES, STEPS } from '../constants';
+import { GA } from '@capillarytech/cap-ui-utils';
+import { gtmPush } from '../../../utils/gtmTrackers';
+
+// Mock dependencies
+jest.mock('lodash', () => ({
+  ...jest.requireActual('lodash'),
+  isEmpty: jest.fn().mockImplementation(val => {
+    if (val === null || val === undefined) return true;
+    if (typeof val === 'object') return Object.keys(val).length === 0;
+    if (typeof val === 'string') return val.trim().length === 0;
+    return !val;
+  }),
+  find: jest.fn(),
+}));
+
+let mockCapNotificationError;
+jest.mock('@capillarytech/cap-ui-library/CapNotification', () => {
+  mockCapNotificationError = jest.fn();
+  return {
+    error: mockCapNotificationError,
+  };
+});
+
+jest.mock('../../../utils/gtmTrackers', () => ({
+  gtmPush: jest.fn(),
+}));
+
+const mockStopTimer = jest.fn();
+
+jest.mock('@capillarytech/cap-ui-utils', () => ({
+  ...jest.requireActual('@capillarytech/cap-ui-utils'),
+  GA: {
+    timeTracker: {
+      startTimer: jest.fn(),
+      stopTimer: jest.fn(),
+    }
+  }
+}));
+
+describe('useEmailWrapper', () => {
+  let mockProps;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    isEmpty.mockClear();
+    find.mockClear();
+    mockCapNotificationError.mockClear();
+    gtmPush.mockClear();
+    mockStopTimer.mockClear();
+
+    isEmpty.mockImplementation(val => {
+        if (val === null || val === undefined) return true;
+        if (typeof val === 'object') return Object.keys(val).length === 0;
+        if (typeof val === 'string') return val.trim().length === 0;
+        return !val;
+     });
+
+    mockProps = {
+      ...EmailWrapperMockData,
+      intl: { formatMessage: jest.fn((msg) => msg.defaultMessage || msg.id || '') },
+      onEmailModeChange: jest.fn(),
+      showNextStep: jest.fn(),
+      onResetStep: jest.fn(),
+      onEnterTemplateName: jest.fn(),
+      onRemoveTemplateName: jest.fn(),
+      templatesActions: {
+        resetTemplateData: jest.fn(),
+        getDefaultBeeTemplates: jest.fn(),
+        handleZipUpload: jest.fn(),
+        handleHtmlUpload: jest.fn(),
+        setEdmTemplate: jest.fn(),
+        setBEETemplate: jest.fn(),
+      },
+      EmailLayout: null,
+      CmsTemplates: null,
+      SelectedEdmDefaultTemplate: null,
+      isUploading: false,
+      getCmsTemplatesInProgress: false,
+      step: STEPS.MODE_SELECTION,
+      emailCreateMode: '',
+      setIsLoadingContent: jest.fn(),
+      isGetFormData: false,
+      getFormdata: jest.fn(),
+      type: 'someType',
+      isFullMode: false,
+      cap: { currentOrgDetails: { id: 'org1' } },
+      showTemplateName: true,
+      showLiquidErrorInFooter: false,
+      onValidationFail: jest.fn(),
+      forwardedTags: [],
+      selectedOfferDetails: null,
+      onPreviewContentClicked: jest.fn(),
+      onTestContentClicked: jest.fn(),
+      editor: null,
+      moduleType: '',
+      eventContextTags: [],
+      isLoyaltyModule: false,
+      cmsTemplatesLoader: false,
+      currentOrgDetails: { id: 'org1' },
+    };
+  });
+
+  it('is a function', () => {
+    expect(typeof useEmailWrapper).toBe('function');
+  });
+
+  it('initializes with correct default state', () => {
+    const { result } = renderHook(() => useEmailWrapper(mockProps));
+
+    expect(result.current.templateName).toBeDefined();
+    expect(result.current.modes).toBeDefined();
+    expect(result.current.onTemplateNameChange).toBeInstanceOf(Function);
+  });
+
+  it('handles template name change correctly', () => {
+    const { result } = renderHook(() => useEmailWrapper(mockProps));
+
+    reactAct(() => {
+      result.current.onTemplateNameChange({ target: { value: 'New Template' } });
+    });
+
+    expect(result.current.templateName).toBe('New Template');
+    expect(result.current.isTemplateNameEmpty).toBe(false);
+    expect(mockProps.onEnterTemplateName).toHaveBeenCalled();
+  });
+
+  it('detects empty template name correctly', () => {
+    const { result } = renderHook(() => useEmailWrapper(mockProps));
+
+    reactAct(() => {
+      result.current.onTemplateNameChange({ target: { value: '' } });
+    });
+
+    expect(result.current.templateName).toBe('');
+    expect(result.current.isTemplateNameEmpty).toBe(true);
+    expect(mockProps.onRemoveTemplateName).toHaveBeenCalled();
+  });
+
+  it('handles mode change correctly', () => {
+    const { result } = renderHook(() => useEmailWrapper(mockProps));
+
+    reactAct(() => {
+      result.current.onChange({ target: { value: EMAIL_CREATE_MODES.UPLOAD } });
+    });
+
+    expect(mockProps.onEmailModeChange).toHaveBeenCalledWith(EMAIL_CREATE_MODES.UPLOAD);
+  });
+
+  it('handles zip file upload correctly and calls success callbacks', () => {
+    const successCallback = mockProps.showNextStep;
+    const errorCallback = jest.fn();
+
+    mockProps.templatesActions.handleZipUpload.mockImplementation((file, onSuccess, onError) => {
+      onSuccess();
+    });
+
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false,
+    }));
+
+    const mockFile = {
+      name: 'test.zip',
+      size: 1024 * 1024,
+      originFileObj: new Blob(['test data'], { type: 'application/zip' })
+    };
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: mockFile });
+    });
+
+    expect(mockProps.templatesActions.handleZipUpload).toHaveBeenCalledWith(
+      mockFile.originFileObj,
+      expect.any(Function),
+      expect.any(Function)
+    );
+
+    // expect(mockStopTimer).toHaveBeenCalled();
+    expect(gtmPush).toHaveBeenCalled();
+    expect(successCallback).toHaveBeenCalled();
+    expect(mockCapNotificationError).not.toHaveBeenCalled();
+    expect(result.current.modeContent).toEqual({ file: mockFile });
+  });
+
+  it('handles zip file upload error correctly', () => {
+    mockProps.templatesActions.handleZipUpload.mockImplementation((file, onSuccess, onError) => {
+      onError();
+    });
+
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false,
+    }));
+
+    const mockFile = {
+      name: 'test.zip',
+      size: 1024 * 1024,
+      originFileObj: new Blob(['test data'], { type: 'application/zip' })
+    };
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: mockFile });
+    });
+
+    expect(mockProps.templatesActions.handleZipUpload).toHaveBeenCalled();
+    expect(mockCapNotificationError).toHaveBeenCalled();
+    expect(mockProps.showNextStep).not.toHaveBeenCalled();
+  });
+
+  it('handles HTML file upload correctly', async () => {
+    const mockHtmlContent = '<html><body>Test</body></html>';
+    const mockFile = {
+      name: 'test.html',
+      size: 1024,
+      originFileObj: new Blob([mockHtmlContent], { type: 'text/html' })
+    };
+
+    const mockReader = {
+      onload: null,
+      onerror: null,
+      readAsText: jest.fn(function() {
+        this.result = mockHtmlContent;
+        if (this.onload) {
+          this.onload();
+        }
+      }),
+      result: '',
+    };
+    const fileReaderSpy = jest.spyOn(global, 'FileReader').mockImplementation(() => mockReader);
+
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false,
+    }));
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: mockFile });
+    });
+
+    await waitFor(() => {
+      expect(mockReader.readAsText).toHaveBeenCalledWith(mockFile.originFileObj);
+      expect(mockProps.templatesActions.handleHtmlUpload).toHaveBeenCalledWith(mockHtmlContent);
+    });
+
+    expect(result.current.modeContent).toEqual({ file: mockFile });
+    expect(mockCapNotificationError).not.toHaveBeenCalled();
+
+    fileReaderSpy.mockRestore();
+  });
+
+  it('shows error for invalid file type during upload', () => {
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false
+    }));
+
+    const mockFile = {
+      name: 'test.txt',
+      size: 1024,
+      originFileObj: new Blob(['test data'], { type: 'text/plain' })
+    };
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: mockFile });
+    });
+
+    expect(mockCapNotificationError).toHaveBeenCalledWith(expect.objectContaining({
+      key: "email-upload-error",
+    }));
+    expect(mockProps.templatesActions.handleZipUpload).not.toHaveBeenCalled();
+    expect(mockProps.templatesActions.handleHtmlUpload).not.toHaveBeenCalled();
+  });
+
+  it('shows error for oversized file during upload', () => {
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false
+    }));
+
+    const mockFile = {
+      name: 'large_file.zip',
+      size: 6 * 1024 * 1024,
+      originFileObj: new Blob(['large data'], { type: 'application/zip' })
+    };
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: mockFile });
+    });
+
+    expect(mockCapNotificationError).toHaveBeenCalledWith(expect.objectContaining({
+       key: "email-upload-error",
+    }));
+    expect(mockProps.templatesActions.handleZipUpload).not.toHaveBeenCalled();
+  });
+
+  it('shows error if no file or originFileObj is provided for upload', () => {
+    const { result } = renderHook(() => useEmailWrapper({
+      ...mockProps,
+      isUploading: false
+    }));
+
+    reactAct(() => {
+      result.current.useFileUpload({ file: null });
+    });
+    expect(mockCapNotificationError).toHaveBeenCalledTimes(1);
+    expect(mockCapNotificationError).toHaveBeenCalledWith(expect.objectContaining({ key: "email-upload-error"}));
+
+    mockCapNotificationError.mockClear();
+    reactAct(() => {
+       result.current.useFileUpload({ file: { name: 'test.zip', size: 100 } });
+    });
+    expect(mockCapNotificationError).toHaveBeenCalledTimes(1);
+    expect(mockCapNotificationError).toHaveBeenCalledWith(expect.objectContaining({ key: "email-upload-error"}));
+
+    expect(mockProps.templatesActions.handleZipUpload).not.toHaveBeenCalled();
+    expect(mockProps.templatesActions.handleHtmlUpload).not.toHaveBeenCalled();
+  });
+
+  it('calls showNextStep when useEditor is invoked', () => {
+    const { result } = renderHook(() => useEmailWrapper(mockProps));
+    const templateId = 'template123';
+
+    reactAct(() => {
+      result.current.cmsTemplatesProps.handleEdmDefaultTemplateSelection(templateId);
+    });
+
+    expect(result.current.modeContent).toEqual({ id: templateId });
+    expect(mockProps.showNextStep).toHaveBeenCalled();
+  });
+
+  it('calls getDefaultBeeTemplates in useEffect when in EDITOR mode, TEMPLATE_SELECTION step, and no templates', () => {
+    renderHook(() => useEmailWrapper({
+      ...mockProps,
+      step: STEPS.TEMPLATE_SELECTION,
+      emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+      CmsTemplates: null,
+      getCmsTemplatesInProgress: false,
+    }));
+
+    expect(mockProps.templatesActions.getDefaultBeeTemplates).toHaveBeenCalledTimes(1);
+  });
+
+  it('does NOT call getDefaultBeeTemplates if templates already exist or are loading', () => {
+    renderHook(() => useEmailWrapper({
+      ...mockProps,
+      step: STEPS.TEMPLATE_SELECTION,
+      emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+      CmsTemplates: [{ _id: '1', name: 'Test Template' }],
+      getCmsTemplatesInProgress: false,
+    }));
+    expect(mockProps.templatesActions.getDefaultBeeTemplates).not.toHaveBeenCalled();
+
+    renderHook(() => useEmailWrapper({
+      ...mockProps,
+      step: STEPS.TEMPLATE_SELECTION,
+      emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+      CmsTemplates: null,
+      getCmsTemplatesInProgress: true,
+    }));
+    expect(mockProps.templatesActions.getDefaultBeeTemplates).not.toHaveBeenCalled();
+  });
+
+  it('calls setEdmTemplate/setBEETemplate in useEffect when in EDITOR mode and CREATE_TEMPLATE_CONTENT step', async () => {
+    // 1. Setup
+    const templateId = 'editorTemplate456';
+    const mockTemplateData = { _id: templateId, name: 'Selected Editor Template' };
+
+    // Ensure mocks are clean from previous tests
+    find.mockClear();
+    isEmpty.mockClear();
+    mockProps.templatesActions.setEdmTemplate.mockClear();
+    mockProps.templatesActions.setBEETemplate.mockClear();
+    mockProps.showNextStep.mockClear();
+
+    // 2. Mock find (this will be called by the *internal* handleEdmDefaultTemplateSelection)
+    find.mockImplementation((array, criteria) => {
+      // console.log('DEBUG: find called with', JSON.stringify(array), JSON.stringify(criteria)); // Optional debug
+      if (array && criteria && criteria._id === templateId && array[0]?._id === templateId) {
+        return mockTemplateData;
+      }
+      return null;
+    });
+
+    // 3. Initial Render (Template Selection Step)
+    const initialProps = {
+      ...mockProps,
+      step: STEPS.TEMPLATE_SELECTION,
+      emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+      CmsTemplates: [mockTemplateData],
+      SelectedEdmDefaultTemplate: null,
+      // selectedCreateMode is initially '' from hook's useState
+    };
+    const { result, rerender } = renderHook((props) => useEmailWrapper(props), {
+        initialProps: initialProps
+    });
+
+    // 4. Simulate user selecting a template ID via the exposed callback (useEditor)
+    reactAct(() => {
+      // This maps to useEditor which calls setModeContent and showNextStep
+      result.current.cmsTemplatesProps.handleEdmDefaultTemplateSelection(templateId);
+    });
+    // Verify internal state updated and mock called
+    expect(result.current.modeContent).toEqual({ id: templateId }); // State updated
+    expect(mockProps.showNextStep).toHaveBeenCalledTimes(1); // User action effect
+
+    // 5. Rerender with step changed to CREATE_TEMPLATE_CONTENT
+    const createContentProps = {
+      ...initialProps, // Base props
+      step: STEPS.CREATE_TEMPLATE_CONTENT, // *** Change step ***
+      SelectedEdmDefaultTemplate: null // *** Ensure this is null ***
+      // The internal state `modeContent = { id: templateId }` persists
+      // The internal state `selectedCreateMode = ''` also persists (not changed yet)
+    };
+
+    // Mock isEmpty just before rerender for the specific check inside the effect
+    isEmpty.mockImplementation(val => {
+      // console.log('DEBUG: isEmpty called with', JSON.stringify(val)); // Optional debug
+      // Return true ONLY for the 'SelectedEdmDefaultTemplate' check (which is null)
+      if (val === null) return true;
+      // Provide a fallback for other potential isEmpty calls if needed
+      if (typeof val === 'object' && !val) return true;
+      if (typeof val === 'object' && Object.keys(val).length === 0) return true;
+      if (typeof val === 'string' && val.trim().length === 0) return true;
+      return !val;
+    });
+
+    rerender(createContentProps);
+
+    // 6. Wait for effects triggered by the rerender
+    await reactAct(async () => {
+      // Short pause allows React's scheduler to run effects
+      await new Promise(resolve => setTimeout(resolve, 0));
+    });
+
+
+    // Assert that the template setting actions were called as a result of the effect
+    expect(mockProps.templatesActions.setEdmTemplate).toHaveBeenCalledTimes(1);
+    expect(mockProps.templatesActions.setEdmTemplate).toHaveBeenCalledWith(mockTemplateData);
+    expect(mockProps.templatesActions.setBEETemplate).toHaveBeenCalledTimes(1);
+    expect(mockProps.templatesActions.setBEETemplate).toHaveBeenCalledWith(mockTemplateData);
+  });
+
+  it('sets selectedCreateMode in useEffect when in UPLOAD mode and CREATE_TEMPLATE_CONTENT step with EmailLayout', async () => {
+    const initialRenderProps = {
+        ...mockProps,
+        step: STEPS.MODE_SELECTION,
+        emailCreateMode: EMAIL_CREATE_MODES.UPLOAD,
+        EmailLayout: null,
+      };
+
+    const { result, rerender } = renderHook((props) => useEmailWrapper(props), {
+      initialProps: initialRenderProps
+    });
+
+    const rerenderProps = {
+      ...mockProps,
+      step: STEPS.CREATE_TEMPLATE_CONTENT,
+      emailCreateMode: EMAIL_CREATE_MODES.UPLOAD,
+      EmailLayout: { html: '<p>Test Layout</p>' },
+    };
+
+    // Reset isEmpty to default before setting the specific mock for the effect
+    isEmpty.mockImplementation((val) => {
+        if (val === null || val === undefined) return true;
+        if (typeof val === 'object') return Object.keys(val).length === 0;
+        if (typeof val === 'string') return val.trim().length === 0;
+        return !val;
+     });
+    // Mock isEmpty specifically for the EmailLayout check inside the useEffect
+    isEmpty.mockImplementationOnce(() => false); // Mock !isEmpty(EmailLayout) to be true
+
+    rerender(rerenderProps);
+
+    // Wait for the effect to run, set selectedCreateMode, and isShowEmailCreate to update
+    await waitFor(() => {
+        expect(result.current.isShowEmailCreate).toBe(true);
+    });
+
+    // Restore default isEmpty behavior after the specific mock is used
+    isEmpty.mockImplementation((val) => {
+        if (val === null || val === undefined) return true;
+        if (typeof val === 'object') return Object.keys(val).length === 0;
+        if (typeof val === 'string') return val.trim().length === 0;
+        return !val;
+     });
+    isEmpty.mockClear(); // Clear any remaining mock state if needed
+
+    expect(mockProps.templatesActions.setEdmTemplate).not.toHaveBeenCalled();
+    expect(mockProps.templatesActions.setBEETemplate).not.toHaveBeenCalled();
+  });
+
+  it('calls cleanup functions on unmount', () => {
+    const { unmount } = renderHook(() => useEmailWrapper(mockProps));
+
+    unmount();
+
+    expect(mockProps.onResetStep).toHaveBeenCalled();
+    expect(mockProps.templatesActions.resetTemplateData).toHaveBeenCalled();
+  });
+
+  it('correctly computes isShowEmailCreate based on state transitions', async () => {
+    // --- Case 1: Initial state -> false ---
+    const initialPropsCase1 = {
+      ...mockProps,
+      step: STEPS.MODE_SELECTION,
+      emailCreateMode: '',
+      EmailLayout: null,
+      SelectedEdmDefaultTemplate: null,
+    };
+    // Mock isEmpty for initial render checks if needed (though selectedCreateMode is the main driver)
+    isEmpty.mockReturnValue(true); // General mock for empty things
+
+    const { result, rerender } = renderHook((props) => useEmailWrapper(props), {
+      initialProps: initialPropsCase1,
+    });
+    expect(result.current.isShowEmailCreate).toBe(false);
+    isEmpty.mockClear(); // Clear general mock
+
+    // --- Case 2: UPLOAD mode selected, Layout available -> true ---
+    const uploadProps = {
+      ...mockProps,
+      step: STEPS.CREATE_TEMPLATE_CONTENT,
+      emailCreateMode: EMAIL_CREATE_MODES.UPLOAD,
+      EmailLayout: { html: '<p>Test</p>' }, // Layout is present
+      SelectedEdmDefaultTemplate: null,
+    };
+
+    // Reset isEmpty to default before setting the specific mock for the effect
+    isEmpty.mockImplementation((val) => {
+        if (val === null || val === undefined) return true;
+        if (typeof val === 'object') return Object.keys(val).length === 0;
+        if (typeof val === 'string') return val.trim().length === 0;
+        return !val;
+     });
+    // Mock isEmpty specifically for the EmailLayout check inside the useEffect
+    isEmpty.mockImplementationOnce(() => false); // Mock !isEmpty(EmailLayout) to be true
+
+    rerender(uploadProps);
+
+    // Wait for the effect to run, set selectedCreateMode, and isShowEmailCreate to update
+    await waitFor(() => {
+        expect(result.current.isShowEmailCreate).toBe(true);
+    });
+
+    // Restore default isEmpty behavior after the specific mock is used
+    isEmpty.mockImplementation((val) => {
+        if (val === null || val === undefined) return true;
+        if (typeof val === 'object') return Object.keys(val).length === 0;
+        if (typeof val === 'string') return val.trim().length === 0;
+        return !val;
+     });
+    isEmpty.mockClear(); // Clear any remaining mock state if needed
+
+    // --- Case 3: EDITOR mode selected, Template becomes available -> true (via effect) ---
+    const templateId = 't1';
+    const mockTemplate = { _id: templateId };
+    find.mockReturnValue(mockTemplate); // Ensure find is mocked for this case
+
+    const editorPropsInitial = {
+        ...mockProps,
+        step: STEPS.TEMPLATE_SELECTION,
+        emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+        CmsTemplates: [mockTemplate],
+        SelectedEdmDefaultTemplate: null,
+    };
+    rerender(editorPropsInitial);
+
+    // Simulate selecting the template via the exposed handler
+    reactAct(() => {
+      result.current.cmsTemplatesProps.handleEdmDefaultTemplateSelection(templateId);
+    });
+    // Verify modeContent was updated internally by the act above
+    expect(result.current.modeContent).toEqual({ id: templateId });
+
+    const editorPropsFinal = {
+        ...mockProps, // Use fresh props base
+        step: STEPS.CREATE_TEMPLATE_CONTENT, // Move to the create step
+        emailCreateMode: EMAIL_CREATE_MODES.EDITOR,
+        CmsTemplates: [mockTemplate],
+        SelectedEdmDefaultTemplate: null, // Template not yet selected in props
+        // modeContent state ({id: templateId}) should persist internally from the reactAct call
+    };
+
+    // Mock isEmpty specifically for the check within the useEffect triggered by rerender
+    // It should return true for SelectedEdmDefaultTemplate to proceed
+    isEmpty.mockImplementation((arg) => arg === null || arg === undefined || Object.keys(arg).length === 0); // General implementation first
+    isEmpty.mockImplementationOnce(() => true); // Mock the specific check for SelectedEdmDefaultTemplate
+
+    rerender(editorPropsFinal);
+
+    // Cleanup mocks if necessary for subsequent tests (though beforeEach should handle)
+    find.mockClear();
+    isEmpty.mockClear();
+  });
+});

package/v2Containers/MobilePush/Edit/index.js

@@ -1991,7 +1991,6 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                 hideTestAndPreviewBtn={this.props.hideTestAndPreviewBtn}
                 isFullMode={this.props.isFullMode}
                 eventContextTags={this.props?.eventContextTags}
-                messageDetails={this.props?.messageDetails}
               />}
             </CapColumn>
             {this.props.iosCtasData && this.state.showIosCtaTable &&

package/v2Containers/MobilepushWrapper/index.js

@@ -72,7 +72,7 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
   }
 
   render() {
-    const {mobilePushCreateMode, step, getFormData, setIsLoadingContent, isGetFormData, query, isFullMode, showTemplateName, type, onValidationFail, onPreviewContentClicked, onTestContentClicked, templateData, eventContextTags = [], messageDetails = {}} = this.props;
+    const {mobilePushCreateMode, step, getFormData, setIsLoadingContent, isGetFormData, query, isFullMode, showTemplateName, type, onValidationFail, onPreviewContentClicked, onTestContentClicked, templateData, eventContextTags = []} = this.props;
     const {templateName} = this.state;
     const isShowMobilepushCreate = !isEmpty(mobilePushCreateMode);
     return (
@@ -120,7 +120,6 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
               templateData={templateData}
               hideTestAndPreviewBtn={this.props.hideTestAndPreviewBtn}
               eventContextTags={eventContextTags}
-              messageDetails={messageDetails}
           />
 
 

package/v2Containers/Sms/Create/index.js

@@ -994,7 +994,6 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
                 onTestContentClicked={this.props.onTestContentClicked}
                 onPreviewContentClicked={this.props.onPreviewContentClicked}
                 eventContextTags={this.props?.eventContextTags}
-                messageDetails={this.props?.messageDetails}
               />
             </CapColumn>
           </CapRow>

package/v2Containers/SmsWrapper/index.js

@@ -30,7 +30,6 @@ const SmsWrapper = (props) => {
     smsRegister,
     onShowTemplates,
     eventContextTags,
-    messageDetails = {},
   } = props;
 
   const smsProps = {
@@ -47,7 +46,6 @@ const SmsWrapper = (props) => {
     onPreviewContentClicked,
     onTestContentClicked,
     eventContextTags,
-    messageDetails,
   };
   const isTraiDlt = isTraiDLTEnable(isFullMode, smsRegister);
   return <>