@tap-payments/auth-jsconnect 2.1.77-test → 2.1.79-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/app.d.ts +6 -2
- package/build/api/entity.d.ts +3 -3
- package/build/api/individual.d.ts +7 -3
- package/build/assets/locales/ar.json +6 -1
- package/build/assets/locales/en.json +6 -1
- package/build/features/app/bank/bankStore.js +17 -12
- package/build/features/app/brand/brandStore.js +9 -9
- package/build/features/app/connect/connectStore.js +6 -6
- package/build/features/app/individual/individualStore.d.ts +1 -0
- package/build/features/app/individual/individualStore.js +102 -86
- package/build/features/bank/screens/BankDetails/BankDetails.js +8 -7
- package/build/features/bank/screens/BankDetails/BankName.js +13 -10
- package/build/features/bank/screens/BankDetails/Beneficiary.js +12 -13
- package/build/features/bank/screens/BankDetails/IBAN.js +14 -10
- package/build/features/bank/screens/BankDetails/validation.d.ts +14 -14
- package/build/features/bank/screens/BankDetails/validation.js +34 -15
- package/build/features/connect/screens/Merchant/BrandList.js +4 -4
- package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js +1 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js +2 -3
- package/build/features/individual/screens/AdditionalIndividualInfo/EmployerLocation.js +1 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/ShareValue.js +2 -2
- package/build/features/individual/screens/AdditionalIndividualInfo/SignatureFile.js +1 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/validation.d.ts +2 -2
- package/build/features/individual/screens/AdditionalIndividualInfo/validation.js +6 -5
- package/build/features/individual/screens/IndividualList/IndividualList.js +2 -3
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCity.js +23 -5
- package/build/features/individual/screens/IndividualPersonalInfo/BirthCountry.js +1 -1
- package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.js +9 -3
- package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.js +1 -1
- package/build/features/individual/screens/IndividualPersonalInfo/MobileNumber.js +1 -1
- package/build/features/individual/screens/IndividualPersonalInfo/Nationality.js +1 -1
- package/build/features/individual/screens/Verify/Verify.js +10 -17
- package/build/features/shared/SuccessFlowButtons/SuccessFlowButtons.js +1 -1
- package/package.json +1 -1
|
@@ -42,18 +42,19 @@ var ButtonStyled = styled(Button)(function (_a) {
|
|
|
42
42
|
});
|
|
43
43
|
});
|
|
44
44
|
var BankDetails = function () {
|
|
45
|
-
var _a, _b, _c
|
|
46
|
-
var
|
|
45
|
+
var _a, _b, _c;
|
|
46
|
+
var _d = React.useState(false), ibanChecking = _d[0], setIbanChecking = _d[1];
|
|
47
47
|
var dispatch = useAppDispatch();
|
|
48
|
-
var
|
|
48
|
+
var _e = useAppSelector(bankSelector), data = _e.data, loading = _e.loading, error = _e.error;
|
|
49
49
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
50
|
-
var
|
|
50
|
+
var _f = data.bankData, iban = _f.iban, beneficiaryName = _f.beneficiaryName, bankName = _f.bankName, bankStatementId = _f.bankStatementId, bankStatementUploading = _f.uploading, confirmPolicy = _f.confirmPolicy;
|
|
51
51
|
var verify = data.verify;
|
|
52
|
+
var _g = verify.responseBody || {}, bank_account = _g.bank_account, entity = _g.entity;
|
|
52
53
|
var isKWCountry = React.useMemo(function () { return isKW(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
|
|
53
|
-
var isFL = ((
|
|
54
|
-
var bankHasDocument = ((
|
|
54
|
+
var isFL = ((_a = entity === null || entity === void 0 ? void 0 : entity.type) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === BusinessType.FL ? true : false;
|
|
55
|
+
var bankHasDocument = ((_c = (_b = bank_account === null || bank_account === void 0 ? void 0 : bank_account.document) === null || _b === void 0 ? void 0 : _b.file_details) === null || _c === void 0 ? void 0 : _c.length) > 0;
|
|
55
56
|
var methods = useForm({
|
|
56
|
-
resolver: yupResolver(isKWCountry && isFL && !bankHasDocument ? BankKWFLValidation : BankValidation),
|
|
57
|
+
resolver: yupResolver(isKWCountry && isFL && !bankHasDocument ? BankKWFLValidation(bank_account) : BankValidation(bank_account)),
|
|
57
58
|
defaultValues: {
|
|
58
59
|
iban: iban,
|
|
59
60
|
beneficiaryName: beneficiaryName,
|
|
@@ -11,17 +11,18 @@ var __assign = (this && this.__assign) || function () {
|
|
|
11
11
|
};
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
13
|
import * as React from 'react';
|
|
14
|
-
import { ScreenContainer } from '../../../shared/Containers';
|
|
15
|
-
import Input from '../../../shared/Input';
|
|
16
|
-
import { useTranslation } from 'react-i18next';
|
|
17
14
|
import { useController, useFormContext } from 'react-hook-form';
|
|
15
|
+
import { useTranslation } from 'react-i18next';
|
|
18
16
|
import { styled } from '@mui/material/styles';
|
|
19
|
-
import ClearIcon from '../../../shared/ClearIcon';
|
|
20
|
-
import CheckIcon from '../../../shared/CheckIcon';
|
|
21
|
-
import { bankSelector } from '../../../app/bank/bankStore';
|
|
22
17
|
import { useAppSelector } from '../../../../hooks';
|
|
23
18
|
import { removeAllOtherThanAlphabetAndSpace } from '../../../../utils';
|
|
19
|
+
import { FieldType } from '../../../../@types';
|
|
24
20
|
import Collapse from '../../../../components/Collapse';
|
|
21
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
22
|
+
import Input from '../../../shared/Input';
|
|
23
|
+
import ClearIcon from '../../../shared/ClearIcon';
|
|
24
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
25
|
+
import { bankSelector } from '../../../app/bank/bankStore';
|
|
25
26
|
var FeatureStyled = styled(ScreenContainer)(function (_a) {
|
|
26
27
|
var theme = _a.theme;
|
|
27
28
|
return ({
|
|
@@ -34,13 +35,15 @@ var InputStyled = styled(Input)(function () { return ({
|
|
|
34
35
|
}
|
|
35
36
|
}); });
|
|
36
37
|
var BankName = function () {
|
|
37
|
-
var _a, _b;
|
|
38
|
+
var _a, _b, _c;
|
|
38
39
|
var t = useTranslation().t;
|
|
39
|
-
var
|
|
40
|
+
var _d = useFormContext(), setValue = _d.setValue, control = _d.control;
|
|
40
41
|
var data = useAppSelector(bankSelector).data;
|
|
41
42
|
var bankNameControl = useController({ name: 'bankName', control: control });
|
|
42
43
|
var bankNameValue = bankNameControl.field.value;
|
|
43
44
|
var hasError = !!((_a = bankNameControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message);
|
|
45
|
+
var bank_account = (data.verify.responseBody || {}).bank_account;
|
|
46
|
+
var isNonEditable = ((_b = bank_account === null || bank_account === void 0 ? void 0 : bank_account.data_status) === null || _b === void 0 ? void 0 : _b.bank_name) === FieldType.NON_EDITABLE;
|
|
44
47
|
var clearValue = function () {
|
|
45
48
|
bankNameControl.field.onChange('');
|
|
46
49
|
};
|
|
@@ -49,12 +52,12 @@ var BankName = function () {
|
|
|
49
52
|
var bankName = (_a = data.bankData.responseBody) === null || _a === void 0 ? void 0 : _a.bank_name;
|
|
50
53
|
if (bankName && !bankNameValue)
|
|
51
54
|
setValue('bankName', bankName);
|
|
52
|
-
}, [(
|
|
55
|
+
}, [(_c = data.bankData.responseBody) === null || _c === void 0 ? void 0 : _c.bank_name]);
|
|
53
56
|
var handleBankChange = function (_a) {
|
|
54
57
|
var target = _a.target;
|
|
55
58
|
var value = removeAllOtherThanAlphabetAndSpace(target.value);
|
|
56
59
|
bankNameControl.field.onChange(value);
|
|
57
60
|
};
|
|
58
|
-
return (_jsx(Collapse, __assign({ in: !!bankNameValue }, { children: _jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('enter_bank_name'), placeholder: t('enter_bank_name_placeholder'), onChange: handleBankChange, value: bankNameValue, required: true,
|
|
61
|
+
return (_jsx(Collapse, __assign({ in: !!bankNameValue }, { children: _jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('enter_bank_name'), placeholder: t('enter_bank_name_placeholder'), onChange: handleBankChange, value: bankNameValue, required: true, disabled: isNonEditable, endAdornment: !hasError && bankNameValue ? _jsx(CheckIcon, {}) : bankNameValue && _jsx(ClearIcon, { onClick: clearValue }) }) }) })));
|
|
59
62
|
};
|
|
60
63
|
export default BankName;
|
|
@@ -4,35 +4,34 @@ import Input from '../../../shared/Input';
|
|
|
4
4
|
import { useTranslation } from 'react-i18next';
|
|
5
5
|
import { useController, useFormContext } from 'react-hook-form';
|
|
6
6
|
import { styled } from '@mui/material/styles';
|
|
7
|
-
import { ScreenContainer } from '../../../shared/Containers';
|
|
8
|
-
import { bankSelector } from '../../../app/bank/bankStore';
|
|
9
7
|
import { useAppSelector } from '../../../../hooks';
|
|
8
|
+
import { FieldType } from '../../../../@types';
|
|
10
9
|
import ClearIcon from '../../../shared/ClearIcon';
|
|
11
10
|
import CheckIcon from '../../../shared/CheckIcon';
|
|
11
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
12
|
+
import { bankSelector } from '../../../app/bank/bankStore';
|
|
12
13
|
var FeatureStyled = styled(ScreenContainer)(function (_a) {
|
|
13
14
|
var theme = _a.theme;
|
|
14
15
|
return ({
|
|
15
16
|
marginBlockEnd: theme.spacing(3)
|
|
16
17
|
});
|
|
17
18
|
});
|
|
18
|
-
var InputStyled = styled(Input)(function (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
});
|
|
19
|
+
var InputStyled = styled(Input)(function () { return ({
|
|
20
|
+
input: {
|
|
21
|
+
textTransform: 'capitalize'
|
|
22
|
+
}
|
|
23
|
+
}); });
|
|
26
24
|
var Beneficiary = function () {
|
|
27
|
-
var _a, _b;
|
|
25
|
+
var _a, _b, _c;
|
|
28
26
|
var t = useTranslation().t;
|
|
29
|
-
var
|
|
27
|
+
var _d = useFormContext(), setValue = _d.setValue, control = _d.control;
|
|
30
28
|
var data = useAppSelector(bankSelector).data;
|
|
31
29
|
var beneficiaryControl = useController({ name: 'beneficiaryName', control: control });
|
|
32
30
|
var beneficiaryValue = beneficiaryControl.field.value;
|
|
33
31
|
var hasError = (_a = beneficiaryControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
|
|
34
32
|
var error = (_b = beneficiaryControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
35
33
|
var bank_account = (data.verify.responseBody || {}).bank_account;
|
|
34
|
+
var isNonEditable = ((_c = bank_account === null || bank_account === void 0 ? void 0 : bank_account.data_status) === null || _c === void 0 ? void 0 : _c.beneficiary_name) === FieldType.NON_EDITABLE;
|
|
36
35
|
React.useEffect(function () {
|
|
37
36
|
var beneficiary_name = (bank_account || {}).beneficiary_name;
|
|
38
37
|
if (beneficiary_name)
|
|
@@ -45,6 +44,6 @@ var Beneficiary = function () {
|
|
|
45
44
|
var clearValue = function () {
|
|
46
45
|
beneficiaryControl.field.onChange('');
|
|
47
46
|
};
|
|
48
|
-
return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
|
|
47
|
+
return (_jsx(FeatureStyled, { children: _jsx(InputStyled, { label: t('beneficiary_name'), onChange: handleBeneficiaryChange, disabled: isNonEditable, value: beneficiaryValue, placeholder: t('beneficiary_name'), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: !hasError && beneficiaryValue ? _jsx(CheckIcon, {}) : beneficiaryValue && _jsx(ClearIcon, { onClick: clearValue }) }) }));
|
|
49
48
|
};
|
|
50
49
|
export default Beneficiary;
|
|
@@ -36,22 +36,23 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
36
36
|
};
|
|
37
37
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
38
38
|
import * as React from 'react';
|
|
39
|
-
import
|
|
39
|
+
import { debounce } from 'lodash-es';
|
|
40
40
|
import { useTranslation } from 'react-i18next';
|
|
41
|
+
import axios from 'axios';
|
|
41
42
|
import { useController, useFormContext } from 'react-hook-form';
|
|
42
|
-
import { removeAllOtherThanCharsAndNumber } from '../../../../utils';
|
|
43
43
|
import { styled } from '@mui/material';
|
|
44
|
+
import CircularProgress from '@mui/material/CircularProgress';
|
|
45
|
+
import { removeAllOtherThanCharsAndNumber } from '../../../../utils';
|
|
46
|
+
import { settingsSelector } from '../../../../app/settings';
|
|
47
|
+
import { useAppSelector, useAppDispatch } from '../../../../hooks';
|
|
48
|
+
import { FieldType } from '../../../../@types';
|
|
44
49
|
import { MAX_IBAN_VALUE } from '../../../../constants';
|
|
45
50
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
46
|
-
import { debounce } from 'lodash-es';
|
|
47
51
|
import { checkIbanBank } from '../../../app/bank/bankStore';
|
|
48
|
-
import { useAppDispatch } from '../../../../hooks';
|
|
49
|
-
import axios from 'axios';
|
|
50
52
|
import ClearIcon from '../../../shared/ClearIcon';
|
|
51
53
|
import CheckIcon from '../../../shared/CheckIcon';
|
|
52
|
-
import
|
|
53
|
-
import {
|
|
54
|
-
import { useAppSelector } from '../../../../hooks';
|
|
54
|
+
import Input from '../../../shared/Input';
|
|
55
|
+
import { bankSelector } from '../../../app/bank/bankStore';
|
|
55
56
|
var InputStyled = styled(Input)(function () { return ({
|
|
56
57
|
input: {
|
|
57
58
|
textTransform: 'uppercase'
|
|
@@ -59,15 +60,18 @@ var InputStyled = styled(Input)(function () { return ({
|
|
|
59
60
|
}); });
|
|
60
61
|
var cancelToken = null;
|
|
61
62
|
var IBAN = function (_a) {
|
|
62
|
-
var _b;
|
|
63
|
+
var _b, _c;
|
|
63
64
|
var fetchingIban = _a.fetchingIban, ibanChecking = _a.ibanChecking;
|
|
64
65
|
var dispatch = useAppDispatch();
|
|
65
66
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
67
|
+
var data = useAppSelector(bankSelector).data;
|
|
66
68
|
var t = useTranslation().t;
|
|
67
69
|
var control = useFormContext().control;
|
|
68
70
|
var ibanControl = useController({ name: 'iban', control: control });
|
|
69
71
|
var ibanValue = ibanControl.field.value;
|
|
70
72
|
var error = (_b = ibanControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
73
|
+
var bank_account = (data.verify.responseBody || {}).bank_account;
|
|
74
|
+
var isNonEditable = ((_c = bank_account === null || bank_account === void 0 ? void 0 : bank_account.data_status) === null || _c === void 0 ? void 0 : _c.iban) === FieldType.NON_EDITABLE;
|
|
71
75
|
var checkBank = debounce(function (value) { return __awaiter(void 0, void 0, void 0, function () {
|
|
72
76
|
var onSuccess;
|
|
73
77
|
return __generator(this, function (_a) {
|
|
@@ -95,6 +99,6 @@ var IBAN = function (_a) {
|
|
|
95
99
|
var clearValue = function () {
|
|
96
100
|
ibanControl.field.onChange('');
|
|
97
101
|
};
|
|
98
|
-
return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('iban_input_placeholder', { countrycode: settingsData.businessCountry.iso2.toUpperCase() }), warningType: 'alert', warningMessage: error && t(error), required: true, endAdornment: ibanChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && ibanValue ? (_jsx(CheckIcon, {})) : (ibanValue && _jsx(ClearIcon, { onClick: clearValue })) }) }));
|
|
102
|
+
return (_jsx(ScreenContainer, { children: _jsx(InputStyled, { label: t('enter_iban'), inputProps: { maxLength: MAX_IBAN_VALUE }, onChange: handleIbanChange, value: ibanValue, placeholder: t('iban_input_placeholder', { countrycode: settingsData.businessCountry.iso2.toUpperCase() }), warningType: 'alert', warningMessage: error && t(error), required: true, disabled: isNonEditable, endAdornment: ibanChecking ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : !error && ibanValue ? (_jsx(CheckIcon, {})) : (ibanValue && _jsx(ClearIcon, { onClick: clearValue })) }) }));
|
|
99
103
|
};
|
|
100
104
|
export default IBAN;
|
|
@@ -1,39 +1,39 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
|
-
export declare const BankValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
|
-
iban:
|
|
2
|
+
export declare const BankValidation: (bankAccount: any) => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
4
4
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
5
|
-
beneficiaryName:
|
|
5
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
6
6
|
bankStatementId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
|
|
7
7
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
8
8
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
9
|
-
iban:
|
|
9
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
10
10
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
11
|
-
beneficiaryName:
|
|
11
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
12
12
|
bankStatementId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
|
|
13
13
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
14
14
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
15
|
-
iban:
|
|
15
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
16
16
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
17
|
-
beneficiaryName:
|
|
17
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
18
18
|
bankStatementId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
|
|
19
19
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
20
20
|
}>>>;
|
|
21
|
-
export declare const BankKWFLValidation: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
22
|
-
iban:
|
|
21
|
+
export declare const BankKWFLValidation: (bankAccount: any) => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
22
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
23
23
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
24
|
-
beneficiaryName:
|
|
24
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
25
25
|
bankStatementId: import("yup/lib/array").RequiredArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined>;
|
|
26
26
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
27
27
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
28
|
-
iban:
|
|
28
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
29
29
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
30
|
-
beneficiaryName:
|
|
30
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
31
31
|
bankStatementId: import("yup/lib/array").RequiredArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined>;
|
|
32
32
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
33
33
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
34
|
-
iban:
|
|
34
|
+
iban: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
35
35
|
bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
36
|
-
beneficiaryName:
|
|
36
|
+
beneficiaryName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
37
37
|
bankStatementId: import("yup/lib/array").RequiredArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined>;
|
|
38
38
|
confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
|
|
39
39
|
}>>>;
|
|
@@ -1,16 +1,35 @@
|
|
|
1
|
-
import { REGEX_ALPHANUMERIC, REGEX_IBAN } from '../../../../constants';
|
|
2
1
|
import * as yup from 'yup';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
2
|
+
import { FieldType } from '../../../../@types';
|
|
3
|
+
import { REGEX_ALPHANUMERIC, REGEX_IBAN } from '../../../../constants';
|
|
4
|
+
export var BankValidation = function (bankAccount) {
|
|
5
|
+
var _a = bankAccount || {}, iban = _a.iban, beneficiary_name = _a.beneficiary_name, data_status = _a.data_status;
|
|
6
|
+
var isIBANOptional = !iban && (data_status === null || data_status === void 0 ? void 0 : data_status.iban) === FieldType.NON_EDITABLE;
|
|
7
|
+
var isBeneficiaryNameOptional = !beneficiary_name && (data_status === null || data_status === void 0 ? void 0 : data_status.beneficiary_name) === FieldType.NON_EDITABLE;
|
|
8
|
+
return yup.object().shape({
|
|
9
|
+
iban: isIBANOptional
|
|
10
|
+
? yup.string().optional()
|
|
11
|
+
: yup.string().matches(REGEX_IBAN, 'invalid_iban_format').min(15, 'invalid_iban_format').max(34, 'invalid_iban_format').required('alert_iban'),
|
|
12
|
+
bankName: yup.string().optional(),
|
|
13
|
+
beneficiaryName: isBeneficiaryNameOptional
|
|
14
|
+
? yup.string().optional()
|
|
15
|
+
: yup.string().matches(REGEX_ALPHANUMERIC, 'beneficiary_name_invalid').required('beneficiary_name_required'),
|
|
16
|
+
bankStatementId: yup.array().optional(),
|
|
17
|
+
confirmPolicy: yup.boolean().required('alert_bank_confirm').isTrue('alert_bank_confirm')
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
export var BankKWFLValidation = function (bankAccount) {
|
|
21
|
+
var _a = bankAccount || {}, iban = _a.iban, beneficiary_name = _a.beneficiary_name, data_status = _a.data_status;
|
|
22
|
+
var isIBANOptional = !iban && (data_status === null || data_status === void 0 ? void 0 : data_status.iban) === FieldType.NON_EDITABLE;
|
|
23
|
+
var isBeneficiaryNameOptional = !beneficiary_name && (data_status === null || data_status === void 0 ? void 0 : data_status.beneficiary_name) === FieldType.NON_EDITABLE;
|
|
24
|
+
return yup.object().shape({
|
|
25
|
+
iban: isIBANOptional
|
|
26
|
+
? yup.string().optional()
|
|
27
|
+
: yup.string().matches(REGEX_IBAN, 'invalid_iban_format').min(15, 'invalid_iban_format').max(34, 'invalid_iban_format').required('alert_iban'),
|
|
28
|
+
bankName: yup.string().optional(),
|
|
29
|
+
beneficiaryName: isBeneficiaryNameOptional
|
|
30
|
+
? yup.string().optional()
|
|
31
|
+
: yup.string().matches(REGEX_ALPHANUMERIC, 'beneficiary_name_invalid').required('beneficiary_name_required'),
|
|
32
|
+
bankStatementId: yup.array().min(1, 'bank_statement_required').required('bank_statement_required'),
|
|
33
|
+
confirmPolicy: yup.boolean().required('alert_bank_confirm').isTrue('alert_bank_confirm')
|
|
34
|
+
});
|
|
35
|
+
};
|
|
@@ -88,14 +88,14 @@ var BrandList = function (_a) {
|
|
|
88
88
|
setValue('brandName', '');
|
|
89
89
|
}
|
|
90
90
|
setValue('segment', segments_list.find(function (_a) {
|
|
91
|
-
var _b;
|
|
91
|
+
var _b, _c;
|
|
92
92
|
var id = _a.id;
|
|
93
|
-
return ((_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.type) === id;
|
|
93
|
+
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.type) === null || _c === void 0 ? void 0 : _c.id) === id;
|
|
94
94
|
}), { shouldValidate: true });
|
|
95
95
|
setValue('teamSize', team_size_list.find(function (_a) {
|
|
96
|
-
var _b;
|
|
96
|
+
var _b, _c;
|
|
97
97
|
var id = _a.id;
|
|
98
|
-
return ((_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.team) === id;
|
|
98
|
+
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.team) === null || _c === void 0 ? void 0 : _c.id) === id;
|
|
99
99
|
}), { shouldValidate: true });
|
|
100
100
|
onCloseBrandList();
|
|
101
101
|
};
|
package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js
CHANGED
|
@@ -64,7 +64,7 @@ var AdditionalIndividualInfo = function (_a) {
|
|
|
64
64
|
var isAuthorizedUser = user === null || user === void 0 ? void 0 : user.is_authorized;
|
|
65
65
|
var _c = data.individualData, occupation = _c.occupation, sourceIncome = _c.sourceIncome, monthlyIncome = _c.monthlyIncome, employerName = _c.employerName, employerLocation = _c.employerLocation, isPEP = _c.isPEP, isInfluencer = _c.isInfluencer, civilID = _c.civilID, signatureFileId = _c.signatureFileId, civilIDUploading = _c.civilIDUploading, signatureFileUploading = _c.signatureFileUploading;
|
|
66
66
|
var methods = useForm({
|
|
67
|
-
resolver: yupResolver(IndividualInfoValidationSchema(isAuthorizedUser, user
|
|
67
|
+
resolver: yupResolver(IndividualInfoValidationSchema(isAuthorizedUser, user)),
|
|
68
68
|
defaultValues: {
|
|
69
69
|
occupation: occupation,
|
|
70
70
|
sourceIncome: sourceIncome,
|
|
@@ -13,18 +13,17 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
|
|
|
13
13
|
});
|
|
14
14
|
});
|
|
15
15
|
var CivilIDFile = function () {
|
|
16
|
-
var _a;
|
|
17
16
|
var t = useTranslation().t;
|
|
18
17
|
var dispatch = useAppDispatch();
|
|
19
18
|
var control = useFormContext().control;
|
|
20
19
|
var civilIDFileIdControl = useController({ name: 'civilID', control: control });
|
|
21
|
-
var
|
|
20
|
+
var loading = useAppSelector(individualSelector).loading;
|
|
22
21
|
var handleCivilIDChange = function (ids) {
|
|
23
22
|
civilIDFileIdControl.field.onChange(ids);
|
|
24
23
|
};
|
|
25
24
|
var handleReset = function (ids) {
|
|
26
25
|
civilIDFileIdControl.field.onChange(ids);
|
|
27
26
|
};
|
|
28
|
-
return (_jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_civil_id'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_civilID'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_civil_id'), onFileUploaded: handleCivilIDChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4,
|
|
27
|
+
return (_jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_civil_id'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_civilID'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_civil_id'), onFileUploaded: handleCivilIDChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, purpose: 'identity_document', fileUploadingStatus: function (uploading) { return dispatch(civilIDUploadingStatus(uploading)); } }) }));
|
|
29
28
|
};
|
|
30
29
|
export default CivilIDFile;
|
|
@@ -75,7 +75,7 @@ var EmployerLocation = React.forwardRef(function (_a, ref) {
|
|
|
75
75
|
};
|
|
76
76
|
var location = employerLocationControl.field.value;
|
|
77
77
|
var error = (_b = employerLocationControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
78
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { required: true, label: t('tap_js_employer_address_city'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_employee_location'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['
|
|
78
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { required: true, label: t('tap_js_employer_address_city'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_employee_location'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
79
79
|
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIconStyled, {})] }));
|
|
80
80
|
} }) }))] })) })));
|
|
81
81
|
});
|
|
@@ -34,8 +34,8 @@ var ShareValue = function (_a) {
|
|
|
34
34
|
var shareValueControl = useController({ control: control, name: 'shareValue' });
|
|
35
35
|
var shareValueValue = shareValueControl.field.value;
|
|
36
36
|
var error = (_b = shareValueControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
37
|
-
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, __assign({ sx: { mt: 2.5 } }, { children: _jsx(Input, { label: t('
|
|
37
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, __assign({ sx: { mt: 2.5 } }, { children: _jsx(Input, { label: t('share_value_label', {
|
|
38
38
|
currency: t(findCurrencyByIso2(countryCode))
|
|
39
|
-
}), onChange: handleChange, value: shareValueValue, sx: { '& .MuiInputBase-input': { cursor: 'auto' } }, placeholder: t('
|
|
39
|
+
}), onChange: handleChange, value: shareValueValue, sx: { '& .MuiInputBase-input': { cursor: 'auto' } }, placeholder: t('share_value_hint'), warningType: 'alert', warningMessage: error && t(error) }) })) })));
|
|
40
40
|
};
|
|
41
41
|
export default React.memo(ShareValue);
|
|
@@ -37,6 +37,6 @@ var SignatureFile = function (_a) {
|
|
|
37
37
|
var handleReset = function (ids) {
|
|
38
38
|
signatureFileIdControl.field.onChange(ids);
|
|
39
39
|
};
|
|
40
|
-
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_signature_file'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_signature'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_signature_file'), onFileUploaded: handleSignatureChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, purpose: 'customer_signature',
|
|
40
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_signature_file'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_signature'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_signature_file'), onFileUploaded: handleSignatureChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, purpose: 'customer_signature', fileUploadingStatus: function (uploading) { return dispatch(signatureFileUploadingStatus(uploading)); } }) }) })));
|
|
41
41
|
};
|
|
42
42
|
export default SignatureFile;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
2
|
import { ObjectShape } from 'yup/lib/object';
|
|
3
|
-
import {
|
|
4
|
-
export declare const IndividualInfoValidationSchema: (isAuthorizedUser: boolean,
|
|
3
|
+
import { User } from '../../../../@types';
|
|
4
|
+
export declare const IndividualInfoValidationSchema: (isAuthorizedUser: boolean, user: User) => yup.ObjectSchema<import("yup/lib/object").Assign<ObjectShape, {
|
|
5
5
|
occupation: import("yup/lib/object").OptionalObjectSchema<ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<ObjectShape>>;
|
|
6
6
|
sourceIncome: import("yup/lib/object").OptionalObjectSchema<ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<ObjectShape>>;
|
|
7
7
|
monthlyIncome: import("yup/lib/object").OptionalObjectSchema<ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<ObjectShape>>;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
2
|
import { IndividualType, FieldType } from '../../../../@types';
|
|
3
|
-
export var IndividualInfoValidationSchema = function (isAuthorizedUser,
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
3
|
+
export var IndividualInfoValidationSchema = function (isAuthorizedUser, user) {
|
|
4
|
+
var _a = user || {}, type = _a.type, data_status = _a.data_status, occupation = _a.occupation, source_income = _a.source_income, is_relative_PEP = _a.is_relative_PEP, is_influencer = _a.is_influencer;
|
|
5
|
+
var isOccupationOptional = !occupation && (data_status === null || data_status === void 0 ? void 0 : data_status.occupation) === FieldType.NON_EDITABLE;
|
|
6
|
+
var isSourceIncomeOptional = !source_income && (data_status === null || data_status === void 0 ? void 0 : data_status.source_of_income) === FieldType.NON_EDITABLE;
|
|
7
|
+
var isPEPOptional = is_relative_PEP === undefined && (data_status === null || data_status === void 0 ? void 0 : data_status.is_relative_PEP) === FieldType.NON_EDITABLE;
|
|
8
|
+
var isInfluencerOptional = is_influencer === undefined && (data_status === null || data_status === void 0 ? void 0 : data_status.is_influencer) === FieldType.NON_EDITABLE;
|
|
8
9
|
return yup.object().shape({
|
|
9
10
|
occupation: type === IndividualType.USER && !isOccupationOptional ? yup.object().required('alert_choose_occupation') : yup.object().optional(),
|
|
10
11
|
sourceIncome: type === IndividualType.USER && !isSourceIncomeOptional ? yup.object().required('choose_any_source_of_income') : yup.object().optional(),
|
|
@@ -14,7 +14,7 @@ import { useTranslation } from 'react-i18next';
|
|
|
14
14
|
import { styled } from '@mui/material/styles';
|
|
15
15
|
import Box from '@mui/material/Box';
|
|
16
16
|
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
17
|
-
import { useAppDispatch,
|
|
17
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
18
18
|
import Text from '../../../../components/Text';
|
|
19
19
|
import Button from '../../../../components/Button';
|
|
20
20
|
import Collapse from '../../../../components/Collapse';
|
|
@@ -48,9 +48,8 @@ export var SubTitleStyled = styled(Text)(function (_a) {
|
|
|
48
48
|
});
|
|
49
49
|
var IndividualList = function () {
|
|
50
50
|
var dispatch = useAppDispatch();
|
|
51
|
-
var isAr = useLanguage().isAr;
|
|
52
51
|
var t = useTranslation().t;
|
|
53
|
-
var
|
|
52
|
+
var error = useAppSelector(individualSelector).error;
|
|
54
53
|
var onBack = function () {
|
|
55
54
|
dispatch(handlePrevScreenStep());
|
|
56
55
|
};
|
|
@@ -25,14 +25,15 @@ import { useTranslation } from 'react-i18next';
|
|
|
25
25
|
import { useController, useFormContext } from 'react-hook-form';
|
|
26
26
|
import { styled } from '@mui/material/styles';
|
|
27
27
|
import CheckIcon from '@mui/icons-material/Check';
|
|
28
|
-
import
|
|
28
|
+
import CircularProgress from '@mui/material/CircularProgress';
|
|
29
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
29
30
|
import Collapse from '../../../../components/Collapse';
|
|
30
31
|
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
31
32
|
import Text from '../../../../components/Text';
|
|
32
33
|
import SimpleList from '../../../../components/SimpleList';
|
|
33
34
|
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
34
35
|
import Input from '../../../shared/Input';
|
|
35
|
-
import { individualSelector } from '../../../app/individual/individualStore';
|
|
36
|
+
import { getCityList, individualSelector } from '../../../app/individual/individualStore';
|
|
36
37
|
var CountryItemContainer = styled(Box)(function () { return ({
|
|
37
38
|
display: 'flex'
|
|
38
39
|
}); });
|
|
@@ -54,16 +55,33 @@ var BirthCity = React.forwardRef(function (_a, ref) {
|
|
|
54
55
|
var _c = React.useState([]), locationCities = _c[0], setCities = _c[1];
|
|
55
56
|
var _d = React.useState(null), anchorEl = _d[0], setAnchorEl = _d[1];
|
|
56
57
|
var t = useTranslation().t;
|
|
57
|
-
var
|
|
58
|
-
var
|
|
58
|
+
var dispatch = useAppDispatch();
|
|
59
|
+
var _e = useFormContext(), control = _e.control, getValues = _e.getValues, setValue = _e.setValue;
|
|
60
|
+
var _f = useAppSelector(individualSelector), data = _f.data, cityLoading = _f.cityLoading;
|
|
59
61
|
var cityList = (data.verify.responseBody || {}).cityList;
|
|
60
62
|
var placeOfBirthCityControl = useController({ control: control, name: 'placeOfBirthCity' });
|
|
63
|
+
var birthCountry = getValues('placeOfBirthCountry');
|
|
61
64
|
React.useEffect(function () {
|
|
65
|
+
var _a;
|
|
62
66
|
if ((cityList === null || cityList === void 0 ? void 0 : cityList.length) > 0) {
|
|
67
|
+
var listCountry = (_a = cityList[0]) === null || _a === void 0 ? void 0 : _a.country;
|
|
68
|
+
if (cityValue && listCountry !== cityValue.country)
|
|
69
|
+
setValue('placeOfBirthCity', undefined);
|
|
63
70
|
var list = __spreadArray([], cityList, true);
|
|
64
71
|
setCities(list);
|
|
65
72
|
}
|
|
66
73
|
}, [cityList]);
|
|
74
|
+
React.useEffect(function () {
|
|
75
|
+
var _a, _b;
|
|
76
|
+
var user = (data.verify.responseBody || {}).user;
|
|
77
|
+
var listCountry = (cityList === null || cityList === void 0 ? void 0 : cityList.length) > 0 ? (_a = cityList[0]) === null || _a === void 0 ? void 0 : _a.country : (_b = user === null || user === void 0 ? void 0 : user.birth) === null || _b === void 0 ? void 0 : _b.country;
|
|
78
|
+
var iso2 = (birthCountry || {}).iso2;
|
|
79
|
+
if (!listCountry || !iso2)
|
|
80
|
+
return;
|
|
81
|
+
if (listCountry !== iso2) {
|
|
82
|
+
dispatch(getCityList(iso2));
|
|
83
|
+
}
|
|
84
|
+
}, [birthCountry]);
|
|
67
85
|
var onOpenCitySelect = function (event) {
|
|
68
86
|
setAnchorEl(event.currentTarget);
|
|
69
87
|
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
@@ -83,7 +101,7 @@ var BirthCity = React.forwardRef(function (_a, ref) {
|
|
|
83
101
|
};
|
|
84
102
|
var cityValue = placeOfBirthCityControl.field.value;
|
|
85
103
|
var error = (_b = placeOfBirthCityControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
86
|
-
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('place_birth_city_label'), readOnly: true, placeholder: t('choose_place_birth_city'), value: getName(cityValue) || '', warningMessage: error && t(error), onClick: !!anchorEl ? function () { return onCloseCitySelect(); } : onOpenCitySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.en'], list: locationCities, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
104
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('place_birth_city_label'), readOnly: true, placeholder: t('choose_place_birth_city'), value: getName(cityValue) || '', warningMessage: error && t(error), onClick: cityLoading ? undefined : !!anchorEl ? function () { return onCloseCitySelect(); } : onOpenCitySelect, endAdornment: cityLoading ? _jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } }) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.en'], list: locationCities, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
87
105
|
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: item.id === (cityValue === null || cityValue === void 0 ? void 0 : cityValue.id) }, { children: getName(item) })) }), item.id === (cityValue === null || cityValue === void 0 ? void 0 : cityValue.id) && _jsx(CheckIconStyled, {})] }));
|
|
88
106
|
} }) }))] })) })));
|
|
89
107
|
});
|
|
@@ -75,7 +75,7 @@ var BirthCountry = React.forwardRef(function (_a, ref) {
|
|
|
75
75
|
};
|
|
76
76
|
var location = placeOfBirthCountryControl.field.value;
|
|
77
77
|
var error = (_b = placeOfBirthCountryControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
78
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('place_of_birth_country_label'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_place_of_birth_country'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['
|
|
78
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('place_of_birth_country_label'), readOnly: true, onClick: !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_place_of_birth_country'), value: (isAr ? (_c = location === null || location === void 0 ? void 0 : location.name) === null || _c === void 0 ? void 0 : _c.arabic : (_d = location === null || location === void 0 ? void 0 : location.name) === null || _d === void 0 ? void 0 : _d.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
79
79
|
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIconStyled, {})] }));
|
|
80
80
|
} }) }))] })) })));
|
|
81
81
|
});
|
|
@@ -22,7 +22,7 @@ import { IndividualType } from '../../../../@types';
|
|
|
22
22
|
import Form from '../../../../components/Form';
|
|
23
23
|
import Collapse from '../../../../components/Collapse';
|
|
24
24
|
import Text from '../../../../components/Text';
|
|
25
|
-
import { individualSelector, updateIndividualPersonalInfo } from '../../../app/individual/individualStore';
|
|
25
|
+
import { clearError, individualSelector, updateIndividualPersonalInfo } from '../../../app/individual/individualStore';
|
|
26
26
|
import Button from '../../../shared/Button';
|
|
27
27
|
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
28
28
|
import { IndividualInfoValidationSchema } from './validation';
|
|
@@ -56,7 +56,7 @@ var IndividualPersonalInfo = function (_a) {
|
|
|
56
56
|
var t = useTranslation().t;
|
|
57
57
|
var isAr = useLanguage().isAr;
|
|
58
58
|
var dispatch = useAppDispatch();
|
|
59
|
-
var _b = useAppSelector(individualSelector), data = _b.data, loading = _b.loading, error = _b.error;
|
|
59
|
+
var _b = useAppSelector(individualSelector), data = _b.data, loading = _b.loading, error = _b.error, cityLoading = _b.cityLoading;
|
|
60
60
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
61
61
|
var countries = settingsData.countries;
|
|
62
62
|
var verify = data.verify, individualPersonalData = data.individualPersonalData;
|
|
@@ -87,7 +87,13 @@ var IndividualPersonalInfo = function (_a) {
|
|
|
87
87
|
var onSubmit = function (data) {
|
|
88
88
|
dispatch(updateIndividualPersonalInfo(data));
|
|
89
89
|
};
|
|
90
|
+
React.useEffect(function () {
|
|
91
|
+
if (error)
|
|
92
|
+
dispatch(clearError());
|
|
93
|
+
}, [methods.formState.isValid]);
|
|
90
94
|
var onBack = function () {
|
|
95
|
+
if (error)
|
|
96
|
+
dispatch(clearError());
|
|
91
97
|
dispatch(handleCurrentActiveScreen('INDIVIDUAL_LIST_STEP'));
|
|
92
98
|
};
|
|
93
99
|
var handleMenuClick = function (flag) {
|
|
@@ -114,7 +120,7 @@ var IndividualPersonalInfo = function (_a) {
|
|
|
114
120
|
return t('type_board_member');
|
|
115
121
|
return t('type_user');
|
|
116
122
|
};
|
|
117
|
-
var disabled = !methods.formState.isValid;
|
|
123
|
+
var disabled = !methods.formState.isValid || cityLoading;
|
|
118
124
|
var showField = !listActive && !dobActive && !expiryDateActive;
|
|
119
125
|
var isIssuedCountryListActive = listActive === ListType.IssuedCountryList;
|
|
120
126
|
var isBirthCountryListActive = listActive === ListType.BirthCountryList;
|
|
@@ -81,7 +81,7 @@ var IssuedCountry = React.forwardRef(function (_a, ref) {
|
|
|
81
81
|
};
|
|
82
82
|
var location = issuedCountryControl.field.value;
|
|
83
83
|
var error = (_d = issuedCountryControl.fieldState.error) === null || _d === void 0 ? void 0 : _d.message;
|
|
84
|
-
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('issued_country_label'), readOnly: true, disabled: disabled, onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_issued_country'), value: (isAr ? (_e = location === null || location === void 0 ? void 0 : location.name) === null || _e === void 0 ? void 0 : _e.arabic : (_f = location === null || location === void 0 ? void 0 : location.name) === null || _f === void 0 ? void 0 : _f.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['
|
|
84
|
+
return (_jsx(Collapse, __assign({ in: rest.show }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { pt: 2.5 } }, { children: [_jsx(Input, { label: t('issued_country_label'), readOnly: true, disabled: disabled, onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseCountrySelect(); } : onOpenCountrySelect, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_issued_country'), value: (isAr ? (_e = location === null || location === void 0 ? void 0 : location.name) === null || _e === void 0 ? void 0 : _e.arabic : (_f = location === null || location === void 0 ? void 0 : location.name) === null || _f === void 0 ? void 0 : _f.english) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.english', searchValuePath: ['name.arabic', 'name.english'], list: locationCountries, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
85
85
|
return (_jsxs(_Fragment, { children: [_jsx(CountryItemContainer, { children: _jsx(CountryNameText, __assign({ isSelected: (item === null || item === void 0 ? void 0 : item.idd_prefix) === (location === null || location === void 0 ? void 0 : location.idd_prefix) }, { children: isAr ? item.name.arabic : item.name.english })) }), item.idd_prefix === (location === null || location === void 0 ? void 0 : location.idd_prefix) && _jsx(CheckIconStyled, {})] }));
|
|
86
86
|
} }) }))] })) })));
|
|
87
87
|
});
|