@tap-payments/auth-jsconnect 2.8.81-development → 2.8.83-development
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/features/app/business/businessStore.js +4 -2
- package/build/features/app/connectExpress/connectExpressStore.js +29 -28
- package/build/features/business/screens/IDBOD/DOB.d.ts +6 -0
- package/build/features/business/screens/IDBOD/DOB.js +45 -0
- package/build/features/business/screens/IDBOD/IDBOD.js +8 -2
- package/build/features/business/screens/IDBOD/validation.d.ts +3 -0
- package/build/features/business/screens/IDBOD/validation.js +1 -0
- package/build/features/connectExpress/screens/NIDMissed/DOB.d.ts +5 -0
- package/build/features/connectExpress/screens/NIDMissed/DOB.js +47 -0
- package/build/features/connectExpress/screens/NIDMissed/NID.js +8 -2
- package/build/features/connectExpress/screens/NIDMissed/validation.d.ts +3 -0
- package/build/features/connectExpress/screens/NIDMissed/validation.js +1 -0
- package/package.json +1 -1
|
@@ -425,7 +425,7 @@ export var createCivilIdAuth = createAsyncThunk('createCivilIdAuth', function (p
|
|
|
425
425
|
});
|
|
426
426
|
}); });
|
|
427
427
|
export var updateLeadIdentity = createAsyncThunk('updateLeadIdentity', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
428
|
-
var _a, settings, business, identification_id_type, stepName, lead_id, countryIso2, requestBody, data, business_id, entity, screen;
|
|
428
|
+
var _a, settings, business, identification_id_type, stepName, lead_id, countryIso2, dob, requestBody, data, business_id, entity, screen;
|
|
429
429
|
var _b, _c;
|
|
430
430
|
return __generator(this, function (_d) {
|
|
431
431
|
switch (_d.label) {
|
|
@@ -438,6 +438,7 @@ export var updateLeadIdentity = createAsyncThunk('updateLeadIdentity', function
|
|
|
438
438
|
if (isOtherThanKWOrSA(countryIso2)) {
|
|
439
439
|
identification_id_type = IDENTIFICATION_TYPE.NID;
|
|
440
440
|
}
|
|
441
|
+
dob = identification_id_type === IDENTIFICATION_TYPE.NAFATH ? undefined : dateFormat(new Date(params.dob));
|
|
441
442
|
requestBody = {
|
|
442
443
|
id: lead_id || '',
|
|
443
444
|
identification: {
|
|
@@ -445,8 +446,9 @@ export var updateLeadIdentity = createAsyncThunk('updateLeadIdentity', function
|
|
|
445
446
|
issued_country_code: countryIso2,
|
|
446
447
|
type: identification_id_type
|
|
447
448
|
},
|
|
449
|
+
date_of_birth: dob,
|
|
448
450
|
step_name: stepName,
|
|
449
|
-
encryption_contract: ['identification.issued_country_code', 'identification.id', 'identification.type']
|
|
451
|
+
encryption_contract: ['identification.issued_country_code', 'identification.id', 'identification.type', 'date_of_birth']
|
|
450
452
|
};
|
|
451
453
|
return [4, API.leadService.updateLead(requestBody)];
|
|
452
454
|
case 1:
|
|
@@ -341,9 +341,9 @@ export var createNafathAuth = createAsyncThunk('connectExpress/createNafathAuth'
|
|
|
341
341
|
}); });
|
|
342
342
|
export var verifyNafathAsync = createAsyncThunk('connectExpress/verifyNafathAsync', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
343
343
|
var _a, settings, connectExpress, authData, _b, scope, redirectUrl, authConfigData, isScopeAuthentication, bi, isDataHasIndividualOnly, authDataHasValue, expiry, interval, maxCalls, count, data, isSuccess, authId, urlQueryStart, _c, brandList, entityList, stepName, needToCollectMoreInfo, creatingAccount;
|
|
344
|
-
var _d, _e;
|
|
345
|
-
return __generator(this, function (
|
|
346
|
-
switch (
|
|
344
|
+
var _d, _e, _f, _g, _h;
|
|
345
|
+
return __generator(this, function (_j) {
|
|
346
|
+
switch (_j.label) {
|
|
347
347
|
case 0:
|
|
348
348
|
_a = thunkApi.getState(), settings = _a.settings, connectExpress = _a.connectExpress;
|
|
349
349
|
authData = (connectExpress.data.responseData || {}).authData;
|
|
@@ -356,18 +356,18 @@ export var verifyNafathAsync = createAsyncThunk('connectExpress/verifyNafathAsyn
|
|
|
356
356
|
interval = 3;
|
|
357
357
|
maxCalls = Math.floor(expiry / interval);
|
|
358
358
|
count = 1;
|
|
359
|
-
|
|
359
|
+
_j.label = 1;
|
|
360
360
|
case 1:
|
|
361
361
|
if (!(count <= maxCalls)) return [3, 9];
|
|
362
362
|
if (thunkApi.signal.aborted) {
|
|
363
363
|
return [3, 9];
|
|
364
364
|
}
|
|
365
|
-
return [4, API.authService.
|
|
365
|
+
return [4, API.authService.getVerifyExpressAuth(authData === null || authData === void 0 ? void 0 : authData.auth_token)];
|
|
366
366
|
case 2:
|
|
367
|
-
data =
|
|
368
|
-
isSuccess = ((_d = data.
|
|
367
|
+
data = _j.sent();
|
|
368
|
+
isSuccess = ((_e = (_d = data.auth) === null || _d === void 0 ? void 0 : _d.status) === null || _e === void 0 ? void 0 : _e.toLowerCase()) === 'success';
|
|
369
369
|
if (!isSuccess) return [3, 6];
|
|
370
|
-
authId = data.id;
|
|
370
|
+
authId = (_f = data.auth) === null || _f === void 0 ? void 0 : _f.id;
|
|
371
371
|
thunkApi.dispatch(storeAuthId(authId));
|
|
372
372
|
if (isScopeAuthentication && !data.new_user && isDataHasIndividualOnly && authId) {
|
|
373
373
|
if (settings.data.appConfig.mode === 'popup') {
|
|
@@ -384,19 +384,19 @@ export var verifyNafathAsync = createAsyncThunk('connectExpress/verifyNafathAsyn
|
|
|
384
384
|
if (!(isScopeAuthentication && !data.new_user && authDataHasValue)) return [3, 4];
|
|
385
385
|
return [4, thunkApi.dispatch(retrieveAuthenticationListAsync({ individualId: data.individual_id })).unwrap()];
|
|
386
386
|
case 3:
|
|
387
|
-
_c =
|
|
387
|
+
_c = _j.sent(), brandList = _c.brandList, entityList = _c.entityList;
|
|
388
388
|
if (brandList.length && entityList.length) {
|
|
389
389
|
sleep(100).then(function () { return thunkApi.dispatch(handleNextScreenStep('CONNECT_EXPRESS_AUTHENTICATION_LIST_STEP')); });
|
|
390
390
|
return [2, data];
|
|
391
391
|
}
|
|
392
|
-
|
|
393
|
-
case 4: return [4, thunkApi.dispatch(getLeadByIdAsync(data.
|
|
392
|
+
_j.label = 4;
|
|
393
|
+
case 4: return [4, thunkApi.dispatch(getLeadByIdAsync((_g = data.lead) === null || _g === void 0 ? void 0 : _g.id)).unwrap()];
|
|
394
394
|
case 5:
|
|
395
|
-
|
|
395
|
+
_j.sent();
|
|
396
396
|
stepName = data.step_name;
|
|
397
397
|
needToCollectMoreInfo = stepName === 'collect_info';
|
|
398
398
|
creatingAccount = stepName === 'create_account';
|
|
399
|
-
(
|
|
399
|
+
(_h = params.onSuccess) === null || _h === void 0 ? void 0 : _h.call(params);
|
|
400
400
|
if (creatingAccount) {
|
|
401
401
|
sleep(100).then(function () { return thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_WAITING_FOR_CREATING_ACCOUNT_STEP')); });
|
|
402
402
|
}
|
|
@@ -406,8 +406,8 @@ export var verifyNafathAsync = createAsyncThunk('connectExpress/verifyNafathAsyn
|
|
|
406
406
|
return [2, data];
|
|
407
407
|
case 6: return [4, sleep(interval * 1000)];
|
|
408
408
|
case 7:
|
|
409
|
-
|
|
410
|
-
|
|
409
|
+
_j.sent();
|
|
410
|
+
_j.label = 8;
|
|
411
411
|
case 8:
|
|
412
412
|
count++;
|
|
413
413
|
return [3, 1];
|
|
@@ -624,13 +624,13 @@ export var createCivilIDAuthIdentityAsync = createAsyncThunk('connectExpress/cre
|
|
|
624
624
|
});
|
|
625
625
|
}); });
|
|
626
626
|
export var createNIDNafathAuthIdentityAsync = createAsyncThunk('connectExpress/createNIDNafathAuthIdentityAsync', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
627
|
-
var _a, settings, connectExpress, nid, nidType, countryCode, authData, requestBody, data;
|
|
627
|
+
var _a, settings, connectExpress, nid, dob, nidType, countryCode, authData, requestBody, data;
|
|
628
628
|
var _b, _c, _d;
|
|
629
629
|
return __generator(this, function (_e) {
|
|
630
630
|
switch (_e.label) {
|
|
631
631
|
case 0:
|
|
632
632
|
_a = thunkApi.getState(), settings = _a.settings, connectExpress = _a.connectExpress;
|
|
633
|
-
nid = params.nid;
|
|
633
|
+
nid = params.nid, dob = params.dob;
|
|
634
634
|
nidType = IDENTIFICATION_TYPE.NAFATH;
|
|
635
635
|
countryCode = settings.data.businessCountry.iso2;
|
|
636
636
|
if (isOtherThanKWOrSA(countryCode)) {
|
|
@@ -644,9 +644,10 @@ export var createNIDNafathAuthIdentityAsync = createAsyncThunk('connectExpress/c
|
|
|
644
644
|
issued_country_code: countryCode,
|
|
645
645
|
type: nidType
|
|
646
646
|
},
|
|
647
|
+
date_of_birth: nidType === IDENTIFICATION_TYPE.NAFATH ? undefined : dob,
|
|
647
648
|
country_code: countryCode,
|
|
648
649
|
step_name: CONNECT_EXPRESS_STEP_NAMES.IDENTITY_AUTH,
|
|
649
|
-
encryption_contract: ['identification.issued_country_code', 'identification.id', 'identification.type']
|
|
650
|
+
encryption_contract: ['identification.issued_country_code', 'identification.id', 'identification.type', 'date_of_birth']
|
|
650
651
|
};
|
|
651
652
|
return [4, API.leadService.updateLead(requestBody)];
|
|
652
653
|
case 1:
|
|
@@ -669,9 +670,9 @@ export var createNIDNafathAuthIdentityAsync = createAsyncThunk('connectExpress/c
|
|
|
669
670
|
}); });
|
|
670
671
|
export var verifyNafathIdentityAsync = createAsyncThunk('connectExpress/verifyNafathIdentityAsync', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
671
672
|
var connectExpress, authData, expiry, interval, maxCalls, count, data, isSuccess, needToCollectMoreInfo, creatingAccount;
|
|
672
|
-
var _a, _b, _c;
|
|
673
|
-
return __generator(this, function (
|
|
674
|
-
switch (
|
|
673
|
+
var _a, _b, _c, _d;
|
|
674
|
+
return __generator(this, function (_e) {
|
|
675
|
+
switch (_e.label) {
|
|
675
676
|
case 0:
|
|
676
677
|
connectExpress = thunkApi.getState().connectExpress;
|
|
677
678
|
authData = (connectExpress.data.responseData || {}).authData;
|
|
@@ -679,7 +680,7 @@ export var verifyNafathIdentityAsync = createAsyncThunk('connectExpress/verifyNa
|
|
|
679
680
|
interval = 3;
|
|
680
681
|
maxCalls = Math.floor(expiry / interval);
|
|
681
682
|
count = 1;
|
|
682
|
-
|
|
683
|
+
_e.label = 1;
|
|
683
684
|
case 1:
|
|
684
685
|
if (!(count <= maxCalls)) return [3, 7];
|
|
685
686
|
if (thunkApi.signal.aborted) {
|
|
@@ -687,15 +688,15 @@ export var verifyNafathIdentityAsync = createAsyncThunk('connectExpress/verifyNa
|
|
|
687
688
|
}
|
|
688
689
|
return [4, API.authService.getExpressTokenVerify({ token: authData === null || authData === void 0 ? void 0 : authData.verify_token, leadId: authData === null || authData === void 0 ? void 0 : authData.lead_id })];
|
|
689
690
|
case 2:
|
|
690
|
-
data =
|
|
691
|
+
data = _e.sent();
|
|
691
692
|
isSuccess = ((_b = (_a = data.auth) === null || _a === void 0 ? void 0 : _a.status) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'success';
|
|
692
693
|
if (!isSuccess) return [3, 4];
|
|
693
|
-
return [4, thunkApi.dispatch(getLeadByIdAsync(data.
|
|
694
|
+
return [4, thunkApi.dispatch(getLeadByIdAsync((_c = data.lead) === null || _c === void 0 ? void 0 : _c.id)).unwrap()];
|
|
694
695
|
case 3:
|
|
695
|
-
|
|
696
|
+
_e.sent();
|
|
696
697
|
needToCollectMoreInfo = data.step_name === 'collect_info';
|
|
697
698
|
creatingAccount = data.step_name === 'create_account';
|
|
698
|
-
(
|
|
699
|
+
(_d = params.onSuccess) === null || _d === void 0 ? void 0 : _d.call(params);
|
|
699
700
|
if (creatingAccount) {
|
|
700
701
|
sleep(100).then(function () { return thunkApi.dispatch(handleCurrentActiveScreen('CONNECT_EXPRESS_WAITING_FOR_CREATING_ACCOUNT_STEP')); });
|
|
701
702
|
}
|
|
@@ -705,8 +706,8 @@ export var verifyNafathIdentityAsync = createAsyncThunk('connectExpress/verifyNa
|
|
|
705
706
|
return [2, data];
|
|
706
707
|
case 4: return [4, sleep(interval * 1000)];
|
|
707
708
|
case 5:
|
|
708
|
-
|
|
709
|
-
|
|
709
|
+
_e.sent();
|
|
710
|
+
_e.label = 6;
|
|
710
711
|
case 6:
|
|
711
712
|
count++;
|
|
712
713
|
return [3, 1];
|
|
@@ -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, jsxs as _jsxs } 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 { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
17
|
+
import { styled, alpha } from '@mui/material/styles';
|
|
18
|
+
import Text from '../../../../components/Text';
|
|
19
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
20
|
+
import Calender from '../../../shared/Calender';
|
|
21
|
+
import { businessSelector, clearError } from '../../../app/business/businessStore';
|
|
22
|
+
var InputLabelStyled = styled(Text)(function (_a) {
|
|
23
|
+
var theme = _a.theme;
|
|
24
|
+
return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.6) }, theme.typography.caption), { cursor: 'pointer' }));
|
|
25
|
+
});
|
|
26
|
+
var BOD = function (_a) {
|
|
27
|
+
var _b;
|
|
28
|
+
var onDateClicked = _a.onDateClicked;
|
|
29
|
+
var t = useTranslation().t;
|
|
30
|
+
var control = useFormContext().control;
|
|
31
|
+
var dispatch = useAppDispatch();
|
|
32
|
+
var dobControl = useController({ control: control, name: 'dob' });
|
|
33
|
+
var error = useAppSelector(businessSelector).error;
|
|
34
|
+
var handleBirthDateChange = function (data) {
|
|
35
|
+
if (error)
|
|
36
|
+
dispatch(clearError());
|
|
37
|
+
dobControl.field.onChange(data);
|
|
38
|
+
};
|
|
39
|
+
var dateValue = (_b = dobControl === null || dobControl === void 0 ? void 0 : dobControl.field) === null || _b === void 0 ? void 0 : _b.value;
|
|
40
|
+
return (_jsxs(ScreenContainer, { children: [_jsx(InputLabelStyled, __assign({ sx: { p: function (_a) {
|
|
41
|
+
var spacing = _a.spacing;
|
|
42
|
+
return spacing(2.5, 2.5, 1.5, 2.5);
|
|
43
|
+
} } }, { children: t('enter_birth_date') })), _jsx(Calender, { isDob: true, defaultValue: dateValue ? new Date(dateValue) : undefined, onDateClicked: onDateClicked, onDateChange: handleBirthDateChange })] }));
|
|
44
|
+
};
|
|
45
|
+
export default React.memo(BOD);
|
|
@@ -21,18 +21,21 @@ import Form from '../../../../components/Form';
|
|
|
21
21
|
import Button from '../../../shared/Button';
|
|
22
22
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
23
23
|
import { businessSelector, clearError, updateLeadIdentity } from '../../../app/business/businessStore';
|
|
24
|
+
import Collapse from '../../../../components/Collapse';
|
|
24
25
|
import { deepCopy, isOtherThanKWOrSA, sendCustomEventToGTM } from '../../../../utils';
|
|
25
26
|
import { NIDOtherCountryValidationSchema, NIDValidationSchema } from './validation';
|
|
26
27
|
import ID from './ID';
|
|
28
|
+
import DOB from './DOB';
|
|
27
29
|
var FormStyled = styled(Form)(function () { return ({
|
|
28
30
|
display: 'flex',
|
|
29
31
|
flexDirection: 'column'
|
|
30
32
|
}); });
|
|
31
33
|
var IDBOD = function (_a) {
|
|
34
|
+
var _b = React.useState(false), collapse = _b[0], setCollapse = _b[1];
|
|
32
35
|
var isAr = useLanguage().isAr;
|
|
33
36
|
var dispatch = useAppDispatch();
|
|
34
37
|
var t = useTranslation().t;
|
|
35
|
-
var
|
|
38
|
+
var _c = useAppSelector(businessSelector), data = _c.data, loading = _c.loading, error = _c.error;
|
|
36
39
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
37
40
|
var isOtherCountry = React.useMemo(function () { return isOtherThanKWOrSA(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
|
|
38
41
|
var methods = useForm({
|
|
@@ -56,7 +59,10 @@ var IDBOD = function (_a) {
|
|
|
56
59
|
var onSubmit = function (data) {
|
|
57
60
|
dispatch(updateLeadIdentity(deepCopy(data)));
|
|
58
61
|
};
|
|
62
|
+
var handleCollapseOpenClose = function (flag) {
|
|
63
|
+
setCollapse(flag);
|
|
64
|
+
};
|
|
59
65
|
var disabled = !methods.formState.isValid;
|
|
60
|
-
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(ID, {}), _jsx(Button, __assign({ sx: { mt: 10 }, loading: loading, disableBack: true, isAr: isAr, disabled: disabled, error: t(error || '') }, { children: t('next') }))] })) })) }));
|
|
66
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(ID, {}) })), _jsx(Collapse, __assign({ in: isOtherCountry }, { children: _jsx(DOB, { onDateClicked: handleCollapseOpenClose }) })), _jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(Button, __assign({ sx: !isOtherCountry ? { mt: 10 } : {}, loading: loading, disableBack: true, isAr: isAr, disabled: disabled, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
|
|
61
67
|
};
|
|
62
68
|
export default React.memo(IDBOD);
|
|
@@ -7,9 +7,12 @@ export declare const NIDValidationSchema: yup.ObjectSchema<import("yup/lib/objec
|
|
|
7
7
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
8
8
|
}>>>;
|
|
9
9
|
export declare const NIDOtherCountryValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
10
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
10
11
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
11
12
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
13
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
12
14
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
13
15
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
16
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
14
17
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
15
18
|
}>>>;
|
|
@@ -7,5 +7,6 @@ export var NIDValidationSchema = yup.object().shape({
|
|
|
7
7
|
.required('signup_invalid_national_id')
|
|
8
8
|
});
|
|
9
9
|
export var NIDOtherCountryValidationSchema = yup.object().shape({
|
|
10
|
+
dob: yup.string().min(5).required('enter_valid_birth_date'),
|
|
10
11
|
nid: yup.string().min(3, 'signup_invalid_national_id').required('signup_invalid_national_id')
|
|
11
12
|
});
|
|
@@ -0,0 +1,47 @@
|
|
|
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 { useTranslation } from 'react-i18next';
|
|
14
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
15
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
16
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
17
|
+
import { alpha, styled } from '@mui/material/styles';
|
|
18
|
+
import { clearError, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
|
|
19
|
+
import Text from '../../../../components/Text';
|
|
20
|
+
import Calender from '../../../shared/Calender';
|
|
21
|
+
var InputLabelStyled = styled(Text)(function (_a) {
|
|
22
|
+
var theme = _a.theme;
|
|
23
|
+
return (__assign(__assign({ color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }, theme.typography.caption), { lineHeight: theme.spacing(2.5) }));
|
|
24
|
+
});
|
|
25
|
+
var DOB = function (_a) {
|
|
26
|
+
var _b;
|
|
27
|
+
var onDateClicked = _a.onDateClicked;
|
|
28
|
+
var t = useTranslation().t;
|
|
29
|
+
var control = useFormContext().control;
|
|
30
|
+
var dispatch = useAppDispatch();
|
|
31
|
+
var dobControl = useController({ control: control, name: 'dob' });
|
|
32
|
+
var error = useAppSelector(connectExpressSelector).error;
|
|
33
|
+
var handleBirthDateChange = function (data) {
|
|
34
|
+
dobControl.field.onChange(data);
|
|
35
|
+
handleClearError();
|
|
36
|
+
};
|
|
37
|
+
var handleClearError = function () {
|
|
38
|
+
if (error)
|
|
39
|
+
dispatch(clearError());
|
|
40
|
+
};
|
|
41
|
+
var dateValue = (_b = dobControl === null || dobControl === void 0 ? void 0 : dobControl.field) === null || _b === void 0 ? void 0 : _b.value;
|
|
42
|
+
return (_jsxs(ScreenContainer, { children: [_jsx(InputLabelStyled, __assign({ sx: { p: function (_a) {
|
|
43
|
+
var spacing = _a.spacing;
|
|
44
|
+
return spacing(2.5, 2.5, 1.5, 2.5);
|
|
45
|
+
} } }, { children: t('enter_birth_date') })), _jsx(Calender, { isDob: true, defaultValue: dateValue ? new Date(dateValue) : undefined, onDateClicked: onDateClicked, onDateChange: handleBirthDateChange })] }));
|
|
46
|
+
};
|
|
47
|
+
export default DOB;
|
|
@@ -22,18 +22,21 @@ import { clearError, connectExpressSelector, createNIDNafathAuthIdentityAsync }
|
|
|
22
22
|
import Form from '../../../../components/Form';
|
|
23
23
|
import Button from '../../../shared/Button';
|
|
24
24
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
25
|
+
import Collapse from '../../../../components/Collapse';
|
|
25
26
|
import IDNumber from './IDNumber';
|
|
27
|
+
import DOB from './DOB';
|
|
26
28
|
import { deepCopy, isOtherThanKWOrSA } from '../../../../utils';
|
|
27
29
|
var FormStyled = styled(Form)(function () { return ({
|
|
28
30
|
display: 'flex',
|
|
29
31
|
flexDirection: 'column'
|
|
30
32
|
}); });
|
|
31
33
|
var NID = function (_a) {
|
|
34
|
+
var _b = React.useState(false), collapse = _b[0], setCollapse = _b[1];
|
|
32
35
|
var isAr = useLanguage().isAr;
|
|
33
36
|
var dispatch = useAppDispatch();
|
|
34
37
|
var t = useTranslation().t;
|
|
35
38
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
36
|
-
var
|
|
39
|
+
var _c = useAppSelector(connectExpressSelector), data = _c.data, loading = _c.loading, error = _c.error;
|
|
37
40
|
var isOtherCountry = React.useMemo(function () { return isOtherThanKWOrSA(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
|
|
38
41
|
var methods = useForm({
|
|
39
42
|
resolver: yupResolver(isOtherCountry ? NIDOtherCountryValidationSchema : NIDValidationSchema),
|
|
@@ -47,10 +50,13 @@ var NID = function (_a) {
|
|
|
47
50
|
var onSubmit = function (data) {
|
|
48
51
|
dispatch(createNIDNafathAuthIdentityAsync(deepCopy(data)));
|
|
49
52
|
};
|
|
53
|
+
var handleCollapseOpenClose = function (flag) {
|
|
54
|
+
setCollapse(flag);
|
|
55
|
+
};
|
|
50
56
|
var onBack = function () {
|
|
51
57
|
dispatch(handlePrevScreenStep());
|
|
52
58
|
};
|
|
53
59
|
var disabled = !methods.formState.isValid;
|
|
54
|
-
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(IDNumber, { show:
|
|
60
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(IDNumber, { show: !collapse }) })), _jsx(Collapse, __assign({ in: isOtherCountry }, { children: _jsx(DOB, { onDateClicked: handleCollapseOpenClose }) })), _jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(Button, __assign({ sx: !isOtherCountry ? { mt: 10 } : {}, loading: loading, isAr: isAr, onBackClicked: onBack, disabled: disabled, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
|
|
55
61
|
};
|
|
56
62
|
export default React.memo(NID);
|
|
@@ -7,9 +7,12 @@ export declare const NIDValidationSchema: yup.ObjectSchema<import("yup/lib/objec
|
|
|
7
7
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
8
8
|
}>>>;
|
|
9
9
|
export declare const NIDOtherCountryValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
10
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
10
11
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
11
12
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
13
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
12
14
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
13
15
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
16
|
+
dob: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
14
17
|
nid: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
15
18
|
}>>>;
|
|
@@ -7,5 +7,6 @@ export var NIDValidationSchema = yup.object().shape({
|
|
|
7
7
|
.required('signup_invalid_national_id')
|
|
8
8
|
});
|
|
9
9
|
export var NIDOtherCountryValidationSchema = yup.object().shape({
|
|
10
|
+
dob: yup.string().min(5).required('enter_valid_birth_date'),
|
|
10
11
|
nid: yup.string().min(3, 'signup_invalid_national_id').required('signup_invalid_national_id')
|
|
11
12
|
});
|