@tap-payments/auth-jsconnect 2.8.55-beta → 2.8.55-development

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.
Files changed (189) hide show
  1. package/build/@types/app.d.ts +1 -0
  2. package/build/@types/form.d.ts +1 -0
  3. package/build/@types/redux.d.ts +1 -0
  4. package/build/api/entity.d.ts +2 -2
  5. package/build/api/entity.js +12 -4
  6. package/build/api/index.d.ts +2 -2
  7. package/build/constants/api.d.ts +0 -1
  8. package/build/constants/api.js +0 -2
  9. package/build/constants/app.d.ts +0 -2
  10. package/build/constants/app.js +0 -2
  11. package/build/features/app/bank/bankStore.d.ts +13 -18
  12. package/build/features/app/bank/bankStore.js +184 -165
  13. package/build/features/app/board/boardStore.js +52 -30
  14. package/build/features/app/brand/brandStore.d.ts +16 -33
  15. package/build/features/app/brand/brandStore.js +239 -242
  16. package/build/features/app/business/businessStore.d.ts +0 -5
  17. package/build/features/app/business/businessStore.js +76 -87
  18. package/build/features/app/connectExpress/connectExpressStore.d.ts +15 -6
  19. package/build/features/app/connectExpress/connectExpressStore.js +110 -52
  20. package/build/features/app/entity/entityStore.d.ts +20 -36
  21. package/build/features/app/entity/entityStore.js +196 -246
  22. package/build/features/app/individual/individualStore.d.ts +22 -38
  23. package/build/features/app/individual/individualStore.js +263 -266
  24. package/build/features/app/password/passwordStore.d.ts +40 -23
  25. package/build/features/app/password/passwordStore.js +226 -233
  26. package/build/features/app/tax/taxStore.d.ts +13 -7
  27. package/build/features/app/tax/taxStore.js +168 -147
  28. package/build/features/auth/screens/AuthSwitch/AuthSwitch.js +13 -1
  29. package/build/features/auth/screens/BusinessCountry/BusinessCountry.js +7 -1
  30. package/build/features/bank/Bank.d.ts +1 -0
  31. package/build/features/bank/Bank.js +7 -4
  32. package/build/features/bank/screens/BankDetails/BankDetails.js +18 -5
  33. package/build/features/bank/screens/OperatorError/OperatorError.d.ts +5 -0
  34. package/build/features/bank/screens/OperatorError/OperatorError.js +9 -0
  35. package/build/features/bank/screens/OperatorError/index.d.ts +3 -0
  36. package/build/features/bank/screens/OperatorError/index.js +2 -0
  37. package/build/features/bank/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  38. package/build/features/bank/screens/Verify/Verify.js +5 -5
  39. package/build/features/board/Board.js +8 -4
  40. package/build/features/board/screens/OperatorError/OperatorError.d.ts +5 -0
  41. package/build/features/board/screens/OperatorError/OperatorError.js +9 -0
  42. package/build/features/board/screens/OperatorError/index.d.ts +3 -0
  43. package/build/features/board/screens/OperatorError/index.js +2 -0
  44. package/build/features/board/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +3 -4
  45. package/build/features/brand/Brand.d.ts +1 -0
  46. package/build/features/brand/Brand.js +7 -4
  47. package/build/features/brand/screens/BrandActivities/BrandActivities.js +49 -12
  48. package/build/features/brand/screens/BrandActivities/ExpectedSalesRange.js +6 -3
  49. package/build/features/brand/screens/BrandActivities/RefundPolicy.js +1 -1
  50. package/build/features/brand/screens/BrandActivities/TAC.js +1 -1
  51. package/build/features/brand/screens/BrandActivities/TransactionPolicy.js +1 -1
  52. package/build/features/brand/screens/BrandInfo/BrandInfo.js +23 -5
  53. package/build/features/brand/screens/BrandSegmentInfo/BrandSegmentInfo.js +23 -7
  54. package/build/features/brand/screens/OperatorError/OperatorError.d.ts +5 -0
  55. package/build/features/brand/screens/OperatorError/OperatorError.js +9 -0
  56. package/build/features/brand/screens/OperatorError/index.d.ts +3 -0
  57. package/build/features/brand/screens/OperatorError/index.js +2 -0
  58. package/build/features/brand/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  59. package/build/features/brand/screens/Verify/Verify.js +1 -1
  60. package/build/features/business/Business.js +9 -4
  61. package/build/features/business/screens/Activities/Activities.js +12 -3
  62. package/build/features/business/screens/BusinessType/BusinessType.js +10 -2
  63. package/build/features/business/screens/CivilID/CivilID.js +1 -1
  64. package/build/features/business/screens/Customers/Customers.js +12 -3
  65. package/build/features/business/screens/Customers/ExpectedSalesRange.js +6 -3
  66. package/build/features/business/screens/IDBOD/IDBOD.js +10 -2
  67. package/build/features/business/screens/OTP/OTP.js +1 -1
  68. package/build/features/business/screens/OperatorError/OperatorError.d.ts +5 -0
  69. package/build/features/business/screens/OperatorError/OperatorError.js +9 -0
  70. package/build/features/business/screens/OperatorError/index.d.ts +3 -0
  71. package/build/features/business/screens/OperatorError/index.js +2 -0
  72. package/build/features/business/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +14 -3
  73. package/build/features/business/screens/Verify/Verify.js +13 -3
  74. package/build/features/connect/Connect.js +3 -2
  75. package/build/features/connect/screens/BrandSegment/BrandSegment.js +1 -1
  76. package/build/features/connect/screens/BusinessCountry/BusinessCountry.js +9 -2
  77. package/build/features/connect/screens/CivilID/CivilID.js +1 -1
  78. package/build/features/connect/screens/Individual/Email.js +3 -1
  79. package/build/features/connect/screens/Individual/Individual.js +1 -1
  80. package/build/features/connect/screens/Merchant/BrandList.js +3 -3
  81. package/build/features/connect/screens/Merchant/Merchant.js +1 -1
  82. package/build/features/connect/screens/Merchant/SalesChannels.js +1 -1
  83. package/build/features/connect/screens/Mobile/Mobile.js +11 -8
  84. package/build/features/connect/screens/NID/NID.js +1 -1
  85. package/build/features/connect/screens/OperatorError/OperatorError.js +1 -1
  86. package/build/features/connectExpress/ConnectExpress.js +2 -1
  87. package/build/features/connectExpress/screens/AuthenticationList/AuthenticationList.js +5 -2
  88. package/build/features/connectExpress/screens/AuthenticationList/EntityLicenseType.d.ts +9 -0
  89. package/build/features/connectExpress/screens/AuthenticationList/EntityLicenseType.js +90 -0
  90. package/build/features/connectExpress/screens/AuthenticationList/EntityList.js +6 -1
  91. package/build/features/connectExpress/screens/AuthenticationList/validation.d.ts +3 -0
  92. package/build/features/connectExpress/screens/AuthenticationList/validation.js +10 -0
  93. package/build/features/connectExpress/screens/BusinessCountry/BusinessCountry.js +7 -1
  94. package/build/features/connectExpress/screens/CivilID/CivilID.js +1 -1
  95. package/build/features/connectExpress/screens/CivilIDMissed/CivilID.js +1 -1
  96. package/build/features/connectExpress/screens/CollectBusinessInfo/CollectBusinessInfo.js +1 -1
  97. package/build/features/connectExpress/screens/CollectIndividualInfo/CollectIndividualInfo.js +1 -1
  98. package/build/features/connectExpress/screens/CollectIndividualInfo/Email.js +3 -1
  99. package/build/features/connectExpress/screens/CreateAccountLoader/CreateAccountLoader.js +14 -24
  100. package/build/features/connectExpress/screens/Mobile/Mobile.js +9 -2
  101. package/build/features/connectExpress/screens/NID/NID.js +1 -1
  102. package/build/features/connectExpress/screens/NIDMissed/NID.js +1 -1
  103. package/build/features/connectExpress/screens/OperatorError/OperatorError.d.ts +5 -0
  104. package/build/features/connectExpress/screens/OperatorError/OperatorError.js +9 -0
  105. package/build/features/connectExpress/screens/OperatorError/index.d.ts +3 -0
  106. package/build/features/connectExpress/screens/OperatorError/index.js +2 -0
  107. package/build/features/connectExpress/screens/PrepareDataLoading/PrepareDataLoading.d.ts +5 -0
  108. package/build/features/connectExpress/screens/PrepareDataLoading/PrepareDataLoading.js +34 -0
  109. package/build/features/connectExpress/screens/PrepareDataLoading/index.d.ts +2 -0
  110. package/build/features/connectExpress/screens/PrepareDataLoading/index.js +2 -0
  111. package/build/features/connectExpress/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  112. package/build/features/entity/Entity.d.ts +1 -0
  113. package/build/features/entity/Entity.js +7 -4
  114. package/build/features/entity/screens/EntityCapital/CapitalPaid.js +8 -4
  115. package/build/features/entity/screens/EntityCapital/CapitalShareValue.js +8 -4
  116. package/build/features/entity/screens/EntityCapital/EntityCapital.js +34 -10
  117. package/build/features/entity/screens/EntityName/EntityName.js +32 -15
  118. package/build/features/entity/screens/OperatorError/OperatorError.d.ts +5 -0
  119. package/build/features/entity/screens/OperatorError/OperatorError.js +9 -0
  120. package/build/features/entity/screens/OperatorError/index.d.ts +3 -0
  121. package/build/features/entity/screens/OperatorError/index.js +2 -0
  122. package/build/features/entity/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  123. package/build/features/entity/screens/Verify/Verify.js +1 -1
  124. package/build/features/featuresScreens.js +67 -7
  125. package/build/features/individual/Individual.d.ts +1 -0
  126. package/build/features/individual/Individual.js +7 -4
  127. package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js +54 -14
  128. package/build/features/individual/screens/AdditionalIndividualInfo/IsAuthorizedSwitch.d.ts +14 -0
  129. package/build/features/individual/screens/AdditionalIndividualInfo/IsAuthorizedSwitch.js +76 -0
  130. package/build/features/individual/screens/AdditionalIndividualInfo/MonthlyIncome.js +5 -2
  131. package/build/features/individual/screens/AdditionalIndividualInfo/ShareValue.js +8 -3
  132. package/build/features/individual/screens/AdditionalIndividualInfo/validation.d.ts +4 -1
  133. package/build/features/individual/screens/AdditionalIndividualInfo/validation.js +3 -2
  134. package/build/features/individual/screens/IndividualList/Email.js +3 -2
  135. package/build/features/individual/screens/IndividualList/IndividualList.js +18 -5
  136. package/build/features/individual/screens/IndividualList/UserList.js +13 -9
  137. package/build/features/individual/screens/IndividualPersonalInfo/Email.js +4 -2
  138. package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.js +76 -20
  139. package/build/features/individual/screens/IndividualPhoneInfo/PhoneInfo.js +1 -1
  140. package/build/features/individual/screens/OperatorError/OperatorError.d.ts +5 -0
  141. package/build/features/individual/screens/OperatorError/OperatorError.js +9 -0
  142. package/build/features/individual/screens/OperatorError/index.d.ts +3 -0
  143. package/build/features/individual/screens/OperatorError/index.js +2 -0
  144. package/build/features/individual/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  145. package/build/features/individual/screens/Verify/Verify.js +1 -1
  146. package/build/features/password/Password.d.ts +1 -0
  147. package/build/features/password/Password.js +75 -28
  148. package/build/features/password/screens/CreatePassword/CreatePassword.js +8 -4
  149. package/build/features/password/screens/OTP/OTP.js +1 -1
  150. package/build/features/password/screens/OperatorError/OperatorError.d.ts +5 -0
  151. package/build/features/password/screens/OperatorError/OperatorError.js +9 -0
  152. package/build/features/password/screens/OperatorError/index.d.ts +3 -0
  153. package/build/features/password/screens/OperatorError/index.js +2 -0
  154. package/build/features/password/screens/PrepareDataLoading/PrepareDataLoading.d.ts +4 -0
  155. package/build/features/password/screens/PrepareDataLoading/PrepareDataLoading.js +10 -0
  156. package/build/features/password/screens/PrepareDataLoading/index.d.ts +2 -0
  157. package/build/features/password/screens/PrepareDataLoading/index.js +2 -0
  158. package/build/features/password/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  159. package/build/features/password/screens/Verify/Verify.js +5 -5
  160. package/build/features/shared/Button/FlowsButtons.js +13 -3
  161. package/build/features/shared/Containers/FeatureContainer.d.ts +1 -0
  162. package/build/features/shared/Containers/FeatureContainer.js +3 -3
  163. package/build/features/shared/SuccessFlowButtons/SuccessFlowButtons.d.ts +5 -1
  164. package/build/features/shared/SuccessFlowButtons/SuccessFlowButtons.js +3 -3
  165. package/build/features/signIn/SignIn.js +12 -3
  166. package/build/features/signIn/screens/OperatorError/OperatorError.d.ts +5 -0
  167. package/build/features/signIn/screens/OperatorError/OperatorError.js +9 -0
  168. package/build/features/signIn/screens/OperatorError/index.d.ts +3 -0
  169. package/build/features/signIn/screens/OperatorError/index.js +2 -0
  170. package/build/features/tax/Tax.d.ts +1 -0
  171. package/build/features/tax/Tax.js +7 -4
  172. package/build/features/tax/screens/OperatorError/OperatorError.d.ts +5 -0
  173. package/build/features/tax/screens/OperatorError/OperatorError.js +9 -0
  174. package/build/features/tax/screens/OperatorError/index.d.ts +3 -0
  175. package/build/features/tax/screens/OperatorError/index.js +2 -0
  176. package/build/features/tax/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +2 -2
  177. package/build/features/tax/screens/TaxDetails/TaxDetails.js +7 -2
  178. package/build/features/tax/screens/Verify/Verify.js +5 -5
  179. package/build/hooks/index.d.ts +1 -0
  180. package/build/hooks/index.js +1 -0
  181. package/build/hooks/useFormDirtyCheck.d.ts +10 -0
  182. package/build/hooks/useFormDirtyCheck.js +66 -0
  183. package/build/hooks/useVerifyToken.d.ts +5 -2
  184. package/build/hooks/useVerifyToken.js +10 -5
  185. package/build/utils/common.js +4 -4
  186. package/build/utils/locale.js +2 -1
  187. package/build/utils/string.d.ts +5 -2
  188. package/build/utils/string.js +34 -5
  189. package/package.json +2 -2
@@ -16,7 +16,7 @@ import Beneficiary from './Beneficiary';
16
16
  import IBAN from './IBAN';
17
17
  import BankName from './BankName';
18
18
  import Button from '../../../shared/Button';
19
- import { useAppDispatch, useAppSelector, useFormReadOnly, useSetFromDefaultValues, useDataNoneEditable, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
19
+ import { useAppDispatch, useAppSelector, useFormReadOnly, useSetFromDefaultValues, useDataNoneEditable, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified, useFormDirtyCheck } from '../../../../hooks';
20
20
  import { BankKWFLValidation, BankValidation } from './validation';
21
21
  import { useTranslation } from 'react-i18next';
22
22
  import { useForm, FormProvider } from 'react-hook-form';
@@ -29,7 +29,7 @@ import Form from '../../../../components/Form';
29
29
  import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
30
30
  import ConfirmPolicy from './ConfirmPolicy';
31
31
  import BankStatement from './BankStatement';
32
- import { deepCopy, getFileDetailsFromDocument, isKW, isStringHasOneAsterisk } from '../../../../utils';
32
+ import { deepCopy, getFileDetailsFromDocument, isKW, isStringHasOneAsterisk, sendCustomEventToGTM } from '../../../../utils';
33
33
  var FormStyled = styled(Form)(function () { return ({
34
34
  display: 'flex',
35
35
  flexDirection: 'column',
@@ -50,7 +50,7 @@ var BankDetails = function () {
50
50
  var _e = data.bankData, iban = _e.iban, beneficiaryName = _e.beneficiaryName, bankName = _e.bankName, bankStatementId = _e.bankStatementId, bankStatementUploading = _e.uploading, confirmPolicy = _e.confirmPolicy;
51
51
  var verify = data.verify;
52
52
  var _f = verify.responseBody || {}, bank_account = _f.bank_account, entity = _f.entity, flows = _f.flows;
53
- var _g = bank_account || {}, document = _g.document, data_status = _g.data_status, data_verification = _g.data_verification, beneficiary_name = _g.beneficiary_name, resIban = _g.iban, bank_name = _g.bank_name;
53
+ var _g = bank_account || {}, document = _g.document, data_status = _g.data_status, data_verification = _g.data_verification, beneficiary_name = _g.beneficiary_name, resIban = _g.iban, bank_name = _g.bank_name, is_acknowledged = _g.is_acknowledged;
54
54
  var isKWCountry = React.useMemo(function () { return isKW(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
55
55
  var isFL = ((_a = entity === null || entity === void 0 ? void 0 : entity.type) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === BusinessType.FL ? true : false;
56
56
  var bankHasDocument = ((_b = document === null || document === void 0 ? void 0 : document.file_details) === null || _b === void 0 ? void 0 : _b.length) > 0;
@@ -71,13 +71,19 @@ var BankDetails = function () {
71
71
  var t = useTranslation().t;
72
72
  var isAr = useLanguage().isAr;
73
73
  var onBack = function () {
74
+ sendCustomEventToGTM({
75
+ event: 'Send Event',
76
+ event_category: 'Board Flows - Wallet',
77
+ event_action: 'Wallet Details Back button',
78
+ event_label: settingsData.businessCountry.iso2
79
+ });
74
80
  if ((flows === null || flows === void 0 ? void 0 : flows.length) > 0) {
75
81
  dispatch(handlePrevScreenStep());
76
82
  return;
77
83
  }
78
84
  dispatch(retrieveBoardStatus());
79
85
  };
80
- var disabled = ibanChecking || !methods.formState.isValid || !!error || bankStatementUploading;
86
+ var disabled = ibanChecking || !methods.formState.isValid || bankStatementUploading;
81
87
  React.useEffect(function () {
82
88
  if (error)
83
89
  dispatch(clearError());
@@ -101,9 +107,16 @@ var BankDetails = function () {
101
107
  var isBeneficiaryNameVerified = dataVerified['beneficiary_name'] && beneficiary_name === methods.watch('beneficiaryName');
102
108
  var isIBANVerified = dataVerified['iban'] && resIban === methods.watch('iban');
103
109
  var isBankNameVerified = dataVerified['bank_name'] && bank_name === methods.watch('bankName');
110
+ var isDirty = useFormDirtyCheck(methods, {
111
+ iban: resIban,
112
+ beneficiaryName: beneficiary_name,
113
+ bankName: bank_name,
114
+ confirmPolicy: is_acknowledged
115
+ }).isDirty;
104
116
  var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
105
117
  var onSubmit = function (data) {
106
- dispatch(createBankAccount(deepCopy(getFelids(data))));
118
+ var formData = __assign(__assign({}, deepCopy(getFelids(data))), { isDirty: isDirty });
119
+ dispatch(createBankAccount(formData));
107
120
  };
108
121
  var disableBack = settingsData.appConfig.mode === 'content';
109
122
  return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, { readOnly: readOnly['beneficiaryName'] || noneEditable['beneficiary_name'], isVerified: isBeneficiaryNameVerified }), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking, readOnly: readOnly['iban'] || noneEditable['iban'], isVerified: isIBANVerified }), _jsx(BankName, { readOnly: readOnly['bankName'] || noneEditable['bank_name'], isVerified: isBankNameVerified }), _jsx(BankStatement, { isVerified: dataVerified['document'], required: isKWCountry && isFL && !bankHasDocument, defaultFiles: defaultBankFiles, readOnly: readOnly['bankStatementId'] || noneEditable['bank_statement_file_id'] }), _jsx(ConfirmPolicy, { readOnly: readOnly['confirmPolicy'] || noneEditable['is_acknowledged'] }), _jsx(ButtonStyled, __assign({ disableBack: disableBack, onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OperatorErrorProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OperatorErrorProps) => import("react/jsx-runtime").JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,9 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { useTranslation } from 'react-i18next';
4
+ import GenericError from '../../../shared/GenericError';
5
+ var OperatorError = function (_a) {
6
+ var t = useTranslation().t;
7
+ return _jsx(GenericError, { error: t('operator_is_invalid'), errorTitle: t('oops') });
8
+ };
9
+ export default React.memo(OperatorError);
@@ -0,0 +1,3 @@
1
+ import OperatorError, { OperatorErrorProps } from './OperatorError';
2
+ export type { OperatorErrorProps };
3
+ export default OperatorError;
@@ -0,0 +1,2 @@
1
+ import OperatorError from './OperatorError';
2
+ export default OperatorError;
@@ -21,10 +21,10 @@ var SuccessWithFlowButtons = function () {
21
21
  var _a = useAppSelector(bankSelector), data = _a.data, loading = _a.loading;
22
22
  var settingsData = useAppSelector(settingsSelector).data;
23
23
  var isScopeAuthentication = settingsData.appConfig.scope === SCOPE_AUTH;
24
- var _b = data.verify.responseBody || {}, flows = _b.flows, entity = _b.entity, brand = _b.brand, bank = _b.bank_account, merchant = _b.merchant, user = _b.user, business = _b.business, board_id = _b.board_id, board_info_id = _b.board_info_id, name = _b.name, individuals = _b.individuals;
24
+ var _b = data.verify.responseBody || {}, flows = _b.flows, entity = _b.entity, brand = _b.brand, bank = _b.bank_account, merchant = _b.merchant, user = _b.user, business = _b.business, board_id = _b.board_id, board_info_id = _b.board_info_id, name = _b.name, individuals = _b.individuals, recipient = _b.recipient;
25
25
  var onClose = function () {
26
26
  dispatch(onCloseCompleteBank());
27
27
  };
28
- return (_jsx(SuccessFlowButtons, { flowName: data.flowName, loading: loading, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [], onClose: isScopeAuthentication ? onClose : undefined }));
28
+ return (_jsx(SuccessFlowButtons, { flowName: data.flowName, loading: loading, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [], onClose: isScopeAuthentication ? onClose : undefined, recipient: recipient }));
29
29
  };
30
30
  export default memo(SuccessWithFlowButtons);
@@ -46,9 +46,9 @@ var FormStyled = styled(Form)(function () { return ({
46
46
  flexDirection: 'column'
47
47
  }); });
48
48
  var VerifyNumber = function (_a) {
49
- var _b, _c, _d;
49
+ var _b, _c;
50
50
  var dispatch = useAppDispatch();
51
- var _e = useAppSelector(bankSelector), data = _e.data, loading = _e.loading, error = _e.error;
51
+ var _d = useAppSelector(bankSelector), data = _d.data, loading = _d.loading, error = _d.error;
52
52
  var methods = useForm({
53
53
  resolver: yupResolver(OTPValidation),
54
54
  defaultValues: data.otpData,
@@ -56,8 +56,8 @@ var VerifyNumber = function (_a) {
56
56
  });
57
57
  var t = useTranslation().t;
58
58
  var isAr = useLanguage().isAr;
59
- var _f = React.useState(false), resendLoading = _f[0], setResendLoading = _f[1];
60
- var phone = (_d = (_c = (_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.contact) === null || _c === void 0 ? void 0 : _c.phone) === null || _d === void 0 ? void 0 : _d.number;
59
+ var _e = React.useState(false), resendLoading = _e[0], setResendLoading = _e[1];
60
+ var phone = (_c = (_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.verification_by) === null || _c === void 0 ? void 0 : _c.sent_to;
61
61
  React.useEffect(function () {
62
62
  if (error && methods.formState.isValid && phone)
63
63
  dispatch(clearError());
@@ -68,7 +68,7 @@ var VerifyNumber = function (_a) {
68
68
  var onSubmit = function (formData) {
69
69
  dispatch(verifyBankLeadOTP(deepCopy(formData)));
70
70
  };
71
- var disabled = !methods.formState.isValid || !!error || !phone || resendLoading;
71
+ var disabled = !methods.formState.isValid || !phone || resendLoading;
72
72
  return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(OTPTitleContainerStyled, { children: _jsxs(OTPTitleStyled, { children: [loading ? t('ide_otp_waiting_title') : t('ide_opt_sent_title'), !loading && phone && _jsx("span", __assign({ dir: 'ltr' }, { children: "".concat(maskPhone(phone || '')) }))] }) }), _jsx(OTPInput, { loading: resendLoading, setLoading: setResendLoading }), _jsx(Button, __assign({ disableBack: true, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
73
73
  };
74
74
  export default React.memo(VerifyNumber);
@@ -52,11 +52,15 @@ var Board = memo(function (_a) {
52
52
  });
53
53
  }, []);
54
54
  React.useEffect(function () {
55
- if (data.isValidOperator && props.open && !settingLoading) {
56
- dispatch(createVerifyTokenBy(boardId));
57
- if (props.mode === 'content')
58
- dispatch(handleCurrentActiveScreen('BOARD_SUCCESS_FLOWS_BUTTONS_STEP'));
55
+ if (settingLoading || !props.open)
56
+ return;
57
+ if (!data.isValidOperator) {
58
+ dispatch(handleCurrentActiveScreen('BOARD_OPERATOR_ERROR_STEP'));
59
+ return;
59
60
  }
61
+ dispatch(createVerifyTokenBy(boardId));
62
+ if (props.mode === 'content')
63
+ dispatch(handleCurrentActiveScreen('BOARD_SUCCESS_FLOWS_BUTTONS_STEP'));
60
64
  }, [data.isValidOperator, settingLoading]);
61
65
  var initialLoading = settingLoading || customLoading;
62
66
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ mode: props.mode, open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: !isTapDomain(props.merchantDomain), loaderColor: loaderColor, type: props.mode === 'content' ? 'CONTENT' : undefined, dialogEdgeFormat: data.appConfig.dialogEdgeFormat, features: appConfig.features }, { children: _jsx(FeatureContainer, __assign({ isMaturityExpress: !isTapDomain(props.merchantDomain) }, { children: boardFeatureScreens.map(function (_a, index) {
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OperatorErrorProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OperatorErrorProps) => import("react/jsx-runtime").JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,9 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { useTranslation } from 'react-i18next';
4
+ import GenericError from '../../../shared/GenericError';
5
+ var OperatorError = function (_a) {
6
+ var t = useTranslation().t;
7
+ return _jsx(GenericError, { error: t('operator_is_invalid'), errorTitle: t('oops') });
8
+ };
9
+ export default React.memo(OperatorError);
@@ -0,0 +1,3 @@
1
+ import OperatorError, { OperatorErrorProps } from './OperatorError';
2
+ export type { OperatorErrorProps };
3
+ export default OperatorError;
@@ -0,0 +1,2 @@
1
+ import OperatorError from './OperatorError';
2
+ export default OperatorError;
@@ -12,16 +12,15 @@ var __assign = (this && this.__assign) || function () {
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { memo } from 'react';
14
14
  import { settingsSelector } from '../../../../app/settings';
15
- import { useAppSelector, useAppDispatch } from '../../../../hooks';
15
+ import { useAppSelector } from '../../../../hooks';
16
16
  import { SCOPE_AUTH } from '../../../../constants';
17
17
  import { boardSelector } from '../../../app/board/boardStore';
18
18
  import SuccessFlowButtons from '../../../shared/SuccessFlowButtons';
19
19
  var SuccessWithFlowButtons = function () {
20
- var dispatch = useAppDispatch();
21
20
  var _a = useAppSelector(boardSelector), data = _a.data, loading = _a.loading;
22
21
  var settingsData = useAppSelector(settingsSelector).data;
23
22
  var isScopeAuthentication = settingsData.appConfig.scope === SCOPE_AUTH;
24
- var _b = data.verify.responseBody || {}, flows = _b.flows, entity = _b.entity, brand = _b.brand, bank = _b.bank_account, merchant = _b.merchant, user = _b.user, business = _b.business, board_id = _b.board_id, board_info_id = _b.board_info_id, name = _b.name, individuals = _b.individuals;
23
+ var _b = data.verify.responseBody || {}, flows = _b.flows, entity = _b.entity, brand = _b.brand, bank = _b.bank_account, merchant = _b.merchant, user = _b.user, business = _b.business, board_id = _b.board_id, board_info_id = _b.board_info_id, name = _b.name, individuals = _b.individuals, recipient = _b.recipient;
25
24
  var onClose = function () {
26
25
  var url = settingsData.appConfig.redirectUrl;
27
26
  if (!url)
@@ -30,6 +29,6 @@ var SuccessWithFlowButtons = function () {
30
29
  newUrl.searchParams.append('action', 'close');
31
30
  window.open("".concat(newUrl), '_self', '_blank');
32
31
  };
33
- return (_jsx(SuccessFlowButtons, { flowName: data.flowName, loading: loading, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [], onClose: isScopeAuthentication ? onClose : undefined }));
32
+ return (_jsx(SuccessFlowButtons, { flowName: data.flowName, loading: loading, bank: bank, brand: brand, entity: entity, merchant: merchant, user: __assign({ names: { en: name } }, user), business: business, boardId: board_id, boardInfoId: board_info_id, individuals: individuals, flows: flows || [], onClose: isScopeAuthentication ? onClose : undefined, recipient: recipient }));
34
33
  };
35
34
  export default memo(SuccessWithFlowButtons);
@@ -2,6 +2,7 @@ import { LibConfig } from '../../@types';
2
2
  export interface BrandLibProps extends LibConfig {
3
3
  verifyToken?: string;
4
4
  configToken?: string;
5
+ loaderColor?: string;
5
6
  }
6
7
  export declare function BrandElement(props: BrandLibProps): import("react/jsx-runtime").JSX.Element;
7
8
  export declare function renderBrandLib(config: BrandLibProps, elementId: string): {
@@ -36,7 +36,7 @@ import { brandFeatureScreens } from '../featuresScreens';
36
36
  import { brandSelector, verifyLeadToken } from '../app/brand/brandStore';
37
37
  import Background from '../shared/Background';
38
38
  var Brand = memo(function (_a) {
39
- var verifyToken = _a.verifyToken, configToken = _a.configToken, props = __rest(_a, ["verifyToken", "configToken"]);
39
+ var verifyToken = _a.verifyToken, configToken = _a.configToken, loaderColor = _a.loaderColor, props = __rest(_a, ["verifyToken", "configToken", "loaderColor"]);
40
40
  var theme = useAppTheme().theme;
41
41
  var _b = useAppSelector(settingsSelector), data = _b.data, error = _b.error, settingLoading = _b.loading;
42
42
  var _c = useAppSelector(brandSelector), customLoading = _c.customLoading, loading = _c.loading, brandError = _c.error;
@@ -55,11 +55,14 @@ var Brand = memo(function (_a) {
55
55
  loadingScreenName: 'BRAND_LOADING_DATA_STEP',
56
56
  navigation: featureScreensNavigation,
57
57
  open: open,
58
+ mode: props.mode,
58
59
  internalToken: verifyToken,
59
- settingLoading: settingLoading
60
+ settingLoading: settingLoading,
61
+ operatorErrorScreenName: 'BRAND_OPERATOR_ERROR_STEP',
62
+ isValidOperator: data.isValidOperator
60
63
  });
61
- var initialLoading = verifyToken ? settingLoading : settingLoading || customLoading;
62
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: isMaturityExpress, type: props.mode === 'content' ? 'CONTENT' : undefined, dialogEdgeFormat: data.appConfig.dialogEdgeFormat, features: appConfig.features }, { children: _jsx(FeatureContainer, __assign({ isMaturityExpress: isMaturityExpress }, { children: brandFeatureScreens.map(function (_a, index) {
64
+ var initialLoading = verifyToken && props.mode !== 'content' ? settingLoading : settingLoading || customLoading;
65
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ mode: props.mode, open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, loading: initialLoading, error: error, open: open, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: isMaturityExpress, loaderColor: loaderColor, type: props.mode === 'content' ? 'CONTENT' : undefined, dialogEdgeFormat: data.appConfig.dialogEdgeFormat, features: appConfig.features }, { children: _jsx(FeatureContainer, __assign({ mode: props.mode, isMaturityExpress: isMaturityExpress }, { children: brandFeatureScreens.map(function (_a, index) {
63
66
  var Element = _a.element, name = _a.name;
64
67
  var isActive = activeScreen.name === name;
65
68
  return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
@@ -15,13 +15,13 @@ import { ScreenContainer } from '../../../shared/Containers';
15
15
  import { FormProvider, useForm } from 'react-hook-form';
16
16
  import Form from '../../../../components/Form';
17
17
  import { styled } from '@mui/material/styles';
18
- import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
18
+ import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified, useFormDirtyCheck } from '../../../../hooks';
19
19
  import { yupResolver } from '@hookform/resolvers/yup';
20
20
  import { BrandActivitiesValidationSchema } from './validation';
21
21
  import Button from '../../../shared/Button';
22
22
  import { brandSelector, updateBrandActivities } from '../../../app/brand/brandStore';
23
- import { handlePrevScreenStep } from '../../../../app/settings';
24
- import { deepCopy } from '../../../../utils';
23
+ import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
24
+ import { deepCopy, sendCustomEventToGTM } from '../../../../utils';
25
25
  import { useTranslation } from 'react-i18next';
26
26
  import ActivitiesList from './ActivitiesList';
27
27
  import CustomerBase from './CustomerBase';
@@ -36,11 +36,12 @@ var FormStyled = styled(Form)(function () { return ({
36
36
  flexDirection: 'column'
37
37
  }); });
38
38
  var BrandActivities = function (_a) {
39
- var _b, _c, _d, _e, _f;
40
- var _g = React.useState(), listActive = _g[0], setListActive = _g[1];
39
+ var _b, _c, _d, _e;
40
+ var _f = React.useState(), listActive = _f[0], setListActive = _f[1];
41
41
  var dispatch = useAppDispatch();
42
- var _h = useAppSelector(brandSelector), data = _h.data, loading = _h.loading, error = _h.error;
43
- var _j = data.brandActivities, activities = _j.activities, customerLocations = _j.customerLocations, expectedCustomer = _j.expectedCustomer, expectedSale = _j.expectedSale, termAndConditionChecked = _j.termAndConditionChecked, refundPolicy = _j.refundPolicy, transactionPolicy = _j.transactionPolicy;
42
+ var settingsData = useAppSelector(settingsSelector).data;
43
+ var _g = useAppSelector(brandSelector), data = _g.data, loading = _g.loading, error = _g.error;
44
+ var _h = data.brandActivities, activities = _h.activities, customerLocations = _h.customerLocations, expectedCustomer = _h.expectedCustomer, expectedSale = _h.expectedSale, termAndConditionChecked = _h.termAndConditionChecked, refundPolicy = _h.refundPolicy, transactionPolicy = _h.transactionPolicy;
44
45
  var ListType;
45
46
  (function (ListType) {
46
47
  ListType["ActivitiesList"] = "ActivitiesList";
@@ -48,6 +49,14 @@ var BrandActivities = function (_a) {
48
49
  ListType["ExpectedCustomerList"] = "ExpectedCustomerList";
49
50
  ListType["ExpectedSalesList"] = "ExpectedSalesList";
50
51
  })(ListType || (ListType = {}));
52
+ React.useEffect(function () {
53
+ sendCustomEventToGTM({
54
+ event: 'Send Event',
55
+ event_category: 'Board Flows - Brand',
56
+ event_action: 'Update Brand Activities Details Page',
57
+ event_label: settingsData.businessCountry.iso2
58
+ });
59
+ }, []);
51
60
  var methods = useForm({
52
61
  resolver: yupResolver(BrandActivitiesValidationSchema()),
53
62
  defaultValues: {
@@ -62,7 +71,8 @@ var BrandActivities = function (_a) {
62
71
  mode: 'onChange'
63
72
  });
64
73
  useSetFromDefaultValues(methods, data.brandActivities, true);
65
- var _k = ((_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.brand) || {}, data_status = _k.data_status, data_verification = _k.data_verification, operations = _k.operations;
74
+ var _j = data.verify.responseBody || {}, activitiesDefaultValues = _j.activitiesDefaultValues, brand = _j.brand;
75
+ var _k = brand || {}, data_status = _k.data_status, data_verification = _k.data_verification, operations = _k.operations;
66
76
  var originalReadOnly = useFormReadOnly(methods);
67
77
  var noneEditable = useDataNoneEditable(data_status, [
68
78
  'activities',
@@ -78,6 +88,32 @@ var BrandActivities = function (_a) {
78
88
  'operations.sales_range'
79
89
  ]);
80
90
  var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
91
+ var isDirty = useFormDirtyCheck(methods, {
92
+ activities: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.activities,
93
+ customerLocations: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.customerLocations,
94
+ expectedCustomer: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.expectedCustomer,
95
+ expectedSale: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.expectedSale,
96
+ termAndConditionChecked: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.termAndConditionChecked,
97
+ refundPolicy: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.transactionPolicy,
98
+ transactionPolicy: activitiesDefaultValues === null || activitiesDefaultValues === void 0 ? void 0 : activitiesDefaultValues.refundPolicy
99
+ }, [
100
+ {
101
+ name: 'activities',
102
+ keys: ['id']
103
+ },
104
+ {
105
+ name: 'customerLocations',
106
+ keys: ['id']
107
+ },
108
+ {
109
+ name: 'expectedCustomer',
110
+ keys: ['id']
111
+ },
112
+ {
113
+ name: 'expectedSale',
114
+ keys: ['id']
115
+ }
116
+ ]).isDirty;
81
117
  var locations = methods.watch('customerLocations');
82
118
  var isCustomerLocationsHasVerifiedValue = React.useMemo(function () {
83
119
  var _a, _b;
@@ -92,10 +128,11 @@ var BrandActivities = function (_a) {
92
128
  return (locationIds === null || locationIds === void 0 ? void 0 : locationIds.length) === (Ids === null || Ids === void 0 ? void 0 : Ids.length) && locationIds.every(function (locationId) { return Ids.includes(locationId); });
93
129
  }, [locations, operations]);
94
130
  var isCustomerLocationsVerified = dataVerified['operations.customer_base_location'] && isCustomerLocationsHasVerifiedValue;
95
- var isExpectedSalesRangeVerified = dataVerified['operations.sales_range'] && ((_c = operations === null || operations === void 0 ? void 0 : operations.sales) === null || _c === void 0 ? void 0 : _c.id) === ((_d = methods.watch('expectedSale')) === null || _d === void 0 ? void 0 : _d.id);
96
- var isExpectedCustomersVerified = dataVerified['operations.customer_base'] && ((_e = operations === null || operations === void 0 ? void 0 : operations.customer_base) === null || _e === void 0 ? void 0 : _e.id) === ((_f = methods.watch('expectedCustomer')) === null || _f === void 0 ? void 0 : _f.id);
131
+ var isExpectedSalesRangeVerified = dataVerified['operations.sales_range'] && ((_b = operations === null || operations === void 0 ? void 0 : operations.sales) === null || _b === void 0 ? void 0 : _b.id) === ((_c = methods.watch('expectedSale')) === null || _c === void 0 ? void 0 : _c.id);
132
+ var isExpectedCustomersVerified = dataVerified['operations.customer_base'] && ((_d = operations === null || operations === void 0 ? void 0 : operations.customer_base) === null || _d === void 0 ? void 0 : _d.id) === ((_e = methods.watch('expectedCustomer')) === null || _e === void 0 ? void 0 : _e.id);
97
133
  var onSubmit = function (data) {
98
- dispatch(updateBrandActivities(deepCopy(getFelids(data))));
134
+ var formData = __assign(__assign({}, deepCopy(getFelids(data))), { isDirty: isDirty });
135
+ dispatch(updateBrandActivities(formData));
99
136
  };
100
137
  var onBack = function () {
101
138
  dispatch(handlePrevScreenStep());
@@ -105,7 +142,7 @@ var BrandActivities = function (_a) {
105
142
  };
106
143
  var t = useTranslation().t;
107
144
  var isAr = useLanguage().isAr;
108
- var disabled = !methods.formState.isValid || !!error;
145
+ var disabled = !methods.formState.isValid;
109
146
  var isActivitiesListActive = listActive === ListType.ActivitiesList;
110
147
  var isCustomerBaseListActive = listActive === ListType.CustomerBaseList;
111
148
  var isExpectedCustomerListActive = listActive === ListType.ExpectedCustomerList;
@@ -15,7 +15,7 @@ import { useTranslation } from 'react-i18next';
15
15
  import { useController, useFormContext } from 'react-hook-form';
16
16
  import Box from '@mui/material/Box';
17
17
  import { styled } from '@mui/material/styles';
18
- import { isExist } from '../../../../utils';
18
+ import { getCurrencyByCountryIso2, isExist } from '../../../../utils';
19
19
  import { useLanguage, useAppSelector, useAppDispatch } from '../../../../hooks';
20
20
  import { settingsSelector } from '../../../../app/settings';
21
21
  import SimpleList from '../../../../components/SimpleList';
@@ -68,7 +68,7 @@ var ExpectedSalesRange = function (_a) {
68
68
  var expectedSaleControl = useController({ name: 'expectedSale', control: control });
69
69
  var _g = useAppSelector(brandSelector), data = _g.data, error = _g.error;
70
70
  var settingsData = useAppSelector(settingsSelector).data;
71
- var brandActivities = data.brandActivities, currency = data.currency;
71
+ var brandActivities = data.brandActivities;
72
72
  var expectedSales = (brandActivities.responseBody || {}).expectedSales;
73
73
  var expectedSalesRangeValue = expectedSaleControl.field.value;
74
74
  var countryCode = settingsData.businessCountry;
@@ -95,6 +95,9 @@ var ExpectedSalesRange = function (_a) {
95
95
  var handleCloseSubMenu = function () {
96
96
  setSubIndex('');
97
97
  };
98
+ var getCurrency = React.useMemo(function () {
99
+ return t(getCurrencyByCountryIso2(countryCode.iso2));
100
+ }, [countryCode.iso2]);
98
101
  React.useEffect(function () {
99
102
  if ((expectedSales === null || expectedSales === void 0 ? void 0 : expectedSales.length) > 0) {
100
103
  setExpectedSalesRangeList(expectedSales);
@@ -124,7 +127,7 @@ var ExpectedSalesRange = function (_a) {
124
127
  setSubIndex(item.id);
125
128
  }, [anchorEl, expectedSalesRangeValue]);
126
129
  return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, { children: [_jsxs(InputLabelStyled, { children: [t('expected_sales_monthly', {
127
- currency: t(currency)
130
+ currency: getCurrency
128
131
  }), _jsx(MandatoryStyled, { children: "*" })] }), _jsx(InputStyled, { readOnly: readOnly, value: isAr ? (_b = expectedSalesRangeValue === null || expectedSalesRangeValue === void 0 ? void 0 : expectedSalesRangeValue.name.ar) !== null && _b !== void 0 ? _b : '' : (_c = expectedSalesRangeValue === null || expectedSalesRangeValue === void 0 ? void 0 : expectedSalesRangeValue.name.en) !== null && _c !== void 0 ? _c : '', onClick: !!anchorEl ? handleCloseMainMenu : handleOpenMainMenu, placeholder: t('choose_expected_sales'), endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl, isVerified: isVerified }) }), _jsxs(Collapse, __assign({ in: !!anchorEl }, { children: [_jsx(Search, { onSearchValue: handleSearch }), _jsx(SimpleListStyled, { sx: { maxHeight: '350px', paddingTop: 0 }, list: expectedSalesRangeList, listItemProps: { sx: { padding: 0 } }, onSelectItem: function (item) {
129
132
  var isOnlyOneItem = !item.sub || item.sub.length === 1;
130
133
  if (isOnlyOneItem)
@@ -88,6 +88,6 @@ var RefundPolicy = function (_a) {
88
88
  return;
89
89
  refundControl.field.onChange(checked);
90
90
  };
91
- return (_jsx(Collapse, __assign({ in: !isChecked }, { children: _jsxs(ScreenContainer, { children: [_jsxs(ContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: refundChecked, onChange: handleRefundCheckedChange }), _jsxs(TextStyled, { children: [t('agree_on_refund_policy'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.REFUND_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.REFUND_EN, target: '_blank', underline: 'always' }, { children: t('refund_policy_compliance') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }) })));
91
+ return (_jsxs(ScreenContainer, { children: [_jsxs(ContainerStyled, __assign({ readOnly: readOnly || isChecked }, { children: [_jsx(CheckboxStyled, { disabled: isChecked, disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: refundChecked, onChange: handleRefundCheckedChange }), _jsxs(TextStyled, { children: [t('agree_on_refund_policy'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.REFUND_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.REFUND_EN, target: '_blank', underline: 'always' }, { children: t('refund_policy_compliance') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }));
92
92
  };
93
93
  export default RefundPolicy;
@@ -88,6 +88,6 @@ var TAC = function (_a) {
88
88
  return;
89
89
  tacControl.field.onChange(checked);
90
90
  };
91
- return (_jsx(Collapse, __assign({ in: !isChecked }, { children: _jsxs(ScreenContainer, __assign({ sx: { mt: 2.75 } }, { children: [_jsxs(TACContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: tacChecked, onChange: handleTACCheckedChange }), _jsxs(TextStyled, { children: [t('read_agree_terms_and_conditions_message'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TOS_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TOS_EN, target: '_blank', underline: 'always' }, { children: t('terms_and_conditions_link_title') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] })) })));
91
+ return (_jsxs(ScreenContainer, __assign({ sx: { mt: 2.75 } }, { children: [_jsxs(TACContainerStyled, __assign({ readOnly: readOnly || isChecked }, { children: [_jsx(CheckboxStyled, { disabled: isChecked, disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: tacChecked, onChange: handleTACCheckedChange }), _jsxs(TextStyled, { children: [t('read_agree_terms_and_conditions_message'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TOS_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TOS_EN, target: '_blank', underline: 'always' }, { children: t('terms_and_conditions_link_title') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] })));
92
92
  };
93
93
  export default React.memo(TAC);
@@ -51,6 +51,6 @@ var TransactionPolicy = function (_a) {
51
51
  return;
52
52
  transactionControl.field.onChange(checked);
53
53
  };
54
- return (_jsx(Collapse, __assign({ in: !isChecked }, { children: _jsxs(ScreenContainer, { children: [_jsxs(ContainerStyled, __assign({ readOnly: readOnly }, { children: [_jsx(CheckboxStyled, { disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: transactionChecked, onChange: handleTransactionCheckedChange }), _jsxs(TextStyled, { children: [t('agree_on_chargeback_policy'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TRANSACTION_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TRANSACTION_EN, target: '_blank', underline: 'always' }, { children: t('chargeback_policy') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }) })));
54
+ return (_jsxs(ScreenContainer, { children: [_jsxs(ContainerStyled, __assign({ readOnly: readOnly || isChecked }, { children: [_jsx(CheckboxStyled, { disabled: isChecked, disableRipple: true, disableFocusRipple: true, focusRipple: false, checked: transactionChecked, onChange: handleTransactionCheckedChange }), _jsxs(TextStyled, { children: [t('agree_on_chargeback_policy'), _jsx(LinkStyled, __assign({ href: isAr ? TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TRANSACTION_AR : TAP_WEBSITE + countryCode + EXTERNAL_LINKS.TRANSACTION_EN, target: '_blank', underline: 'always' }, { children: t('chargeback_policy') }))] })] })), _jsx(CollapseStyled, __assign({ in: !!warningMessage }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: warningMessage && t(warningMessage) })) }))] }));
55
55
  };
56
56
  export default TransactionPolicy;
@@ -14,11 +14,11 @@ import React from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { FormProvider, useForm } from 'react-hook-form';
16
16
  import { styled } from '@mui/material/styles';
17
- import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
17
+ import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified, useFormDirtyCheck } from '../../../../hooks';
18
18
  import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
19
19
  import { yupResolver } from '@hookform/resolvers/yup';
20
20
  import Form from '../../../../components/Form';
21
- import { deepCopy, mapSalesChannel } from '../../../../utils';
21
+ import { deepCopy, mapSalesChannel, sendCustomEventToGTM } from '../../../../utils';
22
22
  import Button from '../../../shared/Button';
23
23
  import { clearError, brandSelector, updateBrand, retrieveBoardStatus } from '../../../app/brand/brandStore';
24
24
  import { ScreenContainer } from '../../../shared/Containers';
@@ -39,7 +39,7 @@ var BrandInfo = function (_a) {
39
39
  var settingsData = useAppSelector(settingsSelector).data;
40
40
  var _d = data.brandData, brandName = _d.brandName, salesChannels = _d.salesChannels, brandLogoId = _d.brandLogoId, responseBody = _d.responseBody;
41
41
  var _e = data.verify.responseBody || {}, brand = _e.brand, flows = _e.flows;
42
- var _f = brand || {}, logo_details = _f.logo_details, data_status = _f.data_status, data_verification = _f.data_verification, name = _f.name;
42
+ var _f = brand || {}, logo_details = _f.logo_details, data_status = _f.data_status, data_verification = _f.data_verification, name = _f.name, channel_services = _f.channel_services;
43
43
  var methods = useForm({
44
44
  resolver: yupResolver(BrandValidationSchema()),
45
45
  defaultValues: {
@@ -52,6 +52,17 @@ var BrandInfo = function (_a) {
52
52
  var watch = methods.watch;
53
53
  useSetFromDefaultValues(methods, data.brandData, true);
54
54
  var defaultBrandLogoFile = React.useMemo(function () { return logo_details && __assign(__assign({}, logo_details), { docId: '' }); }, [logo_details]);
55
+ var initialSalesChannels = React.useMemo(function () { return mapSalesChannel(channel_services || []); }, [channel_services]);
56
+ var isDirty = useFormDirtyCheck(methods, {
57
+ brandName: ((name === null || name === void 0 ? void 0 : name.en) || '').trim(),
58
+ salesChannels: initialSalesChannels,
59
+ brandLogoId: defaultBrandLogoFile === null || defaultBrandLogoFile === void 0 ? void 0 : defaultBrandLogoFile.id
60
+ }, [
61
+ {
62
+ name: 'salesChannels',
63
+ keys: ['id', 'address', 'code', 'sub']
64
+ }
65
+ ]).isDirty;
55
66
  var originalReadOnly = useFormReadOnly(methods, { brandLogoId: defaultBrandLogoFile });
56
67
  var noneEditable = useDataNoneEditable(data_status, ['name.en', 'name.ar', 'channel_services', 'logo']);
57
68
  var readOnly = useFormErrorAndUpdateReadOnly(methods, originalReadOnly, noneEditable);
@@ -59,9 +70,16 @@ var BrandInfo = function (_a) {
59
70
  var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
60
71
  var isBrandNameVerified = dataVerified['name.en'] && dataVerified['name.ar'] && ((name === null || name === void 0 ? void 0 : name.en) === watch('brandName') || (name === null || name === void 0 ? void 0 : name.ar) === watch('brandName'));
61
72
  var onSubmit = function (data) {
62
- dispatch(updateBrand(deepCopy(getFelids(data))));
73
+ var formData = __assign(__assign({}, deepCopy(getFelids(data))), { isDirty: isDirty });
74
+ dispatch(updateBrand(formData));
63
75
  };
64
76
  var onBack = function () {
77
+ sendCustomEventToGTM({
78
+ event: 'Send Event',
79
+ event_category: 'Board Flows - Brand',
80
+ event_action: 'Brand Details Back button',
81
+ event_label: settingsData.businessCountry.iso2
82
+ });
65
83
  if ((flows === null || flows === void 0 ? void 0 : flows.length) > 0) {
66
84
  dispatch(handlePrevScreenStep());
67
85
  return;
@@ -80,7 +98,7 @@ var BrandInfo = function (_a) {
80
98
  if ((responseBody === null || responseBody === void 0 ? void 0 : responseBody.response_code) === '5')
81
99
  methods.setError('brandName', { message: 'brand_name_already_exist' });
82
100
  }, [responseBody]);
83
- var brandErrChecks = !methods.formState.isValid || !!methods.formState.errors.brandName || !!error;
101
+ var brandErrChecks = !methods.formState.isValid || !!methods.formState.errors.brandName;
84
102
  var disabled = brandErrChecks || brandNameChecking || uploadingBrandLogo;
85
103
  var disableBack = settingsData.appConfig.mode === 'content';
86
104
  return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandName, { readOnly: readOnly['brandName'] || (noneEditable['name.en'] && noneEditable['name.ar']), brandNameChecking: brandNameChecking, fetchingBrandName: setBrandNameChecking, isVerified: isBrandNameVerified }), _jsx(BrandLogo, { defaultFile: defaultBrandLogoFile, readOnly: readOnly['brandLogoId'], isVerified: dataVerified['logo'] }), _jsx(SalesChannels, { readOnly: readOnly['salesChannels'] || noneEditable['channel_services'] }), _jsx(Button, __assign({ disableBack: disableBack, onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('next') }))] })) })) }));
@@ -14,12 +14,12 @@ import React from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { FormProvider, useForm } from 'react-hook-form';
16
16
  import { styled } from '@mui/material/styles';
17
- import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
18
- import { handlePrevScreenStep } from '../../../../app/settings';
17
+ import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified, useFormDirtyCheck } from '../../../../hooks';
18
+ import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
19
19
  import { yupResolver } from '@hookform/resolvers/yup';
20
20
  import Collapse from '../../../../components/Collapse';
21
21
  import Form from '../../../../components/Form';
22
- import { deepCopy } from '../../../../utils';
22
+ import { deepCopy, sendCustomEventToGTM } from '../../../../utils';
23
23
  import { ScreenContainer } from '../../../shared/Containers';
24
24
  import { clearError, brandSelector, updateSegmentBrand } from '../../../app/brand/brandStore';
25
25
  import Button from '../../../shared/Button';
@@ -46,9 +46,10 @@ var BrandInfo = function (_a) {
46
46
  var t = useTranslation().t;
47
47
  var isAr = useLanguage().isAr;
48
48
  var _l = useAppSelector(brandSelector), data = _l.data, loading = _l.loading, error = _l.error;
49
+ var settingsData = useAppSelector(settingsSelector).data;
49
50
  var _m = data.brandSegmentData, segmentLocation = _m.segmentLocation, segmentProfit = _m.segmentProfit, segmentTech = _m.segmentTech, teamSize = _m.teamSize;
50
- var brand = (data.verify.responseBody || {}).brand;
51
- var _o = brand || {}, data_status = _o.data_status, data_verification = _o.data_verification, resSegment = _o.segment;
51
+ var _o = data.verify.responseBody || {}, brand = _o.brand, segmentDefaultValues = _o.segmentDefaultValues;
52
+ var _p = brand || {}, data_status = _p.data_status, data_verification = _p.data_verification, resSegment = _p.segment;
52
53
  var methods = useForm({
53
54
  resolver: yupResolver(BrandValidationSchema()),
54
55
  defaultValues: {
@@ -61,6 +62,12 @@ var BrandInfo = function (_a) {
61
62
  });
62
63
  var watch = methods.watch;
63
64
  useSetFromDefaultValues(methods, data.brandSegmentData, true);
65
+ var isDirty = useFormDirtyCheck(methods, {
66
+ segmentLocation: segmentDefaultValues === null || segmentDefaultValues === void 0 ? void 0 : segmentDefaultValues.segmentLocation,
67
+ segmentProfit: segmentDefaultValues === null || segmentDefaultValues === void 0 ? void 0 : segmentDefaultValues.segmentProfit,
68
+ segmentTech: segmentDefaultValues === null || segmentDefaultValues === void 0 ? void 0 : segmentDefaultValues.segmentTech,
69
+ teamSize: segmentDefaultValues === null || segmentDefaultValues === void 0 ? void 0 : segmentDefaultValues.teamSize
70
+ }).isDirty;
64
71
  var originalReadOnly = useFormReadOnly(methods);
65
72
  var noneEditable = useDataNoneEditable(data_status, [
66
73
  'segment.location_type',
@@ -81,16 +88,25 @@ var BrandInfo = function (_a) {
81
88
  var isSegmentTechVerified = dataVerified['segment.tech_type'] && ((_f = resSegment === null || resSegment === void 0 ? void 0 : resSegment.tech_type) === null || _f === void 0 ? void 0 : _f.id) === ((_g = watch('segmentTech')) === null || _g === void 0 ? void 0 : _g.id);
82
89
  var isTeamSizeVerified = dataVerified['segment.teams'] && ((_h = resSegment === null || resSegment === void 0 ? void 0 : resSegment.team) === null || _h === void 0 ? void 0 : _h.id) === ((_j = watch('teamSize')) === null || _j === void 0 ? void 0 : _j.id);
83
90
  var onSubmit = function (data) {
84
- dispatch(updateSegmentBrand(deepCopy(getFelids(data))));
91
+ var formData = __assign(__assign({}, deepCopy(getFelids(data))), { isDirty: isDirty });
92
+ dispatch(updateSegmentBrand(formData));
85
93
  };
86
94
  var onBack = function () {
87
95
  dispatch(handlePrevScreenStep());
88
96
  };
97
+ React.useEffect(function () {
98
+ sendCustomEventToGTM({
99
+ event: 'Send Event',
100
+ event_category: 'Board Flows - Brand',
101
+ event_action: 'Update Business Market & Size',
102
+ event_label: settingsData.businessCountry.iso2
103
+ });
104
+ }, []);
89
105
  React.useEffect(function () {
90
106
  if (error)
91
107
  dispatch(clearError());
92
108
  }, [methods.formState.isValid]);
93
- var disabled = !methods.formState.isValid || !!error;
109
+ var disabled = !methods.formState.isValid;
94
110
  var handleMenuClick = function (flag) {
95
111
  setListActive(flag);
96
112
  };
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OperatorErrorProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OperatorErrorProps) => import("react/jsx-runtime").JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,9 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
3
+ import { useTranslation } from 'react-i18next';
4
+ import GenericError from '../../../shared/GenericError';
5
+ var OperatorError = function (_a) {
6
+ var t = useTranslation().t;
7
+ return _jsx(GenericError, { error: t('operator_is_invalid'), errorTitle: t('oops') });
8
+ };
9
+ export default React.memo(OperatorError);