@capillarytech/creatives-library 7.17.176 → 7.17.177

package/package.json

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

package/services/api.js

@@ -525,8 +525,8 @@ export const getS3UrlFileSizes = (data) => {
   return request(url, getAPICallObject('POST', data));
 };
 
-export const getTemplateInfoById = ({id, username, oa_id, token, host}) => {
-  const url = `${API_ENDPOINT}/templates/v1/${id}/Zalo?username=${username}&oa_id=${oa_id}&token=${token}&host=${host}`;
+export const getTemplateInfoById = ({id, username, oa_id, token}) => {
+  const url = `${API_ENDPOINT}/templates/v1/${id}/Zalo?username=${username}&oa_id=${oa_id}&token=${token}`;
   const compressedTemplatesData = request(url, getAPICallObject('GET'));
   return compressedTemplatesData.then((data) => {
     const { response = '' } = data || {};

package/v2Containers/CreativesContainer/index.js

@@ -124,12 +124,10 @@ export class Creatives extends React.Component {
         sourceAccountIdentifier = "",
         configs: { token = "" } = {},
       } = get(this.props, "Templates.selectedZaloAccount", {});
-      const { hostName = ''} = get(this.props, "Templates.senderDetails", {});
       this.props.zaloActions.getTemplateInfoById({
         username: name,
         oa_id: sourceAccountIdentifier,
         token,
-        host: hostName,
         id: template?._id,
         preview: true,
         actionCallback: this.actionCallback,

package/v2Containers/Templates/index.js

@@ -305,10 +305,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           channel = 'Zalo';
           activeMode = ACCOUNT_SELECTION_MODE;
           this.props.actions.getWeCrmAccounts(channel);
-          this.props.actions.getSenderDetails({
-            channel: ZALO,
-            orgUnitId: -1,
-          });
           break;
         default:
           channel = '';
@@ -623,19 +619,18 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         wecrm_token
       } = configs || {};
       if (weCrmChannels.includes(selectedChannel)) {
-          if ([WHATSAPP_LOWERCASE, ZALO_LOWERCASE].includes(selectedChannel)) {
+          if ([WHATSAPP_LOWERCASE].includes(selectedChannel)) {
             if (hostName === '') {
               return;
             }
 
             weCrmAccountsList[0].hostName = hostName;
             nextProps.actions.setChannelAccount(selectedChannel.toUpperCase(), weCrmAccountsList[0]);
-            if (selectedChannel === ZALO_LOWERCASE) {
-              paramsDefault.username = name;
-              paramsDefault.oa_id = sourceAccountIdentifier;
-              paramsDefault.token = token;
-              paramsDefault.host = hostName;
-            }
+          } else if ([ZALO_LOWERCASE].includes(selectedChannel)) {
+            nextProps.actions.setChannelAccount(selectedChannel.toUpperCase(), weCrmAccountsList[0]);
+            paramsDefault.username = name;
+            paramsDefault.oa_id = sourceAccountIdentifier;
+            paramsDefault.token = token;
           } else {
             paramsDefault.wecrmId = wecrm_app_id;
             paramsDefault.wecrmToken = wecrm_token;
@@ -646,7 +641,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           }
         
       }
-      this.setState({ defaultAccount: false, activeMode: TEMPLATES_MODE, selectedAccount: weCrmAccountsList[0].name, hostName: weCrmAccountsList[0].hostName });
+      this.setState({ defaultAccount: false, activeMode: TEMPLATES_MODE, selectedAccount: weCrmAccountsList[0].name, hostName });
       this.getAllTemplates({params: paramsDefault}, true);
     }
     const zaloPreviewUrl = get(nextProps, 'Zalo.zaloTemplatePreviewData.versions.base.content.zalo.previewUrl', '');
@@ -700,13 +695,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
               name = "",
               sourceAccountIdentifier = "",
               configs: { token = "" } = {},
-              hostName = "",
             } = setAcc || {};
             params.username = name;
             params.oa_id = sourceAccountIdentifier;
             params.token = token;
             params.isAccountSelection = true;
-            params.host = hostName || this.state.hostName;
         }
       }
 
@@ -806,8 +799,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
       if(this.state.channel.toLowerCase() !== ZALO_LOWERCASE) {
         queryParams.name = this.state.searchText;
         queryParams.sortBy = this.state.sortBy;
-      } else {
-        queryParams.host = this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName;
       }
       queryParams.page = this.state.page;
       queryParams.perPage = this.state.perPageLimit;
@@ -862,12 +853,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
           name = "",
           sourceAccountIdentifier = "",
           configs: { token = "" } = {},
-          hostName = "",
         } = get(this.props, "Templates.selectedZaloAccount", {});
         queryParams.username = name;
         queryParams.oa_id = sourceAccountIdentifier;
         queryParams.token = token;
-        queryParams.host = hostName || this.state.hostName;
       }
       this.setState({ page, templatesCount }, () => {
         queryParams.page = page;
@@ -2113,13 +2102,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         name = "",
         sourceAccountIdentifier = "",
         configs: { token = "" } = {},
-        hostName = "",
       } = get(this.props, "Templates.selectedZaloAccount", {});
       this.props.zaloActions.getTemplateInfoById({
         username: name,
         oa_id: sourceAccountIdentifier,
         token: token,
-        host: hostName || this.state.hostName,
         id: template?._id,
         preview: true,
         actionCallback: this.actionCallback,

package/v2Containers/Templates/sagas.js

@@ -1,4 +1,3 @@
-import get from 'lodash/get';
 import { call, put, takeLatest, take, cancel, select } from 'redux-saga/effects';
 import { LOCATION_CHANGE } from 'react-router-redux';
 // import { schema, normalize } from 'normalizr';
@@ -177,7 +176,7 @@ export function* getSenderDetails({
     if (!apiResponse?.errors?.length) {
       yield put({
         type: types.GET_SENDER_DETAILS_SUCCESS,
-        payload: get(apiResponse, `entity.${channel}[0].domainProperties.hostName`, ''),
+        payload: apiResponse?.entity?.WHATSAPP[0]?.domainProperties?.hostName || '',
       });
     } else {
       yield put({

package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap

@@ -87,53 +87,380 @@ exports[`Test Templates container Should render illustration when no templates a
 `;
 
 exports[`Test Templates container Should render temlates when Zalo templates are passed in full mode 1`] = `
-<CapSpin
-  spinning={false}
->
+<Fragment>
   <div
-    style={
-      Object {
-        "overflowX": "auto",
-        "paddingBottom": "1.142rem",
-      }
-    }
+    className="creatives-templates-list full-mode"
   >
-    <CapHeader
-      className="select-account-header"
-      description="Choose the account to send content"
-      descriptionClass=""
-      inline={false}
-      size="regular"
-      title="Zalo account"
-      titleClass=""
-    />
-    <CapRadioCard
-      cardHeight="48px"
-      cardWidth="276px"
-      className="select-account"
-      defaultValue=""
+    <input
+      accept=".zip, .html, .htm"
+      id="filename"
       onChange={[Function]}
-      panes={
-        Array [
-          Object {
-            "icon": <CapIconAvatar
-              backgroundProps={Object {}}
-              height="2rem"
-              labelProps={Object {}}
-              text="c"
-              width="auto"
-            />,
-            "key": "fa66f53ca2bb4b93b02dfc5bd265e2fd",
-            "title": "capillary_zns",
-            "value": "capillary_zns",
-          },
-        ]
+      style={
+        Object {
+          "display": "none",
+        }
       }
-      selected=""
-      size="small"
+      type="file"
     />
+    <CapRow>
+      <Pagination
+        onPageChange={[Function]}
+        paginationContainer="pagination-container"
+        paginationSelector="pagination-container"
+        templateInProgress={false}
+      >
+        <div>
+          <div
+            className="action-container"
+          >
+            <_class
+              className="search-text"
+              disabled={false}
+              labelPosition="top"
+              onChange={[Function]}
+              onClear={[Function]}
+              onScroll={[Function]}
+              placeholder="Search"
+              style={
+                Object {
+                  "width": "210px",
+                }
+              }
+              value=""
+            />
+            <div
+              className="zalo-filters"
+            >
+              <CapSelectFilter
+                data={
+                  Array [
+                    Object {
+                      "key": "enable",
+                      "label": <FormattedMessage
+                        defaultMessage="Enable"
+                        id="creatives.containersV2.zalo.ENABLE_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "ENABLE",
+                    },
+                    Object {
+                      "key": "reject",
+                      "label": <FormattedMessage
+                        defaultMessage="Reject"
+                        id="creatives.containersV2.zalo.REJECT_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "REJECT",
+                    },
+                    Object {
+                      "key": "disable",
+                      "label": <FormattedMessage
+                        defaultMessage="Disable"
+                        id="creatives.containersV2.zalo.DISABLE_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "DISABLE",
+                    },
+                    Object {
+                      "key": "reviewPending",
+                      "label": <FormattedMessage
+                        defaultMessage="Review Pending"
+                        id="creatives.containersV2.zalo.PENDING_REVIEW_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "PENDING_REVIEW",
+                    },
+                  ]
+                }
+                dropdownMaxHeight="320px"
+                dropdownWidth="228px"
+                onSelect={[Function]}
+                placeholder="Status"
+                placement="bottomLeft"
+                selectedValue=""
+                width="90px"
+              />
+            </div>
+            <Component />
+            <Component />
+            <div
+              style={
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "justifyContent": "space-between",
+                }
+              }
+            />
+          </div>
+          <CapRow
+            align="middle"
+            className="selected-whatsapp-filters"
+            type="flex"
+          />
+          <CapSpin
+            spinning={false}
+            style={
+              Object {
+                "width": "100%",
+              }
+            }
+            tip="Getting all templates..."
+          >
+            <div>
+              <div
+                className="pagination-container"
+              >
+                <CapCustomCardList
+                  cardList={
+                    Array [
+                      Object {
+                        "content": <CapLabel
+                          className="zalo-listing-content desc"
+                          type="label19"
+                        >
+                          Test1
+                        </CapLabel>,
+                        "extra": Array [
+                          <CapTooltip
+                            title={
+                              <div
+                                className="zalo-view-tooltip"
+                              >
+                                Open preview in new tab
+                              </div>
+                            }
+                          >
+                            <CapIcon
+                              className="view-zalo"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
+                              }
+                              type="eye"
+                            />
+                          </CapTooltip>,
+                          <CapDropdown
+                            overlay={
+                              <CapMenu>
+                                <withItemHOC
+                                  className="duplicate-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Duplicate"
+                                    id="creatives.containersV2.Templates.duplicateButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                                <withItemHOC
+                                  className="delete-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Delete"
+                                    id="creatives.containersV2.Templates.deleteButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                              </CapMenu>
+                            }
+                          >
+                            <React.Fragment />
+                          </CapDropdown>,
+                        ],
+                        "hoverOption": <CapButton
+                          className="edit-zalo"
+                          isAddBtn={false}
+                          onClick={[Function]}
+                          type="primary"
+                        >
+                          Overview
+                        </CapButton>,
+                        "key": "ZALO-card-Test1",
+                        "title": <CapRow>
+                          <CapLabel
+                            className="zalo-template-name"
+                            type="label1"
+                          >
+                            
+                          </CapLabel>
+                          <CapRow
+                            align="middle"
+                            className="zalo-status-container zalo-status-color"
+                            type="flex"
+                          >
+                            <CapStatus
+                              color=""
+                              height="0.571rem"
+                              labelType="label3"
+                              text=""
+                              type="pending"
+                              width="0.571rem"
+                            />
+                          </CapRow>
+                        </CapRow>,
+                      },
+                      Object {
+                        "content": <CapLabel
+                          className="zalo-listing-content desc"
+                          type="label19"
+                        >
+                          Test2
+                        </CapLabel>,
+                        "extra": Array [
+                          <CapTooltip
+                            title={
+                              <div
+                                className="zalo-view-tooltip"
+                              >
+                                Open preview in new tab
+                              </div>
+                            }
+                          >
+                            <CapIcon
+                              className="view-zalo"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
+                              }
+                              type="eye"
+                            />
+                          </CapTooltip>,
+                          <CapDropdown
+                            overlay={
+                              <CapMenu>
+                                <withItemHOC
+                                  className="duplicate-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Duplicate"
+                                    id="creatives.containersV2.Templates.duplicateButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                                <withItemHOC
+                                  className="delete-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Delete"
+                                    id="creatives.containersV2.Templates.deleteButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                              </CapMenu>
+                            }
+                          >
+                            <React.Fragment />
+                          </CapDropdown>,
+                        ],
+                        "hoverOption": <CapButton
+                          className="edit-zalo"
+                          isAddBtn={false}
+                          onClick={[Function]}
+                          type="primary"
+                        >
+                          Overview
+                        </CapButton>,
+                        "key": "ZALO-card-Test2",
+                        "title": <CapRow>
+                          <CapLabel
+                            className="zalo-template-name"
+                            type="label1"
+                          >
+                            
+                          </CapLabel>
+                          <CapRow
+                            align="middle"
+                            className="zalo-status-container zalo-status-color"
+                            type="flex"
+                          >
+                            <CapStatus
+                              color=""
+                              height="0.571rem"
+                              labelType="label3"
+                              text=""
+                              type="pending"
+                              width="0.571rem"
+                            />
+                          </CapRow>
+                        </CapRow>,
+                      },
+                    ]
+                  }
+                  fbType="list"
+                  key="ZALO-card-list"
+                  style={
+                    Object {
+                      "marginLeft": "16px",
+                    }
+                  }
+                  type="ZALO"
+                />
+              </div>
+              <div
+                style={
+                  Object {
+                    "height": "calc(100vh - 325px)",
+                    "overflow": "auto",
+                  }
+                }
+              />
+            </div>
+          </CapSpin>
+        </div>
+      </Pagination>
+    </CapRow>
+    <CapRow />
+    <CapRow>
+      <CapSlideBox
+        closeIconPosition="right"
+        closeIconSize="m"
+        closeIconType="close"
+        content={
+          <CardGrid
+            className=""
+            colNumber={2}
+            gutterSize={16}
+            isLoading={false}
+            listItem={Array []}
+            onHoverItem={[Function]}
+            onItemClick={[Function]}
+          />
+        }
+        handleClose={[Function]}
+        header={
+          <h3>
+            Select layout
+          </h3>
+        }
+        loadingText="Loading EDM Templates"
+        position="right"
+        show={false}
+        size="size-r"
+        width={60}
+      />
+      <InjectIntl(Wrapper)
+        centered={true}
+        className="delete-template-confirm"
+        closeText="Cancel"
+        okText="Yes, delete"
+        onCancel={[Function]}
+        onOk={[Function]}
+        title="Confirm delete template"
+        visible={false}
+      >
+        Are you sure you wish to delete this template?
+      </InjectIntl(Wrapper)>
+    </CapRow>
   </div>
-</CapSpin>
+</Fragment>
 `;
 
 exports[`Test Templates container Should render temlates when whatsapp templates are passed 1`] = `
@@ -671,53 +998,161 @@ exports[`Test Templates container Should render temlates when whatsapp templates
 `;
 
 exports[`Test Templates container Should render temlates when zalo templates are passed 1`] = `
-<CapSpin
-  spinning={false}
->
+<Fragment>
   <div
-    style={
-      Object {
-        "overflowX": "auto",
-        "paddingBottom": "1.142rem",
-      }
-    }
+    className="creatives-templates-list library-mode"
   >
-    <CapHeader
-      className="select-account-header"
-      description="Choose the account to send content"
-      descriptionClass=""
-      inline={false}
-      size="regular"
-      title="Zalo account"
-      titleClass=""
-    />
-    <CapRadioCard
-      cardHeight="48px"
-      cardWidth="276px"
-      className="select-account"
-      defaultValue=""
+    <input
+      accept=".zip, .html, .htm"
+      id="filename"
       onChange={[Function]}
-      panes={
-        Array [
-          Object {
-            "icon": <CapIconAvatar
-              backgroundProps={Object {}}
-              height="2rem"
-              labelProps={Object {}}
-              text="c"
-              width="auto"
-            />,
-            "key": "fa66f53ca2bb4b93b02dfc5bd265e2fd",
-            "title": "capillary_zns",
-            "value": "capillary_zns",
-          },
-        ]
+      style={
+        Object {
+          "display": "none",
+        }
       }
-      selected=""
-      size="small"
+      type="file"
     />
+    <CapRow>
+      <Pagination
+        onPageChange={[Function]}
+        paginationContainer="pagination-container"
+        paginationSelector="pagination-container"
+        templateInProgress={false}
+      >
+        <div>
+          <div
+            className="action-container"
+          >
+            <_class
+              className="search-text"
+              disabled={false}
+              labelPosition="top"
+              onChange={[Function]}
+              onClear={[Function]}
+              onScroll={[Function]}
+              placeholder="Search"
+              style={
+                Object {
+                  "width": "210px",
+                }
+              }
+              value=""
+            />
+            <div
+              className="zalo-filters"
+            />
+            <Component />
+            <Component />
+            <div
+              style={
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "justifyContent": "space-between",
+                }
+              }
+            />
+          </div>
+          <CapRow
+            align="middle"
+            className="selected-whatsapp-filters"
+            type="flex"
+          />
+          <CapSpin
+            spinning={false}
+            style={
+              Object {
+                "width": "100%",
+              }
+            }
+            tip="Getting all templates..."
+          >
+            <div>
+              <div
+                style={
+                  Object {
+                    "height": "calc(100vh - 325px)",
+                    "overflow": "auto",
+                  }
+                }
+              >
+                <CapHeader
+                  description={
+                    <CapLabel
+                      style={
+                        Object {
+                          "textAlign": "center",
+                        }
+                      }
+                      type="label1"
+                    >
+                      Please try searching with another term or apply different filter
+                    </CapLabel>
+                  }
+                  descriptionClass=""
+                  inline={false}
+                  size="large"
+                  title={
+                    <CapHeading
+                      className="channel-specific-illustration-text"
+                      type="h3"
+                    >
+                      Sorry, we couldn’t find any matches
+                    </CapHeading>
+                  }
+                  titleClass=""
+                />
+              </div>
+            </div>
+          </CapSpin>
+        </div>
+      </Pagination>
+    </CapRow>
+    <CapRow />
+    <CapRow>
+      <CapSlideBox
+        closeIconPosition="right"
+        closeIconSize="m"
+        closeIconType="close"
+        content={
+          <CardGrid
+            className=""
+            colNumber={2}
+            gutterSize={16}
+            isLoading={false}
+            listItem={Array []}
+            onHoverItem={[Function]}
+            onItemClick={[Function]}
+          />
+        }
+        handleClose={[Function]}
+        header={
+          <h3>
+            Select layout
+          </h3>
+        }
+        loadingText="Loading EDM Templates"
+        position="right"
+        show={false}
+        size="size-r"
+        width={60}
+      />
+      <InjectIntl(Wrapper)
+        centered={true}
+        className="delete-template-confirm"
+        closeText="Cancel"
+        okText="Yes, delete"
+        onCancel={[Function]}
+        onOk={[Function]}
+        title="Confirm delete template"
+        visible={false}
+      >
+        Are you sure you wish to delete this template?
+      </InjectIntl(Wrapper)>
+    </CapRow>
   </div>
-</CapSpin>
+</Fragment>
 `;
 
 exports[`Test Templates container Test max templates exceeded 1`] = `

package/v2Containers/Templates/tests/index.test.js

@@ -69,7 +69,6 @@ describe('Test Templates container', () => {
           setChannelAccount,
           getAllTemplates,
           getUserList,
-          getSenderDetails,
         }}
         location={{
           pathname: '/Zalo',

package/v2Containers/Templates/tests/sagas.test.js

@@ -1,5 +1,5 @@
 import { expectSaga } from 'redux-saga-test-plan';
-import { take, call, takeLatest, takeEvery, put } from 'redux-saga/effects';
+import { take, call, takeLatest, takeEvery } from 'redux-saga/effects';
 import * as matchers from 'redux-saga-test-plan/matchers';
 import * as api from '../../../services/api';
 import * as types from '../constants';
@@ -10,12 +10,9 @@ import {
   getAllTemplates,
   watchGetCdnTransformationConfig,
   watchGetAllTemplates,
-  getSenderDetails,
 } from '../sagas';
 
 import * as mockData from './mockData';
-import { ZALO } from '../../CreativesContainer/constants';
-import { VIET_GUYS } from '../../Zalo/constants';
 
 describe('getCdnTransformationConfig saga', () => {
   it("handle valid response from api", () => {
@@ -137,53 +134,3 @@ describe('watchForTemplates saga', () => {
     );
   });
 });
-
-describe('getSenderDetails Saga', () => {
-  const channel = 'someChannel';
-  const orgUnitId = 'someOrgUnitId';
-  const action = { channel, orgUnitId };
-
-  it('should handle apiResponse with hostName', () => {
-    const apiResponse = {
-      entity: {
-        [channel]: [
-          {
-            domainProperties: {
-              hostName: 'example.com',
-            },
-          },
-        ],
-      },
-    };
-
-    const generator = getSenderDetails(action);
-    expect(generator.next().value).toEqual(call(api.getSenderDetails, channel, orgUnitId));
-    expect(generator.next(apiResponse).value).toEqual(
-      put({
-        type: types.GET_SENDER_DETAILS_SUCCESS,
-        payload: 'example.com',
-      })
-    );
-  });
-
-  it('should handle apiResponse without hostName', () => {
-    const apiResponse = {
-      entity: {
-        [channel]: [
-          {
-            domainProperties: {},
-          },
-        ],
-      },
-    };
-
-    const generator = getSenderDetails(action);
-    expect(generator.next().value).toEqual(call(api.getSenderDetails, channel, orgUnitId));
-    expect(generator.next(apiResponse).value).toEqual(
-      put({
-        type: types.GET_SENDER_DETAILS_SUCCESS,
-        payload: '',
-      })
-    );
-  });
-});

package/v2Containers/Zalo/index.js

@@ -56,7 +56,7 @@ export const Zalo = (props) => {
     isFullMode,
     templateData = {},
     editData = {},
-    accountData: { selectedZaloAccount = {}, senderDetails = {} } = {},
+    accountData: { selectedZaloAccount = {} } = {},
     globalActions,
     location,
     getDefaultTags,
@@ -66,7 +66,6 @@ export const Zalo = (props) => {
     getFormData,
     selectedOfferDetails,
   } = props || {};
-  const {hostName = ''} = senderDetails;
   const { formatMessage } = intl;
   const [oa_id, setOaId] = useState('');
   const [token, setToken] = useState('');
@@ -122,12 +121,11 @@ export const Zalo = (props) => {
 
   //gets template details
   useEffect(() => {
-    if (zaloTempId && oa_id && token && username && hostName) {
+    if (zaloTempId && oa_id && token && username) {
       actions.getTemplateInfoById({
         username,
         oa_id,
         token,
-        host: hostName,
         id: zaloTempId,
         actionCallback,
       });
@@ -136,10 +134,10 @@ export const Zalo = (props) => {
     return () => {
       actions.resetTemplateInfoData();
     };
-  }, [zaloTempId, oa_id, token, username, hostName]);
+  }, [zaloTempId, oa_id, token, username]);
 
   const handleSetValues = (paramsData = []) =>
-    paramsData?.map((paramData) => {
+    paramsData.map((paramData) => {
       for (const key in varMapped) {
         if (paramData?.name === key) {
           paramData.value = varMapped[key];
@@ -341,7 +339,7 @@ export const Zalo = (props) => {
 
   const isEditDoneDisabled = () => {
     let disableCheck = false;
-    templateListParams?.forEach((listParams) => {
+    templateListParams.forEach((listParams) => {
       const { error, value } = listParams;
       const errorMessage = !error
         ? handleErrorValidation(value, listParams)
@@ -354,11 +352,10 @@ export const Zalo = (props) => {
   };
   const createPayload = () => {
     const varMap = {};
-    templateListParams?.forEach((listParam) => {
-      const { name = '', value = '' } = listParam;
+    templateListParams.forEach((listParam) => {
+      const { name, value } = listParam;
       varMap[name] = value;
-    }
-    );
+    });
     const payload = {
       channel: ZALO,
       accountId: oa_id,

package/v2Containers/Zalo/selectors.js

@@ -9,4 +9,4 @@ const makeSelectZalo = () =>
 const makeSelectAccount = () =>
   createSelector(selectAccountDomain(), (substate) => substate && substate.toJS());
 
-export { makeSelectZalo, makeSelectAccount};
+export { makeSelectZalo, makeSelectAccount };

package/v2Containers/Zalo/tests/mockData.js

@@ -11462,9 +11462,6 @@ export const accountData = {
       modifiedDate: '2023-10-16T00:00:00+05:30',
     },
   },
-  senderDetails: {
-    hostName: 'vietguyszalotrans',
-  },
 };
 
 export const templateData = {
@@ -11482,46 +11479,3 @@ export const templateConfigs = {
     ma_so1: '4',
   },
 };
-
-export const mockGapItTemplateData = [
-  {
-    _id: '354701',
-    versions: {
-      base: {
-        content: {
-          zalo: {
-            templateName: 'Test',
-            listParams: [
-              {
-                name: "Name",
-                type: "STRING",
-                require: true,
-                maxLength: 80,
-                minLength: 0,
-                acceptNull: false,
-              },
-              {
-                name: "So_dien_thoai",
-                type: "STRING",
-                require: true,
-                maxLength: 30,
-                minLength: 0,
-                acceptNull: false,
-              },
-              {
-                name: "so_du",
-                type: "STRING",
-                require: true,
-                maxLength: 30,
-                minLength: 0,
-                acceptNull: false,
-              },
-            ],
-            previewUrl: 'https://account.zalo.cloud/znspreview/h84m64E6ST_owPQVFzTilg==',
-            status: 'ENABLE',
-          },
-        },
-      },
-    },
-  },
-];

package/v2Containers/Zalo/tests/selector.test.js

@@ -5,7 +5,7 @@ describe("makeSelectZalo", () => {
   it("returns the expected object with default values when substate is empty", () => {
     // Arrange
     const state = fromJS({ zalo: {} });
-    const expected = {};
+    const expected = {}
     const selector = makeSelectZalo();
 
     // Act
@@ -17,7 +17,7 @@ describe("makeSelectZalo", () => {
   it("returns the expected object with default values when substate is empty for makeSelectAccount", () => {
     // Arrange
     const state = fromJS({ templates: {} });
-    const expected = {};
+    const expected = {}
     const selector = makeSelectAccount();
 
     // Act
@@ -25,4 +25,4 @@ describe("makeSelectZalo", () => {
     // Assert
     expect(result).toEqual(expected);
   });
-});
+});