@tap-payments/auth-jsconnect 1.0.51 → 1.0.54

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 (105) hide show
  1. package/build/@types/app.d.ts +3 -3
  2. package/build/@types/form.d.ts +23 -3
  3. package/build/api/data.d.ts +1 -1
  4. package/build/api/data.js +2 -2
  5. package/build/api/entity.d.ts +5 -2
  6. package/build/api/index.d.ts +4 -4
  7. package/build/api/lead.d.ts +1 -1
  8. package/build/app/rootReducer.d.ts +4 -0
  9. package/build/app/rootReducer.js +9 -1
  10. package/build/app/store.d.ts +8 -0
  11. package/build/assets/locales/ar.json +2 -1
  12. package/build/assets/locales/en.json +3 -2
  13. package/build/components/AnimationFlow/AnimationFlow.d.ts +3 -1
  14. package/build/components/AnimationFlow/AnimationFlow.js +9 -1
  15. package/build/components/AnimationFlow/Error.d.ts +6 -0
  16. package/build/components/AnimationFlow/Error.js +32 -0
  17. package/build/components/AnimationFlow/Loader.d.ts +2 -0
  18. package/build/components/AnimationFlow/Loader.js +16 -0
  19. package/build/components/Loader/Loader.d.ts +1 -0
  20. package/build/components/Loader/Loader.js +1 -1
  21. package/build/components/SimpleList/SimpleList.js +1 -0
  22. package/build/constants/app.d.ts +24 -0
  23. package/build/constants/app.js +61 -19
  24. package/build/constants/dummy.d.ts +2 -0
  25. package/build/constants/dummy.js +12 -6
  26. package/build/features/app/bank/bankStore.d.ts +36 -0
  27. package/build/features/app/bank/bankStore.js +218 -0
  28. package/build/features/app/business/businessStore.d.ts +2 -3
  29. package/build/features/app/business/businessStore.js +79 -85
  30. package/build/features/app/connect/connectStore.js +31 -30
  31. package/build/features/app/individual/individualStore.d.ts +36 -0
  32. package/build/features/app/individual/individualStore.js +222 -0
  33. package/build/features/app/password/passwordStore.d.ts +36 -0
  34. package/build/features/app/password/passwordStore.js +218 -0
  35. package/build/features/app/tax/taxStore.d.ts +38 -0
  36. package/build/features/app/tax/taxStore.js +271 -0
  37. package/build/features/bank/Bank.d.ts +2 -1
  38. package/build/features/bank/Bank.js +17 -7
  39. package/build/features/bank/screens/BankDetails/BankDetails.js +1 -2
  40. package/build/features/bank/screens/Verify/OTPInput.d.ts +5 -0
  41. package/build/features/bank/screens/Verify/OTPInput.js +42 -0
  42. package/build/features/bank/screens/Verify/Verify.d.ts +5 -0
  43. package/build/features/bank/screens/Verify/Verify.js +78 -0
  44. package/build/features/bank/screens/Verify/index.d.ts +2 -0
  45. package/build/features/bank/screens/Verify/index.js +2 -0
  46. package/build/features/bank/screens/Verify/validation.d.ts +8 -0
  47. package/build/features/bank/screens/Verify/validation.js +4 -0
  48. package/build/features/business/Business.js +2 -2
  49. package/build/features/business/screens/Activities/Activities.js +8 -8
  50. package/build/features/business/screens/Activities/ActivitiesList.js +7 -7
  51. package/build/features/business/screens/Activities/SalesChannels.js +1 -1
  52. package/build/features/business/screens/BusinessType/CRNumber.d.ts +2 -1
  53. package/build/features/business/screens/BusinessType/CRNumber.js +2 -2
  54. package/build/features/business/screens/BusinessType/CompanyLicense.js +2 -1
  55. package/build/features/business/screens/BusinessType/FLNumber.d.ts +2 -1
  56. package/build/features/business/screens/BusinessType/FLNumber.js +2 -2
  57. package/build/features/business/screens/BusinessType/FreelanceLicense.js +2 -1
  58. package/build/features/business/screens/Confirm/Confirm.js +1 -1
  59. package/build/features/business/screens/Customers/Customers.js +3 -3
  60. package/build/features/business/screens/Customers/ExpectedCustomers.js +3 -3
  61. package/build/features/connect/Connect.js +2 -2
  62. package/build/features/connect/screens/Merchant/BrandList.d.ts +0 -2
  63. package/build/features/connect/screens/Merchant/BrandList.js +16 -40
  64. package/build/features/connect/screens/Merchant/Merchant.js +42 -23
  65. package/build/features/connect/screens/Merchant/SocialMedia.d.ts +2 -1
  66. package/build/features/connect/screens/Merchant/SocialMedia.js +30 -3
  67. package/build/features/connect/screens/Merchant/validation.d.ts +6 -1
  68. package/build/features/connect/screens/Merchant/validation.js +67 -7
  69. package/build/features/connect/screens/Mobile/MobileNumber.js +1 -1
  70. package/build/features/featuresScreens.js +20 -10
  71. package/build/features/individual/Individual.d.ts +2 -1
  72. package/build/features/individual/Individual.js +17 -9
  73. package/build/features/individual/screens/Verify/OTPInput.d.ts +5 -0
  74. package/build/features/individual/screens/Verify/OTPInput.js +42 -0
  75. package/build/features/individual/screens/Verify/Verify.d.ts +5 -0
  76. package/build/features/individual/screens/Verify/Verify.js +78 -0
  77. package/build/features/individual/screens/Verify/index.d.ts +2 -0
  78. package/build/features/individual/screens/Verify/index.js +2 -0
  79. package/build/features/individual/screens/Verify/validation.d.ts +8 -0
  80. package/build/features/individual/screens/Verify/validation.js +4 -0
  81. package/build/features/password/Password.d.ts +2 -1
  82. package/build/features/password/Password.js +17 -9
  83. package/build/features/password/screens/Verify/OTPInput.d.ts +5 -0
  84. package/build/features/password/screens/Verify/OTPInput.js +42 -0
  85. package/build/features/password/screens/Verify/Verify.d.ts +5 -0
  86. package/build/features/password/screens/Verify/Verify.js +78 -0
  87. package/build/features/password/screens/Verify/index.d.ts +2 -0
  88. package/build/features/password/screens/Verify/index.js +2 -0
  89. package/build/features/password/screens/Verify/validation.d.ts +8 -0
  90. package/build/features/password/screens/Verify/validation.js +4 -0
  91. package/build/features/tax/Tax.d.ts +2 -1
  92. package/build/features/tax/Tax.js +17 -9
  93. package/build/features/tax/screens/Success/Success.js +6 -0
  94. package/build/features/tax/screens/TaxDetails/TaxDetails.js +6 -7
  95. package/build/features/tax/screens/Verify/OTPInput.d.ts +5 -0
  96. package/build/features/tax/screens/Verify/OTPInput.js +42 -0
  97. package/build/features/tax/screens/Verify/Verify.d.ts +5 -0
  98. package/build/features/tax/screens/Verify/Verify.js +78 -0
  99. package/build/features/tax/screens/Verify/index.d.ts +2 -0
  100. package/build/features/tax/screens/Verify/index.js +2 -0
  101. package/build/features/tax/screens/Verify/validation.d.ts +8 -0
  102. package/build/features/tax/screens/Verify/validation.js +4 -0
  103. package/build/hooks/useAppDispatch.d.ts +4 -0
  104. package/build/utils/string.js +0 -1
  105. package/package.json +1 -1
@@ -4,7 +4,6 @@ import IndividualScreen from './connect/screens/Individual';
4
4
  import MerchantInfoScreen from './connect/screens/Merchant';
5
5
  import ConnectOTPScreen from './connect/screens/OTP';
6
6
  import ThankYouScreen from './connect/screens/ThankYou';
7
- import PasswordScreen from './connect/screens/Password';
8
7
  import CustomersPage from './business/screens/Customers';
9
8
  import IDBODPage from './business/screens/IDBOD';
10
9
  import BusinessVerifyPage from './business/screens/Verify';
@@ -12,14 +11,17 @@ import BusinessOTPPage from './business/screens/OTP';
12
11
  import BusinessTypePage from './business/screens/BusinessType';
13
12
  import ActivitiesPage from './business/screens/Activities';
14
13
  import SuccessPage from './business/screens/Success';
15
- import ConfirmPage from './business/screens/Confirm';
14
+ import PasswordVerifyPage from './password/screens/Verify';
16
15
  import CreatePasswordPage from './password/screens/CreatePassword';
17
16
  import SuccessPasswordPage from './password/screens/Success';
17
+ import IndividualVerifyPage from './individual/screens/Verify';
18
18
  import ShowIndividualInfoPage from './individual/screens/ShowIndividualInfo';
19
19
  import AdditionalIndividualInfoPage from './individual/screens/AdditionalIndividualInfo';
20
20
  import SuccessOwnerPage from './individual/screens/Success';
21
+ import BankVerifyPage from './bank/screens/Verify';
21
22
  import BankDetailsPage from './bank/screens/BankDetails';
22
23
  import BankSuccessPage from './bank/screens/Success';
24
+ import TaxVerifyPage from './tax/screens/Verify';
23
25
  import TaxDetailsPage from './tax/screens/TaxDetails';
24
26
  import TaxSuccessPage from './tax/screens/Success';
25
27
  export var connectFeatureScreens = [
@@ -39,10 +41,6 @@ export var connectFeatureScreens = [
39
41
  name: 'CONNECT_INDIVIDUAL_STEP',
40
42
  element: IndividualScreen
41
43
  },
42
- {
43
- name: 'CONNECT_PASSWORD_STEP',
44
- element: PasswordScreen
45
- },
46
44
  {
47
45
  name: 'CONNECT_MERCHANT_INFO_STEP',
48
46
  element: MerchantInfoScreen
@@ -69,10 +67,6 @@ export var businessFeatureScreens = [
69
67
  name: 'BUSINESS_BUSINESS_TYPE_STEP',
70
68
  element: BusinessTypePage
71
69
  },
72
- {
73
- name: 'BUSINESS_CONFIRM_STEP',
74
- element: ConfirmPage
75
- },
76
70
  {
77
71
  name: 'BUSINESS_ACTIVITIES_STEP',
78
72
  element: ActivitiesPage
@@ -84,6 +78,10 @@ export var businessFeatureScreens = [
84
78
  { name: 'BUSINESS_SUCCESS_STEP', element: SuccessPage }
85
79
  ];
86
80
  export var passwordFeatureScreens = [
81
+ {
82
+ name: 'PASSWORD_VERIFY_STEP',
83
+ element: PasswordVerifyPage
84
+ },
87
85
  {
88
86
  name: 'PASSWORD_CREATE_PASSWORD_STEP',
89
87
  element: CreatePasswordPage
@@ -94,6 +92,10 @@ export var passwordFeatureScreens = [
94
92
  }
95
93
  ];
96
94
  export var individualFeatureScreens = [
95
+ {
96
+ name: 'INDIVIDUAL_VERIFY_STEP',
97
+ element: IndividualVerifyPage
98
+ },
97
99
  {
98
100
  name: 'INDIVIDUAL_SHOW_INDIVIDUAL_INFO_STEP',
99
101
  element: ShowIndividualInfoPage
@@ -108,6 +110,10 @@ export var individualFeatureScreens = [
108
110
  }
109
111
  ];
110
112
  export var bankFeatureScreens = [
113
+ {
114
+ name: 'BANK_VERIFY_STEP',
115
+ element: BankVerifyPage
116
+ },
111
117
  {
112
118
  name: 'BANK_BANK_DETAILS_STEP',
113
119
  element: BankDetailsPage
@@ -118,6 +124,10 @@ export var bankFeatureScreens = [
118
124
  }
119
125
  ];
120
126
  export var taxFeatureScreens = [
127
+ {
128
+ name: 'TAX_VERIFY_STEP',
129
+ element: TaxVerifyPage
130
+ },
121
131
  {
122
132
  name: 'TAX_TAX_DETAILS_STEP',
123
133
  element: TaxDetailsPage
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
- export interface IndividualLibProps {
2
+ import { LibConfig } from '../../@types';
3
+ export interface IndividualLibProps extends LibConfig {
3
4
  }
4
5
  export declare function IndividualLib(props: IndividualLibProps): JSX.Element;
5
6
  export declare function renderIndividualLib(config: IndividualLibProps, elementId: string): void;
@@ -11,29 +11,37 @@ var __assign = (this && this.__assign) || function () {
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import React, { memo, useEffect } from 'react';
14
- import { useTranslation } from 'react-i18next';
15
- import { useAppTheme, useAppDispatch, useAppSelector } from '../../hooks';
16
- import { handleActiveFlowScreens, settingsSelector } from '../../app/settings';
14
+ import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener } from '../../hooks';
15
+ import { settingsSelector } from '../../app/settings';
17
16
  import AnimationFlow from '../../components/AnimationFlow';
18
17
  import { store } from '../../app/store';
19
18
  import { ReduxProvider, ThemeProvider } from '../../components/Providers';
20
19
  import Collapse from '../../components/Collapse';
21
- import { reactElement } from '../../utils';
20
+ import { getParameterByName, reactElement } from '../../utils';
22
21
  import { FeatureContainer } from '../shared/Containers';
23
22
  import { INDIVIDUAL_SCREENS_NAVIGATION } from '../../constants';
24
23
  import { individualFeatureScreens } from '../featuresScreens';
24
+ import { verifyLeadToken } from '../app/individual/individualStore';
25
25
  import CustomFooter from '../shared/Footer';
26
26
  var Individual = memo(function (props) {
27
27
  var open = React.useState(true)[0];
28
- var t = useTranslation().t;
29
28
  var theme = useAppTheme().theme;
30
29
  var dispatch = useAppDispatch();
31
- var data = useAppSelector(settingsSelector).data;
30
+ var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
+ var loading = useAppConfig(__assign({ navigation: INDIVIDUAL_SCREENS_NAVIGATION }, props)).loading;
32
+ useErrorListener();
32
33
  var activeScreen = data.activeScreen;
34
+ var verifyToken = function () {
35
+ var token = getParameterByName('token');
36
+ if (!token)
37
+ throw new Error('Auth token is not found!');
38
+ dispatch(verifyLeadToken(token));
39
+ };
33
40
  useEffect(function () {
34
- dispatch(handleActiveFlowScreens(INDIVIDUAL_SCREENS_NAVIGATION));
35
- }, []);
36
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: individualFeatureScreens.map(function (_a, index) {
41
+ if (!loading)
42
+ verifyToken();
43
+ }, [loading]);
44
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ loading: settingLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: individualFeatureScreens.map(function (_a, index) {
37
45
  var Element = _a.element, name = _a.name;
38
46
  var isActive = activeScreen.name === name;
39
47
  return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OTPProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,42 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import Box from '@mui/material/Box/Box';
15
+ import { styled } from '@mui/material/styles';
16
+ import OTPField from '../../../shared/OTP';
17
+ import { useController, useFormContext } from 'react-hook-form';
18
+ import { useTranslation } from 'react-i18next';
19
+ import { DEFAULT_TIMER_VALUE } from '../../../../constants';
20
+ var BoxStyled = styled(Box)(function (_a) {
21
+ var theme = _a.theme;
22
+ return ({
23
+ display: 'flex',
24
+ flexDirection: 'column',
25
+ fontFamily: theme.typography.fontFamily
26
+ });
27
+ });
28
+ var OTPInput = function (_a) {
29
+ var _b = useFormContext(), control = _b.control, setValue = _b.setValue;
30
+ var t = useTranslation().t;
31
+ var otpControl = useController({ name: 'otp', control: control });
32
+ var handleOnOTPChange = function (otp) {
33
+ otpControl.field.onChange(otp);
34
+ };
35
+ var handleOnResendOTP = function () {
36
+ if (otpControl.field.value)
37
+ setValue('otp', '', { shouldValidate: true });
38
+ };
39
+ var otpValue = otpControl.field.value;
40
+ return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
41
+ };
42
+ export default React.memo(OTPInput);
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OTPProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,78 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import { useAppDispatch } from '../../../../hooks';
15
+ import { useTranslation } from 'react-i18next';
16
+ import { useSelector } from 'react-redux';
17
+ import { useForm, FormProvider } from 'react-hook-form';
18
+ import { yupResolver } from '@hookform/resolvers/yup';
19
+ import Box from '@mui/material/Box/Box';
20
+ import { styled } from '@mui/material/styles';
21
+ import { handlePrevScreenStep } from '../../../../app/settings';
22
+ import { useLanguage } from '../../../../hooks';
23
+ import { maskPhone } from '../../../../utils';
24
+ import Form from '../../../../components/Form';
25
+ import Text from '../../../../components/Text';
26
+ import { ScreenContainer } from '../../../shared/Containers';
27
+ import { individualSelector, clearError, resetOTPScreen, verifyLeadOTP } from '../../../app/individual/individualStore';
28
+ import Button from '../../../shared/Button';
29
+ import { OTPValidation } from './validation';
30
+ import OTPInput from './OTPInput';
31
+ var OTPTitleContainerStyled = styled(Box)(function (_a) {
32
+ var theme = _a.theme;
33
+ return ({
34
+ background: theme.palette.common.white,
35
+ border: '1px solid',
36
+ borderColor: theme.palette.divider,
37
+ direction: theme.direction,
38
+ borderRadius: theme.spacing(0, 0, 1.25, 1.25),
39
+ marginBottom: theme.spacing(5.75)
40
+ });
41
+ });
42
+ var OTPTitleStyled = styled(Text)(function (_a) {
43
+ var theme = _a.theme;
44
+ return (__assign(__assign({}, theme.typography.body1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightLight, marginBlock: theme.spacing(1.75), marginInlineStart: theme.spacing(2.5), lineHeight: 1.75 }));
45
+ });
46
+ var FormStyled = styled(Form)(function () { return ({
47
+ display: 'flex',
48
+ flexDirection: 'column'
49
+ }); });
50
+ var VerifyNumber = function (_a) {
51
+ var _b, _c, _d;
52
+ var dispatch = useAppDispatch();
53
+ var _e = useSelector(individualSelector), data = _e.data, loading = _e.loading, error = _e.error;
54
+ var methods = useForm({
55
+ resolver: yupResolver(OTPValidation),
56
+ defaultValues: data.otpData,
57
+ mode: 'onChange'
58
+ });
59
+ var t = useTranslation().t;
60
+ var isAr = useLanguage().isAr;
61
+ React.useEffect(function () {
62
+ if (error)
63
+ dispatch(clearError());
64
+ return function () {
65
+ dispatch(resetOTPScreen());
66
+ };
67
+ }, [methods.formState.isValid]);
68
+ var onSubmit = function (formData) {
69
+ dispatch(verifyLeadOTP(formData));
70
+ };
71
+ var onBack = function () {
72
+ dispatch(handlePrevScreenStep());
73
+ };
74
+ 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;
75
+ var disabled = !methods.formState.isValid || !!error || !phone;
76
+ 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, {}), _jsx(Button, __assign({ disableBack: true, onBackClicked: function () { return onBack(); }, disabled: disabled, type: 'submit', isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
77
+ };
78
+ export default React.memo(VerifyNumber);
@@ -0,0 +1,2 @@
1
+ import OTP from './Verify';
2
+ export default OTP;
@@ -0,0 +1,2 @@
1
+ import OTP from './Verify';
2
+ export default OTP;
@@ -0,0 +1,8 @@
1
+ import * as yup from 'yup';
2
+ export declare const OTPValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
4
+ }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
5
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
6
+ }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
7
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
+ }>>>;
@@ -0,0 +1,4 @@
1
+ import * as yup from 'yup';
2
+ export var OTPValidation = yup.object().shape({
3
+ otp: yup.string().min(6, 'otp_min_length').required('otp_required')
4
+ });
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
- export interface PasswordLibProps {
2
+ import { LibConfig } from '../../@types';
3
+ export interface PasswordLibProps extends LibConfig {
3
4
  }
4
5
  export declare function PasswordLib(props: PasswordLibProps): JSX.Element;
5
6
  export declare function renderPasswordLib(config: PasswordLibProps, elementId: string): void;
@@ -11,29 +11,37 @@ var __assign = (this && this.__assign) || function () {
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import React, { memo, useEffect } from 'react';
14
- import { useTranslation } from 'react-i18next';
15
- import { useAppTheme, useAppDispatch, useAppSelector } from '../../hooks';
16
- import { handleActiveFlowScreens, settingsSelector } from '../../app/settings';
14
+ import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener } from '../../hooks';
15
+ import { settingsSelector } from '../../app/settings';
17
16
  import AnimationFlow from '../../components/AnimationFlow';
18
17
  import { store } from '../../app/store';
19
18
  import { ReduxProvider, ThemeProvider } from '../../components/Providers';
20
19
  import Collapse from '../../components/Collapse';
21
20
  import { FeatureContainer } from '../shared/Containers';
22
- import { reactElement } from '../../utils';
21
+ import { getParameterByName, reactElement } from '../../utils';
23
22
  import { PASSWORD_SCREENS_NAVIGATION } from '../../constants';
24
23
  import { passwordFeatureScreens } from '../featuresScreens';
24
+ import { verifyLeadToken } from '../app/password/passwordStore';
25
25
  import CustomFooter from '../shared/Footer';
26
26
  var Password = memo(function (props) {
27
27
  var open = React.useState(true)[0];
28
- var t = useTranslation().t;
29
28
  var theme = useAppTheme().theme;
30
29
  var dispatch = useAppDispatch();
31
- var data = useAppSelector(settingsSelector).data;
30
+ var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
+ var loading = useAppConfig(__assign({ navigation: PASSWORD_SCREENS_NAVIGATION }, props)).loading;
32
+ useErrorListener();
32
33
  var activeScreen = data.activeScreen;
34
+ var verifyToken = function () {
35
+ var token = getParameterByName('token');
36
+ if (!token)
37
+ throw new Error('Auth token is not found!');
38
+ dispatch(verifyLeadToken(token));
39
+ };
33
40
  useEffect(function () {
34
- dispatch(handleActiveFlowScreens(PASSWORD_SCREENS_NAVIGATION));
35
- }, []);
36
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: passwordFeatureScreens.map(function (_a, index) {
41
+ if (!loading)
42
+ verifyToken();
43
+ }, [loading]);
44
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ loading: settingLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: passwordFeatureScreens.map(function (_a, index) {
37
45
  var Element = _a.element, name = _a.name;
38
46
  var isActive = activeScreen.name === name;
39
47
  return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OTPProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,42 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import Box from '@mui/material/Box/Box';
15
+ import { styled } from '@mui/material/styles';
16
+ import OTPField from '../../../shared/OTP';
17
+ import { useController, useFormContext } from 'react-hook-form';
18
+ import { useTranslation } from 'react-i18next';
19
+ import { DEFAULT_TIMER_VALUE } from '../../../../constants';
20
+ var BoxStyled = styled(Box)(function (_a) {
21
+ var theme = _a.theme;
22
+ return ({
23
+ display: 'flex',
24
+ flexDirection: 'column',
25
+ fontFamily: theme.typography.fontFamily
26
+ });
27
+ });
28
+ var OTPInput = function (_a) {
29
+ var _b = useFormContext(), control = _b.control, setValue = _b.setValue;
30
+ var t = useTranslation().t;
31
+ var otpControl = useController({ name: 'otp', control: control });
32
+ var handleOnOTPChange = function (otp) {
33
+ otpControl.field.onChange(otp);
34
+ };
35
+ var handleOnResendOTP = function () {
36
+ if (otpControl.field.value)
37
+ setValue('otp', '', { shouldValidate: true });
38
+ };
39
+ var otpValue = otpControl.field.value;
40
+ return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
41
+ };
42
+ export default React.memo(OTPInput);
@@ -0,0 +1,5 @@
1
+ import * as React from 'react';
2
+ export interface OTPProps {
3
+ }
4
+ declare const _default: React.MemoExoticComponent<({}: OTPProps) => JSX.Element>;
5
+ export default _default;
@@ -0,0 +1,78 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import * as React from 'react';
14
+ import { useAppDispatch } from '../../../../hooks';
15
+ import { useTranslation } from 'react-i18next';
16
+ import { useSelector } from 'react-redux';
17
+ import { useForm, FormProvider } from 'react-hook-form';
18
+ import { yupResolver } from '@hookform/resolvers/yup';
19
+ import Box from '@mui/material/Box/Box';
20
+ import { styled } from '@mui/material/styles';
21
+ import { handlePrevScreenStep } from '../../../../app/settings';
22
+ import { useLanguage } from '../../../../hooks';
23
+ import { maskPhone } from '../../../../utils';
24
+ import Form from '../../../../components/Form';
25
+ import Text from '../../../../components/Text';
26
+ import { ScreenContainer } from '../../../shared/Containers';
27
+ import { passwordSelector, clearError, resetOTPScreen, verifyPasswordLeadOTP } from '../../../app/password/passwordStore';
28
+ import Button from '../../../shared/Button';
29
+ import { OTPValidation } from './validation';
30
+ import OTPInput from './OTPInput';
31
+ var OTPTitleContainerStyled = styled(Box)(function (_a) {
32
+ var theme = _a.theme;
33
+ return ({
34
+ background: theme.palette.common.white,
35
+ border: '1px solid',
36
+ borderColor: theme.palette.divider,
37
+ direction: theme.direction,
38
+ borderRadius: theme.spacing(0, 0, 1.25, 1.25),
39
+ marginBottom: theme.spacing(5.75)
40
+ });
41
+ });
42
+ var OTPTitleStyled = styled(Text)(function (_a) {
43
+ var theme = _a.theme;
44
+ return (__assign(__assign({}, theme.typography.body1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightLight, marginBlock: theme.spacing(1.75), marginInlineStart: theme.spacing(2.5), lineHeight: 1.75 }));
45
+ });
46
+ var FormStyled = styled(Form)(function () { return ({
47
+ display: 'flex',
48
+ flexDirection: 'column'
49
+ }); });
50
+ var VerifyNumber = function (_a) {
51
+ var _b, _c, _d;
52
+ var dispatch = useAppDispatch();
53
+ var _e = useSelector(passwordSelector), data = _e.data, loading = _e.loading, error = _e.error;
54
+ var methods = useForm({
55
+ resolver: yupResolver(OTPValidation),
56
+ defaultValues: data.otpData,
57
+ mode: 'onChange'
58
+ });
59
+ var t = useTranslation().t;
60
+ var isAr = useLanguage().isAr;
61
+ React.useEffect(function () {
62
+ if (error)
63
+ dispatch(clearError());
64
+ return function () {
65
+ dispatch(resetOTPScreen());
66
+ };
67
+ }, [methods.formState.isValid]);
68
+ var onSubmit = function (formData) {
69
+ dispatch(verifyPasswordLeadOTP(formData));
70
+ };
71
+ var onBack = function () {
72
+ dispatch(handlePrevScreenStep());
73
+ };
74
+ 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;
75
+ var disabled = !methods.formState.isValid || !!error || !phone;
76
+ 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, {}), _jsx(Button, __assign({ disableBack: true, onBackClicked: function () { return onBack(); }, disabled: disabled, type: 'submit', isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
77
+ };
78
+ export default React.memo(VerifyNumber);
@@ -0,0 +1,2 @@
1
+ import OTP from './Verify';
2
+ export default OTP;
@@ -0,0 +1,2 @@
1
+ import OTP from './Verify';
2
+ export default OTP;
@@ -0,0 +1,8 @@
1
+ import * as yup from 'yup';
2
+ export declare const OTPValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
3
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
4
+ }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
5
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
6
+ }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
7
+ otp: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
8
+ }>>>;
@@ -0,0 +1,4 @@
1
+ import * as yup from 'yup';
2
+ export var OTPValidation = yup.object().shape({
3
+ otp: yup.string().min(6, 'otp_min_length').required('otp_required')
4
+ });
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
- export interface TaxLibProps {
2
+ import { LibConfig } from '../../@types';
3
+ export interface TaxLibProps extends LibConfig {
3
4
  }
4
5
  export declare function TaxLib(props: TaxLibProps): JSX.Element;
5
6
  export declare function renderTaxLib(config: TaxLibProps, elementId: string): void;
@@ -11,29 +11,37 @@ var __assign = (this && this.__assign) || function () {
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import React, { memo, useEffect } from 'react';
14
- import { useTranslation } from 'react-i18next';
15
- import { useAppTheme, useAppDispatch, useAppSelector } from '../../hooks';
16
- import { handleActiveFlowScreens, settingsSelector } from '../../app/settings';
14
+ import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener } from '../../hooks';
15
+ import { settingsSelector } from '../../app/settings';
17
16
  import AnimationFlow from '../../components/AnimationFlow';
18
17
  import { store } from '../../app/store';
19
18
  import { ReduxProvider, ThemeProvider } from '../../components/Providers';
20
19
  import Collapse from '../../components/Collapse';
21
- import { reactElement } from '../../utils';
20
+ import { getParameterByName, reactElement } from '../../utils';
22
21
  import { FeatureContainer } from '../shared/Containers';
23
22
  import { TAX_SCREENS_NAVIGATION } from '../../constants';
24
23
  import { taxFeatureScreens } from '../featuresScreens';
25
24
  import CustomFooter from '../shared/Footer';
25
+ import { verifyLeadToken } from '../app/tax/taxStore';
26
26
  var Tax = memo(function (props) {
27
27
  var open = React.useState(true)[0];
28
- var t = useTranslation().t;
29
28
  var theme = useAppTheme().theme;
30
29
  var dispatch = useAppDispatch();
31
- var data = useAppSelector(settingsSelector).data;
30
+ var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
+ var loading = useAppConfig(__assign({ navigation: TAX_SCREENS_NAVIGATION }, props)).loading;
32
+ useErrorListener();
32
33
  var activeScreen = data.activeScreen;
34
+ var verifyToken = function () {
35
+ var token = getParameterByName('token');
36
+ if (!token)
37
+ throw new Error('Auth token is not found!');
38
+ dispatch(verifyLeadToken(token));
39
+ };
33
40
  useEffect(function () {
34
- dispatch(handleActiveFlowScreens(TAX_SCREENS_NAVIGATION));
35
- }, []);
36
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.map(function (_a, index) {
41
+ if (!loading)
42
+ verifyToken();
43
+ }, [loading]);
44
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(AnimationFlow, __assign({ open: open, error: error, loading: settingLoading, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.map(function (_a, index) {
37
45
  var Element = _a.element, name = _a.name;
38
46
  var isActive = activeScreen.name === name;
39
47
  return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
@@ -1,9 +1,15 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import * as React from 'react';
3
3
  import { useTranslation } from 'react-i18next';
4
+ import { useAppDispatch } from '../../../../hooks';
5
+ import { updateLeadSuccess } from '../../../app/tax/taxStore';
4
6
  import SuccessScreen from '../../../shared/SuccessScreen';
5
7
  var Success = function (_a) {
6
8
  var t = useTranslation().t;
9
+ var dispatch = useAppDispatch();
10
+ React.useEffect(function () {
11
+ dispatch(updateLeadSuccess());
12
+ }, []);
7
13
  var onSuccess = function () {
8
14
  window.open('mailto:');
9
15
  };
@@ -17,29 +17,28 @@ import { useTranslation } from 'react-i18next';
17
17
  import { styled } from '@mui/material/styles';
18
18
  import { useForm, FormProvider } from 'react-hook-form';
19
19
  import Form from '../../../../components/Form';
20
- import { handleNextScreenStep } from '../../../../app/settings';
21
20
  import { Validation } from './validation';
22
21
  import { yupResolver } from '@hookform/resolvers/yup';
22
+ import { taxSelector, updateTaxInfo } from '../../../app/tax/taxStore';
23
23
  import VATId from './VATId';
24
+ import { useSelector } from 'react-redux';
24
25
  var FormStyled = styled(Form)(function () { return ({
25
26
  display: 'flex',
26
27
  flexDirection: 'column'
27
28
  }); });
28
29
  var TaxDetails = function () {
29
30
  var dispatch = useAppDispatch();
31
+ var _a = useSelector(taxSelector), data = _a.data, loading = _a.loading, error = _a.error;
30
32
  var methods = useForm({
31
33
  resolver: yupResolver(Validation),
32
- defaultValues: {
33
- vatId: ''
34
- },
34
+ defaultValues: data.taxData,
35
35
  mode: 'onChange'
36
36
  });
37
37
  var t = useTranslation().t;
38
38
  var isAr = useLanguage().isAr;
39
39
  var onSubmit = function (data) {
40
- console.log('data', data);
41
- dispatch(handleNextScreenStep());
40
+ dispatch(updateTaxInfo(data));
42
41
  };
43
- return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(VATId, {}), _jsx(Button, __assign({ disableBack: true, isAr: isAr, disabled: !methods.formState.isValid }, { children: t('next') }))] })) })) }));
42
+ return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(VATId, {}), _jsx(Button, __assign({ disableBack: true, isAr: isAr, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
44
43
  };
45
44
  export default TaxDetails;