@capillarytech/creatives-library 8.0.60-alpha.5 → 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.5",
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);
658
+ this.getAllTemplates({params: paramsDefault}, true);
661
659
  }
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
- }
703
- }
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;
716
+ params.host = this.props.Templates?.senderDetails?.hostName || this.props.Templates?.selectedZaloAccount?.hostName || this.state.hostName;
816
717
  }
817
- if (selectedChannel === WHATSAPP_LOWERCASE && hostName) {
818
- params.accountId = sourceAccountIdentifier;
819
- params.host = hostName;
820
- // this.getHostName(sourceAccountIdentifier, domainProperties) || this.props.Templates?.selectedWhatsappAccount?.hostName;
821
- }
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 = () => {
@@ -841,13 +727,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
841
727
  }
842
728
  onCreateComplete = (isReloadTemplates) => {
843
729
  this.setState({routeParams: null, previewOpen: false}, () => {
844
- const params = {};
845
- if (this.state.channel?.toLowerCase() === WHATSAPP_LOWERCASE) {
846
- params.accountId = this.props.Templates?.selectedWhatsappAccount?.sourceAccountIdentifier;
847
- params.host = this.state?.hostName;
848
- }
849
730
  if (this.isFullMode() && isReloadTemplates) {
850
- this.getAllTemplates({params}, true);
731
+ this.getAllTemplates({params: {}}, true);
851
732
  }
852
733
  });
853
734
  }
@@ -920,7 +801,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
920
801
  let queryParams = params || {};
921
802
  let page = this.state.page;
922
803
  const { activeMode } = this.state;
923
- console.log(">>> getAllTemplates", {params, getNextPage, resetPage, resetTemplates, elseif: (resetPage || (page === 1 && this.state.templatesCount === 0) || page <= (this.state.templatesCount / this.state.perPageLimit))})
924
804
  if (activeMode === ACCOUNT_SELECTION_MODE) {
925
805
  this.setTemplatesMode();
926
806
  }
@@ -1140,7 +1020,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1140
1020
  filteredTemplates = this.filterWechatTemplates(templates);
1141
1021
  break;
1142
1022
  case WHATSAPP:
1143
- filteredTemplates = this.state?.hostName ? this.filterWhatsappTemplates(templates) : [];
1023
+ filteredTemplates = this.filterWhatsappTemplates(templates);
1144
1024
  break;
1145
1025
  case LINE:
1146
1026
  filteredTemplates = this.filterLineTemplates(templates);
@@ -1501,17 +1381,16 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1501
1381
 
1502
1382
  const accountId = get(this.props, 'Templates.selectedWeChatAccount.uuid');
1503
1383
  const accounts = get(this.props, 'Templates.weCrmAccounts');
1504
- const noWhatsappZaloTemplates = this.isFullMode() && isEmpty(templates) || !this.state.hostName;
1384
+ const noWhatsappZaloTemplates = this.isFullMode() && isEmpty(templates);
1505
1385
  const noFilteredWhatsappZaloTemplates = this.isFullMode() && !isEmpty(templates) && isEmpty(filteredTemplates);
1506
1386
  const noApprovedWhatsappZaloTemplates = !this.isFullMode() && isEmpty(filteredTemplates);
1507
- 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);
1508
1388
  const showZaloIllustration = !isEmpty(this.props.Templates.selectedZaloAccount) && [ZALO_LOWERCASE].includes(channelLowerCase);
1509
1389
  const showRcsIllustration = channelLowerCase === RCS_LOWERCASE && isEmpty(templates);
1510
1390
  const showInAppIllustration = channelLowerCase === INAPP_LOWERCASE && isEmpty(templates);
1511
1391
  const noLoaderAndSearchText = isEmpty(this.state.searchText) && !isLoading;
1512
- console.log(">>> state ", {showWhatsappIllustration, noLoaderAndSearchText, channelLowerCase, host: this.state.hostName, templates: this.props.Templates})
1513
1392
  return (<div>
1514
- {[WECHAT, MOBILE_PUSH, INAPP, WHATSAPP, ZALO].includes(currentChannel) && this.showAccountName()}
1393
+ {[WECHAT, MOBILE_PUSH, INAPP].includes(currentChannel) && this.showAccountName()}
1515
1394
  {filterContent}
1516
1395
  {[WHATSAPP, ZALO].includes(currentChannel) && this.selectedFilters()}
1517
1396
  <CapCustomSkeleton loader={isLoading}>
@@ -1548,15 +1427,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1548
1427
  isEmpty(filteredTemplates) &&
1549
1428
  isEmpty(this.state.searchText) &&
1550
1429
  <div style={this.isFullMode() ? { height: "calc(100vh - 325px)", overflow: 'auto'} : {}}>
1551
- <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel, this.state.hostName)} />
1430
+ <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />
1552
1431
  </div>
1553
1432
  )
1554
1433
  }
1555
1434
  {(showWhatsappIllustration || showZaloIllustration) && (
1556
1435
  noLoaderAndSearchText &&
1557
1436
  <div style={this.isFullMode() ? { height: "calc(100vh - 325px)", overflow: 'auto' } : {}}>
1558
- {noWhatsappZaloTemplates && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel, isEmpty(this.state.hostName))} />}
1559
- {noFilteredWhatsappZaloTemplates && this.state?.hostName && this.whatsappZaloIllustrationText('noFilteredWhatsappZaloTemplatesTitle', 'noFilteredWhatsappZaloTemplatesDesc')}
1437
+ {noWhatsappZaloTemplates && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />}
1438
+ {noFilteredWhatsappZaloTemplates && this.whatsappZaloIllustrationText('noFilteredWhatsappZaloTemplatesTitle', 'noFilteredWhatsappZaloTemplatesDesc')}
1560
1439
  {noApprovedWhatsappZaloTemplates && this.whatsappZaloIllustrationText('noApprovedWhatsappZaloTemplatesTitle', showWhatsappIllustration ? 'noApprovedWhatsappTemplatesDesc' : 'zaloDescIllustration')}
1561
1440
  </div>
1562
1441
  )
@@ -1961,9 +1840,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
1961
1840
  }
1962
1841
  if (this.state.channel.toLowerCase() === MOBILE_PUSH_LOWERCASE) {
1963
1842
  params.accountId = this.props.Templates.selectedWeChatAccount.id;
1964
- } else if (this.state.channel.toLowerCase() === WHATSAPP_LOWERCASE) {
1965
- params.accountId = this.props.Templates?.selectedWhatsappAccount?.sourceAccountIdentifier;
1966
- params.host = this.state?.hostName;
1967
1843
  }
1968
1844
  this.delay(() => {
1969
1845
  this.getAllTemplates({params, resetPage: true});
@@ -2567,7 +2443,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2567
2443
  (rcsLoader !== undefined ? rcsLoader : false);
2568
2444
  return isLoading;
2569
2445
  }
2570
- getChannelTypeIllustrationInfo = (type, hostNameNotFound) => {
2446
+ getChannelTypeIllustrationInfo = (type) => {
2571
2447
  const { isFullMode, intl } = this.props;
2572
2448
  const templateIntlMsg = intl.formatMessage(messages.template);
2573
2449
  const templateText = isFullMode ? templateIntlMsg : '';
@@ -2593,28 +2469,16 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2593
2469
  illustrationImage: pushIllustration,
2594
2470
  title: <FormattedMessage {...messages.pushTitleIllustartion} values={{ template: templateText }} />,
2595
2471
  };
2596
- case WHATSAPP: {
2597
- if (hostNameNotFound) {
2598
- return {
2599
- illustrationImage: whatsappOrZaloAccountIllustration,
2600
- title: <FormattedMessage {...messages.whatsappAccountNotConfiguredTitle} />,
2601
- description: <FormattedMessage {...messages.accountNotConfiguredDescription} />,
2602
- descriptionPosition: 'bottom',
2603
- descriptionClassName: 'illustration-desc zalo-illustration',
2604
- buttonClassName: "zalo-illustration-button",
2605
- };
2606
- } else {
2607
- return {
2608
- buttonLabel: <FormattedMessage {...messages.newWhatsappTemplate} values={{ template: templateText }} />,
2609
- onClick: this.createTemplate,
2610
- illustrationImage: whatsappIllustration,
2611
- title: <FormattedMessage {...messages.whatsappTitleIllustration} values={{ template: templateText }} />,
2612
- description: <FormattedMessage {...messages.whatsappDescIllustration} />,
2613
- descriptionPosition: 'bottom',
2614
- descriptionClassName: 'illustration-desc',
2615
- };
2616
- }
2617
- }
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
+ };
2618
2482
  case RCS:
2619
2483
  return {
2620
2484
  buttonLabel: <FormattedMessage {...messages.newRCSTemplate} values={{ template: templateText }} />,
@@ -2625,27 +2489,15 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2625
2489
  descriptionPosition: 'bottom',
2626
2490
  descriptionClassName: 'illustration-desc rcs-illustration',
2627
2491
  };
2628
- case ZALO:{
2629
- if (hostNameNotFound) {
2630
- return {
2631
- illustrationImage: whatsappOrZaloAccountIllustration,
2632
- title: <FormattedMessage {...messages.zaloAccountNotConfiguredTitle} />,
2633
- description: <FormattedMessage {...messages.accountNotConfiguredDescription} />,
2634
- descriptionPosition: 'bottom',
2635
- descriptionClassName: 'illustration-desc zalo-illustration',
2636
- buttonClassName: "zalo-illustration-button",
2637
- };
2638
- } else {
2639
- return {
2640
- illustrationImage: zaloillustration,
2641
- title: <FormattedMessage {...messages.zaloTitleIllustration} />,
2642
- description: <FormattedMessage {...messages.zaloDescIllustration} />,
2643
- descriptionPosition: 'bottom',
2644
- descriptionClassName: 'illustration-desc zalo-illustration',
2645
- buttonClassName: "zalo-illustration-button",
2646
- };
2647
- }
2648
- }
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
+ };
2649
2501
  case INAPP:
2650
2502
  return {
2651
2503
  illustrationImage: inAppIllustration,
@@ -2712,9 +2564,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2712
2564
  const isMobilePushChannel = channel === MOBILE_PUSH;
2713
2565
  const isInAppChannel = channel === INAPP;
2714
2566
  const isFacebookChannel = channel === FACEBOOK;
2715
- 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) {
2716
2569
  forEach(weCrmAccounts, (account) => {
2717
- 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)) {
2718
2571
  if (query.type === 'embedded' && (!query.module || (query.module && query.module !== 'library'))) {
2719
2572
  if (query.source_account_id && account.sourceAccountIdentifier === query.source_account_id) {
2720
2573
  accountOptions.push(
@@ -2797,10 +2650,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2797
2650
  break;
2798
2651
  }
2799
2652
  let showNoAccountHeader = isEmpty(weCrmAccounts) && !fetchingWeCrmAccounts;
2800
- // This is not required as whatsapp will have account selection for multiple accounts
2801
- // if (channel === WHATSAPP && this.state.hostName === '') {
2802
- // showNoAccountHeader = true;
2803
- // }
2653
+ if (channel === WHATSAPP && this.state.hostName === '') {
2654
+ showNoAccountHeader = true;
2655
+ }
2804
2656
  if (channel === FACEBOOK && !isEmpty(campaignSettings) ) {
2805
2657
  const fbSetting = get(campaignSettings, 'accountSettings.socialAccountSettings.facebookAccountSettings', []);
2806
2658
  const { orgUnitFacebookPageSettingsMap } = fbSetting[0] || {};
@@ -2819,7 +2671,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2819
2671
  if (channel === WECHAT && !commonUtil.hasWechatFeatureEnabled()) {
2820
2672
  showNoAccountHeader = true;
2821
2673
  }
2822
- console.log("### renderAccountSelection -> showNoAccountHeader", {hostName: this.state.hostName, showNoAccountHeader, selectedAccount, accountOptions, accountHeader, noAccountHeader })
2823
2674
  return (<CapSkeleton loading={fetchingWeCrmAccounts} active paragraph={{ rows: 10 }}>
2824
2675
  {showNoAccountHeader ? <FormattedMessage {...noAccountHeader} /> :
2825
2676
  <div style={{ overflowX: "auto", paddingBottom: CAP_SPACE_16 }}>
@@ -3023,7 +2874,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3023
2874
  );
3024
2875
  //TODO -> uncomment the following line
3025
2876
  // const isfilterContentVisisble = !isEmpty(this.props.TemplatesList) || !isEmpty(this.state.searchText) || !isEmpty(this.props.Templates.templateError);
3026
- let isfilterContentVisisble = true;
2877
+ const isfilterContentVisisble = true;
3027
2878
  const isWechatEmbedded = !this.props.isFullMode && channel.toUpperCase() === WECHAT;
3028
2879
  const channelLowerCase = (channel || '').toLowerCase();
3029
2880
  const isTraiDltFeature = this.checkDLTfeatureEnable();
@@ -3038,7 +2889,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3038
2889
  className="create-new-link"
3039
2890
  />
3040
2891
  )
3041
- : this.state.channel.toLowerCase() === ZALO_LOWERCASE || (channelLowerCase === WHATSAPP_LOWERCASE && isEmpty(this.state.hostName)) ? <></> : (
2892
+ : this.state.channel.toLowerCase() === ZALO_LOWERCASE ? <></> : (
3042
2893
  <CapButton
3043
2894
  className={`create-new-${channelLowerCase} margin-l-8 margin-b-12`}
3044
2895
  type={"primary"}
@@ -3052,9 +2903,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3052
2903
  const isWhatsappCountExeeded = templatesCount >= MAX_WHATSAPP_TEMPLATES;
3053
2904
  const showWhatsappCountWarning = templatesCount >= WARNING_WHATSAPP_TEMPLATES;
3054
2905
  const whatsappCountExceedText = <FormattedMessage {...messages.whatsappMaxTemplates} values={{ maxCount: MAX_WHATSAPP_TEMPLATES }}/>;
3055
- if (([WHATSAPP_LOWERCASE, ZALO_LOWERCASE].includes(this.state?.channel?.toLocaleLowerCase()) && isEmpty(this.state?.hostName))) {
3056
- isfilterContentVisisble = false;
3057
- }
2906
+
3058
2907
  const filterContent = (( isfilterContentVisisble || [WECHAT, MOBILE_PUSH, INAPP].includes(this.state.channel.toUpperCase())) && <div className="action-container">
3059
2908
  {isfilterContentVisisble && <CapInput.Search
3060
2909
  className="search-text"
@@ -3102,7 +2951,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3102
2951
  channel.toUpperCase() === WHATSAPP && (
3103
2952
  <div className="whatsapp-filters">
3104
2953
  {
3105
- this.props.isFullMode && this.state.hostName ? (
2954
+ this.props.isFullMode ? (
3106
2955
  <CapSelectFilter
3107
2956
  placement="bottomLeft"
3108
2957
  data={STATUS_OPTIONS}
@@ -3114,20 +2963,18 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3114
2963
  />
3115
2964
  ) : null
3116
2965
  }
3117
- {this.state?.hostName ? (
3118
- <CapSelectFilter
3119
- placement="bottomLeft"
3120
- data={this.state.hostName === HOST_TWILIO
3121
- ? TWILIO_CATEGORY_OPTIONS
3122
- : KARIX_GUPSHUP_CATEGORY_OPTIONS}
3123
- onSelect={this.setWhatsappCategory}
3124
- selectedValue={this.state.selectedWhatsappCategory}
3125
- placeholder="Category"
3126
- showBadge
3127
- width="105px"
3128
- overlayStyle={{ overflowY: "hidden" }}
3129
- />
3130
- ) : 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
+ />
3131
2978
  </div>
3132
2979
 
3133
2980
  )
@@ -3200,7 +3047,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
3200
3047
  }
3201
3048
  <div style={{display: "flex", justifyContent: "space-between", alignItems: 'center'}}>
3202
3049
  {
3203
- this.state?.channel?.toLowerCase() === WHATSAPP_LOWERCASE && (isWhatsappCountExeeded)? (
3050
+ this.state.channel.toLowerCase() === WHATSAPP_LOWERCASE && isWhatsappCountExeeded ? (
3204
3051
  <CapTooltip title={whatsappCountExceedText}>
3205
3052
  <div className="button-disabled-tooltip-wrapper">
3206
3053
  {createButton}
@@ -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>