@tap-payments/auth-jsconnect 2.1.43-test → 2.1.45-test
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/form.d.ts +8 -5
- package/build/api/account.d.ts +5 -0
- package/build/api/account.js +9 -1
- package/build/api/auth.d.ts +8 -4
- package/build/api/auth.js +18 -2
- package/build/api/index.d.ts +6 -2
- package/build/api/lead.d.ts +1 -0
- package/build/api/lead.js +10 -1
- package/build/assets/locales/ar.json +2 -0
- package/build/assets/locales/en.json +2 -0
- package/build/components/Lottie/Lottie.d.ts +320 -0
- package/build/components/Lottie/Lottie.js +3 -1
- package/build/components/Lottie/files/account_creating.json +732 -0
- package/build/constants/api.d.ts +3 -0
- package/build/constants/api.js +8 -2
- package/build/constants/app.d.ts +5 -2
- package/build/constants/app.js +60 -4
- package/build/features/app/auth/authStore.d.ts +3 -3
- package/build/features/app/business/businessStore.d.ts +1 -0
- package/build/features/app/connect/connectStore.d.ts +1 -0
- package/build/features/app/connect/connectStore.js +6 -5
- package/build/features/app/connectExpress/connectExpressStore.d.ts +61 -6
- package/build/features/app/connectExpress/connectExpressStore.js +614 -66
- package/build/features/connect/screens/Merchant/Merchant.js +11 -8
- package/build/features/connect/screens/Merchant/Segments.js +3 -3
- package/build/features/connect/screens/Merchant/TeamSize.js +2 -2
- package/build/features/connectExpress/ConnectExpress.js +1 -1
- package/build/features/connectExpress/screens/CivilID/CivilID.js +3 -3
- package/build/features/connectExpress/screens/CivilIDMissed/CivilID.d.ts +5 -0
- package/build/features/connectExpress/screens/CivilIDMissed/CivilID.js +53 -0
- package/build/features/connectExpress/screens/CivilIDMissed/IDNumber.d.ts +7 -0
- package/build/features/connectExpress/screens/CivilIDMissed/IDNumber.js +55 -0
- package/build/features/connectExpress/screens/CivilIDMissed/index.d.ts +3 -0
- package/build/features/connectExpress/screens/CivilIDMissed/index.js +2 -0
- package/build/features/connectExpress/screens/CivilIDMissed/validation.d.ts +8 -0
- package/build/features/connectExpress/screens/CivilIDMissed/validation.js +4 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/BrandName.d.ts +8 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/BrandName.js +142 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/CollectBusinessInfo.d.ts +5 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/CollectBusinessInfo.js +77 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseList.d.ts +8 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseList.js +144 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseNumber.d.ts +7 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseNumber.js +52 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseType.d.ts +34 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/LicenseType.js +94 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/index.d.ts +3 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/index.js +2 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/validation.d.ts +27 -0
- package/build/features/connectExpress/screens/CollectBusinessInfo/validation.js +79 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/CollectIndividualInfo.d.ts +5 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/CollectIndividualInfo.js +89 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/Email.d.ts +8 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/Email.js +113 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/MobileNumber.d.ts +10 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/MobileNumber.js +149 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/Name.d.ts +6 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/Name.js +45 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/index.d.ts +3 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/index.js +2 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/validation.d.ts +14 -0
- package/build/features/connectExpress/screens/CollectIndividualInfo/validation.js +31 -0
- package/build/features/connectExpress/screens/CreateAccountLoader/CreateAccountLoader.d.ts +5 -0
- package/build/features/connectExpress/screens/CreateAccountLoader/CreateAccountLoader.js +61 -0
- package/build/features/connectExpress/screens/CreateAccountLoader/index.d.ts +2 -0
- package/build/features/connectExpress/screens/CreateAccountLoader/index.js +2 -0
- package/build/features/connectExpress/screens/IdentityOTP/OTP.d.ts +5 -0
- package/build/features/connectExpress/screens/IdentityOTP/OTP.js +87 -0
- package/build/features/connectExpress/screens/IdentityOTP/OTPInput.d.ts +5 -0
- package/build/features/connectExpress/screens/IdentityOTP/OTPInput.js +52 -0
- package/build/features/connectExpress/screens/IdentityOTP/index.d.ts +3 -0
- package/build/features/connectExpress/screens/IdentityOTP/index.js +2 -0
- package/build/features/connectExpress/screens/IdentityOTP/validation.d.ts +8 -0
- package/build/features/connectExpress/screens/IdentityOTP/validation.js +4 -0
- package/build/features/connectExpress/screens/IdentityVerifyPACI/VerifyPACI.d.ts +5 -0
- package/build/features/connectExpress/screens/IdentityVerifyPACI/VerifyPACI.js +34 -0
- package/build/features/connectExpress/screens/IdentityVerifyPACI/index.d.ts +3 -0
- package/build/features/connectExpress/screens/IdentityVerifyPACI/index.js +2 -0
- package/build/features/connectExpress/screens/Mobile/Mobile.js +0 -3
- package/build/features/connectExpress/screens/NID/NID.js +7 -6
- package/build/features/connectExpress/screens/NIDMissed/DOB.d.ts +6 -0
- package/build/features/connectExpress/screens/NIDMissed/DOB.js +47 -0
- package/build/features/connectExpress/screens/NIDMissed/IDNumber.d.ts +6 -0
- package/build/features/connectExpress/screens/NIDMissed/IDNumber.js +60 -0
- package/build/features/connectExpress/screens/NIDMissed/NID.d.ts +5 -0
- package/build/features/connectExpress/screens/NIDMissed/NID.js +59 -0
- package/build/features/connectExpress/screens/NIDMissed/index.d.ts +3 -0
- package/build/features/connectExpress/screens/NIDMissed/index.js +2 -0
- package/build/features/connectExpress/screens/NIDMissed/validation.d.ts +11 -0
- package/build/features/connectExpress/screens/NIDMissed/validation.js +9 -0
- package/build/features/connectExpress/screens/OTP/OTP.js +10 -6
- package/build/features/connectExpress/screens/OTP/OTPInput.js +7 -6
- package/build/features/connectExpress/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.d.ts +3 -0
- package/build/features/connectExpress/screens/SuccessWithFlowButtons/SuccessWithFlowButtons.js +119 -0
- package/build/features/connectExpress/screens/SuccessWithFlowButtons/index.d.ts +2 -0
- package/build/features/connectExpress/screens/SuccessWithFlowButtons/index.js +2 -0
- package/build/features/connectExpress/screens/VerifyPACI/VerifyPACI.js +7 -68
- package/build/features/featuresScreens.js +40 -0
- package/build/features/shared/FlowButtons/FlowButtons.d.ts +4 -0
- package/build/features/shared/FlowButtons/FlowButtons.js +6 -0
- package/build/features/shared/FlowButtons/index.d.ts +2 -0
- package/build/features/shared/FlowButtons/index.js +2 -0
- package/package.json +1 -1
|
@@ -0,0 +1,113 @@
|
|
|
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
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
13
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
14
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
15
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
16
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
17
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
18
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
22
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
23
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
24
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
25
|
+
function step(op) {
|
|
26
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
27
|
+
while (_) try {
|
|
28
|
+
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;
|
|
29
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
30
|
+
switch (op[0]) {
|
|
31
|
+
case 0: case 1: t = op; break;
|
|
32
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
33
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
34
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
35
|
+
default:
|
|
36
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
37
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
38
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
39
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
40
|
+
if (t[2]) _.ops.pop();
|
|
41
|
+
_.trys.pop(); continue;
|
|
42
|
+
}
|
|
43
|
+
op = body.call(thisArg, _);
|
|
44
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
45
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
49
|
+
import * as React from 'react';
|
|
50
|
+
import { useTranslation } from 'react-i18next';
|
|
51
|
+
import { debounce } from 'lodash-es';
|
|
52
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
53
|
+
import axios from 'axios';
|
|
54
|
+
import { styled } from '@mui/material/styles';
|
|
55
|
+
import CircularProgress from '@mui/material/CircularProgress';
|
|
56
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
57
|
+
import Collapse from '../../../../components/Collapse';
|
|
58
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
59
|
+
import Input from '../../../shared/Input';
|
|
60
|
+
import ClearIcon from '../../../shared/ClearIcon';
|
|
61
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
62
|
+
import { checkEmailAvailabilityAsync, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
|
|
63
|
+
var InputStyled = styled(Input)(function () { return ({
|
|
64
|
+
input: {
|
|
65
|
+
textTransform: 'lowercase'
|
|
66
|
+
}
|
|
67
|
+
}); });
|
|
68
|
+
var cancelToken = null;
|
|
69
|
+
var Email = function (_a) {
|
|
70
|
+
var _b;
|
|
71
|
+
var show = _a.show, fetchingEmail = _a.fetchingEmail, emailChecking = _a.emailChecking;
|
|
72
|
+
var _c = React.useState(''), storedEmail = _c[0], setStoredEmail = _c[1];
|
|
73
|
+
var dispatch = useAppDispatch();
|
|
74
|
+
var data = useAppSelector(connectExpressSelector).data;
|
|
75
|
+
var t = useTranslation().t;
|
|
76
|
+
var control = useFormContext().control;
|
|
77
|
+
var emailControl = useController({ name: 'email', control: control });
|
|
78
|
+
var emailValue = emailControl.field.value;
|
|
79
|
+
var error = (_b = emailControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
80
|
+
var checkEmail = debounce(function (value) { return __awaiter(void 0, void 0, void 0, function () {
|
|
81
|
+
var onSuccess;
|
|
82
|
+
return __generator(this, function (_a) {
|
|
83
|
+
if (cancelToken) {
|
|
84
|
+
cancelToken.cancel('Aborted');
|
|
85
|
+
}
|
|
86
|
+
cancelToken = axios.CancelToken.source();
|
|
87
|
+
onSuccess = function () { return fetchingEmail(false); };
|
|
88
|
+
dispatch(checkEmailAvailabilityAsync({ email: value, cancelToken: cancelToken.token, onSuccess: onSuccess }));
|
|
89
|
+
return [2];
|
|
90
|
+
});
|
|
91
|
+
}); }, 500);
|
|
92
|
+
var handleEmailChange = function (event) {
|
|
93
|
+
emailControl.field.onChange(event.target.value);
|
|
94
|
+
};
|
|
95
|
+
React.useEffect(function () {
|
|
96
|
+
var _a, _b, _c;
|
|
97
|
+
var email = (_c = (_b = (_a = data.responseData) === null || _a === void 0 ? void 0 : _a.leadData) === null || _b === void 0 ? void 0 : _b.contact) === null || _c === void 0 ? void 0 : _c.email;
|
|
98
|
+
if (!!email)
|
|
99
|
+
setStoredEmail(email);
|
|
100
|
+
}, [data.responseData]);
|
|
101
|
+
React.useEffect(function () {
|
|
102
|
+
var isValid = emailValue && !error && emailValue.length > 3;
|
|
103
|
+
if (isValid && emailValue != storedEmail) {
|
|
104
|
+
fetchingEmail(true);
|
|
105
|
+
checkEmail(emailValue);
|
|
106
|
+
}
|
|
107
|
+
}, [emailValue, error]);
|
|
108
|
+
var clearNumber = function () {
|
|
109
|
+
emailControl.field.onChange('');
|
|
110
|
+
};
|
|
111
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('signup_email_lable'), value: emailValue, onEnterPressed: function (e) { return e.preventDefault(); }, onChange: handleEmailChange, type: 'email', placeholder: t('signup_email_placeholder'), warningType: 'alert', warningMessage: error && t(error), endAdornment: emailChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && emailValue ? (_jsx(CheckIcon, {})) : (emailValue && _jsx(ClearIcon, { onClick: clearNumber })) }) }) })));
|
|
112
|
+
};
|
|
113
|
+
export default React.memo(Email);
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { CountryCode } from '../../../../@types';
|
|
3
|
+
interface MobileNumberProps {
|
|
4
|
+
countries: Array<CountryCode>;
|
|
5
|
+
show: boolean;
|
|
6
|
+
onListOpen?: () => void;
|
|
7
|
+
onListClose?: () => void;
|
|
8
|
+
}
|
|
9
|
+
declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<MobileNumberProps & React.RefAttributes<unknown>>>;
|
|
10
|
+
export default _default;
|
|
@@ -0,0 +1,149 @@
|
|
|
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
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
24
|
+
import * as React from 'react';
|
|
25
|
+
import { useTranslation } from 'react-i18next';
|
|
26
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
27
|
+
import Box from '@mui/material/Box';
|
|
28
|
+
import { styled, alpha } from '@mui/material/styles';
|
|
29
|
+
import { removeAllCharsFromNumber } from '../../../../utils';
|
|
30
|
+
import { useLanguage } from '../../../../hooks';
|
|
31
|
+
import Text from '../../../../components/Text';
|
|
32
|
+
import Collapse from '../../../../components/Collapse';
|
|
33
|
+
import SimpleList from '../../../../components/SimpleList';
|
|
34
|
+
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
35
|
+
import ClearIcon from '../../../shared/ClearIcon';
|
|
36
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
37
|
+
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
38
|
+
import Input from '../../../shared/Input';
|
|
39
|
+
import Search from '../../../shared/Search';
|
|
40
|
+
var LabelContainerStyled = styled(Box)(function (_a) {
|
|
41
|
+
var theme = _a.theme;
|
|
42
|
+
return ({
|
|
43
|
+
display: 'flex',
|
|
44
|
+
justifyContent: 'space-between',
|
|
45
|
+
padding: theme.spacing(0, 2.5, 1.25, 2.5)
|
|
46
|
+
});
|
|
47
|
+
});
|
|
48
|
+
var CountryItemContainer = styled(Box)(function () { return ({
|
|
49
|
+
display: 'flex'
|
|
50
|
+
}); });
|
|
51
|
+
var CountryCodeText = styled(Text, {
|
|
52
|
+
shouldForwardProp: function (prop) { return prop !== 'isSelected'; }
|
|
53
|
+
})(function (_a) {
|
|
54
|
+
var theme = _a.theme, isSelected = _a.isSelected;
|
|
55
|
+
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { width: theme.spacing(10), textAlign: 'start', fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight }));
|
|
56
|
+
});
|
|
57
|
+
var CountryNameText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
58
|
+
var theme = _a.theme, isSelected = _a.isSelected;
|
|
59
|
+
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
|
|
60
|
+
});
|
|
61
|
+
var CountryCodeStyled = styled(Text)(function (_a) {
|
|
62
|
+
var theme = _a.theme;
|
|
63
|
+
return (__assign(__assign({ cursor: 'pointer' }, theme.typography.body2), { fontWeight: theme.typography.fontWeightRegular, display: 'flex', alignItems: 'center', minWidth: theme.spacing(8.75) }));
|
|
64
|
+
});
|
|
65
|
+
var InputLabelStyled = styled(Text)(function (_a) {
|
|
66
|
+
var theme = _a.theme;
|
|
67
|
+
return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }, theme.typography.caption), { lineHeight: theme.spacing(2.5) }));
|
|
68
|
+
});
|
|
69
|
+
var ExpandIconStyled = styled(ExpandIcon)(function (_a) {
|
|
70
|
+
var theme = _a.theme;
|
|
71
|
+
return ({
|
|
72
|
+
marginInlineStart: theme.spacing(1)
|
|
73
|
+
});
|
|
74
|
+
});
|
|
75
|
+
var InputStyled = styled(Input)(function () { return ({
|
|
76
|
+
direction: 'ltr',
|
|
77
|
+
'& .MuiInputBase-input': {
|
|
78
|
+
cursor: 'auto'
|
|
79
|
+
}
|
|
80
|
+
}); });
|
|
81
|
+
var MobileNumber = React.forwardRef(function (_a, ref) {
|
|
82
|
+
var _b, _c, _d;
|
|
83
|
+
var countries = _a.countries, rest = __rest(_a, ["countries"]);
|
|
84
|
+
var _e = React.useState(countries || []), countriesCode = _e[0], setCountries = _e[1];
|
|
85
|
+
var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
|
|
86
|
+
var t = useTranslation().t;
|
|
87
|
+
var isAr = useLanguage().isAr;
|
|
88
|
+
var _g = useFormContext(), control = _g.control, setValue = _g.setValue;
|
|
89
|
+
var phoneControl = useController({ name: 'mobile', control: control });
|
|
90
|
+
var countryCodeControl = useController({ name: 'countryCode', control: control });
|
|
91
|
+
var countryCodeValue = countryCodeControl.field.value;
|
|
92
|
+
var mobileValue = phoneControl.field.value || '';
|
|
93
|
+
var countryName = (isAr ? (_b = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.name) === null || _b === void 0 ? void 0 : _b.arabic : (_c = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.name) === null || _c === void 0 ? void 0 : _c.english) || '';
|
|
94
|
+
var error = !!mobileValue ? (_d = phoneControl.fieldState.error) === null || _d === void 0 ? void 0 : _d.message : '';
|
|
95
|
+
var isSA = countryCodeValue.iso2 === 'SA';
|
|
96
|
+
var mobileLen = countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.digits;
|
|
97
|
+
var isStartsWith5 = mobileValue.startsWith('5');
|
|
98
|
+
var requiredLen = isSA && isStartsWith5 ? mobileLen - 1 : mobileLen;
|
|
99
|
+
React.useEffect(function () {
|
|
100
|
+
if (mobileValue)
|
|
101
|
+
setValue('mobile', mobileValue, { shouldValidate: true });
|
|
102
|
+
}, []);
|
|
103
|
+
var onPhoneNumberChange = function (_a) {
|
|
104
|
+
var target = _a.target;
|
|
105
|
+
var value = removeAllCharsFromNumber(target.value);
|
|
106
|
+
phoneControl.field.onChange(value);
|
|
107
|
+
};
|
|
108
|
+
var clearMobileNumber = function () {
|
|
109
|
+
phoneControl.field.onChange('');
|
|
110
|
+
};
|
|
111
|
+
var onCloseCountryList = function () {
|
|
112
|
+
var _a;
|
|
113
|
+
if (anchorEl) {
|
|
114
|
+
setAnchorEl(null);
|
|
115
|
+
(_a = rest.onListClose) === null || _a === void 0 ? void 0 : _a.call(rest);
|
|
116
|
+
}
|
|
117
|
+
setCountries(countries);
|
|
118
|
+
};
|
|
119
|
+
var toggleCountryList = function () {
|
|
120
|
+
var _a, _b;
|
|
121
|
+
if (anchorEl) {
|
|
122
|
+
setAnchorEl(null);
|
|
123
|
+
(_a = rest.onListClose) === null || _a === void 0 ? void 0 : _a.call(rest);
|
|
124
|
+
setCountries(countries);
|
|
125
|
+
}
|
|
126
|
+
else {
|
|
127
|
+
(_b = rest.onListOpen) === null || _b === void 0 ? void 0 : _b.call(rest);
|
|
128
|
+
setAnchorEl(true);
|
|
129
|
+
}
|
|
130
|
+
};
|
|
131
|
+
var onSelectItem = function (country) {
|
|
132
|
+
onCloseCountryList();
|
|
133
|
+
setValue('mobile', '');
|
|
134
|
+
countryCodeControl.field.onChange(country);
|
|
135
|
+
};
|
|
136
|
+
var handleSearch = function (value) {
|
|
137
|
+
var filteredCountries = countries.filter(function (country) {
|
|
138
|
+
return country.idd_prefix.toString().toLowerCase().startsWith(value.replace('+', '').toLowerCase()) ||
|
|
139
|
+
country.capital.toLowerCase().startsWith(value.toLowerCase()) ||
|
|
140
|
+
country.name.arabic.toLowerCase().startsWith(value.toLowerCase()) ||
|
|
141
|
+
country.name.english.toLowerCase().startsWith(value.toLowerCase());
|
|
142
|
+
});
|
|
143
|
+
setCountries(filteredCountries);
|
|
144
|
+
};
|
|
145
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { mb: 3 } }, { children: [_jsx(LabelContainerStyled, { children: _jsx(InputLabelStyled, { children: t('signup_enter_mobile') }) }), _jsx(InputStyled, { inputProps: { maxLength: requiredLen }, type: 'tel', disabled: !!anchorEl, onClick: onCloseCountryList, onChange: onPhoneNumberChange, value: !!anchorEl ? countryName : mobileValue, startAdornment: _jsxs(CountryCodeStyled, __assign({ onClick: function () { return toggleCountryList(); } }, { children: ["+".concat(countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix), !anchorEl && _jsx(ExpandIconStyled, { anchorEl: !!anchorEl })] })), endAdornment: !!anchorEl ? (_jsx(ExpandIconStyled, { onClick: function () { return toggleCountryList(); }, anchorEl: !!anchorEl })) : !error && mobileValue ? (_jsx(CheckIcon, {})) : (mobileValue && _jsx(ClearIcon, { onClick: clearMobileNumber })), placeholder: "".concat(isSA ? '5' : '0', "00000000"), warningType: 'alert', warningMessage: error && t(error, { length: requiredLen, number: '05|5' }) }), _jsxs(Collapse, __assign({ in: !!anchorEl }, { children: [_jsx(Search, { onSearchValue: handleSearch }), _jsx(SimpleList, { searchKeyPath: 'name.english', list: countriesCode, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
146
|
+
return (_jsxs(_Fragment, { children: [_jsxs(CountryItemContainer, { children: [_jsxs(CountryCodeText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: ["+", item.idd_prefix] })), _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english }))] }), item.idd_prefix === (countryCodeValue === null || countryCodeValue === void 0 ? void 0 : countryCodeValue.idd_prefix) && _jsx(CheckIcon, {})] }));
|
|
147
|
+
} })] }))] })) })));
|
|
148
|
+
});
|
|
149
|
+
export default React.memo(MobileNumber);
|
|
@@ -0,0 +1,45 @@
|
|
|
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 { useTranslation } from 'react-i18next';
|
|
15
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
16
|
+
import { styled } from '@mui/material/styles';
|
|
17
|
+
import { removeAllOtherThanAlphabetAndSpace } from '../../../../utils';
|
|
18
|
+
import Collapse from '../../../../components/Collapse';
|
|
19
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
20
|
+
import Input from '../../../shared/Input';
|
|
21
|
+
import ClearIcon from '../../../shared/ClearIcon';
|
|
22
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
23
|
+
var InputStyled = styled(Input)(function () { return ({
|
|
24
|
+
input: {
|
|
25
|
+
textTransform: 'capitalize'
|
|
26
|
+
}
|
|
27
|
+
}); });
|
|
28
|
+
var Name = function (_a) {
|
|
29
|
+
var _b;
|
|
30
|
+
var show = _a.show;
|
|
31
|
+
var t = useTranslation().t;
|
|
32
|
+
var control = useFormContext().control;
|
|
33
|
+
var nameControl = useController({ name: 'name', control: control });
|
|
34
|
+
var handleNameChange = function (event) {
|
|
35
|
+
var value = removeAllOtherThanAlphabetAndSpace(event.target.value);
|
|
36
|
+
nameControl.field.onChange(value);
|
|
37
|
+
};
|
|
38
|
+
var nameValue = nameControl.field.value;
|
|
39
|
+
var error = (_b = nameControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
40
|
+
var clearNumber = function () {
|
|
41
|
+
nameControl.field.onChange('');
|
|
42
|
+
};
|
|
43
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, __assign({ sx: { mb: 3, mt: 2.5 } }, { children: _jsx(InputStyled, { label: t('signup_merchant_name_label'), value: nameValue, onChange: handleNameChange, placeholder: t('signup_merchant_name_label'), warningType: 'alert', warningMessage: error && t(error), endAdornment: !error && nameValue ? _jsx(CheckIcon, {}) : nameValue && _jsx(ClearIcon, { onClick: clearNumber }) }) })) })));
|
|
44
|
+
};
|
|
45
|
+
export default React.memo(Name);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as yup from 'yup';
|
|
2
|
+
export declare const CollectIndividualInfoValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
|
+
name: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
4
|
+
email: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
5
|
+
mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
6
|
+
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
7
|
+
name: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
8
|
+
email: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
9
|
+
mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
10
|
+
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
11
|
+
name: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
12
|
+
email: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
13
|
+
mobile: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
14
|
+
}>>>;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { REGEX_FULL_NAME } from '../../../../constants';
|
|
2
|
+
import * as yup from 'yup';
|
|
3
|
+
export var CollectIndividualInfoValidation = yup.object().shape({
|
|
4
|
+
name: yup.string().matches(REGEX_FULL_NAME, 'please write your first and last name').required('please write your first and last name'),
|
|
5
|
+
email: yup.string().email('email_not_valid').required('email_not_valid'),
|
|
6
|
+
mobile: yup
|
|
7
|
+
.string()
|
|
8
|
+
.test({
|
|
9
|
+
test: function (value) {
|
|
10
|
+
var countryCode = this.parent.countryCode;
|
|
11
|
+
var isSA = countryCode.iso2 === 'SA';
|
|
12
|
+
var digits = countryCode.digits;
|
|
13
|
+
var mobileValue = value || '';
|
|
14
|
+
var valueLen = mobileValue.length;
|
|
15
|
+
var isNumber = mobileValue.match(/^[0-9]/g);
|
|
16
|
+
if (!isNumber)
|
|
17
|
+
return this.createError({ message: 'enter_valid_mobile_number' });
|
|
18
|
+
var isStartWithZero = mobileValue.startsWith('05');
|
|
19
|
+
var isStartWith5 = mobileValue.startsWith('5');
|
|
20
|
+
var isSaudiNumber = isStartWith5 || isStartWithZero;
|
|
21
|
+
if (isSA) {
|
|
22
|
+
if (!isSaudiNumber)
|
|
23
|
+
return this.createError({ message: 'start_with_number' });
|
|
24
|
+
var requiredLen = isStartWith5 ? digits - 1 : digits;
|
|
25
|
+
return valueLen === requiredLen ? true : this.createError({ message: 'enter_valid_mobile_number' });
|
|
26
|
+
}
|
|
27
|
+
return valueLen === digits ? true : this.createError({ message: 'enter_valid_mobile_number' });
|
|
28
|
+
}
|
|
29
|
+
})
|
|
30
|
+
.required('mobile_number_error')
|
|
31
|
+
});
|
|
@@ -0,0 +1,61 @@
|
|
|
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, Fragment as _Fragment, jsxs as _jsxs } 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 { useTranslation } from 'react-i18next';
|
|
17
|
+
import Text from '../../../../components/Text';
|
|
18
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
19
|
+
import LottieFile, { LottieAnimationFiles } from '../../../../components/Lottie';
|
|
20
|
+
import { useAppDispatch } from '../../../../hooks';
|
|
21
|
+
import { createAccountAsync } from '../../../app/connectExpress/connectExpressStore';
|
|
22
|
+
var TitleContainerStyled = styled(Box)(function (_a) {
|
|
23
|
+
var theme = _a.theme;
|
|
24
|
+
return ({
|
|
25
|
+
direction: theme.direction,
|
|
26
|
+
display: 'flex',
|
|
27
|
+
flexDirection: 'column',
|
|
28
|
+
alignItems: 'center',
|
|
29
|
+
marginBottom: theme.spacing(2.5)
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
var VerifyPACITitleStyled = styled(Text)(function (_a) {
|
|
33
|
+
var theme = _a.theme;
|
|
34
|
+
return (__assign(__assign({}, theme.typography.body1), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightBold, marginBottom: theme.spacing(2.4), lineHeight: '19.2px' }));
|
|
35
|
+
});
|
|
36
|
+
var VerifyPACISubTitleStyled = styled(Text)(function (_a) {
|
|
37
|
+
var theme = _a.theme;
|
|
38
|
+
return (__assign(__assign({}, theme.typography.body2), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightMedium, lineHeight: '16.8px' }));
|
|
39
|
+
});
|
|
40
|
+
var Container = styled(Box)(function (_a) {
|
|
41
|
+
var theme = _a.theme;
|
|
42
|
+
return ({
|
|
43
|
+
position: 'relative',
|
|
44
|
+
display: 'flex',
|
|
45
|
+
justifyContent: 'center',
|
|
46
|
+
alignItems: 'center',
|
|
47
|
+
maxHeight: '300px',
|
|
48
|
+
height: '200px',
|
|
49
|
+
width: '100%',
|
|
50
|
+
marginBottom: theme.spacing(3.25)
|
|
51
|
+
});
|
|
52
|
+
});
|
|
53
|
+
var CreateAccountLoader = function (_a) {
|
|
54
|
+
var t = useTranslation().t;
|
|
55
|
+
var dispatch = useAppDispatch();
|
|
56
|
+
React.useEffect(function () {
|
|
57
|
+
dispatch(createAccountAsync());
|
|
58
|
+
}, []);
|
|
59
|
+
return (_jsx(ScreenContainer, __assign({ sx: { mb: 2.5 } }, { children: _jsxs(TitleContainerStyled, { children: [_jsx(Container, { children: _jsx(LottieFile, { file: LottieAnimationFiles.account_creation, loop: true, height: 'unset' }) }), _jsxs(_Fragment, { children: [_jsx(VerifyPACITitleStyled, { children: t('creating_account_title') }), _jsx(VerifyPACISubTitleStyled, { children: t('creating_account_description') })] })] }) })));
|
|
60
|
+
};
|
|
61
|
+
export default React.memo(CreateAccountLoader);
|
|
@@ -0,0 +1,87 @@
|
|
|
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 Box from '@mui/material/Box/Box';
|
|
14
|
+
import { styled } from '@mui/material/styles';
|
|
15
|
+
import * as React from 'react';
|
|
16
|
+
import { useTranslation } from 'react-i18next';
|
|
17
|
+
import Text from '../../../../components/Text';
|
|
18
|
+
import { clearError, connectExpressSelector, verifyMobileOtpAsync, resetOTPValue, verifyNIDOtpLeadIdentityAsync } from '../../../app/connectExpress/connectExpressStore';
|
|
19
|
+
import Button from '../../../shared/Button';
|
|
20
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
21
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
22
|
+
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
23
|
+
import { useLanguage } from '../../../../hooks';
|
|
24
|
+
import { AuthForType } from '../../../../@types';
|
|
25
|
+
import { useForm, FormProvider } from 'react-hook-form';
|
|
26
|
+
import { yupResolver } from '@hookform/resolvers/yup';
|
|
27
|
+
import Form from '../../../../components/Form';
|
|
28
|
+
import { maskPhone, maskID } from '../../../../utils';
|
|
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), marginInline: theme.spacing(2.5), lineHeight: 1.75, whiteSpace: 'pre-line' }));
|
|
45
|
+
});
|
|
46
|
+
var FormStyled = styled(Form)(function () { return ({
|
|
47
|
+
display: 'flex',
|
|
48
|
+
flexDirection: 'column'
|
|
49
|
+
}); });
|
|
50
|
+
var OTP = function () {
|
|
51
|
+
var _a;
|
|
52
|
+
var dispatch = useAppDispatch();
|
|
53
|
+
var _b = useAppSelector(connectExpressSelector), data = _b.data, loading = _b.loading, error = _b.error;
|
|
54
|
+
var t = useTranslation().t;
|
|
55
|
+
var isAr = useLanguage().isAr;
|
|
56
|
+
var methods = useForm({
|
|
57
|
+
resolver: yupResolver(OTPValidation),
|
|
58
|
+
defaultValues: data.otpData,
|
|
59
|
+
mode: 'onChange'
|
|
60
|
+
});
|
|
61
|
+
var isNidAuth = data.otpData.authFor === AuthForType.NATIONAL_ID;
|
|
62
|
+
React.useEffect(function () {
|
|
63
|
+
if (error)
|
|
64
|
+
dispatch(clearError());
|
|
65
|
+
}, [methods.formState.isValid]);
|
|
66
|
+
React.useEffect(function () {
|
|
67
|
+
return function () {
|
|
68
|
+
dispatch(resetOTPValue());
|
|
69
|
+
};
|
|
70
|
+
}, []);
|
|
71
|
+
var onSubmit = function (formData) {
|
|
72
|
+
if (isNidAuth) {
|
|
73
|
+
dispatch(verifyNIDOtpLeadIdentityAsync(formData));
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
dispatch(verifyMobileOtpAsync(formData));
|
|
77
|
+
};
|
|
78
|
+
var onBack = function () {
|
|
79
|
+
dispatch(handlePrevScreenStep());
|
|
80
|
+
};
|
|
81
|
+
var disabled = !methods.formState.isValid || !!error;
|
|
82
|
+
var phone = ((_a = data.mobileData.countryCode) === null || _a === void 0 ? void 0 : _a.idd_prefix) + (data.mobileData.mobile || '');
|
|
83
|
+
var idNumber = data.nidData.nid;
|
|
84
|
+
var title = isNidAuth ? t('opt_nid_sent_title', { provider: 'ABSHER' }) : t('ide_opt_sent_title');
|
|
85
|
+
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') : title, !loading && _jsx("span", __assign({ dir: 'ltr' }, { children: isNidAuth ? maskID(idNumber) : maskPhone(phone) }))] }) }), _jsx(OTPInput, {}), _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
|
|
86
|
+
};
|
|
87
|
+
export default React.memo(OTP);
|
|
@@ -0,0 +1,52 @@
|
|
|
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 { useController, useFormContext } from 'react-hook-form';
|
|
15
|
+
import { useTranslation } from 'react-i18next';
|
|
16
|
+
import Box from '@mui/material/Box/Box';
|
|
17
|
+
import { styled } from '@mui/material/styles';
|
|
18
|
+
import OTPField from '../../../shared/OTP';
|
|
19
|
+
import { DEFAULT_TIMER_VALUE } from '../../../../constants';
|
|
20
|
+
import { AuthForType } from '../../../../@types';
|
|
21
|
+
import { createNIDAuthIdentityAsync, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
|
|
22
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
23
|
+
var BoxStyled = styled(Box)(function (_a) {
|
|
24
|
+
var theme = _a.theme;
|
|
25
|
+
return ({
|
|
26
|
+
display: 'flex',
|
|
27
|
+
flexDirection: 'column',
|
|
28
|
+
fontFamily: theme.typography.fontFamily
|
|
29
|
+
});
|
|
30
|
+
});
|
|
31
|
+
var OTPInput = function (_a) {
|
|
32
|
+
var _b = useFormContext(), control = _b.control, setValue = _b.setValue;
|
|
33
|
+
var t = useTranslation().t;
|
|
34
|
+
var dispatch = useAppDispatch();
|
|
35
|
+
var otpControl = useController({ name: 'otp', control: control });
|
|
36
|
+
var data = useAppSelector(connectExpressSelector).data;
|
|
37
|
+
var nidData = data.nidData;
|
|
38
|
+
var isNidAuth = data.otpData.authFor === AuthForType.NATIONAL_ID;
|
|
39
|
+
var handleOnOTPChange = function (otp) {
|
|
40
|
+
otpControl.field.onChange(otp);
|
|
41
|
+
};
|
|
42
|
+
var handleOnResendOTP = function () {
|
|
43
|
+
};
|
|
44
|
+
var handleOnResendAbsherOTP = function () {
|
|
45
|
+
if (otpControl.field.value)
|
|
46
|
+
setValue('otp', '', { shouldValidate: true });
|
|
47
|
+
dispatch(createNIDAuthIdentityAsync(nidData));
|
|
48
|
+
};
|
|
49
|
+
var otpValue = otpControl.field.value;
|
|
50
|
+
return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: isNidAuth ? handleOnResendAbsherOTP : handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
|
|
51
|
+
};
|
|
52
|
+
export default React.memo(OTPInput);
|
|
@@ -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
|
+
}>>>;
|