@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.
- package/build/@types/app.d.ts +3 -3
- package/build/@types/form.d.ts +23 -3
- package/build/api/data.d.ts +1 -1
- package/build/api/data.js +2 -2
- package/build/api/entity.d.ts +5 -2
- package/build/api/index.d.ts +4 -4
- package/build/api/lead.d.ts +1 -1
- package/build/app/rootReducer.d.ts +4 -0
- package/build/app/rootReducer.js +9 -1
- package/build/app/store.d.ts +8 -0
- package/build/assets/locales/ar.json +2 -1
- package/build/assets/locales/en.json +3 -2
- package/build/components/AnimationFlow/AnimationFlow.d.ts +3 -1
- package/build/components/AnimationFlow/AnimationFlow.js +9 -1
- package/build/components/AnimationFlow/Error.d.ts +6 -0
- package/build/components/AnimationFlow/Error.js +32 -0
- package/build/components/AnimationFlow/Loader.d.ts +2 -0
- package/build/components/AnimationFlow/Loader.js +16 -0
- package/build/components/Loader/Loader.d.ts +1 -0
- package/build/components/Loader/Loader.js +1 -1
- package/build/components/SimpleList/SimpleList.js +1 -0
- package/build/constants/app.d.ts +24 -0
- package/build/constants/app.js +61 -19
- package/build/constants/dummy.d.ts +2 -0
- package/build/constants/dummy.js +12 -6
- package/build/features/app/bank/bankStore.d.ts +36 -0
- package/build/features/app/bank/bankStore.js +218 -0
- package/build/features/app/business/businessStore.d.ts +2 -3
- package/build/features/app/business/businessStore.js +79 -85
- package/build/features/app/connect/connectStore.js +31 -30
- package/build/features/app/individual/individualStore.d.ts +36 -0
- package/build/features/app/individual/individualStore.js +222 -0
- package/build/features/app/password/passwordStore.d.ts +36 -0
- package/build/features/app/password/passwordStore.js +218 -0
- package/build/features/app/tax/taxStore.d.ts +38 -0
- package/build/features/app/tax/taxStore.js +271 -0
- package/build/features/bank/Bank.d.ts +2 -1
- package/build/features/bank/Bank.js +17 -7
- package/build/features/bank/screens/BankDetails/BankDetails.js +1 -2
- package/build/features/bank/screens/Verify/OTPInput.d.ts +5 -0
- package/build/features/bank/screens/Verify/OTPInput.js +42 -0
- package/build/features/bank/screens/Verify/Verify.d.ts +5 -0
- package/build/features/bank/screens/Verify/Verify.js +78 -0
- package/build/features/bank/screens/Verify/index.d.ts +2 -0
- package/build/features/bank/screens/Verify/index.js +2 -0
- package/build/features/bank/screens/Verify/validation.d.ts +8 -0
- package/build/features/bank/screens/Verify/validation.js +4 -0
- package/build/features/business/Business.js +2 -2
- package/build/features/business/screens/Activities/Activities.js +8 -8
- package/build/features/business/screens/Activities/ActivitiesList.js +7 -7
- package/build/features/business/screens/Activities/SalesChannels.js +1 -1
- package/build/features/business/screens/BusinessType/CRNumber.d.ts +2 -1
- package/build/features/business/screens/BusinessType/CRNumber.js +2 -2
- package/build/features/business/screens/BusinessType/CompanyLicense.js +2 -1
- package/build/features/business/screens/BusinessType/FLNumber.d.ts +2 -1
- package/build/features/business/screens/BusinessType/FLNumber.js +2 -2
- package/build/features/business/screens/BusinessType/FreelanceLicense.js +2 -1
- package/build/features/business/screens/Confirm/Confirm.js +1 -1
- package/build/features/business/screens/Customers/Customers.js +3 -3
- package/build/features/business/screens/Customers/ExpectedCustomers.js +3 -3
- package/build/features/connect/Connect.js +2 -2
- package/build/features/connect/screens/Merchant/BrandList.d.ts +0 -2
- package/build/features/connect/screens/Merchant/BrandList.js +16 -40
- package/build/features/connect/screens/Merchant/Merchant.js +42 -23
- package/build/features/connect/screens/Merchant/SocialMedia.d.ts +2 -1
- package/build/features/connect/screens/Merchant/SocialMedia.js +30 -3
- package/build/features/connect/screens/Merchant/validation.d.ts +6 -1
- package/build/features/connect/screens/Merchant/validation.js +67 -7
- package/build/features/connect/screens/Mobile/MobileNumber.js +1 -1
- package/build/features/featuresScreens.js +20 -10
- package/build/features/individual/Individual.d.ts +2 -1
- package/build/features/individual/Individual.js +17 -9
- package/build/features/individual/screens/Verify/OTPInput.d.ts +5 -0
- package/build/features/individual/screens/Verify/OTPInput.js +42 -0
- package/build/features/individual/screens/Verify/Verify.d.ts +5 -0
- package/build/features/individual/screens/Verify/Verify.js +78 -0
- package/build/features/individual/screens/Verify/index.d.ts +2 -0
- package/build/features/individual/screens/Verify/index.js +2 -0
- package/build/features/individual/screens/Verify/validation.d.ts +8 -0
- package/build/features/individual/screens/Verify/validation.js +4 -0
- package/build/features/password/Password.d.ts +2 -1
- package/build/features/password/Password.js +17 -9
- package/build/features/password/screens/Verify/OTPInput.d.ts +5 -0
- package/build/features/password/screens/Verify/OTPInput.js +42 -0
- package/build/features/password/screens/Verify/Verify.d.ts +5 -0
- package/build/features/password/screens/Verify/Verify.js +78 -0
- package/build/features/password/screens/Verify/index.d.ts +2 -0
- package/build/features/password/screens/Verify/index.js +2 -0
- package/build/features/password/screens/Verify/validation.d.ts +8 -0
- package/build/features/password/screens/Verify/validation.js +4 -0
- package/build/features/tax/Tax.d.ts +2 -1
- package/build/features/tax/Tax.js +17 -9
- package/build/features/tax/screens/Success/Success.js +6 -0
- package/build/features/tax/screens/TaxDetails/TaxDetails.js +6 -7
- package/build/features/tax/screens/Verify/OTPInput.d.ts +5 -0
- package/build/features/tax/screens/Verify/OTPInput.js +42 -0
- package/build/features/tax/screens/Verify/Verify.d.ts +5 -0
- package/build/features/tax/screens/Verify/Verify.js +78 -0
- package/build/features/tax/screens/Verify/index.d.ts +2 -0
- package/build/features/tax/screens/Verify/index.js +2 -0
- package/build/features/tax/screens/Verify/validation.d.ts +8 -0
- package/build/features/tax/screens/Verify/validation.js +4 -0
- package/build/hooks/useAppDispatch.d.ts +4 -0
- package/build/utils/string.js +0 -1
- 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
|
|
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
|
-
|
|
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 {
|
|
15
|
-
import {
|
|
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
|
|
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
|
-
|
|
35
|
-
|
|
36
|
-
|
|
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,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,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,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
|
+
}>>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
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 {
|
|
15
|
-
import {
|
|
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
|
|
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
|
-
|
|
35
|
-
|
|
36
|
-
|
|
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,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,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,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
|
+
}>>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
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 {
|
|
15
|
-
import {
|
|
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
|
|
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
|
-
|
|
35
|
-
|
|
36
|
-
|
|
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
|
-
|
|
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;
|