@tap-payments/auth-jsconnect 1.0.63 → 1.0.67

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 (38) hide show
  1. package/build/api/availabilityServices.d.ts +5 -0
  2. package/build/api/availabilityServices.js +5 -1
  3. package/build/api/entity.d.ts +1 -0
  4. package/build/api/index.d.ts +1 -0
  5. package/build/assets/locales/ar.json +2 -0
  6. package/build/assets/locales/en.json +4 -2
  7. package/build/constants/api.d.ts +1 -0
  8. package/build/constants/api.js +3 -1
  9. package/build/constants/assets.d.ts +10 -8
  10. package/build/constants/assets.js +10 -8
  11. package/build/constants/validation.d.ts +1 -0
  12. package/build/constants/validation.js +1 -0
  13. package/build/features/app/bank/bankStore.d.ts +8 -0
  14. package/build/features/app/bank/bankStore.js +36 -3
  15. package/build/features/app/business/businessStore.d.ts +3 -0
  16. package/build/features/app/business/businessStore.js +66 -33
  17. package/build/features/app/connect/connectStore.js +1 -1
  18. package/build/features/bank/screens/BankDetails/BankDetails.js +6 -4
  19. package/build/features/bank/screens/BankDetails/BankName.js +17 -3
  20. package/build/features/bank/screens/BankDetails/Beneficiary.js +12 -3
  21. package/build/features/bank/screens/BankDetails/IBAN.d.ts +3 -1
  22. package/build/features/bank/screens/BankDetails/IBAN.js +67 -4
  23. package/build/features/bank/screens/BankDetails/validation.js +2 -2
  24. package/build/features/bank/screens/Success/Success.js +2 -4
  25. package/build/features/business/screens/BusinessType/LicenseList.js +1 -1
  26. package/build/features/business/screens/BusinessType/LicenseNumber.js +1 -1
  27. package/build/features/business/screens/BusinessType/validation.d.ts +3 -3
  28. package/build/features/business/screens/BusinessType/validation.js +14 -7
  29. package/build/features/business/screens/Customers/ExpectedSalesRange.js +0 -5
  30. package/build/features/business/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +33 -27
  31. package/build/features/individual/screens/Success/Success.js +2 -4
  32. package/build/features/password/screens/Success/Success.js +2 -4
  33. package/build/features/shared/Button/AbsherButton.js +22 -19
  34. package/build/features/shared/Button/FlowsButtons.d.ts +3 -3
  35. package/build/features/shared/Button/FlowsButtons.js +30 -18
  36. package/build/features/shared/Button/MobileButton.js +13 -11
  37. package/build/features/tax/screens/Success/Success.js +2 -4
  38. package/package.json +1 -1
@@ -1,10 +1,13 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
+ import * as React from 'react';
2
3
  import Input from '../../../shared/Input';
3
4
  import { useTranslation } from 'react-i18next';
4
5
  import { useController, useFormContext } from 'react-hook-form';
5
6
  import { styled } from '@mui/material';
6
7
  import { removeOnlyNumbers } from '../../../../utils';
7
8
  import { ScreenContainer } from '../../../shared/Containers';
9
+ import { bankSelector } from '../../../app/bank/bankStore';
10
+ import { useAppSelector, useLanguage } from '../../../../hooks';
8
11
  import ClearIcon from '../../../shared/ClearIcon';
9
12
  import CheckIcon from '../../../shared/CheckIcon';
10
13
  var FeatureStyled = styled(ScreenContainer)(function (_a) {
@@ -22,13 +25,19 @@ var InputStyled = styled(Input)(function (_a) {
22
25
  });
23
26
  });
24
27
  var Beneficiary = function () {
25
- var _a, _b;
28
+ var _a, _b, _c, _d;
26
29
  var t = useTranslation().t;
27
- var control = useFormContext().control;
30
+ var _e = useFormContext(), setValue = _e.setValue, control = _e.control;
31
+ var isAr = useLanguage().isAr;
32
+ var data = useAppSelector(bankSelector).data;
28
33
  var beneficiaryControl = useController({ name: 'beneficiaryName', control: control });
29
34
  var beneficiaryValue = beneficiaryControl.field.value;
30
35
  var hasError = (_a = beneficiaryControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
31
36
  var error = (_b = beneficiaryControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
37
+ var legalName = (_d = (_c = data.verify.responseBody) === null || _c === void 0 ? void 0 : _c.entity) === null || _d === void 0 ? void 0 : _d.legal_name;
38
+ React.useEffect(function () {
39
+ setValue('beneficiaryName', isAr ? legalName === null || legalName === void 0 ? void 0 : legalName.ar : legalName === null || legalName === void 0 ? void 0 : legalName.en);
40
+ }, []);
32
41
  var handleBeneficiaryChange = function (_a) {
33
42
  var target = _a.target;
34
43
  var value = removeOnlyNumbers(target.value);
@@ -37,6 +46,6 @@ var Beneficiary = function () {
37
46
  var clearValue = function () {
38
47
  beneficiaryControl.field.onChange('');
39
48
  };
40
- return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
49
+ return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, disabled: !!legalName, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
41
50
  };
42
51
  export default Beneficiary;
@@ -1,5 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  export interface IBANProps {
3
+ fetchingIban: (flag: boolean) => void;
4
+ ibanChecking: boolean;
3
5
  }
4
- declare const IBAN: () => JSX.Element;
6
+ declare const IBAN: ({ fetchingIban, ibanChecking }: IBANProps) => JSX.Element;
5
7
  export default IBAN;
@@ -1,4 +1,41 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __generator = (this && this.__generator) || function (thisArg, body) {
11
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
12
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
13
+ function verb(n) { return function (v) { return step([n, v]); }; }
14
+ function step(op) {
15
+ if (f) throw new TypeError("Generator is already executing.");
16
+ while (_) try {
17
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
18
+ if (y = 0, t) op = [op[0] & 2, t.value];
19
+ switch (op[0]) {
20
+ case 0: case 1: t = op; break;
21
+ case 4: _.label++; return { value: op[1], done: false };
22
+ case 5: _.label++; y = op[1]; op = [0]; continue;
23
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
24
+ default:
25
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
26
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
27
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
28
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
29
+ if (t[2]) _.ops.pop();
30
+ _.trys.pop(); continue;
31
+ }
32
+ op = body.call(thisArg, _);
33
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
34
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
+ }
36
+ };
1
37
  import { jsx as _jsx } from "react/jsx-runtime";
38
+ import * as React from 'react';
2
39
  import Input from '../../../shared/Input';
3
40
  import { useTranslation } from 'react-i18next';
4
41
  import { useController, useFormContext } from 'react-hook-form';
@@ -6,22 +43,48 @@ import { removeAllOtherThanCharsAndNumber } from '../../../../utils';
6
43
  import { styled } from '@mui/material';
7
44
  import { MAX_IBAN_VALUE } from '../../../../constants';
8
45
  import { ScreenContainer } from '../../../shared/Containers';
46
+ import { debounce } from 'lodash-es';
47
+ import { checkIbanBank } from '../../../app/bank/bankStore';
48
+ import { useAppDispatch } from '../../../../hooks';
49
+ import axios from 'axios';
9
50
  import ClearIcon from '../../../shared/ClearIcon';
10
51
  import CheckIcon from '../../../shared/CheckIcon';
52
+ import CircularProgress from '@mui/material/CircularProgress';
11
53
  var FeatureStyled = styled(ScreenContainer)(function (_a) {
12
54
  var theme = _a.theme;
13
55
  return ({
14
56
  marginBlockEnd: theme.spacing(3)
15
57
  });
16
58
  });
17
- var IBAN = function () {
18
- var _a, _b;
59
+ var cancelToken = null;
60
+ var IBAN = function (_a) {
61
+ var _b;
62
+ var fetchingIban = _a.fetchingIban, ibanChecking = _a.ibanChecking;
63
+ var dispatch = useAppDispatch();
19
64
  var t = useTranslation().t;
20
65
  var control = useFormContext().control;
21
66
  var ibanControl = useController({ name: 'iban', control: control });
22
67
  var ibanValue = ibanControl.field.value;
23
- var hasError = !!((_a = ibanControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message);
24
68
  var error = (_b = ibanControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
69
+ var checkBank = debounce(function (value) { return __awaiter(void 0, void 0, void 0, function () {
70
+ var onSuccess;
71
+ return __generator(this, function (_a) {
72
+ if (cancelToken) {
73
+ cancelToken.cancel('Aborted');
74
+ }
75
+ cancelToken = axios.CancelToken.source();
76
+ onSuccess = function () { return fetchingIban(false); };
77
+ dispatch(checkIbanBank({ iban: value, cancelToken: cancelToken.token, onSuccess: onSuccess }));
78
+ return [2];
79
+ });
80
+ }); }, 500);
81
+ React.useEffect(function () {
82
+ var isValid = ibanValue && !error && ibanValue.length > 14;
83
+ if (isValid) {
84
+ fetchingIban(true);
85
+ checkBank(ibanValue);
86
+ }
87
+ }, [ibanValue, error]);
25
88
  var handleIbanChange = function (_a) {
26
89
  var target = _a.target;
27
90
  var value = removeAllOtherThanCharsAndNumber(target.value);
@@ -30,6 +93,6 @@ var IBAN = function () {
30
93
  var clearValue = function () {
31
94
  ibanControl.field.onChange('');
32
95
  };
33
- return (_jsx(FeatureStyled, { children: _jsx(Input, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('enter_iban_placeholder'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && ibanValue ? _jsx(CheckIcon, {}) : ibanValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
96
+ return (_jsx(FeatureStyled, { children: _jsx(Input, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('enter_iban_placeholder'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: ibanChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && ibanValue ? (_jsx(CheckIcon, {})) : (ibanValue && _jsx(ClearIcon, { onClick: clearValue })) }) }));
34
97
  };
35
98
  export default IBAN;
@@ -1,4 +1,4 @@
1
- import { REGEX_FULL_NAME } from '../../../../constants';
1
+ import { REGEX_BENEFICIARY_NAME } from '../../../../constants';
2
2
  import * as yup from 'yup';
3
3
  export var BankValidation = yup.object().shape({
4
4
  iban: yup
@@ -10,6 +10,6 @@ export var BankValidation = yup.object().shape({
10
10
  bankName: yup.string().required('bank_name_required'),
11
11
  beneficiaryName: yup
12
12
  .string()
13
- .matches(REGEX_FULL_NAME, 'beneficiary_name_invalid')
13
+ .matches(REGEX_BENEFICIARY_NAME, 'beneficiary_name_invalid')
14
14
  .required('beneficiary_name_required')
15
15
  });
@@ -10,9 +10,7 @@ var Success = function (_a) {
10
10
  React.useEffect(function () {
11
11
  dispatch(updateLeadSuccess());
12
12
  }, []);
13
- var onSuccess = function () {
14
- window.open('mailto:');
15
- };
16
- return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess });
13
+ var onSuccess = function () { };
14
+ return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess, successTitle: 'continue' });
17
15
  };
18
16
  export default React.memo(Success);
@@ -122,7 +122,7 @@ var LicenseList = function (_a) {
122
122
  var licenseReadonly = !isOtherLicense(selected);
123
123
  var isCR = (selected === null || selected === void 0 ? void 0 : selected.type) === BusinessType.CR;
124
124
  var flValue = isOtherLicense(selected) ? t(getLicenseName(selected)) : getLicenseNumber(selected);
125
- return (_jsxs(ScreenContainer, { children: [_jsx(InputStyled, { label: t('choose_any_license'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseLicenseList(); } : onOpenLicenseList, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_license_cr'), value: isCR ? getLicenseName(selected) : flValue }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'legal_name?.en', list: licenseList || [], onSelectItem: onSelectItem, renderItem: function (item) {
125
+ return (_jsxs(ScreenContainer, { children: [_jsx(InputStyled, { label: t('choose_any_license'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseLicenseList(); } : onOpenLicenseList, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_license_cr'), value: isCR ? t(getLicenseName(selected)) : flValue }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'legal_name?.en', list: licenseList || [], onSelectItem: onSelectItem, renderItem: function (item) {
126
126
  return (_jsxs(_Fragment, { children: [_jsx(LicenseContainer, { children: _jsx(LicenseNameText, __assign({ isSelected: getLicenseNumber(item) === getLicenseNumber(selected) }, { children: isOtherLicense(item) ? t(getLicenseName(item)) : getLicenseFullName(item) })) }), getLicenseNumber(item) === getLicenseNumber(selected) && _jsx(CheckIcon, {})] }));
127
127
  } }) })), _jsx(LicenseNumber, { show: showLicenseNumber, readOnly: licenseReadonly })] }));
128
128
  };
@@ -41,6 +41,6 @@ var LicenseNumber = function (_a) {
41
41
  var error = (_b = licenseNumberControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
42
42
  var length = isCR ? CR_NUMBER_LENGTH : FL_NUMBER_LENGTH;
43
43
  var label = isCR ? 'cr_number' : 'fl_number';
44
- return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, { children: _jsx(Input, { readOnly: readOnly, label: t(label), onChange: handleFLNumberChange, inputProps: { maxLength: length }, value: licenseNumberValue, endAdornment: (licenseNumberValue === null || licenseNumberValue === void 0 ? void 0 : licenseNumberValue.length) === length ? (_jsx(CheckIcon, {})) : (licenseNumberValue && _jsx(ClearIcon, { onClick: clearLicenseNumber })), placeholder: isCR ? '01f3c5x78n' : '1a3c5b78', warningType: 'alert', warningMessage: error && t(error, { length: length }) }) }) })));
44
+ return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, { children: _jsx(Input, { readOnly: readOnly, label: t(label), onChange: handleFLNumberChange, inputProps: { maxLength: length }, value: licenseNumberValue, endAdornment: (licenseNumberValue === null || licenseNumberValue === void 0 ? void 0 : licenseNumberValue.length) === length ? (_jsx(CheckIcon, {})) : (licenseNumberValue && _jsx(ClearIcon, { onClick: clearLicenseNumber })), placeholder: isCR ? t('cr_number_hint') : t('fl_number_hint'), warningType: 'alert', warningMessage: error && t(error, { length: length }) }) }) })));
45
45
  };
46
46
  export default React.memo(LicenseNumber);
@@ -1,11 +1,11 @@
1
1
  import * as yup from 'yup';
2
2
  export declare const LicenseValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
3
  selectedLicense: any;
4
- licenseNumber: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
4
+ licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
5
5
  }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
6
6
  selectedLicense: any;
7
- licenseNumber: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
7
+ licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
8
  }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
9
9
  selectedLicense: any;
10
- licenseNumber: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
10
+ licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
11
11
  }>>>;
@@ -13,13 +13,20 @@ var objectElements = {
13
13
  };
14
14
  export var LicenseValidationSchema = yup.object().shape({
15
15
  selectedLicense: yup.object().shape(objectElements).required(''),
16
- licenseNumber: yup.string().when('selectedLicense', function (selectedLicenseValue) {
17
- var _a, _b;
18
- if (((_b = (_a = selectedLicenseValue === null || selectedLicenseValue === void 0 ? void 0 : selectedLicenseValue.license) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === BusinessType.CR) {
19
- return yup.string().min(CR_NUMBER_LENGTH, "cr_max_length").required('cr_required');
20
- }
21
- else {
22
- return yup.string().min(FL_NUMBER_LENGTH, "fl_max_length").required('fl_required');
16
+ licenseNumber: yup
17
+ .string()
18
+ .test({
19
+ test: function (value) {
20
+ var selectedLicense = this.parent.selectedLicense;
21
+ var isCR = (selectedLicense === null || selectedLicense === void 0 ? void 0 : selectedLicense.type) === BusinessType.CR;
22
+ var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
23
+ if (length === 0)
24
+ return true;
25
+ if (isCR) {
26
+ return length === CR_NUMBER_LENGTH ? true : this.createError({ message: 'cr_max_length' });
27
+ }
28
+ return length === FL_NUMBER_LENGTH ? true : this.createError({ message: 'fl_max_length' });
23
29
  }
24
30
  })
31
+ .required('')
25
32
  });
@@ -67,11 +67,6 @@ var ExpectedSalesRange = function (_a) {
67
67
  setExpectedSalesRangeList(response === null || response === void 0 ? void 0 : response.expectedSales);
68
68
  }
69
69
  }, [response === null || response === void 0 ? void 0 : response.expectedSales]);
70
- var checkRemainingCondition = function (item) {
71
- return !!expectedSalesRangeValue.find(function (expectedSale) {
72
- return expectedSale.id === item.id;
73
- });
74
- };
75
70
  var onSelectItem = function (expectedSalesRange) {
76
71
  onCloseList();
77
72
  expectedSalesRangeControl.field.onChange(expectedSalesRange);
@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
13
- import { memo } from 'react';
13
+ import { memo, useEffect, useState } from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { styled } from '@mui/material/styles';
16
16
  import Box from '@mui/material/Box';
@@ -18,6 +18,8 @@ import Text from '../../../../components/Text';
18
18
  import Container from '../../../shared/Containers/ScreenContainer';
19
19
  import { FlowsButtons } from '../../../shared/Button';
20
20
  import { ICONS_NAMES } from '../../../../constants';
21
+ import { useAppSelector, useLanguage } from '../../../../hooks';
22
+ import { businessSelector } from '../../../app/business/businessStore';
21
23
  var TextContainerStyled = styled(Box)(function (_a) {
22
24
  var theme = _a.theme;
23
25
  return ({
@@ -49,31 +51,35 @@ var ButtonGroupStyled = styled(Box)(function (_a) {
49
51
  });
50
52
  var SuccessWithFlowButtons = function () {
51
53
  var t = useTranslation().t;
52
- return (_jsxs(ContainerStyled, { children: [_jsx(TextContainerStyled, { children: _jsxs(TitleStyled, { children: [t('ide_successfully_verified_message'), " "] }) }), _jsx(ButtonGroupStyled, { children: _jsx(FlowsButtons, { buttons: [
53
- {
54
- title: t('tax_flow_pending'),
55
- href: '#',
56
- src: ICONS_NAMES.Tax_filled_icon,
57
- hoverSrc: ICONS_NAMES.Tax_white_icon
58
- },
59
- {
60
- title: t('individual_flow_pending'),
61
- href: '#',
62
- src: ICONS_NAMES.User_filled_icon,
63
- hoverSrc: ICONS_NAMES.User_white_icon
64
- },
65
- {
66
- title: t('bank_flow_pending'),
67
- href: '#',
68
- src: ICONS_NAMES.Bank_filled_icon,
69
- hoverSrc: ICONS_NAMES.Bank_white_icon
70
- },
71
- {
72
- title: t('password_flow_pending'),
73
- href: '#',
74
- src: ICONS_NAMES.Password_filled_icon,
75
- hoverSrc: ICONS_NAMES.Password_white_icon
76
- }
77
- ] }) })] }));
54
+ var isAr = useLanguage().isAr;
55
+ var data = useAppSelector(businessSelector).data;
56
+ var _a = data.verify.responseBody || {}, flows = _a.flows, nameObj = _a.name;
57
+ var _b = useState([]), buttons = _b[0], setButtons = _b[1];
58
+ var username = ((nameObj === null || nameObj === void 0 ? void 0 : nameObj.first) || '') + ' ' + ((nameObj === null || nameObj === void 0 ? void 0 : nameObj.last) || '');
59
+ var reMapFlowData = function (flows) {
60
+ if (flows === void 0) { flows = []; }
61
+ var images = ICONS_NAMES;
62
+ var mappedFlows = flows.map(function (_a) {
63
+ var name = _a.name, url = _a.url, status = _a.status;
64
+ var type = status === 'initiated' ? 'pending' : 'completed';
65
+ var title = t("".concat(name, "_flow_").concat(type), { individual_name: username });
66
+ var src = "".concat(name, "_filled_icon");
67
+ var hoverSrc = "".concat(name, "_white_icon");
68
+ var isCompleted = status === 'completed' && name !== 'password';
69
+ return {
70
+ title: title,
71
+ href: url,
72
+ src: images[src],
73
+ hoverSrc: images[hoverSrc],
74
+ isCompleted: isCompleted
75
+ };
76
+ });
77
+ setButtons(mappedFlows);
78
+ };
79
+ useEffect(function () {
80
+ if ((flows === null || flows === void 0 ? void 0 : flows.length) > 0)
81
+ reMapFlowData(flows);
82
+ }, [flows, isAr]);
83
+ return (_jsxs(ContainerStyled, { children: [_jsx(TextContainerStyled, { children: _jsxs(TitleStyled, { children: [t('ide_successfully_verified_message'), " "] }) }), _jsx(ButtonGroupStyled, { children: _jsx(FlowsButtons, { buttons: buttons }) })] }));
78
84
  };
79
85
  export default memo(SuccessWithFlowButtons);
@@ -10,9 +10,7 @@ var Success = function (_a) {
10
10
  React.useEffect(function () {
11
11
  dispatch(updateLeadSuccess());
12
12
  }, []);
13
- var onSuccess = function () {
14
- window.open('mailto:');
15
- };
16
- return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess });
13
+ var onSuccess = function () { };
14
+ return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess, successTitle: 'continue' });
17
15
  };
18
16
  export default React.memo(Success);
@@ -4,9 +4,7 @@ import { useTranslation } from 'react-i18next';
4
4
  import SuccessScreen from '../../../shared/SuccessScreen';
5
5
  var Success = function (_a) {
6
6
  var t = useTranslation().t;
7
- var onSuccess = function () {
8
- window.open('mailto:');
9
- };
10
- return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess });
7
+ var onSuccess = function () { };
8
+ return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess, successTitle: 'continue' });
11
9
  };
12
10
  export default React.memo(Success);
@@ -21,18 +21,17 @@ var __rest = (this && this.__rest) || function (s, e) {
21
21
  return t;
22
22
  };
23
23
  import { jsx as _jsx } from "react/jsx-runtime";
24
+ import React from 'react';
24
25
  import Button from '../../../components/Button';
25
26
  import Icon from '../../../components/Icon';
26
27
  import { alpha, styled } from '@mui/material/styles';
27
28
  import Box from '@mui/material/Box';
28
29
  import { ICONS_NAMES } from '../../../constants';
29
- var IconStyled = styled(Icon)(function (_a) {
30
- var theme = _a.theme;
31
- return ({
32
- width: theme.spacing(3),
33
- height: theme.spacing(3),
34
- marginInlineStart: theme.spacing(0.75)
35
- });
30
+ var IconStyled = styled(Icon, { shouldForwardProp: function (prop) { return prop !== 'disabled'; } })(function (_a) {
31
+ var theme = _a.theme, disabled = _a.disabled;
32
+ return (__assign({ width: theme.spacing(3), height: theme.spacing(3), marginInlineStart: theme.spacing(0.75) }, (disabled && {
33
+ opacity: 0.3
34
+ })));
36
35
  });
37
36
  var ButtonBoxStyled = styled(Box)(function (_a) {
38
37
  var theme = _a.theme;
@@ -40,31 +39,35 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
40
39
  margin: theme.spacing(0, 2.5, 2.5, 2.5)
41
40
  });
42
41
  });
43
- var ButtonStyled = styled(Button, { shouldForwardProp: function (prop) { return prop !== 'hideIcon'; } })(function (_a) {
44
- var theme = _a.theme, hideIcon = _a.hideIcon;
42
+ var ButtonStyled = styled(Button, {
43
+ shouldForwardProp: function (prop) { return prop !== 'hideIcon' && prop !== 'touched'; }
44
+ })(function (_a) {
45
+ var theme = _a.theme, hideIcon = _a.hideIcon, touched = _a.touched;
45
46
  return ({
46
47
  paddingInlineStart: theme.spacing(0.75),
47
48
  textTransform: 'none',
48
- backgroundColor: theme.palette.common.white,
49
+ backgroundColor: touched ? theme.palette.primary.light : theme.palette.common.white,
49
50
  border: "1px solid ".concat(hideIcon ? theme.palette.primary.main : theme.palette.primary.light),
50
- color: hideIcon ? theme.palette.primary.main : theme.palette.primary.light,
51
+ color: hideIcon ? theme.palette.primary.main : touched ? theme.palette.common.white : theme.palette.primary.light,
51
52
  '&:hover': {
52
- backgroundColor: hideIcon ? theme.palette.primary.main : theme.palette.primary.light,
53
- color: theme.palette.common.white,
53
+ backgroundColor: touched ? theme.palette.primary.light : theme.palette.common.white,
54
+ color: hideIcon ? theme.palette.primary.main : touched ? theme.palette.common.white : theme.palette.primary.light,
54
55
  img: {
55
- filter: 'brightness(0) invert(1)'
56
+ filter: touched ? 'brightness(0) invert(1)' : ''
56
57
  }
57
58
  },
58
- '&:active': {
59
- backgroundColor: theme.palette.common.white
60
- },
61
59
  '&:disabled': {
62
60
  backgroundColor: theme.palette.common.white,
63
- color: hideIcon ? alpha(theme.palette.primary.main, 0.3) : theme.palette.primary.light
61
+ color: alpha(hideIcon ? theme.palette.primary.main : theme.palette.primary.light, 0.3),
62
+ border: "1px solid ".concat(alpha(hideIcon ? theme.palette.primary.main : theme.palette.primary.light, 0.3))
64
63
  }
65
64
  });
66
65
  });
67
66
  export default function AbsherButton(_a) {
68
67
  var children = _a.children, isAr = _a.isAr, hideIcon = _a.hideIcon, disabled = _a.disabled, props = __rest(_a, ["children", "isAr", "hideIcon", "disabled"]);
69
- return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ hideIcon: hideIcon, disabled: disabled, type: 'button', startIcon: !hideIcon && _jsx(IconStyled, { src: ICONS_NAMES.ABSHER_LOGO }) }, props, { children: children })) }));
68
+ var _b = React.useState(false), touched = _b[0], setTouched = _b[1];
69
+ var handleTouch = function () {
70
+ setTouched(true);
71
+ };
72
+ return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ onTouchStart: handleTouch, touched: touched, hideIcon: hideIcon, disabled: disabled, type: 'button', startIcon: !hideIcon && _jsx(IconStyled, { disabled: disabled, src: ICONS_NAMES.ABSHER_LOGO }) }, props, { children: children })) }));
70
73
  }
@@ -1,13 +1,13 @@
1
1
  /// <reference types="react" />
2
2
  import { ButtonProps } from '../../../components/Button';
3
- declare type buttonProps = {
3
+ export declare type ButtonItemProps = {
4
4
  title: string;
5
5
  href: string;
6
6
  src: string;
7
7
  hoverSrc: string;
8
+ isCompleted: boolean;
8
9
  };
9
10
  export interface EmailProvidersButtonsProps extends ButtonProps {
10
- buttons: buttonProps[];
11
+ buttons: ButtonItemProps[];
11
12
  }
12
13
  export default function FlowsButtons({ buttons }: EmailProvidersButtonsProps): JSX.Element;
13
- export {};
@@ -10,14 +10,16 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
+ import { createElement as _createElement } from "react";
13
14
  import React from 'react';
14
15
  import Button from '../../../components/Button';
15
16
  import { alpha, styled } from '@mui/material/styles';
16
17
  import Box from '@mui/material/Box';
17
18
  import Link from '@mui/material/Link';
18
19
  import { ICONS_NAMES } from '../../../constants';
20
+ import CheckIcon from '@mui/icons-material/Check';
19
21
  var Image = styled('img', { shouldForwardProp: function (prop) { return prop !== 'isAr'; } })(function (_a) {
20
- var theme = _a.theme, isAr = _a.isAr;
22
+ var theme = _a.theme;
21
23
  return ({
22
24
  width: theme.spacing(3),
23
25
  height: theme.spacing(3),
@@ -32,31 +34,41 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
32
34
  margin: theme.spacing(0, 2.5, 2.5, 2.5)
33
35
  });
34
36
  });
35
- var ButtonStyled = styled(Button)(function (_a) {
36
- var theme = _a.theme;
37
- return ({
38
- width: '100%',
39
- textTransform: 'none',
40
- paddingInlineStart: theme.spacing(0.75),
41
- backgroundColor: theme.palette.common.white,
42
- border: "1px solid ".concat(theme.palette.primary.main),
43
- color: theme.palette.primary.main,
44
- '&:hover': {
45
- backgroundColor: theme.palette.primary.main,
46
- color: theme.palette.common.white
47
- },
48
- '&:disabled': {
37
+ var ButtonStyled = styled(Button, { shouldForwardProp: function (prop) { return prop !== 'isCompleted'; } })(function (_a) {
38
+ var theme = _a.theme, isCompleted = _a.isCompleted;
39
+ return (__assign(__assign({ width: '100%', textTransform: 'none', paddingInlineStart: theme.spacing(0.75), backgroundColor: theme.palette.common.white, border: "1px solid ".concat(theme.palette.primary.main), color: theme.palette.primary.main }, (isCompleted && {
40
+ paddingInlineEnd: '13px',
41
+ color: theme.palette.success.main,
42
+ border: "1px solid ".concat(theme.palette.success.main)
43
+ })), { '&:hover': __assign({ backgroundColor: theme.palette.primary.main, color: theme.palette.common.white }, (isCompleted && {
44
+ backgroundColor: theme.palette.common.white,
45
+ border: "1px solid ".concat(theme.palette.success.main),
46
+ color: theme.palette.success.main,
47
+ cursor: 'initial'
48
+ })), '&:disabled': {
49
49
  backgroundColor: theme.palette.common.white,
50
50
  color: alpha(theme.palette.primary.main, 0.3)
51
- }
51
+ } }));
52
+ });
53
+ var CheckIconStyled = styled(CheckIcon)(function (_a) {
54
+ var theme = _a.theme;
55
+ return ({
56
+ width: theme.spacing(2.5),
57
+ height: theme.spacing(2.5),
58
+ color: theme.palette.success.main
52
59
  });
53
60
  });
54
61
  export default function FlowsButtons(_a) {
55
62
  var buttons = _a.buttons;
56
63
  var _b = React.useState(), index = _b[0], setIndex = _b[1];
57
64
  return (_jsx(ButtonBoxStyled, { children: buttons.map(function (_a, idx) {
58
- var title = _a.title, href = _a.href, src = _a.src, hoverSrc = _a.hoverSrc;
65
+ var title = _a.title, href = _a.href, src = _a.src, hoverSrc = _a.hoverSrc, isCompleted = _a.isCompleted;
59
66
  var isLast = idx === buttons.length - 1;
60
- return (_jsx(Link, __assign({ underline: 'none', onMouseEnter: function () { return setIndex(idx); }, onMouseLeave: function () { return setIndex(undefined); } }, { children: _jsx(ButtonStyled, __assign({ sx: { mb: isLast ? 0 : 1.8 }, endIcon: _jsx(Image, { sx: { height: 15 }, src: index === idx ? ICONS_NAMES.Arrow_white_right_icon : ICONS_NAMES.Arrow_filled_right_icon }), startIcon: _jsx(Image, { src: index === idx ? hoverSrc : src, alt: title }), type: 'button' }, { children: title })) }), idx));
67
+ var linkProps = {
68
+ href: href,
69
+ target: '_blank'
70
+ };
71
+ return (_createElement(Link, __assign({}, (!isCompleted && linkProps), { underline: 'none', key: idx, onMouseEnter: function () { return !isCompleted && setIndex(idx); }, onMouseLeave: function () { return setIndex(undefined); } }),
72
+ _jsx(ButtonStyled, __assign({ isCompleted: isCompleted, sx: { mb: isLast ? 0 : 1.8 }, endIcon: isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15 }, src: index === idx ? ICONS_NAMES.Arrow_white_right_icon : ICONS_NAMES.Arrow_filled_right_icon })), startIcon: _jsx(Image, { src: index === idx ? hoverSrc : src, alt: title }), type: 'button' }, { children: title }))));
61
73
  }) }));
62
74
  }
@@ -21,6 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
21
21
  return t;
22
22
  };
23
23
  import { jsx as _jsx } from "react/jsx-runtime";
24
+ import React from 'react';
24
25
  import Button from '../../../components/Button';
25
26
  import Icon from '../../../components/Icon';
26
27
  import { alpha, styled } from '@mui/material/styles';
@@ -38,24 +39,21 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
38
39
  margin: theme.spacing(0, 2.5, 2.5, 2.5)
39
40
  });
40
41
  });
41
- var ButtonStyled = styled(Button)(function (_a) {
42
- var theme = _a.theme;
42
+ var ButtonStyled = styled(Button, { shouldForwardProp: function (prop) { return prop !== 'touched'; } })(function (_a) {
43
+ var theme = _a.theme, touched = _a.touched;
43
44
  return ({
44
45
  paddingInlineStart: theme.spacing(0.75),
45
46
  textTransform: 'none',
46
- backgroundColor: theme.palette.common.white,
47
+ backgroundColor: touched ? theme.palette.primary.main : theme.palette.common.white,
47
48
  border: "1px solid ".concat(theme.palette.primary.main),
48
- color: theme.palette.primary.main,
49
+ color: touched ? theme.palette.common.white : theme.palette.primary.main,
49
50
  '&:hover': {
50
- backgroundColor: theme.palette.primary.main,
51
- color: theme.palette.common.white,
51
+ backgroundColor: touched ? theme.palette.primary.main : theme.palette.common.white,
52
+ color: touched ? theme.palette.common.white : theme.palette.primary.main,
52
53
  img: {
53
- filter: 'brightness(0) invert(1)'
54
+ filter: touched ? 'brightness(0) invert(1)' : ''
54
55
  }
55
56
  },
56
- '&:active': {
57
- backgroundColor: theme.palette.common.white
58
- },
59
57
  '&:disabled': {
60
58
  backgroundColor: theme.palette.common.white,
61
59
  color: alpha(theme.palette.primary.main, 0.3)
@@ -64,5 +62,9 @@ var ButtonStyled = styled(Button)(function (_a) {
64
62
  });
65
63
  export default function MobileButton(_a) {
66
64
  var children = _a.children, isAr = _a.isAr, hideIcon = _a.hideIcon, disabled = _a.disabled, props = __rest(_a, ["children", "isAr", "hideIcon", "disabled"]);
67
- return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ disabled: disabled, type: 'button', startIcon: !hideIcon && _jsx(IconStyled, { disabled: disabled, src: ICONS_NAMES.MOBILE_ICON }) }, props, { children: children })) }));
65
+ var _b = React.useState(false), touched = _b[0], setTouched = _b[1];
66
+ var handleTouch = function () {
67
+ setTouched(true);
68
+ };
69
+ return (_jsx(ButtonBoxStyled, { children: _jsx(ButtonStyled, __assign({ onTouchStart: handleTouch, touched: touched, disabled: disabled, type: 'button', startIcon: !hideIcon && _jsx(IconStyled, { disabled: disabled, src: ICONS_NAMES.MOBILE_ICON }) }, props, { children: children })) }));
68
70
  }
@@ -10,9 +10,7 @@ var Success = function (_a) {
10
10
  React.useEffect(function () {
11
11
  dispatch(updateLeadSuccess());
12
12
  }, []);
13
- var onSuccess = function () {
14
- window.open('mailto:');
15
- };
16
- return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess });
13
+ var onSuccess = function () { };
14
+ return _jsx(SuccessScreen, { title: t('ide_successfully_updated_message'), onSuccess: onSuccess, successTitle: 'continue' });
17
15
  };
18
16
  export default React.memo(Success);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tap-payments/auth-jsconnect",
3
- "version": "1.0.63",
3
+ "version": "1.0.67",
4
4
  "description": "connect library, auth",
5
5
  "private": false,
6
6
  "main": "build/index.js",