@capillarytech/creatives-library 8.0.60-alpha.7 → 8.0.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/config/app.js CHANGED
@@ -17,7 +17,6 @@ const config = {
17
17
  accountConfig: (strs, accountId) => `${window.location.origin}/org/config/AccountAdd?q=a&channelId=2&accountId=${accountId}&edit=1`,
18
18
  },
19
19
  development: {
20
- // api_endpoint: 'http://localhost:2022/arya/api/v1/creatives',
21
20
  api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/arya/api/v1/creatives',
22
21
  campaigns_api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/campaigns',
23
22
  campaigns_api_org_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/org/campaign',
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capillarytech/creatives-library",
3
3
  "author": "meharaj",
4
- "version": "8.0.60-alpha.7",
4
+ "version": "8.0.60",
5
5
  "description": "Capillary creatives ui",
6
6
  "main": "./index.js",
7
7
  "module": "./index.es.js",
@@ -294,4 +294,36 @@ export const getTagMapValue = (object = {}) => {
294
294
  ).reduce((acc, current) => {
295
295
  return { ...acc?.subtags ?? {}, ...current?.subtags ?? {} };
296
296
  }, {});
297
+ };
298
+
299
+
300
+ /**
301
+ * Extracts and merges all subtags and top-level keys from the provided object into a single flat map.
302
+ *
303
+ * @param {Object} object - The input object containing top-level keys with optional subtags.
304
+ * @returns {Object} - A flat map containing all top-level keys and their subtags.
305
+ */
306
+ export const getForwardedMapValues = (object = {}) => {
307
+ return Object?.entries(object)?.reduce((acc, [key, current]) => {
308
+ // Check if current has 'subtags' and it's an object
309
+ if (current && current?.subtags && typeof current?.subtags === 'object') {
310
+ // Add the top-level key with its 'name' and 'desc'
311
+ acc[key] = {
312
+ name: current?.name,
313
+ desc: current?.desc,
314
+ };
315
+
316
+ // Merge the subtags into the accumulator
317
+ acc = { ...acc, ...current?.subtags };
318
+ } else if (current && typeof current === 'object') {
319
+ // If no 'subtags', add the top-level key with its 'name' and 'desc'
320
+ acc[key] = {
321
+ name: current?.name,
322
+ desc: current?.desc,
323
+ };
324
+ }
325
+
326
+ // If the current entry is not an object or lacks 'name'/'desc', skip it
327
+ return acc;
328
+ }, {});
297
329
  };
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import '@testing-library/jest-dom';
3
- import { checkSupport, extractNames, getTagMapValue, preprocessHtml, validateIfTagClosed,validateTags, skipTags } from '../tagValidations';
3
+ import { checkSupport, extractNames, getTagMapValue,getForwardedMapValues, preprocessHtml, validateIfTagClosed,validateTags, skipTags } from '../tagValidations';
4
4
  import { eventContextTags } from '../../v2Containers/TagList/tests/mockdata';
5
5
 
6
6
  describe("check if curly brackets are balanced", () => {
@@ -496,4 +496,273 @@ describe("skipTags", () => {
496
496
  const result = skipTags(tag);
497
497
  expect(result).toEqual(true);
498
498
  });
499
+ });
500
+
501
+
502
+ describe('getForwardedMapValues', () => {
503
+ test('should return an empty object when input is empty', () => {
504
+ const input = {};
505
+ const expected = {};
506
+ expect(getForwardedMapValues(input)).toEqual(expected);
507
+ });
508
+
509
+ test('should correctly process objects with subtags', () => {
510
+ const input = {
511
+ customer: {
512
+ name: 'Customer',
513
+ desc: 'Customer Description',
514
+ subtags: {
515
+ cumulative_points_currency: {
516
+ name: 'Lifetime Points (in ₹)',
517
+ desc: 'Lifetime Points in ₹ Description',
518
+ },
519
+ mobile_number: {
520
+ name: 'Mobile Number',
521
+ desc: 'Mobile Number Description',
522
+ },
523
+ },
524
+ },
525
+ store: {
526
+ name: 'Store',
527
+ desc: 'Store Description',
528
+ subtags: {
529
+ store_name: {
530
+ name: 'Store Name',
531
+ desc: 'Store Name Description',
532
+ },
533
+ store_address: {
534
+ name: 'Store Address',
535
+ desc: 'Store Address Description',
536
+ },
537
+ },
538
+ },
539
+ };
540
+
541
+ const expected = {
542
+ customer: {
543
+ name: 'Customer',
544
+ desc: 'Customer Description',
545
+ },
546
+ cumulative_points_currency: {
547
+ name: 'Lifetime Points (in ₹)',
548
+ desc: 'Lifetime Points in ₹ Description',
549
+ },
550
+ mobile_number: {
551
+ name: 'Mobile Number',
552
+ desc: 'Mobile Number Description',
553
+ },
554
+ store: {
555
+ name: 'Store',
556
+ desc: 'Store Description',
557
+ },
558
+ store_name: {
559
+ name: 'Store Name',
560
+ desc: 'Store Name Description',
561
+ },
562
+ store_address: {
563
+ name: 'Store Address',
564
+ desc: 'Store Address Description',
565
+ },
566
+ };
567
+
568
+ expect(getForwardedMapValues(input)).toEqual(expected);
569
+ });
570
+
571
+ test('should correctly process objects without subtags', () => {
572
+ const input = {
573
+ points_on_event: {
574
+ name: 'Points on event',
575
+ desc: 'Points on event Description',
576
+ },
577
+ unsubscribe: {
578
+ name: 'Unsubscribe',
579
+ desc: 'Unsubscribe Description',
580
+ },
581
+ };
582
+
583
+ const expected = {
584
+ points_on_event: {
585
+ name: 'Points on event',
586
+ desc: 'Points on event Description',
587
+ },
588
+ unsubscribe: {
589
+ name: 'Unsubscribe',
590
+ desc: 'Unsubscribe Description',
591
+ },
592
+ };
593
+
594
+ expect(getForwardedMapValues(input)).toEqual(expected);
595
+ });
596
+
597
+ test('should handle a mix of entries with and without subtags', () => {
598
+ const input = {
599
+ customer: {
600
+ name: 'Customer',
601
+ desc: 'Customer Description',
602
+ subtags: {
603
+ cumulative_points_currency: {
604
+ name: 'Lifetime Points (in ₹)',
605
+ desc: 'Lifetime Points in ₹ Description',
606
+ },
607
+ },
608
+ },
609
+ points_on_event: {
610
+ name: 'Points on event',
611
+ desc: 'Points on event Description',
612
+ },
613
+ store: {
614
+ name: 'Store',
615
+ desc: 'Store Description',
616
+ subtags: {
617
+ store_name: {
618
+ name: 'Store Name',
619
+ desc: 'Store Name Description',
620
+ },
621
+ },
622
+ },
623
+ };
624
+
625
+ const expected = {
626
+ customer: {
627
+ name: 'Customer',
628
+ desc: 'Customer Description',
629
+ },
630
+ cumulative_points_currency: {
631
+ name: 'Lifetime Points (in ₹)',
632
+ desc: 'Lifetime Points in ₹ Description',
633
+ },
634
+ points_on_event: {
635
+ name: 'Points on event',
636
+ desc: 'Points on event Description',
637
+ },
638
+ store: {
639
+ name: 'Store',
640
+ desc: 'Store Description',
641
+ },
642
+ store_name: {
643
+ name: 'Store Name',
644
+ desc: 'Store Name Description',
645
+ },
646
+ };
647
+
648
+ expect(getForwardedMapValues(input)).toEqual(expected);
649
+ });
650
+
651
+ test('should ignore entries that are not objects', () => {
652
+ const input = {
653
+ valid_entry: {
654
+ name: 'Valid Entry',
655
+ desc: 'Valid Entry Description',
656
+ },
657
+ invalid_entry: 'This is a string, not an object',
658
+ another_invalid_entry: null,
659
+ };
660
+
661
+ const expected = {
662
+ valid_entry: {
663
+ name: 'Valid Entry',
664
+ desc: 'Valid Entry Description',
665
+ },
666
+ };
667
+
668
+ expect(getForwardedMapValues(input)).toEqual(expected);
669
+ });
670
+
671
+ test('should handle entries missing name or desc', () => {
672
+ const input = {
673
+ incomplete_entry1: {
674
+ name: 'Incomplete Entry 1',
675
+ // desc is missing
676
+ subtags: {
677
+ subtag1: {
678
+ name: 'Subtag 1',
679
+ desc: 'Subtag 1 Description',
680
+ },
681
+ },
682
+ },
683
+ incomplete_entry2: {
684
+ // name is missing
685
+ desc: 'Incomplete Entry 2 Description',
686
+ },
687
+ };
688
+
689
+ const expected = {
690
+ incomplete_entry1: {
691
+ name: 'Incomplete Entry 1',
692
+ desc: undefined,
693
+ },
694
+ subtag1: {
695
+ name: 'Subtag 1',
696
+ desc: 'Subtag 1 Description',
697
+ },
698
+ incomplete_entry2: {
699
+ name: undefined,
700
+ desc: 'Incomplete Entry 2 Description',
701
+ },
702
+ };
703
+
704
+ expect(getForwardedMapValues(input)).toEqual(expected);
705
+ });
706
+
707
+ test('should handle deeply nested subtags by only flattening one level', () => {
708
+ const input = {
709
+ parent: {
710
+ name: 'Parent',
711
+ desc: 'Parent Description',
712
+ subtags: {
713
+ child: {
714
+ name: 'Child',
715
+ desc: 'Child Description',
716
+ subtags: {
717
+ grandchild: {
718
+ name: 'Grandchild',
719
+ desc: 'Grandchild Description',
720
+ },
721
+ },
722
+ },
723
+ },
724
+ },
725
+ };
726
+
727
+ const expected = {
728
+ parent: {
729
+ name: 'Parent',
730
+ desc: 'Parent Description',
731
+ },
732
+ child: {
733
+ name: 'Child',
734
+ desc: 'Child Description',
735
+ subtags: {
736
+ grandchild: {
737
+ name: 'Grandchild',
738
+ desc: 'Grandchild Description',
739
+ },
740
+ },
741
+ },
742
+ };
743
+
744
+ expect(getForwardedMapValues(input)).toEqual(expected);
745
+ });
746
+
747
+
748
+ test('should not mutate the original input object', () => {
749
+ const input = {
750
+ customer: {
751
+ name: 'Customer',
752
+ desc: 'Customer Description',
753
+ subtags: {
754
+ cumulative_points_currency: {
755
+ name: 'Lifetime Points (in ₹)',
756
+ desc: 'Lifetime Points in ₹ Description',
757
+ },
758
+ },
759
+ },
760
+ };
761
+
762
+ const inputCopy = JSON.parse(JSON.stringify(input)); // Deep copy
763
+
764
+ getForwardedMapValues(input);
765
+
766
+ expect(input).toEqual(inputCopy);
767
+ });
499
768
  });
@@ -71,4 +71,20 @@ export const expectedStateGetLiquidTagsRequest = {
71
71
  },
72
72
  orgID: "",
73
73
  token: ""
74
+ };
75
+
76
+ export const expectedForwardedTags = {
77
+ fetchingLiquidTags: false,
78
+ fetchingSchema: true,
79
+ fetchingSchemaError: '',
80
+ injectedTags: undefined,
81
+ liquidTags: [],
82
+ messages: [],
83
+ metaEntities: {
84
+ layouts: [],
85
+ tagLookupMap: {},
86
+ tags: []
87
+ },
88
+ orgID: "",
89
+ token: ""
74
90
  };
@@ -7,7 +7,7 @@ import * as types from './constants';
7
7
  import initialState from '../../initialState';
8
8
  import { FAILURE } from '../App/constants';
9
9
  import { TAG } from '../Whatsapp/constants';
10
- import { getTagMapValue } from '../../utils/tagValidations';
10
+ import { getTagMapValue, getForwardedMapValues } from '../../utils/tagValidations';
11
11
 
12
12
  function capReducer(state = fromJS(initialState.cap), action) {
13
13
  switch (action.type) {
@@ -117,7 +117,8 @@ function capReducer(state = fromJS(initialState.cap), action) {
117
117
  const combinedTagMap = {
118
118
  ...standardTagMap,
119
119
  ...customSubtags,
120
- ...extendedSubtags
120
+ ...extendedSubtags,
121
+ ...state.getIn(['metaEntities', 'tagLookupMap'])?.toJS(),
121
122
  };
122
123
  const stateMeta = state.get("metaEntities");
123
124
  return state
@@ -142,7 +143,18 @@ function capReducer(state = fromJS(initialState.cap), action) {
142
143
  metaEntities.tags.custom = _.filter(state.get('metaEntities').tags.custom, (tag) => action.tagList.indexOf(tag.name) === -1);
143
144
  return state.setIn(['metaEntities'], metaEntities);
144
145
  case types.SET_INJECTED_TAGS:
145
- return state.set('injectedTags', action.injectedTags);
146
+
147
+ // Deep clone the tagLookupMap to avoid direct mutations
148
+ let updatedMetaEntitiesTagLookUp = _.cloneDeep(state.getIn(['metaEntities', 'tagLookupMap']));
149
+ const formattedInjectedTags = getForwardedMapValues(action?.injectedTags);
150
+ // Merge the injectedTags with the existing tagLookupMap
151
+ updatedMetaEntitiesTagLookUp = {
152
+ ...formattedInjectedTags || {},
153
+ ...updatedMetaEntitiesTagLookUp || {},
154
+ };
155
+ return state
156
+ .set('injectedTags', action.injectedTags)
157
+ .setIn(['metaEntities', 'tagLookupMap'], fromJS(updatedMetaEntitiesTagLookUp));
146
158
  case types.GET_TOPBAR_MENU_DATA_REQUEST:
147
159
  return state.set('topbarMenuData', fromJS({ status: 'request' }));
148
160
  case types.GET_TOPBAR_MENU_DATA_SUCCESS:
@@ -10,6 +10,7 @@ import {
10
10
  GET_LIQUID_TAGS_FAILURE,
11
11
  GET_LIQUID_TAGS_REQUEST,
12
12
  GET_SCHEMA_FOR_ENTITY_SUCCESS,
13
+ SET_INJECTED_TAGS,
13
14
  } from '../constants';
14
15
  import reducer from '../reducer';
15
16
  import initialState from '../../../initialState';
@@ -18,7 +19,8 @@ import {
18
19
  expectedStateGetLiquidTagsFailure,
19
20
  expectedStateGetLiquidTagsSuccess,
20
21
  expectedStateGetSchemaForEntitySuccessTAG,
21
- expectedStateGetSchemaForEntitySuccess
22
+ expectedStateGetSchemaForEntitySuccess,
23
+ expectedForwardedTags
22
24
  } from '../mockData';
23
25
 
24
26
  const mockedInitialState = fromJS(initialState.cap);
@@ -106,4 +108,12 @@ describe('should handle GET_SUPPORT_VIDEOS_CONFIG', () => {
106
108
 
107
109
  expect(reducer(mockedInitialState, action).toJS()).toEqual(expectedStateGetSchemaForEntitySuccess);
108
110
  });
111
+ it('handles the GET_SCHEMA_FOR_ENTITY_SUCCESS action', () => {
112
+ const action = {
113
+ type: SET_INJECTED_TAGS,
114
+ data: {},
115
+ };
116
+
117
+ expect(reducer(mockedInitialState, action).toJS())?.fetchingSchema?.toEqual(true);
118
+ });
109
119
  });
@@ -73,8 +73,3 @@ export const GET_SENDER_DETAILS_FAILURE =
73
73
  export const GET_CDN_TRANSFORMATION_CONFIG_REQUEST = 'app/v2Containers/Templates/GET_CDN_TRANSFORMATION_CONFIG_REQUEST';
74
74
  export const GET_CDN_TRANSFORMATION_CONFIG_SUCCESS = 'app/v2Containers/Templates/GET_CDN_TRANSFORMATION_CONFIG_SUCCESS';
75
75
  export const GET_CDN_TRANSFORMATION_CONFIG_FAILURE = 'app/v2Containers/Templates/GET_CDN_TRANSFORMATION_CONFIG_FAILURE';
76
-
77
- export const ACCOUNT_MAPPING_ON_CHANNEL = {
78
- whatsapp: 'selectedWhatsappAccount',
79
- zalo: 'selectedZaloAccount',
80
- };
@@ -97,7 +97,7 @@ import {
97
97
  FACEBOOK as FACEBOOK_CHANNEL,
98
98
  CREATE,
99
99
  } from '../App/constants';
100
- import {MAX_WHATSAPP_TEMPLATES, WARNING_WHATSAPP_TEMPLATES , ACCOUNT_MAPPING_ON_CHANNEL} from './constants';
100
+ import {MAX_WHATSAPP_TEMPLATES, WARNING_WHATSAPP_TEMPLATES } from './constants';
101
101
  import { COPY_OF } from '../../containers/App/constants';
102
102
  import {
103
103
  TWILIO_CATEGORY_OPTIONS,
@@ -126,7 +126,6 @@ import emailIllustration from '../Assets/images/emailIllustration.svg';
126
126
  import smsIllustration from '../Assets/images/smsIllustration.svg';
127
127
  import pushIllustration from '../Assets/images/pushIllustration.svg';
128
128
  import whatsappIllustration from '../Assets/images/whatsappIllustration.png';
129
- import whatsappOrZaloAccountIllustration from '../Assets/images/whatsappOrZaloAccountIllustration.svg';
130
129
  import rcsIllustration from '../Assets/images/rcsIllustration.png';
131
130
  import zaloillustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
132
131
  import inAppIllustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
@@ -251,22 +250,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
251
250
  this.delayTimer = 0;
252
251
  }
253
252
 
254
- getHostName(selectedSourceAccountIdentifier, domainPropertiesData = []) {
255
- if (isEmpty(domainPropertiesData) || !selectedSourceAccountIdentifier) {
256
- return '';
257
- }
258
- for (const domainData of domainPropertiesData) {
259
- const { hostName, connectionProperties: { account_sid, wabaId, userid, sourceAccountIdentifier, oa_id } = {}} = domainData?.domainProperties || {};
260
- // If sourceAccountIdentifier is not present in the domainProperties, then it will try to find in account_sid, wabaId, user_id.
261
- // wabaId, user_id is, account_sid are for Karix, Gupshup, and Twilio (Whatsapp) respectively and oa_id is for Zalo.
262
- const sourceAccountIdentifiersArray = [account_sid, wabaId, userid, oa_id, sourceAccountIdentifier];
263
- if (sourceAccountIdentifiersArray.includes(selectedSourceAccountIdentifier)) {
264
- this.setState({hostName});
265
- return hostName;
266
- }
267
- }
268
- };
269
-
270
253
  componentWillMount() {
271
254
  if (this.state.channel === '') {
272
255
  let channel = '';
@@ -629,11 +612,11 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
629
612
  if (!isEmpty(nextProps.Templates.templateDetails) && !isEqual(nextProps.Templates.templateDetails, this.props.Templates.templateDetails)) {
630
613
  this.setState({ previewTemplate: nextProps.Templates.templateDetails });
631
614
  }
632
- const { weCrmAccounts: weCrmAccountsList = [], senderDetails = {} } = get(nextProps, 'Templates', {});
633
- const weCrmChannels = [WHATSAPP_LOWERCASE, ZALO_LOWERCASE];
615
+ const { weCrmAccounts: weCrmAccountsList = [], senderDetails: { hostName = '' } = {} } = get(nextProps, 'Templates', {});
616
+ const weCrmChannels = ['wechat', WHATSAPP_LOWERCASE, ZALO_LOWERCASE];
634
617
 
635
- // Keeping the wechat flow separate as it has different logic for setting the account.
636
- if (weCrmAccountsList?.length === 1 && this.state?.defaultAccount && selectedChannel === WECHAT_LOWERCASE && !isEmpty(senderDetails?.hostName)) {
618
+ if (weCrmAccountsList.length === 1 && this.state.defaultAccount && (weCrmChannels.indexOf(selectedChannel) > -1) && !isEmpty(hostName)) {
619
+ let paramsDefault = {};
637
620
  if (this.state.channel.toLowerCase() !== ZALO_LOWERCASE) {
638
621
  paramsDefault = {
639
622
  name: this.state.searchText,
@@ -641,109 +624,39 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
641
624
  };
642
625
  }
643
626
 
644
- const { sourceAccountIdentifier, configs } = weCrmAccountsList?.[0] || {};
627
+ const {name, sourceAccountIdentifier, configs } = weCrmAccountsList?.[0] || {};
645
628
  const {
629
+ token,
646
630
  wecrm_app_id,
647
631
  wecrm_token
648
632
  } = configs || {};
633
+ if (weCrmChannels.includes(selectedChannel)) {
634
+ if ([WHATSAPP_LOWERCASE, ZALO_LOWERCASE].includes(selectedChannel)) {
635
+ if (hostName === '') {
636
+ return;
637
+ }
649
638
 
650
- const paramsDefault = {
651
- wecrmId: wecrm_app_id,
652
- wecrmToken: wecrm_token,
653
- originalId: sourceAccountIdentifier,
639
+ weCrmAccountsList[0].hostName = hostName;
640
+ nextProps.actions.setChannelAccount(selectedChannel.toUpperCase(), weCrmAccountsList[0]);
641
+ if (selectedChannel === ZALO_LOWERCASE) {
642
+ paramsDefault.username = name;
643
+ paramsDefault.oa_id = sourceAccountIdentifier;
644
+ paramsDefault.token = token;
645
+ paramsDefault.host = hostName || this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName || this.state.hostName;
646
+ }
647
+ } else {
648
+ paramsDefault.wecrmId = wecrm_app_id;
649
+ paramsDefault.wecrmToken = wecrm_token;
650
+ paramsDefault.originalId = sourceAccountIdentifier;
651
+ nextProps.actions.setWeChatAccount(
652
+ weCrmAccountsList[0],
653
+ );
654
+ }
655
+
654
656
  }
655
- nextProps.actions.setWeChatAccount(
656
- weCrmAccountsList[0],
657
- );
658
-
659
657
  this.setState({ defaultAccount: false, activeMode: TEMPLATES_MODE, selectedAccount: weCrmAccountsList[0].name, hostName: weCrmAccountsList[0].hostName });
660
- this.getAllTemplates({ params: paramsDefault }, true);
661
- }
662
-
663
- if (weCrmAccountsList?.length && this.state?.defaultAccount && (weCrmChannels.includes(selectedChannel))) {
664
- const isSingleAccount = weCrmAccountsList?.length === 1;
665
- const selectedAccount = this.props.Templates[ACCOUNT_MAPPING_ON_CHANNEL[selectedChannel]] || {};
666
- const hostName = this.getHostName(isSingleAccount ? weCrmAccountsList[0]?.sourceAccountIdentifier : selectedAccount?.sourceAccountIdentifier, senderDetails?.domainProperties);
667
-
668
- if (!isEmpty(hostName)) {
669
- let paramsDefault = {};
670
- if (this.state.channel.toLowerCase() !== ZALO_LOWERCASE) {
671
- paramsDefault = {
672
- name: this.state.searchText,
673
- sortBy: this.state.sortBy,
674
- };
675
- }
676
-
677
- const {name, sourceAccountIdentifier, configs } = weCrmAccountsList?.[0] || {};
678
- if (isSingleAccount) {
679
- weCrmAccountsList[0].hostName = hostName;
680
- } else {
681
- selectedAccount.hostName = hostName;
682
- }
683
- nextProps.actions.setChannelAccount(selectedChannel?.toUpperCase(), isSingleAccount ? weCrmAccountsList[0] : selectedAccount);
684
- if (selectedChannel === ZALO_LOWERCASE) {
685
- paramsDefault.username = name;
686
- paramsDefault.oa_id = sourceAccountIdentifier;
687
- paramsDefault.token = configs?.token;
688
- paramsDefault.host = hostName || this.props.Templates?.selectedZaloAccount?.hostName;
689
- }
690
- if (selectedChannel === WHATSAPP_LOWERCASE) {
691
- paramsDefault.accountId = sourceAccountIdentifier;
692
- paramsDefault.host = hostName || this.props.Templates?.selectedWhatsappAccount?.hostName;
693
- }
694
- this.setState({ defaultAccount: false, activeMode: TEMPLATES_MODE, selectedAccount: isSingleAccount ? weCrmAccountsList[0]?.name : selectedAccount?.name });
695
- /**
696
- * Incase of multiple accounts, getAllTemplates is called on selecting the account. It's handled in onAccountSelect function.
697
- * But for single account, onAccountSelect function won't get executed and getAllTemplates will be excuted.
698
- */
699
- if (weCrmAccountsList?.length === 1) {
700
- this.getAllTemplates({params: paramsDefault}, true);
701
- }
702
- }
658
+ this.getAllTemplates({params: paramsDefault}, true);
703
659
  }
704
-
705
- // if (weCrmAccountsList.length === 1 && this.state.defaultAccount && (weCrmChannels.indexOf(selectedChannel) > -1) && !isEmpty(hostName)) {
706
- // let paramsDefault = {};
707
- // if (this.state.channel.toLowerCase() !== ZALO_LOWERCASE) {
708
- // paramsDefault = {
709
- // name: this.state.searchText,
710
- // sortBy: this.state.sortBy,
711
- // };
712
- // }
713
-
714
- // const {name, sourceAccountIdentifier, configs } = weCrmAccountsList?.[0] || {};
715
- // const {
716
- // token,
717
- // wecrm_app_id,
718
- // wecrm_token
719
- // } = configs || {};
720
- // if (weCrmChannels.includes(selectedChannel)) {
721
- // if ([WHATSAPP_LOWERCASE, ZALO_LOWERCASE].includes(selectedChannel)) {
722
- // if (hostName === '') {
723
- // return;
724
- // }
725
-
726
- // weCrmAccountsList[0].hostName = hostName;
727
- // nextProps.actions.setChannelAccount(selectedChannel.toUpperCase(), weCrmAccountsList[0]);
728
- // if (selectedChannel === ZALO_LOWERCASE) {
729
- // paramsDefault.username = name;
730
- // paramsDefault.oa_id = sourceAccountIdentifier;
731
- // paramsDefault.token = token;
732
- // paramsDefault.host = hostName || this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName || this.state.hostName;
733
- // }
734
- // } else {
735
- // paramsDefault.wecrmId = wecrm_app_id;
736
- // paramsDefault.wecrmToken = wecrm_token;
737
- // paramsDefault.originalId = sourceAccountIdentifier;
738
- // nextProps.actions.setWeChatAccount(
739
- // weCrmAccountsList[0],
740
- // );
741
- // }
742
-
743
- // }
744
- // this.setState({ defaultAccount: false, activeMode: TEMPLATES_MODE, selectedAccount: weCrmAccountsList[0].name, hostName: weCrmAccountsList[0].hostName });
745
- // this.getAllTemplates({params: paramsDefault}, true);
746
- // }
747
660
  const zaloPreviewUrl = get(nextProps, 'Zalo.zaloTemplatePreviewData.versions.base.content.zalo.previewUrl', '');
748
661
  if (zaloPreviewUrl && this.state.channel.toLowerCase() === ZALO_LOWERCASE) {
749
662
  handlePreviewInNewTab(zaloPreviewUrl);
@@ -768,7 +681,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
768
681
  params.sortBy = this.state.sortBy;
769
682
  }
770
683
  const selectedChannel = this.state.channel.toLowerCase();
771
- const isZaloOrWhatsapp = [ZALO_LOWERCASE, WHATSAPP_LOWERCASE].includes(selectedChannel);
772
684
  if (selectedChannel === 'wechat') {
773
685
  params.wecrmId = this.props.Templates.weCrmAccounts[findIndex(this.props.Templates.weCrmAccounts, { name: value})].configs.wecrm_app_id;
774
686
  params.wecrmToken = this.props.Templates.weCrmAccounts[findIndex(this.props.Templates.weCrmAccounts, { name: value})].configs.wecrm_token;
@@ -788,52 +700,26 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
788
700
  } else {
789
701
  this.setState({ selectedAccountError: false });
790
702
  }
791
- } else if ([LINE.toLowerCase(), RCS_LOWERCASE, ZALO_LOWERCASE, WHATSAPP_LOWERCASE].includes(selectedChannel)) {
703
+ } else if ([LINE.toLowerCase(), RCS_LOWERCASE, ZALO_LOWERCASE].includes(selectedChannel)) {
792
704
  const setAcc = this.props?.Templates?.weCrmAccounts?.find((item) => item?.name === this.state.selectedAccount);
793
- console.log(">>> get onAccountSelect", { isZaloOrWhatsapp, selectedChannel, setAcc, slectedAcc: this.state.selectedAccount, value, templ: this.props.Templates?.weCrmAccounts});
794
- const { domainProperties = [] } = this.props?.Templates?.senderDetails || {};
795
- let hostName = '';
796
- if (isZaloOrWhatsapp) {
797
- hostName = this.getHostName(setAcc?.sourceAccountIdentifier, domainProperties);
798
- setAcc.hostName = hostName;
799
- }
800
705
  this.props.actions.setChannelAccount(selectedChannel?.toUpperCase(), setAcc);
801
-
802
- const {
803
- name = "",
804
- sourceAccountIdentifier = "",
805
- configs: { token = "" } = {},
806
- } = setAcc || {};
807
-
808
- if(selectedChannel === ZALO_LOWERCASE && hostName) {
706
+ if(selectedChannel === ZALO_LOWERCASE){
707
+ const {
708
+ name = "",
709
+ sourceAccountIdentifier = "",
710
+ configs: { token = "" } = {},
711
+ } = setAcc || {};
809
712
  params.username = name;
810
713
  params.oa_id = sourceAccountIdentifier;
811
714
  params.token = token;
812
715
  params.isAccountSelection = true;
813
- // params.host = this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName || this.state.hostName;
814
- params.host = hostName;
815
- // this.getHostName(sourceAccountIdentifier, domainProperties) || this.props.Templates?.selectedZaloAccount?.hostName;
816
- }
817
- if (selectedChannel === WHATSAPP_LOWERCASE && hostName) {
818
- params.accountId = sourceAccountIdentifier;
819
- params.host = hostName;
820
- // this.getHostName(sourceAccountIdentifier, domainProperties) || this.props.Templates?.selectedWhatsappAccount?.hostName;
716
+ params.host = this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName || this.state.hostName;
821
717
  }
822
- console.log(">>> onAccountSelect", {params,sourceAccountIdentifier, hostName, setAcc, name,shn: this.state.hostName, token, setAcc, selectedChannel, value, templ: this.props.Templates});
823
718
  }
824
719
 
825
- // this.setState({activeMode: TEMPLATES_MODE});
826
- console.log(">>> GETALLTEMPLATES onaccount select 1", {params})
827
- // this.getAllTemplates({params, resetPage: true});
720
+ this.setState({activeMode: TEMPLATES_MODE});
828
721
 
829
- // Always set activeMode before getAllTemplates call
830
- this.setState({ activeMode: TEMPLATES_MODE }, () => {
831
- // Restrict getAllTemplates call only if selectedChannel is ZALO or WHATSAPP and hostName is empty
832
- if (!(isZaloOrWhatsapp && !params?.host)) {
833
- console.log(">>> GETALLTEMPLATES onaccount select ", { params });
834
- this.getAllTemplates({ params, resetPage: true });
835
- }
836
- });
722
+ this.getAllTemplates({params, resetPage: true});
837
723
  });
838
724
  }
839
725
  onPaginationChange = () => {
@@ -911,17 +797,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
911
797
 
912
798
  moment.locale(locale);
913
799
  };
914
-
915
- setWhatsappQueryParams = (queryParams, params) => {
916
- queryParams.accountId = params?.accountId || this.props.Templates?.selectedWhatsappAccount?.sourceAccountIdentifier;
917
- queryParams.host = params?.host || this.state?.hostName;
918
- };
919
-
920
800
  getAllTemplates = ({params, getNextPage, resetPage}, resetTemplates) => {
921
801
  let queryParams = params || {};
922
802
  let page = this.state.page;
923
803
  const { activeMode } = this.state;
924
- console.log(">>> getAllTemplates", {params, getNextPage, resetPage, resetTemplates, elseif: (resetPage || (page === 1 && this.state.templatesCount === 0) || page <= (this.state.templatesCount / this.state.perPageLimit))})
925
804
  if (activeMode === ACCOUNT_SELECTION_MODE) {
926
805
  this.setTemplatesMode();
927
806
  }
@@ -946,9 +825,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
946
825
  if (([MOBILE_PUSH_LOWERCASE, INAPP_LOWERCASE].includes(channel.toLowerCase())) && !isEmpty(this.props.Templates.selectedWeChatAccount)) {
947
826
  queryParams.accountId = this.props.Templates?.selectedWeChatAccount?.id;
948
827
  }
949
- if (this.state?.channel?.toLowerCase() === WHATSAPP_LOWERCASE) {
950
- this.setWhatsappQueryParams(queryParams, params);
951
- }
952
828
  this.props.actions.getAllTemplates(channel, queryParams,`${copyOf}`);
953
829
  } else if ((resetPage || (page === 1 && this.state.templatesCount === 0) || page <= (this.state.templatesCount / this.state.perPageLimit))) {
954
830
  if (getNextPage) {
@@ -998,9 +874,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
998
874
  queryParams.token = token;
999
875
  queryParams.host = hostName || this.props.Templates?.senderDetails?.hostName ||this.state.hostName;
1000
876
  }
1001
- if (this.state?.channel?.toLowerCase() === WHATSAPP_LOWERCASE) {
1002
- this.setWhatsappQueryParams(queryParams, params);
1003
- }
1004
877
  this.setState({ page, templatesCount }, () => {
1005
878
  queryParams.page = page;
1006
879
  queryParams.perPage = this.state.perPageLimit;
@@ -1137,7 +1010,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1137
1010
  };
1138
1011
 
1139
1012
  getTemplateDataForGrid = ({templates = [], handlers, filterContent, channel, isLoading, loadingTip}) => {
1140
- console.log("@@@ getTemplateDataForGrid", {templates, handlers, filterContent, channel, isLoading, loadingTip})
1141
1013
  const currentChannel = channel.toUpperCase();
1142
1014
  const {channel: stateChannel} = this.state;
1143
1015
  const channelLowerCase = stateChannel.toLowerCase();
@@ -1148,7 +1020,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1148
1020
  filteredTemplates = this.filterWechatTemplates(templates);
1149
1021
  break;
1150
1022
  case WHATSAPP:
1151
- filteredTemplates = this.state?.hostName ? this.filterWhatsappTemplates(templates) : [];
1023
+ filteredTemplates = this.filterWhatsappTemplates(templates);
1152
1024
  break;
1153
1025
  case LINE:
1154
1026
  filteredTemplates = this.filterLineTemplates(templates);
@@ -1509,17 +1381,16 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1509
1381
 
1510
1382
  const accountId = get(this.props, 'Templates.selectedWeChatAccount.uuid');
1511
1383
  const accounts = get(this.props, 'Templates.weCrmAccounts');
1512
- const noWhatsappZaloTemplates = this.isFullMode() && isEmpty(templates) || !this.state.hostName;
1384
+ const noWhatsappZaloTemplates = this.isFullMode() && isEmpty(templates);
1513
1385
  const noFilteredWhatsappZaloTemplates = this.isFullMode() && !isEmpty(templates) && isEmpty(filteredTemplates);
1514
1386
  const noApprovedWhatsappZaloTemplates = !this.isFullMode() && isEmpty(filteredTemplates);
1515
- const showWhatsappIllustration = (!isEmpty(this.props.Templates.selectedWhatsappAccount) && [WHATSAPP_LOWERCASE].includes(channelLowerCase)) || !this.state.hostName ;
1387
+ const showWhatsappIllustration = !isEmpty(this.props.Templates.selectedWhatsappAccount) && [WHATSAPP_LOWERCASE].includes(channelLowerCase);
1516
1388
  const showZaloIllustration = !isEmpty(this.props.Templates.selectedZaloAccount) && [ZALO_LOWERCASE].includes(channelLowerCase);
1517
1389
  const showRcsIllustration = channelLowerCase === RCS_LOWERCASE && isEmpty(templates);
1518
1390
  const showInAppIllustration = channelLowerCase === INAPP_LOWERCASE && isEmpty(templates);
1519
1391
  const noLoaderAndSearchText = isEmpty(this.state.searchText) && !isLoading;
1520
- console.log(">>> state ", {showWhatsappIllustration, noLoaderAndSearchText, channelLowerCase, host: this.state.hostName, templates: this.props.Templates})
1521
1392
  return (<div>
1522
- {[WECHAT, MOBILE_PUSH, INAPP, WHATSAPP, ZALO].includes(currentChannel) && this.showAccountName()}
1393
+ {[WECHAT, MOBILE_PUSH, INAPP].includes(currentChannel) && this.showAccountName()}
1523
1394
  {filterContent}
1524
1395
  {[WHATSAPP, ZALO].includes(currentChannel) && this.selectedFilters()}
1525
1396
  <CapCustomSkeleton loader={isLoading}>
@@ -1556,15 +1427,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1556
1427
  isEmpty(filteredTemplates) &&
1557
1428
  isEmpty(this.state.searchText) &&
1558
1429
  <div style={this.isFullMode() ? { height: "calc(100vh - 325px)", overflow: 'auto'} : {}}>
1559
- <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel, this.state.hostName)} />
1430
+ <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />
1560
1431
  </div>
1561
1432
  )
1562
1433
  }
1563
1434
  {(showWhatsappIllustration || showZaloIllustration) && (
1564
1435
  noLoaderAndSearchText &&
1565
1436
  <div style={this.isFullMode() ? { height: "calc(100vh - 325px)", overflow: 'auto' } : {}}>
1566
- {noWhatsappZaloTemplates && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel, isEmpty(this.state.hostName))} />}
1567
- {noFilteredWhatsappZaloTemplates && this.state?.hostName && this.whatsappZaloIllustrationText('noFilteredWhatsappZaloTemplatesTitle', 'noFilteredWhatsappZaloTemplatesDesc')}
1437
+ {noWhatsappZaloTemplates && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />}
1438
+ {noFilteredWhatsappZaloTemplates && this.whatsappZaloIllustrationText('noFilteredWhatsappZaloTemplatesTitle', 'noFilteredWhatsappZaloTemplatesDesc')}
1568
1439
  {noApprovedWhatsappZaloTemplates && this.whatsappZaloIllustrationText('noApprovedWhatsappZaloTemplatesTitle', showWhatsappIllustration ? 'noApprovedWhatsappTemplatesDesc' : 'zaloDescIllustration')}
1569
1440
  </div>
1570
1441
  )
@@ -1969,9 +1840,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1969
1840
  }
1970
1841
  if (this.state.channel.toLowerCase() === MOBILE_PUSH_LOWERCASE) {
1971
1842
  params.accountId = this.props.Templates.selectedWeChatAccount.id;
1972
- } else if (this.state.channel.toLowerCase() === WHATSAPP_LOWERCASE) {
1973
- params.accountId = this.props.Templates?.selectedWhatsappAccount?.sourceAccountIdentifier;
1974
- params.host = this.state?.hostName;
1975
1843
  }
1976
1844
  this.delay(() => {
1977
1845
  this.getAllTemplates({params, resetPage: true});
@@ -2575,7 +2443,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2575
2443
  (rcsLoader !== undefined ? rcsLoader : false);
2576
2444
  return isLoading;
2577
2445
  }
2578
- getChannelTypeIllustrationInfo = (type, hostNameNotFound) => {
2446
+ getChannelTypeIllustrationInfo = (type) => {
2579
2447
  const { isFullMode, intl } = this.props;
2580
2448
  const templateIntlMsg = intl.formatMessage(messages.template);
2581
2449
  const templateText = isFullMode ? templateIntlMsg : '';
@@ -2601,28 +2469,16 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2601
2469
  illustrationImage: pushIllustration,
2602
2470
  title: <FormattedMessage {...messages.pushTitleIllustartion} values={{ template: templateText }} />,
2603
2471
  };
2604
- case WHATSAPP: {
2605
- if (hostNameNotFound) {
2606
- return {
2607
- illustrationImage: whatsappOrZaloAccountIllustration,
2608
- title: <FormattedMessage {...messages.whatsappAccountNotConfiguredTitle} />,
2609
- description: <FormattedMessage {...messages.accountNotConfiguredDescription} />,
2610
- descriptionPosition: 'bottom',
2611
- descriptionClassName: 'illustration-desc zalo-illustration',
2612
- buttonClassName: "zalo-illustration-button",
2613
- };
2614
- } else {
2615
- return {
2616
- buttonLabel: <FormattedMessage {...messages.newWhatsappTemplate} values={{ template: templateText }} />,
2617
- onClick: this.createTemplate,
2618
- illustrationImage: whatsappIllustration,
2619
- title: <FormattedMessage {...messages.whatsappTitleIllustration} values={{ template: templateText }} />,
2620
- description: <FormattedMessage {...messages.whatsappDescIllustration} />,
2621
- descriptionPosition: 'bottom',
2622
- descriptionClassName: 'illustration-desc',
2623
- };
2624
- }
2625
- }
2472
+ case WHATSAPP:
2473
+ return {
2474
+ buttonLabel: <FormattedMessage {...messages.newWhatsappTemplate} values={{ template: templateText }} />,
2475
+ onClick: this.createTemplate,
2476
+ illustrationImage: whatsappIllustration,
2477
+ title: <FormattedMessage {...messages.whatsappTitleIllustration} values={{ template: templateText }} />,
2478
+ description: <FormattedMessage {...messages.whatsappDescIllustration} />,
2479
+ descriptionPosition: 'bottom',
2480
+ descriptionClassName: 'illustration-desc',
2481
+ };
2626
2482
  case RCS:
2627
2483
  return {
2628
2484
  buttonLabel: <FormattedMessage {...messages.newRCSTemplate} values={{ template: templateText }} />,
@@ -2633,27 +2489,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2633
2489
  descriptionPosition: 'bottom',
2634
2490
  descriptionClassName: 'illustration-desc rcs-illustration',
2635
2491
  };
2636
- case ZALO:{
2637
- if (hostNameNotFound) {
2638
- return {
2639
- illustrationImage: whatsappOrZaloAccountIllustration,
2640
- title: <FormattedMessage {...messages.zaloAccountNotConfiguredTitle} />,
2641
- description: <FormattedMessage {...messages.accountNotConfiguredDescription} />,
2642
- descriptionPosition: 'bottom',
2643
- descriptionClassName: 'illustration-desc zalo-illustration',
2644
- buttonClassName: "zalo-illustration-button",
2645
- };
2646
- } else {
2647
- return {
2648
- illustrationImage: zaloillustration,
2649
- title: <FormattedMessage {...messages.zaloTitleIllustration} />,
2650
- description: <FormattedMessage {...messages.zaloDescIllustration} />,
2651
- descriptionPosition: 'bottom',
2652
- descriptionClassName: 'illustration-desc zalo-illustration',
2653
- buttonClassName: "zalo-illustration-button",
2654
- };
2655
- }
2656
- }
2492
+ case ZALO:
2493
+ return {
2494
+ illustrationImage: zaloillustration,
2495
+ title: <FormattedMessage {...messages.zaloTitleIllustration} />,
2496
+ description: <FormattedMessage {...messages.zaloDescIllustration} />,
2497
+ descriptionPosition: 'bottom',
2498
+ descriptionClassName: 'illustration-desc zalo-illustration',
2499
+ buttonClassName: "zalo-illustration-button",
2500
+ };
2657
2501
  case INAPP:
2658
2502
  return {
2659
2503
  illustrationImage: inAppIllustration,
@@ -2708,7 +2552,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2708
2552
  return modal;
2709
2553
  };
2710
2554
 
2711
- renderAccountSelection = (linenum) => {
2555
+ renderAccountSelection = () => {
2712
2556
  const accountOptions = [];
2713
2557
  const { selectedAccount } = this.state;
2714
2558
  let { channel = '' } = this.state;
@@ -2720,9 +2564,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2720
2564
  const isMobilePushChannel = channel === MOBILE_PUSH;
2721
2565
  const isInAppChannel = channel === INAPP;
2722
2566
  const isFacebookChannel = channel === FACEBOOK;
2723
- if ([WECHAT, MOBILE_PUSH, INAPP, LINE, ZALO, WHATSAPP].includes(channel) && !isEmpty(weCrmAccounts) && !isFacebookChannel) {
2567
+
2568
+ if ([WECHAT, MOBILE_PUSH, INAPP, LINE, ZALO].includes(channel) && !isEmpty(weCrmAccounts) && !isFacebookChannel) {
2724
2569
  forEach(weCrmAccounts, (account) => {
2725
- if ((isWechatChannel && account.configs && account.configs.is_wecrm_enabled) || [MOBILE_PUSH, INAPP, LINE, ZALO, WHATSAPP].includes(channel)) {
2570
+ if ((isWechatChannel && account.configs && account.configs.is_wecrm_enabled) || [MOBILE_PUSH, INAPP, LINE, ZALO].includes(channel)) {
2726
2571
  if (query.type === 'embedded' && (!query.module || (query.module && query.module !== 'library'))) {
2727
2572
  if (query.source_account_id && account.sourceAccountIdentifier === query.source_account_id) {
2728
2573
  accountOptions.push(
@@ -2805,10 +2650,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2805
2650
  break;
2806
2651
  }
2807
2652
  let showNoAccountHeader = isEmpty(weCrmAccounts) && !fetchingWeCrmAccounts;
2808
- // This is not required as whatsapp will have account selection for multiple accounts
2809
- // if (channel === WHATSAPP && this.state.hostName === '') {
2810
- // showNoAccountHeader = true;
2811
- // }
2653
+ if (channel === WHATSAPP && this.state.hostName === '') {
2654
+ showNoAccountHeader = true;
2655
+ }
2812
2656
  if (channel === FACEBOOK && !isEmpty(campaignSettings) ) {
2813
2657
  const fbSetting = get(campaignSettings, 'accountSettings.socialAccountSettings.facebookAccountSettings', []);
2814
2658
  const { orgUnitFacebookPageSettingsMap } = fbSetting[0] || {};
@@ -2827,7 +2671,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2827
2671
  if (channel === WECHAT && !commonUtil.hasWechatFeatureEnabled()) {
2828
2672
  showNoAccountHeader = true;
2829
2673
  }
2830
- console.log("### renderAccountSelection -> showNoAccountHeader", {linenum, hostName: this.state.hostName, showNoAccountHeader, selectedAccount, accountOptions, accountHeader, noAccountHeader })
2831
2674
  return (<CapSkeleton loading={fetchingWeCrmAccounts} active paragraph={{ rows: 10 }}>
2832
2675
  {showNoAccountHeader ? <FormattedMessage {...noAccountHeader} /> :
2833
2676
  <div style={{ overflowX: "auto", paddingBottom: CAP_SPACE_16 }}>
@@ -3003,7 +2846,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3003
2846
 
3004
2847
 
3005
2848
  if (activeMode === ACCOUNT_SELECTION_MODE && showForChannels ) {
3006
- return this.renderAccountSelection(3006);
2849
+ return this.renderAccountSelection();
3007
2850
  }
3008
2851
 
3009
2852
 
@@ -3031,7 +2874,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3031
2874
  );
3032
2875
  //TODO -> uncomment the following line
3033
2876
  // const isfilterContentVisisble = !isEmpty(this.props.TemplatesList) || !isEmpty(this.state.searchText) || !isEmpty(this.props.Templates.templateError);
3034
- let isfilterContentVisisble = true;
2877
+ const isfilterContentVisisble = true;
3035
2878
  const isWechatEmbedded = !this.props.isFullMode && channel.toUpperCase() === WECHAT;
3036
2879
  const channelLowerCase = (channel || '').toLowerCase();
3037
2880
  const isTraiDltFeature = this.checkDLTfeatureEnable();
@@ -3046,7 +2889,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3046
2889
  className="create-new-link"
3047
2890
  />
3048
2891
  )
3049
- : this.state?.channel?.toLowerCase() === ZALO_LOWERCASE || (channelLowerCase === WHATSAPP_LOWERCASE && isEmpty(this.state?.hostName)) ? <></> : (
2892
+ : this.state.channel.toLowerCase() === ZALO_LOWERCASE ? <></> : (
3050
2893
  <CapButton
3051
2894
  className={`create-new-${channelLowerCase} margin-l-8 margin-b-12`}
3052
2895
  type={"primary"}
@@ -3060,9 +2903,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3060
2903
  const isWhatsappCountExeeded = templatesCount >= MAX_WHATSAPP_TEMPLATES;
3061
2904
  const showWhatsappCountWarning = templatesCount >= WARNING_WHATSAPP_TEMPLATES;
3062
2905
  const whatsappCountExceedText = <FormattedMessage {...messages.whatsappMaxTemplates} values={{ maxCount: MAX_WHATSAPP_TEMPLATES }}/>;
3063
- if (([WHATSAPP_LOWERCASE, ZALO_LOWERCASE].includes(this.state?.channel?.toLocaleLowerCase()) && isEmpty(this.state?.hostName))) {
3064
- isfilterContentVisisble = false;
3065
- }
2906
+
3066
2907
  const filterContent = (( isfilterContentVisisble || [WECHAT, MOBILE_PUSH, INAPP].includes(this.state.channel.toUpperCase())) && <div className="action-container">
3067
2908
  {isfilterContentVisisble && <CapInput.Search
3068
2909
  className="search-text"
@@ -3091,7 +2932,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3091
2932
  channel.toUpperCase() === ZALO && (
3092
2933
  <div className="zalo-filters">
3093
2934
  {
3094
- this.props?.isFullMode && this.state?.hostName ? (
2935
+ this.props.isFullMode ? (
3095
2936
  <CapSelectFilter
3096
2937
  placement="bottomLeft"
3097
2938
  data={ZALO_STATUS_OPTIONS}
@@ -3110,7 +2951,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3110
2951
  channel.toUpperCase() === WHATSAPP && (
3111
2952
  <div className="whatsapp-filters">
3112
2953
  {
3113
- this.props?.isFullMode && this.state?.hostName ? (
2954
+ this.props.isFullMode ? (
3114
2955
  <CapSelectFilter
3115
2956
  placement="bottomLeft"
3116
2957
  data={STATUS_OPTIONS}
@@ -3122,20 +2963,18 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3122
2963
  />
3123
2964
  ) : null
3124
2965
  }
3125
- {this.state?.hostName ? (
3126
- <CapSelectFilter
3127
- placement="bottomLeft"
3128
- data={this.state.hostName === HOST_TWILIO
3129
- ? TWILIO_CATEGORY_OPTIONS
3130
- : KARIX_GUPSHUP_CATEGORY_OPTIONS}
3131
- onSelect={this.setWhatsappCategory}
3132
- selectedValue={this.state.selectedWhatsappCategory}
3133
- placeholder="Category"
3134
- showBadge
3135
- width="105px"
3136
- overlayStyle={{ overflowY: "hidden" }}
3137
- />
3138
- ) : null}
2966
+ <CapSelectFilter
2967
+ placement="bottomLeft"
2968
+ data={this.state.hostName === HOST_TWILIO
2969
+ ? TWILIO_CATEGORY_OPTIONS
2970
+ : KARIX_GUPSHUP_CATEGORY_OPTIONS}
2971
+ onSelect={this.setWhatsappCategory}
2972
+ selectedValue={this.state.selectedWhatsappCategory}
2973
+ placeholder="Category"
2974
+ showBadge
2975
+ width="105px"
2976
+ overlayStyle={{ overflowY: "hidden" }}
2977
+ />
3139
2978
  </div>
3140
2979
 
3141
2980
  )
@@ -3208,7 +3047,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3208
3047
  }
3209
3048
  <div style={{display: "flex", justifyContent: "space-between", alignItems: 'center'}}>
3210
3049
  {
3211
- this.state?.channel?.toLowerCase() === WHATSAPP_LOWERCASE && (isWhatsappCountExeeded)? (
3050
+ this.state.channel.toLowerCase() === WHATSAPP_LOWERCASE && isWhatsappCountExeeded ? (
3212
3051
  <CapTooltip title={whatsappCountExceedText}>
3213
3052
  <div className="button-disabled-tooltip-wrapper">
3214
3053
  {createButton}
@@ -3249,7 +3088,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3249
3088
 
3250
3089
  return (
3251
3090
  <>
3252
- {activeMode === ACCOUNT_CHANGE_MODE && this.renderAccountSelection(3252)}
3091
+ {activeMode === ACCOUNT_CHANGE_MODE && this.renderAccountSelection()}
3253
3092
  <div className={`creatives-templates-list ${this.props.isFullMode ? 'full-mode' : 'library-mode'}`}>
3254
3093
  <input type="file" id="filename" style={{ display: 'none'}} accept=".zip, .html, .htm" onChange={(event) => this.handleFileUpload(event, {files: event.target.files})} />
3255
3094
 
@@ -354,18 +354,6 @@ export default defineMessages({
354
354
  id: `${scope}.whatsappDescIllustration`,
355
355
  defaultMessage: 'These templates can be reused when creating a\nnew message content.',
356
356
  },
357
- "whatsappAccountNotConfiguredTitle": {
358
- id: `${scope}.whatsappAccountNotConfiguredTitle`,
359
- defaultMessage: 'Whatsapp account is not configured',
360
- },
361
- "accountNotConfiguredDescription": {
362
- id: `${scope}.accountNotConfiguredDescription`,
363
- defaultMessage: 'Please contact your Customer Success Manager to fix the issue.',
364
- },
365
- "zaloAccountNotConfiguredTitle": {
366
- id: `${scope}.zaloAccountNotConfiguredTitle`,
367
- defaultMessage: 'Zalo account is not configured',
368
- },
369
357
  "zaloTitleIllustration": {
370
358
  id: `${scope}.zaloTitleIllustration`,
371
359
  defaultMessage: 'There are no approved templates available',
@@ -180,17 +180,12 @@ function templatesReducer(state = initialState, action) {
180
180
  return state.set('fetchedOrgLevelCampaignSettings', false);
181
181
  case types.GET_SENDER_DETAILS_REQUEST:
182
182
  return state.set('senderDetails', { status: 'REQUEST' });
183
- case types.GET_SENDER_DETAILS_SUCCESS: {
184
- const { channel, domainProperties = {} } = action?.payload || {};
185
- const isMultiAccountChannel = ['WHATSAPP', 'ZALO'].includes(channel);
186
- const senderDetailsKey = isMultiAccountChannel ? 'domainProperties' : 'hostName';
187
- // For Whatsapp and Zalo we need to store domainProperties instead of only hostName
183
+ case types.GET_SENDER_DETAILS_SUCCESS:
188
184
  return state.set('senderDetails', {
189
185
  status: 'SUCCESS',
190
- [senderDetailsKey]: isMultiAccountChannel ? domainProperties : action?.payload,
186
+ hostName: action.payload,
191
187
  errors: [],
192
188
  });
193
- }
194
189
  case types.GET_SENDER_DETAILS_FAILURE:
195
190
  return state.set('senderDetails', {
196
191
  status: 'FAILURE',
@@ -63,176 +63,6 @@ export function* fetchUserList() {
63
63
  export function* fetchWeCrmAccounts(action) {
64
64
  try {
65
65
  const result = yield call(Api.fetchWeCrmAccounts, action.source);
66
- // const result = {
67
- // "success": true,
68
- // "status": {
69
- // "isError": false,
70
- // "code": 200,
71
- // "message": "success"
72
- // },
73
- // "message": "WeCRM Account details fetched",
74
- // "response": [
75
- // {
76
- // "id": 13694,
77
- // "uuid": "c41edad79aab48dcb1030722509ab322",
78
- // "name": "CapillaryWABA",
79
- // "sourceAccountIdentifier": "107499611940863",
80
- // "toMirror": true,
81
- // "sourceTypeId": 19,
82
- // "sourceTypeName": "WHATSAPP",
83
- // "isActive": true,
84
- // "commChannels": [
85
- // "whatsapp"
86
- // ],
87
- // "configs": {
88
- // "accessToken": "Bearer gDwEuRIm9icV6phixociSw==",
89
- // "promotionalMessagingSSID": "919611759663",
90
- // "transactionalMessagingSSID": "919611759663",
91
- // hostName: "karixwhatsappbulk"
92
- // },
93
- // "attribution": {
94
- // "createDate": "2025-01-10T00:00:00+05:30",
95
- // "createdBy": {
96
- // "id": 50716406,
97
- // "code": "1724755070_",
98
- // "description": "",
99
- // "name": "1724755070_Aneel",
100
- // "type": "ADMIN_USER",
101
- // "referenceId": -1,
102
- // "adminType": "GENERAL",
103
- // "isActive": true,
104
- // "isOuEnabled": false,
105
- // "timeZoneId": 0,
106
- // "currencyId": 0,
107
- // "languageId": 0,
108
- // "default": false
109
- // },
110
- // "modifiedBy": {
111
- // "id": 50716406,
112
- // "code": "1724755070_",
113
- // "description": "",
114
- // "name": "1724755070_Aneel",
115
- // "type": "ADMIN_USER",
116
- // "referenceId": -1,
117
- // "adminType": "GENERAL",
118
- // "isActive": true,
119
- // "isOuEnabled": false,
120
- // "timeZoneId": 0,
121
- // "currencyId": 0,
122
- // "languageId": 0,
123
- // "default": false
124
- // },
125
- // "modifiedDate": "2025-01-10T00:00:00+05:30"
126
- // }
127
- // },
128
- // {
129
- // "id": 13695,
130
- // "uuid": "e0cd92248fc54b7eb04c470e7434f8c3",
131
- // "name": "gupshup_otp_nightly",
132
- // "sourceAccountIdentifier": "2000239981",
133
- // "toMirror": true,
134
- // "sourceTypeId": 19,
135
- // "sourceTypeName": "WHATSAPP",
136
- // "isActive": true,
137
- // "commChannels": [
138
- // "whatsapp"
139
- // ],
140
- // "configs": {
141
- // "accessToken": "qrtCAJCz",
142
- // "promotionalMessagingSSID": "919289221771",
143
- // "transactionalMessagingSSID": "919289221771",
144
- // hostName: "gupshupwhatsappbulk"
145
- // },
146
- // "attribution": {
147
- // "createDate": "2025-01-13T00:00:00+05:30",
148
- // "createdBy": {
149
- // "id": 50716406,
150
- // "code": "1724755070_",
151
- // "description": "",
152
- // "name": "1724755070_Aneel",
153
- // "type": "ADMIN_USER",
154
- // "referenceId": -1,
155
- // "adminType": "GENERAL",
156
- // "isActive": true,
157
- // "isOuEnabled": false,
158
- // "timeZoneId": 0,
159
- // "currencyId": 0,
160
- // "languageId": 0,
161
- // "default": false
162
- // },
163
- // "modifiedBy": {
164
- // "id": 50716406,
165
- // "code": "1724755070_",
166
- // "description": "",
167
- // "name": "1724755070_Aneel",
168
- // "type": "ADMIN_USER",
169
- // "referenceId": -1,
170
- // "adminType": "GENERAL",
171
- // "isActive": true,
172
- // "isOuEnabled": false,
173
- // "timeZoneId": 0,
174
- // "currencyId": 0,
175
- // "languageId": 0,
176
- // "default": false
177
- // },
178
- // "modifiedDate": "2025-01-13T00:00:00+05:30"
179
- // }
180
- // },
181
- // {
182
- // "id": 13696,
183
- // "uuid": "e0cd92248fc54b7eb04c470e7434f8c4",
184
- // "name": "Gupshup_Dummy",
185
- // "sourceAccountIdentifier": "20002399812",
186
- // "toMirror": true,
187
- // "sourceTypeId": 19,
188
- // "sourceTypeName": "WHATSAPP",
189
- // "isActive": true,
190
- // "commChannels": [
191
- // "whatsapp"
192
- // ],
193
- // "configs": {
194
- // "accessToken": "qrtCAJCz",
195
- // "promotionalMessagingSSID": "919289221771",
196
- // "transactionalMessagingSSID": "919289221771",
197
- // hostName: "gupshupwhatsappbulk"
198
- // },
199
- // "attribution": {
200
- // "createDate": "2025-01-13T00:00:00+05:30",
201
- // "createdBy": {
202
- // "id": 50716406,
203
- // "code": "1724755070_",
204
- // "description": "",
205
- // "name": "1724755070_Aneel",
206
- // "type": "ADMIN_USER",
207
- // "referenceId": -1,
208
- // "adminType": "GENERAL",
209
- // "isActive": true,
210
- // "isOuEnabled": false,
211
- // "timeZoneId": 0,
212
- // "currencyId": 0,
213
- // "languageId": 0,
214
- // "default": false
215
- // },
216
- // "modifiedBy": {
217
- // "id": 50716406,
218
- // "code": "1724755070_",
219
- // "description": "",
220
- // "name": "1724755070_Aneel",
221
- // "type": "ADMIN_USER",
222
- // "referenceId": -1,
223
- // "adminType": "GENERAL",
224
- // "isActive": true,
225
- // "isOuEnabled": false,
226
- // "timeZoneId": 0,
227
- // "currencyId": 0,
228
- // "languageId": 0,
229
- // "default": false
230
- // },
231
- // "modifiedDate": "2025-01-13T00:00:00+05:30"
232
- // }
233
- // }
234
- // ]
235
- // }
236
66
  yield put({
237
67
  type: types.GET_WECRM_ACCOUNTS_SUCCESS,
238
68
  data: result.response,
@@ -331,14 +161,8 @@ export function* getSenderDetails({
331
161
  if (!apiResponse?.errors?.length) {
332
162
  yield put({
333
163
  type: types.GET_SENDER_DETAILS_SUCCESS,
334
- // payload: get(apiResponse, `entity.${channel}[0].domainProperties.hostName`, ''),
335
- payload: ['WHATSAPP', 'ZALO'].includes(channel) ?
336
- { channel,
337
- domainProperties: get(apiResponse, `entity.${channel}`, '')
338
- } :
339
- get(apiResponse, `entity.${channel}[0].domainProperties.hostName`, ''),
164
+ payload: get(apiResponse, `entity.${channel}[0].domainProperties.hostName`, ''),
340
165
  });
341
-
342
166
  } else {
343
167
  yield put({
344
168
  type: types.GET_SENDER_DETAILS_FAILURE,
@@ -240,7 +240,6 @@ export const Whatsapp = (props) => {
240
240
  name = '',
241
241
  hostName = '',
242
242
  } = accountObj;
243
- console.log('accountObj', {hostName, sourceAccountIdentifier, configs, accountObj});
244
243
  setAccountId(sourceAccountIdentifier);
245
244
  setAccessToken(configs.accessToken || '');
246
245
  setAccountName(name);
@@ -1,11 +0,0 @@
1
- <svg width="152" height="152" viewBox="0 0 152 152" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path fill-rule="evenodd" clip-rule="evenodd" d="M86.9122 17.3023C106.492 7.08226 130.722 14.6223 141.322 44.7423C148.432 64.9823 149.082 88.5923 137.812 106.942C132.312 115.902 123.992 123.602 112.212 129.052C107.701 131.125 102.981 132.707 98.1322 133.772C97.6822 133.882 97.1622 133.992 96.6822 134.072C78.9322 137.702 59.5622 135.072 43.2022 128.072L42.8522 127.912C28.4122 121.622 16.3222 111.892 9.85221 99.9723C9.83606 99.944 9.8199 99.9125 9.80309 99.8796C9.77827 99.8312 9.75202 99.78 9.72221 99.7323C-0.927788 79.8523 8.75221 66.6223 16.0722 60.1623C18.7689 57.8105 21.8026 55.8757 25.0722 54.4223C34.0723 50.3945 42.7163 45.6142 50.9122 40.1323C62.9722 31.8323 75.7522 23.1323 86.9122 17.3023ZM35.1022 30.6523C35.1022 30.6523 27.7822 38.6523 32.4922 42.8423C36.1322 46.1023 47.4922 40.2323 48.1222 34.7123C48.6322 30.7523 42.4222 23.6723 35.1322 30.6523H35.1022ZM25.2122 46.1223C25.2122 46.1223 21.8422 45.2723 21.9622 49.1923C22.0822 53.1123 25.7522 51.3623 26.8322 50.5823C27.9122 49.8023 29.6322 46.9623 25.2122 46.1223Z" fill="#FFD24B"/>
3
- <path d="M57.0425 61.592C53.7025 61.502 55.3525 61.242 59.4725 60.382C62.9825 59.652 67.6325 58.492 70.1325 56.702C79.1325 50.262 88.1325 50.122 93.2325 62.242C104.012 87.922 114.522 113.502 99.8525 134.772C99.8525 134.772 103.963 115.032 100.222 104.772C100.222 104.772 93.3525 114.152 82.9025 113.462C82.9025 113.462 99.9025 90.822 91.9025 83.042C91.9025 83.042 72.5125 73.042 74.4325 91.732C74.4325 91.732 76.6125 103.852 80.9825 109.802C80.9825 109.802 73.3325 109.342 69.1225 103.632C69.1225 103.632 66.7425 112.902 69.8825 135.632C69.8825 135.632 55.2025 118.202 68.1125 84.102C70.4025 78.122 84.2125 62.362 57.0425 61.592Z" fill="#103344"/>
4
- <path d="M69.4523 132.793C66.3123 110.103 69.2123 103.603 69.2123 103.603C72.1223 107.543 76.6723 108.983 79.2123 109.503C79.5447 109.528 79.8631 109.364 80.0346 109.078C80.2061 108.792 80.2014 108.434 80.0223 108.153C76.3623 101.873 74.5323 91.7027 74.5323 91.7027C72.0523 72.0127 89.9823 77.7027 92.6923 81.8127C98.4323 90.6527 87.6323 106.813 83.9723 112.013C83.7754 112.277 83.7369 112.628 83.8718 112.928C84.0067 113.229 84.2938 113.434 84.6223 113.463C94.1323 113.123 100.272 104.743 100.272 104.743C104.012 115.033 99.8023 134.473 99.8023 134.473L99.3723 138.563L69.9123 135.623L69.4523 132.793Z" fill="white"/>
5
- <path d="M90.2121 132.703C90.2068 135.463 88.2475 137.833 85.5375 138.357C82.8275 138.881 80.1259 137.412 79.0921 134.853C78.8219 134.182 78.6828 133.466 78.6821 132.743C78.6821 129.563 81.2721 123.643 84.4521 123.643C85.7743 123.783 86.9599 124.52 87.6721 125.643C88.0469 126.142 88.3813 126.67 88.6721 127.223C88.698 127.288 88.7281 127.351 88.7621 127.413C89.6281 129.048 90.1231 130.854 90.2121 132.703Z" fill="#A61426"/>
6
- <path d="M89.8224 131.882C89.822 134.474 88.0962 136.749 85.6001 137.447C83.104 138.146 80.4481 137.097 79.1024 134.882C78.8322 134.211 78.693 133.495 78.6924 132.772C78.6924 129.592 81.2824 123.672 84.4624 123.672C85.7845 123.813 86.9702 124.549 87.6824 125.672C88.0571 126.171 88.3915 126.7 88.6824 127.252C88.7083 127.317 88.7383 127.381 88.7724 127.442C89.3938 128.844 89.7498 130.35 89.8224 131.882Z" fill="#D5192E"/>
7
- <path d="M89.2124 130.993C89.2124 132.523 88.6045 133.99 87.5224 135.073C86.4403 136.155 84.9727 136.763 83.4424 136.763C81.7946 136.765 80.2265 136.054 79.1424 134.813C78.8722 134.142 78.7331 133.426 78.7324 132.703C78.7324 129.523 81.3224 123.603 84.5024 123.603C85.8246 123.743 87.0102 124.48 87.7224 125.603C88.6118 127.267 89.1207 129.108 89.2124 130.993Z" fill="#ED1D34"/>
8
- <circle cx="78.2624" cy="58.3127" r="1.34" fill="white"/>
9
- <circle cx="78.262" cy="58.3118" r="0.68" fill="black"/>
10
- <ellipse cx="82.5535" cy="126.552" rx="1.51" ry="0.9" transform="rotate(-62.05 82.5535 126.552)" fill="#F47988"/>
11
- </svg>