@capillarytech/creatives-library 8.0.242-alpha.0 → 8.0.242-alpha.10

package/v2Containers/InApp/__tests__/sagas.test.js

@@ -0,0 +1,363 @@
+/**
+ * InApp Sagas Tests
+ *
+ * Tests for InApp sagas including HTML content create/edit flows
+ */
+
+import { call, put } from 'redux-saga/effects';
+import * as Api from '../../../services/api';
+import {
+  inAppTemplateCreate,
+  editTemplate,
+  getTemplateDetails,
+  uploadInAppAsset,
+} from '../sagas';
+import {
+  INAPP_TEMPLATE_CREATE_SUCCESS,
+  INAPP_TEMPLATE_CREATE_FAILURE,
+  INAPP_EDIT_TEMPLATE_SUCCESS,
+  INAPP_EDIT_TEMPLATE_FAILURE,
+  GET_INAPP_TEMPLATE_DETAILS_SUCCESS,
+  GET_INAPP_TEMPLATE_DETAILS_FAILURE,
+  UPLOAD_INAPP_ASSET_SUCCESS,
+  UPLOAD_INAPP_ASSET_FAILURE,
+} from '../constants';
+import { INAPP } from '../../CreativesContainer/constants';
+
+describe('InApp Sagas', () => {
+  describe('inAppTemplateCreate', () => {
+    const payload = {
+      name: 'Test Template',
+      versions: {
+        base: {
+          content: {
+            ANDROID: {
+              title: 'Android Title',
+              message: '<p>Android HTML Content</p>',
+              bodyType: 'MODAL',
+            },
+            IOS: {
+              title: 'iOS Title',
+              message: '<p>iOS HTML Content</p>',
+              bodyType: 'MODAL',
+            },
+          },
+        },
+      },
+      type: INAPP,
+    };
+
+    test('creates template successfully with HTML content', () => {
+      const generator = inAppTemplateCreate({
+        payload,
+        callback: jest.fn(),
+      });
+
+      const mockResponse = {
+        response: {
+          id: 'template-123',
+          name: 'Test Template',
+        },
+        status: {
+          code: 201,
+        },
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.createChannelWiseTemplate, { channel: INAPP, template: payload })
+      );
+
+      expect(generator.next(mockResponse).value).toEqual(
+        put({
+          type: INAPP_TEMPLATE_CREATE_SUCCESS,
+          data: mockResponse.response,
+          statusCode: 201,
+          errorMsg: undefined,
+        })
+      );
+
+      const callback = generator.next().value;
+      expect(callback).toBeUndefined(); // Callback is called but not yielded
+
+      expect(generator.next().done).toBe(true);
+    });
+
+    test('handles API error when creating template', () => {
+      const generator = inAppTemplateCreate({
+        payload,
+        callback: jest.fn(),
+      });
+
+      const mockError = {
+        response: null,
+        status: {
+          code: 400,
+        },
+        message: 'Validation error',
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.createChannelWiseTemplate, { channel: INAPP, template: payload })
+      );
+
+      expect(generator.next(mockError).value).toEqual(
+        put({
+          type: INAPP_TEMPLATE_CREATE_FAILURE,
+          error: 'Validation error',
+          errorMsg: 'Validation error',
+        })
+      );
+
+      const callback = generator.next().value;
+      expect(callback).toBeUndefined();
+
+      expect(generator.next().done).toBe(true);
+    });
+
+    test('handles exception during template creation', () => {
+      const generator = inAppTemplateCreate({
+        payload,
+        callback: jest.fn(),
+      });
+
+      const error = new Error('Network error');
+
+      expect(generator.next().value).toEqual(
+        call(Api.createChannelWiseTemplate, { channel: INAPP, template: payload })
+      );
+
+      expect(generator.throw(error).value).toEqual(
+        put({
+          type: INAPP_TEMPLATE_CREATE_FAILURE,
+          error,
+          errorMsg: undefined,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+  });
+
+  describe('editTemplate', () => {
+    const payload = {
+      _id: 'template-123',
+      name: 'Updated Template',
+      versions: {
+        base: {
+          content: {
+            ANDROID: {
+              title: 'Updated Android Title',
+              message: '<p>Updated Android HTML</p>',
+              bodyType: 'MODAL',
+            },
+            IOS: {
+              title: 'Updated iOS Title',
+              message: '<p>Updated iOS HTML</p>',
+              bodyType: 'MODAL',
+            },
+          },
+        },
+      },
+      type: INAPP,
+    };
+
+    test('edits template successfully with HTML content', () => {
+      const generator = editTemplate({
+        payload,
+        callback: jest.fn(),
+      });
+
+      const mockResponse = {
+        response: {
+          id: 'template-123',
+          name: 'Updated Template',
+        },
+        status: {
+          code: 200,
+        },
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.createChannelWiseTemplate, { channel: INAPP, template: payload })
+      );
+
+      expect(generator.next(mockResponse).value).toEqual(
+        put({
+          type: INAPP_EDIT_TEMPLATE_SUCCESS,
+          data: mockResponse.response,
+          statusCode: 200,
+          errorMsg: undefined,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+
+    test('handles API error when editing template', () => {
+      const generator = editTemplate({
+        payload,
+        callback: jest.fn(),
+      });
+
+      const mockError = {
+        response: null,
+        status: {
+          code: 404,
+        },
+        message: 'Template not found',
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.createChannelWiseTemplate, { channel: INAPP, template: payload })
+      );
+
+      expect(generator.next(mockError).value).toEqual(
+        put({
+          type: INAPP_EDIT_TEMPLATE_FAILURE,
+          error: 'Template not found',
+          errorMsg: 'Template not found',
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+  });
+
+  describe('getTemplateDetails', () => {
+    test('fetches template details successfully', () => {
+      const generator = getTemplateDetails({
+        id: 'template-123',
+        callback: jest.fn(),
+      });
+
+      const mockResponse = {
+        response: {
+          id: 'template-123',
+          name: 'Test Template',
+          versions: {
+            base: {
+              content: {
+                ANDROID: {
+                  title: 'Android Title',
+                  message: '<p>Android HTML Content</p>',
+                },
+                IOS: {
+                  title: 'iOS Title',
+                  message: '<p>iOS HTML Content</p>',
+                },
+              },
+            },
+          },
+        },
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.getTemplateDetails, {
+          id: 'template-123',
+          channel: INAPP,
+        })
+      );
+
+      expect(generator.next(mockResponse).value).toEqual(
+        put({
+          type: GET_INAPP_TEMPLATE_DETAILS_SUCCESS,
+          data: mockResponse.response,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+
+    test('handles error when fetching template details', () => {
+      const generator = getTemplateDetails({
+        id: 'template-123',
+        callback: jest.fn(),
+      });
+
+      const error = new Error('Not found');
+
+      expect(generator.next().value).toEqual(
+        call(Api.getTemplateDetails, {
+          id: 'template-123',
+          channel: INAPP,
+        })
+      );
+
+      expect(generator.throw(error).value).toEqual(
+        put({
+          type: GET_INAPP_TEMPLATE_DETAILS_FAILURE,
+          error,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+  });
+
+  describe('uploadInAppAsset', () => {
+    test('uploads asset successfully', () => {
+      const params = {
+        file: new File(['test'], 'test.jpg'),
+        assetType: 'image',
+        fileParams: {},
+        templateType: INAPP,
+      };
+
+      const generator = uploadInAppAsset(params);
+
+      const mockResponse = {
+        response: {
+          asset: {
+            url: 'https://cdn.example.com/image.jpg',
+            id: 'asset-123',
+          },
+        },
+        status: {
+          code: 200,
+        },
+      };
+
+      expect(generator.next().value).toEqual(
+        call(Api.uploadFile, params)
+      );
+
+      expect(generator.next(mockResponse).value).toEqual(
+        put({
+          type: UPLOAD_INAPP_ASSET_SUCCESS,
+          data: mockResponse.response.asset,
+          statusCode: 200,
+          templateType: INAPP,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+
+    test('handles error when uploading asset', () => {
+      const params = {
+        file: new File(['test'], 'test.jpg'),
+        assetType: 'image',
+        fileParams: {},
+        templateType: INAPP,
+      };
+
+      const generator = uploadInAppAsset(params);
+
+      const error = new Error('Upload failed');
+
+      expect(generator.next().value).toEqual(
+        call(Api.uploadFile, params)
+      );
+
+      expect(generator.throw(error).value).toEqual(
+        put({
+          type: UPLOAD_INAPP_ASSET_FAILURE,
+          error,
+        })
+      );
+
+      expect(generator.next().done).toBe(true);
+    });
+  });
+});
+

package/v2Containers/InApp/actions.js

@@ -7,6 +7,7 @@ import {
   UPLOAD_INAPP_ASSET_REQUEST,
   CLEAR_INAPP_ASSET,
   INAPP_EDIT_TEMPLATE_REQUEST,
+  GET_BEE_POPUP_BUILDER_TOKEN_REQUEST,
 } from "./constants";
 
 export function createInAppTemplate(payload, callback) {
@@ -62,3 +63,9 @@ export const clearInAppAsset = (templateType) => ({
   type: CLEAR_INAPP_ASSET,
   templateType,
 });
+
+export function getBeePopupBuilderToken() {
+  return {
+    type: GET_BEE_POPUP_BUILDER_TOKEN_REQUEST,
+  };
+}

package/v2Containers/InApp/constants.js

@@ -34,12 +34,18 @@ export const UPLOAD_INAPP_ASSET_SUCCESS = `${prefix}/UPLOAD_INAPP_ASSET_SUCCESS`
 export const UPLOAD_INAPP_ASSET_FAILURE = `${prefix}/UPLOAD_INAPP_ASSET_FAILURE`;
 export const CLEAR_INAPP_ASSET = `${prefix}/CLEAR_INAPP_ASSET`;
 
+export const GET_BEE_POPUP_BUILDER_TOKEN_REQUEST = `${prefix}/GET_BEE_POPUP_BUILDER_TOKEN_REQUEST`;
+export const GET_BEE_POPUP_BUILDER_TOKEN_SUCCESS = `${prefix}/GET_BEE_POPUP_BUILDER_TOKEN_SUCCESS`;
+export const GET_BEE_POPUP_BUILDER_TOKEN_FAILURE = `${prefix}/GET_BEE_POPUP_BUILDER_TOKEN_FAILURE`;
+
 export const INAPP_MEDIA_TYPES = {
   TEXT: "TEXT",
   IMAGE: "IMAGE",
+  HTML: "HTML",
 };
 export const BIG_TEXT = 'BIG_TEXT';
 export const BIG_PICTURE = 'BIG_PICTURE';
+export const BIG_HTML = 'BIG_HTML';
 export const NONE = "NONE";
 export const CTA = "CTA";
 export const MAPP_SDK = "MAPP_SDK";
@@ -70,14 +76,16 @@ export const INAPP_IMG_SIZE = 5000000; // 5MB
 export const TEMPLATE_MESSAGE_MAX_LENGTH = 1024;
 
 export const INAPP_MESSAGE_LAYOUT_TYPES = {
-  MODAL: "POPUP",
+  MODAL: "MODAL",
   TOPBANNER: "HEADER",
   BOTTOMBANNER: "FOOTER",
   FULLSCREEN: "FULLSCREEN",
+  POPUP: "POPUP",
 };
 
 export const ANDROID = "ANDROID";
 export const IOS = "iOS";
+export const IOS_CAPITAL = "IOS";
 export const LAYOUT_RADIO_OPTIONS = [
   {
     value: INAPP_MESSAGE_LAYOUT_TYPES.MODAL,
@@ -136,6 +144,11 @@ export const BUTTON_RADIO_OPTIONS = [
 ];
 
 export const INAPP_LAYOUT_DETAILS = {
+  MODAL: {
+    tagColor: CAP_ORANGE01,
+    tagTextColor: CAP_ORANGE,
+    text: <FormattedMessage {...messages.layoutModal} />,
+  },
   POPUP: {
     tagColor: CAP_ORANGE01,
     tagTextColor: CAP_ORANGE,
@@ -144,12 +157,12 @@ export const INAPP_LAYOUT_DETAILS = {
   HEADER: {
     tagColor: CAP_PURPLE03,
     tagTextColor: CAP_PURPLE02,
-    text: <FormattedMessage {...messages.header} />,
+    text: <FormattedMessage {...messages.layoutTopBanner} />,
   },
   FOOTER: {
     tagColor: CAP_PALE_GREY,
     tagTextColor: FONT_COLOR_05,
-    text: <FormattedMessage {...messages.footer} />,
+    text: <FormattedMessage {...messages.layoutBottomBanner} />,
   },
   FULLSCREEN: {
     tagColor: CAP_GREEN02,
@@ -159,4 +172,7 @@ export const INAPP_LAYOUT_DETAILS = {
 };
 
 export const DEVICE_SUPPORTED = '1';
-export const AI_CONTENT_BOT_DISABLED = "AI_CONTENT_BOT_DISABLED";
+export const AI_CONTENT_BOT_DISABLED = "AI_CONTENT_BOT_DISABLED";
+export const MODE_SELECTION = "modeSelection";
+export const BASIC_EDITOR = "basicEditor";
+export const BEE_EDITOR = "beeEditor";