@tap-payments/auth-jsconnect 2.4.14-test → 2.4.16-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.
Files changed (38) hide show
  1. package/build/@types/app.d.ts +28 -1
  2. package/build/features/app/individual/individualStore.js +8 -5
  3. package/build/features/entity/screens/EntityCapital/EntityCapital.js +7 -7
  4. package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js +28 -21
  5. package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js +10 -4
  6. package/build/features/individual/screens/AdditionalIndividualInfo/InfluencerSwitch.d.ts +2 -1
  7. package/build/features/individual/screens/AdditionalIndividualInfo/InfluencerSwitch.js +13 -10
  8. package/build/features/individual/screens/AdditionalIndividualInfo/MonthlyIncome.js +14 -19
  9. package/build/features/individual/screens/AdditionalIndividualInfo/Occupation.d.ts +1 -0
  10. package/build/features/individual/screens/AdditionalIndividualInfo/Occupation.js +9 -18
  11. package/build/features/individual/screens/AdditionalIndividualInfo/PEPSwitch.d.ts +2 -1
  12. package/build/features/individual/screens/AdditionalIndividualInfo/PEPSwitch.js +12 -9
  13. package/build/features/individual/screens/AdditionalIndividualInfo/SignatureFile.js +9 -3
  14. package/build/features/individual/screens/AdditionalIndividualInfo/SourceOfIncome.js +14 -18
  15. package/build/features/individual/screens/IndividualPersonalInfo/BirthCity.d.ts +1 -0
  16. package/build/features/individual/screens/IndividualPersonalInfo/BirthCity.js +5 -13
  17. package/build/features/individual/screens/IndividualPersonalInfo/BirthCountry.d.ts +1 -0
  18. package/build/features/individual/screens/IndividualPersonalInfo/BirthCountry.js +5 -13
  19. package/build/features/individual/screens/IndividualPersonalInfo/DOB.d.ts +2 -1
  20. package/build/features/individual/screens/IndividualPersonalInfo/DOB.js +2 -2
  21. package/build/features/individual/screens/IndividualPersonalInfo/Email.d.ts +2 -1
  22. package/build/features/individual/screens/IndividualPersonalInfo/Email.js +3 -8
  23. package/build/features/individual/screens/IndividualPersonalInfo/ExpiryDate.d.ts +2 -1
  24. package/build/features/individual/screens/IndividualPersonalInfo/ExpiryDate.js +2 -3
  25. package/build/features/individual/screens/IndividualPersonalInfo/Gender.d.ts +2 -1
  26. package/build/features/individual/screens/IndividualPersonalInfo/Gender.js +3 -2
  27. package/build/features/individual/screens/IndividualPersonalInfo/ID.d.ts +2 -1
  28. package/build/features/individual/screens/IndividualPersonalInfo/ID.js +3 -5
  29. package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.js +58 -20
  30. package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.d.ts +1 -0
  31. package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.js +6 -15
  32. package/build/features/individual/screens/IndividualPersonalInfo/MobileNumber.d.ts +1 -0
  33. package/build/features/individual/screens/IndividualPersonalInfo/MobileNumber.js +5 -8
  34. package/build/features/individual/screens/IndividualPersonalInfo/Name.d.ts +2 -1
  35. package/build/features/individual/screens/IndividualPersonalInfo/Name.js +3 -10
  36. package/build/features/individual/screens/IndividualPersonalInfo/Nationality.d.ts +1 -0
  37. package/build/features/individual/screens/IndividualPersonalInfo/Nationality.js +6 -15
  38. package/package.json +1 -1
@@ -404,7 +404,8 @@ export declare type EntityDataStatus = {
404
404
  };
405
405
  export declare type IndividualDataStatus = {
406
406
  status: FieldType;
407
- name: FieldType;
407
+ 'name.en': FieldType;
408
+ 'name.ar': FieldType;
408
409
  'contact.email': FieldType;
409
410
  'contact.phone.number': FieldType;
410
411
  'contact.phone.country_code': FieldType;
@@ -425,6 +426,7 @@ export declare type IndividualDataStatus = {
425
426
  monthly_income: FieldType;
426
427
  is_relative_PEP: FieldType;
427
428
  is_influencer: FieldType;
429
+ gender: FieldType;
428
430
  };
429
431
  export declare type BrandDataStatus = {
430
432
  status: FieldType;
@@ -550,4 +552,29 @@ export declare type EntityDataVerification = {
550
552
  taxable: string;
551
553
  type: string;
552
554
  };
555
+ export declare type IndividualDataVerification = {
556
+ 'birth.city': string;
557
+ 'birth.country': string;
558
+ 'birth.date': string;
559
+ 'contact.email': string;
560
+ 'contact.phone.country_code': string;
561
+ 'contact.phone.number': string;
562
+ employer_city: string;
563
+ employer_country: string;
564
+ employer_name: string;
565
+ gender: string;
566
+ 'identification.expiry': string;
567
+ 'identification.id': string;
568
+ 'identification.issuer_country': string;
569
+ 'identification.type': string;
570
+ is_authorized: string;
571
+ is_influencer: string;
572
+ is_relative_PEP: string;
573
+ 'name.en': string;
574
+ 'name.ar': string;
575
+ nationality: string;
576
+ occupation: string;
577
+ relation: string;
578
+ status: string;
579
+ };
553
580
  export {};
@@ -544,7 +544,7 @@ export var updatePhoneInfo = createAsyncThunk('individual/updatePhoneInfo', func
544
544
  export var updateIndividualPersonalInfo = createAsyncThunk('individual/updateIndividualPersonalInfo', function (_a, thunkApi) {
545
545
  var formData = _a.formData, originalFormData = _a.originalFormData;
546
546
  return __awaiter(void 0, void 0, void 0, function () {
547
- var _b, settings, individual, _c, notification, user, entity, _d, id, type, name, email, mobile, countryCode, gender, nid, issuedCountry, expiryDate, dob, placeOfBirthCountry, placeOfBirthCity, nationality, code, data_status, userName, identification_id_type, isNameNonEditable, isEmailNonEditable, isMobileNumberNonEditable, isMobileCountryNonEditable, isNidNonEditable, isIssuedCountryNonEditable, isExpiryNonEditable, isIdTypeNonEditable, isNationalityNonEditable, isDOBNonEditable, isBirthCityNonEditable, isBirthCountryNonEditable, hasContact, hasPhone, hasIdentification, hasBirth, contact, requestBody, data;
547
+ var _b, settings, individual, _c, notification, user, entity, _d, id, type, name, email, mobile, countryCode, gender, nid, issuedCountry, expiryDate, dob, placeOfBirthCountry, placeOfBirthCity, nationality, code, data_status, userName, identification_id_type, isGenderNonEditable, isNameENNonEditable, isNameARNonEditable, isEmailNonEditable, isMobileNumberNonEditable, isMobileCountryNonEditable, isNidNonEditable, isIssuedCountryNonEditable, isExpiryNonEditable, isIdTypeNonEditable, isNationalityNonEditable, isDOBNonEditable, isBirthCityNonEditable, isBirthCountryNonEditable, hasContact, hasPhone, hasIdentification, hasBirth, nameIsEditable, contact, requestBody, data;
548
548
  var _e, _f, _g, _h, _j;
549
549
  return __generator(this, function (_k) {
550
550
  switch (_k.label) {
@@ -557,7 +557,9 @@ export var updateIndividualPersonalInfo = createAsyncThunk('individual/updateInd
557
557
  data_status = (user || {}).data_status;
558
558
  userName = getUserNameObject(name);
559
559
  identification_id_type = nid ? (nid.startsWith('1') ? IDENTIFICATION_TYPE.NID : IDENTIFICATION_TYPE.IQAMA) : undefined;
560
- isNameNonEditable = hasNoneEditableValue(data_status, 'name');
560
+ isGenderNonEditable = hasNoneEditableValue(data_status, 'gender');
561
+ isNameENNonEditable = hasNoneEditableValue(data_status, 'name.en');
562
+ isNameARNonEditable = hasNoneEditableValue(data_status, 'name.ar');
561
563
  isEmailNonEditable = hasNoneEditableValue(data_status === null || data_status === void 0 ? void 0 : data_status.contact, 'email');
562
564
  isMobileNumberNonEditable = hasNoneEditableValue((_e = data_status === null || data_status === void 0 ? void 0 : data_status.contact) === null || _e === void 0 ? void 0 : _e.phone, 'number');
563
565
  isMobileCountryNonEditable = hasNoneEditableValue((_f = data_status === null || data_status === void 0 ? void 0 : data_status.contact) === null || _f === void 0 ? void 0 : _f.phone, 'country_code');
@@ -573,6 +575,7 @@ export var updateIndividualPersonalInfo = createAsyncThunk('individual/updateInd
573
575
  hasPhone = mobile && (countryCode === null || countryCode === void 0 ? void 0 : countryCode.idd_prefix);
574
576
  hasIdentification = nid || issuedCountry || identification_id_type || expiryDate;
575
577
  hasBirth = placeOfBirthCity || placeOfBirthCountry;
578
+ nameIsEditable = userName.first && !(isNameENNonEditable && isNameARNonEditable);
576
579
  contact = hasContact && !(isEmailNonEditable && isMobileCountryNonEditable && isMobileNumberNonEditable)
577
580
  ? __assign({ email: isEmailNonEditable ? undefined : email }, (!((isMobileCountryNonEditable && isMobileNumberNonEditable) || !hasPhone) && {
578
581
  phone: {
@@ -580,10 +583,10 @@ export var updateIndividualPersonalInfo = createAsyncThunk('individual/updateInd
580
583
  number: isMobileNumberNonEditable || !mobile ? undefined : mobile
581
584
  }
582
585
  })) : undefined;
583
- requestBody = __assign(__assign(__assign(__assign(__assign(__assign(__assign({ id: id, type: type, gender: gender || undefined }, (!(isNameNonEditable || !userName.first) && {
586
+ requestBody = __assign(__assign(__assign(__assign(__assign(__assign(__assign({ id: id, type: type, gender: isGenderNonEditable || !gender ? undefined : gender }, (nameIsEditable && {
584
587
  names: {
585
- en: userName,
586
- ar: userName
588
+ en: isNameENNonEditable ? undefined : userName,
589
+ ar: isNameARNonEditable ? undefined : userName
587
590
  }
588
591
  })), { contact: contact }), (hasIdentification &&
589
592
  !(isNidNonEditable && isIssuedCountryNonEditable && isExpiryNonEditable && isIdTypeNonEditable) && {
@@ -33,15 +33,15 @@ var FormStyled = styled(Form)(function () { return ({
33
33
  flexDirection: 'column'
34
34
  }); });
35
35
  var EntityCapital = function (_a) {
36
- var _b, _c, _d, _e, _f;
37
- var _g = React.useState(false), anchorEl = _g[0], setAnchorEl = _g[1];
38
- var _h = useAppSelector(entitySelector), data = _h.data, loading = _h.loading, error = _h.error, uploading = _h.uploading;
36
+ var _b, _c, _d, _e, _f, _g;
37
+ var _h = React.useState(false), anchorEl = _h[0], setAnchorEl = _h[1];
38
+ var _j = useAppSelector(entitySelector), data = _j.data, loading = _j.loading, error = _j.error, uploading = _j.uploading;
39
39
  var isAr = useLanguage().isAr;
40
40
  var t = useTranslation().t;
41
41
  var dispatch = useAppDispatch();
42
- var _j = data.entityCapitalData, responseBody = _j.responseBody, capitalPaid = _j.capitalPaid, capitalShareCount = _j.capitalShareCount, capitalShareValue = _j.capitalShareValue, activities = _j.activities;
42
+ var _k = data.entityCapitalData, responseBody = _k.responseBody, capitalPaid = _k.capitalPaid, capitalShareCount = _k.capitalShareCount, capitalShareValue = _k.capitalShareValue, activities = _k.activities;
43
43
  var entity = (data.verify.responseBody || {}).entity;
44
- var _k = entity || {}, data_verification = _k.data_verification, capital = _k.capital;
44
+ var _l = entity || {}, data_verification = _l.data_verification, capital = _l.capital;
45
45
  var methods = useForm({
46
46
  resolver: yupResolver(EntityCapitalValidationSchema()),
47
47
  defaultValues: {
@@ -65,8 +65,8 @@ var EntityCapital = function (_a) {
65
65
  var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
66
66
  var dataVerified = useDataVerified(data_verification, ['capital.paid', 'capital.shares.count', 'capital.shares.value']);
67
67
  var isCapitalPaidVerified = dataVerified['capital.paid'] && ((_b = capital === null || capital === void 0 ? void 0 : capital.paid) === null || _b === void 0 ? void 0 : _b.toString()) === removeAllCharsFromNumber(watch('capitalPaid'));
68
- var isCapitalShareCountVerified = dataVerified['capital.shares.count'] && ((_d = (_c = capital === null || capital === void 0 ? void 0 : capital.shares) === null || _c === void 0 ? void 0 : _c.count) === null || _d === void 0 ? void 0 : _d.toString()) === watch('capitalShareCount');
69
- var isCapitalShareValueVerified = dataVerified['capital.shares.value'] && ((_f = (_e = capital === null || capital === void 0 ? void 0 : capital.shares) === null || _e === void 0 ? void 0 : _e.value) === null || _f === void 0 ? void 0 : _f.toString()) === removeAllCharsFromNumber(watch('capitalShareValue'));
68
+ var isCapitalShareCountVerified = dataVerified['capital.shares.count'] && ((_d = (_c = capital === null || capital === void 0 ? void 0 : capital.shares) === null || _c === void 0 ? void 0 : _c.count) === null || _d === void 0 ? void 0 : _d.toString()) === ((_e = watch('capitalShareCount')) === null || _e === void 0 ? void 0 : _e.toString());
69
+ var isCapitalShareValueVerified = dataVerified['capital.shares.value'] && ((_g = (_f = capital === null || capital === void 0 ? void 0 : capital.shares) === null || _f === void 0 ? void 0 : _f.value) === null || _g === void 0 ? void 0 : _g.toString()) === removeAllCharsFromNumber(watch('capitalShareValue'));
70
70
  var onSubmit = function (data) {
71
71
  dispatch(updateEntityCapital(getFelids(data)));
72
72
  };
@@ -17,7 +17,7 @@ import { useTranslation } from 'react-i18next';
17
17
  import { handleCurrentActiveScreen, settingsSelector } from '../../../../app/settings';
18
18
  import Box from '@mui/material/Box';
19
19
  import { alpha, styled } from '@mui/material/styles';
20
- import { useAppDispatch, useAppSelector, useSetFromDefaultValues, useLanguage, useFormReadOnly, useDataNoneEditable, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids } from '../../../../hooks';
20
+ import { useAppDispatch, useAppSelector, useSetFromDefaultValues, useLanguage, useFormReadOnly, useDataNoneEditable, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
21
21
  import { DocumentPurpose, IndividualType } from '../../../../@types';
22
22
  import { isSA } from '../../../../utils';
23
23
  import Form from '../../../../components/Form';
@@ -52,14 +52,16 @@ var ListType;
52
52
  ListType["OccupationList"] = "OccupationList";
53
53
  })(ListType || (ListType = {}));
54
54
  var AdditionalIndividualInfo = function (_a) {
55
+ var _b;
55
56
  var t = useTranslation().t;
56
57
  var isAr = useLanguage().isAr;
57
58
  var dispatch = useAppDispatch();
58
- var _b = useAppSelector(individualSelector), data = _b.data, loading = _b.loading, error = _b.error;
59
+ var _c = useAppSelector(individualSelector), data = _c.data, loading = _c.loading, error = _c.error;
59
60
  var settingsData = useAppSelector(settingsSelector).data;
60
61
  var verify = data.verify;
61
62
  var user = (verify.responseBody || {}).user;
62
- 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, shareCount = _c.shareCount, shareValue = _c.shareValue;
63
+ var _d = data.individualData, occupation = _d.occupation, sourceIncome = _d.sourceIncome, monthlyIncome = _d.monthlyIncome, employerName = _d.employerName, employerLocation = _d.employerLocation, isPEP = _d.isPEP, isInfluencer = _d.isInfluencer, civilID = _d.civilID, signatureFileId = _d.signatureFileId, civilIDUploading = _d.civilIDUploading, signatureFileUploading = _d.signatureFileUploading, shareCount = _d.shareCount, shareValue = _d.shareValue;
64
+ var _e = user || {}, type = _e.type, documents = _e.documents, is_authorized = _e.is_authorized, data_status = _e.data_status, data_verification = _e.data_verification, names = _e.names, role = _e.role, occupationRes = _e.occupation, is_relative_PEP = _e.is_relative_PEP, is_influencer = _e.is_influencer;
63
65
  var methods = useForm({
64
66
  resolver: yupResolver(IndividualInfoValidationSchema(user === null || user === void 0 ? void 0 : user.type)),
65
67
  defaultValues: {
@@ -80,15 +82,16 @@ var AdditionalIndividualInfo = function (_a) {
80
82
  mode: 'onChange'
81
83
  });
82
84
  useSetFromDefaultValues(methods, data.individualData, true);
83
- var defaultCivilIdFiles = React.useMemo(function () { return getFileDetailsFromDocument(user === null || user === void 0 ? void 0 : user.documents, DocumentPurpose.IDENTITY_DOCUMENT); }, [user === null || user === void 0 ? void 0 : user.documents]);
84
- var defaultSignatureFiles = React.useMemo(function () { return getFileDetailsFromDocument(user === null || user === void 0 ? void 0 : user.documents, DocumentPurpose.CUSTOMER_SIGNATURE); }, [user === null || user === void 0 ? void 0 : user.documents]);
85
+ var watch = methods.watch;
86
+ var defaultCivilIdFiles = React.useMemo(function () { return getFileDetailsFromDocument(documents, DocumentPurpose.IDENTITY_DOCUMENT); }, [documents]);
87
+ var defaultSignatureFiles = React.useMemo(function () { return getFileDetailsFromDocument(documents, DocumentPurpose.CUSTOMER_SIGNATURE); }, [documents]);
85
88
  var originalReadOnly = useFormReadOnly(methods, {
86
89
  isPEP: typeof isPEP === 'boolean',
87
90
  isInfluencer: typeof isInfluencer === 'boolean',
88
91
  civilID: defaultCivilIdFiles,
89
92
  signatureFileId: defaultSignatureFiles
90
93
  });
91
- var noneEditable = useDataNoneEditable(user === null || user === void 0 ? void 0 : user.data_status, [
94
+ var noneEditable = useDataNoneEditable(data_status, [
92
95
  'occupation',
93
96
  'source_of_income',
94
97
  'monthly_income',
@@ -97,7 +100,11 @@ var AdditionalIndividualInfo = function (_a) {
97
100
  ]);
98
101
  var readOnly = useFormErrorAndUpdateReadOnly(methods, originalReadOnly, noneEditable);
99
102
  var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
100
- var _d = React.useState(), listActive = _d[0], setListActive = _d[1];
103
+ var dataVerified = useDataVerified(data_verification, ['occupation', 'is_relative_PEP', 'is_influencer']);
104
+ var isOccupationVerified = dataVerified['occupation'] && (occupationRes === null || occupationRes === void 0 ? void 0 : occupationRes.id) === ((_b = watch('occupation')) === null || _b === void 0 ? void 0 : _b.id);
105
+ var isPEPSwitchVerified = dataVerified['is_relative_PEP'] && is_relative_PEP === watch('isPEP');
106
+ var isInfluencerSwitchVerified = dataVerified['is_influencer'] && is_influencer === watch('isInfluencer');
107
+ var _f = React.useState(), listActive = _f[0], setListActive = _f[1];
101
108
  var isSACountry = React.useMemo(function () { return isSA(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
102
109
  var onSubmit = function (data) {
103
110
  dispatch(updateIndividualInfo(getFelids(data)));
@@ -109,31 +116,31 @@ var AdditionalIndividualInfo = function (_a) {
109
116
  setListActive(flag);
110
117
  };
111
118
  var getUserName = function () {
112
- var _a, _b, _c, _d;
113
- var name = isAr ? (_b = (_a = user === null || user === void 0 ? void 0 : user.names) === null || _a === void 0 ? void 0 : _a.ar) === null || _b === void 0 ? void 0 : _b.first : (_d = (_c = user === null || user === void 0 ? void 0 : user.names) === null || _c === void 0 ? void 0 : _c.en) === null || _d === void 0 ? void 0 : _d.first;
119
+ var _a, _b;
120
+ var name = isAr ? (_a = names === null || names === void 0 ? void 0 : names.ar) === null || _a === void 0 ? void 0 : _a.first : (_b = names === null || names === void 0 ? void 0 : names.en) === null || _b === void 0 ? void 0 : _b.first;
114
121
  return name;
115
122
  };
116
123
  var getUserRole = function () {
117
- var _a, _b, _c, _d, _e;
118
- if ((((_a = user === null || user === void 0 ? void 0 : user.role) === null || _a === void 0 ? void 0 : _a.length) || 0) > 0)
119
- return isAr ? (_c = (_b = user.role[0]) === null || _b === void 0 ? void 0 : _b.name) === null || _c === void 0 ? void 0 : _c.ar : (_e = (_d = user.role[0]) === null || _d === void 0 ? void 0 : _d.name) === null || _e === void 0 ? void 0 : _e.en;
120
- if ((user === null || user === void 0 ? void 0 : user.type) === IndividualType.SHARE_HOLDER)
124
+ var _a, _b, _c, _d;
125
+ if (((role === null || role === void 0 ? void 0 : role.length) || 0) > 0)
126
+ return isAr ? (_b = (_a = user.role[0]) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.ar : (_d = (_c = user.role[0]) === null || _c === void 0 ? void 0 : _c.name) === null || _d === void 0 ? void 0 : _d.en;
127
+ if (type === IndividualType.SHARE_HOLDER)
121
128
  return t('type_share_holder');
122
- if ((user === null || user === void 0 ? void 0 : user.type) === IndividualType.BOARD_MEMBER)
129
+ if (type === IndividualType.BOARD_MEMBER)
123
130
  return t('type_board_member');
124
131
  return t('type_user');
125
132
  };
126
- var showSignatureFile = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.USER || (user === null || user === void 0 ? void 0 : user.type) === IndividualType.BUYER;
127
- var showOccupationFile = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.USER || (user === null || user === void 0 ? void 0 : user.type) === IndividualType.BUYER;
128
- var showSourceOfIncome = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.USER || (user === null || user === void 0 ? void 0 : user.type) === IndividualType.BUYER;
129
- var showIsPEP = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.USER || (user === null || user === void 0 ? void 0 : user.type) === IndividualType.BOARD_MEMBER;
130
- var showIsInfluencer = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.USER || (user === null || user === void 0 ? void 0 : user.type) === IndividualType.BOARD_MEMBER;
131
- var showShares = (user === null || user === void 0 ? void 0 : user.type) === IndividualType.SHARE_HOLDER;
133
+ var showSignatureFile = type === IndividualType.USER || type === IndividualType.BUYER;
134
+ var showOccupationFile = type === IndividualType.USER || type === IndividualType.BUYER;
135
+ var showSourceOfIncome = type === IndividualType.USER || type === IndividualType.BUYER;
136
+ var showIsPEP = type === IndividualType.USER || type === IndividualType.BOARD_MEMBER;
137
+ var showIsInfluencer = type === IndividualType.USER || type === IndividualType.BOARD_MEMBER;
138
+ var showShares = type === IndividualType.SHARE_HOLDER;
132
139
  var isSourceOfIncomeListActive = listActive === ListType.SourceOfIncomeList;
133
140
  var isMonthlyIncomeListActive = listActive === ListType.MonthlyIncomeList;
134
141
  var isOccupationListActive = listActive === ListType.OccupationList;
135
142
  var disabled = !methods.formState.isValid || civilIDUploading || signatureFileUploading;
136
- return (_jsxs(ScreenContainer, { children: [_jsx(Collapse, __assign({ in: !listActive && !!(user === null || user === void 0 ? void 0 : user.is_authorized), timeout: 500 }, { children: _jsxs(TextBoxStyled, { children: [getUserName() || '', _jsx(RoleTextStyled, { children: getUserRole() || '' })] }) })), _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { readOnly: readOnly['occupation'] || noneEditable['occupation'], onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: showOccupationFile && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { readOnly: readOnly['sourceIncome'] || noneEditable['source_of_income'], onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: showSourceOfIncome && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { readOnly: readOnly['monthlyIncome'] || noneEditable['monthly_income'], show: showSourceOfIncome && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(ShareCount, { show: !listActive && showShares, readOnly: readOnly['shareCount'] }), _jsx(ShareValue, { show: !listActive && showShares, readOnly: readOnly['shareValue'] }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, { show: !isSACountry, readOnly: readOnly['civilID'], defaultFiles: defaultCivilIdFiles }), _jsx(SignatureFile, { show: (user === null || user === void 0 ? void 0 : user.is_authorized) && showSignatureFile, readOnly: readOnly['signatureFileId'], defaultFiles: defaultSignatureFiles })] })), _jsx(PEPSwitch, { show: showIsPEP && !listActive, readOnly: readOnly['isPEP'] || noneEditable['is_relative_PEP'] }), _jsx(InfluencerSwitch, { show: showIsInfluencer && !listActive, readOnly: readOnly['isInfluencer'] || noneEditable['is_influencer'] })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) }))] }));
143
+ return (_jsxs(ScreenContainer, { children: [_jsx(Collapse, __assign({ in: !listActive && !!is_authorized, timeout: 500 }, { children: _jsxs(TextBoxStyled, { children: [getUserName() || '', _jsx(RoleTextStyled, { children: getUserRole() || '' })] }) })), _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { isVerified: isOccupationVerified, readOnly: readOnly['occupation'] || noneEditable['occupation'], onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: showOccupationFile && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { readOnly: readOnly['sourceIncome'] || noneEditable['source_of_income'], onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: showSourceOfIncome && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { readOnly: readOnly['monthlyIncome'] || noneEditable['monthly_income'], show: showSourceOfIncome && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(ShareCount, { show: !listActive && showShares, readOnly: readOnly['shareCount'] }), _jsx(ShareValue, { show: !listActive && showShares, readOnly: readOnly['shareValue'] }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, { show: !isSACountry, readOnly: readOnly['civilID'], defaultFiles: defaultCivilIdFiles }), _jsx(SignatureFile, { show: is_authorized && showSignatureFile, readOnly: readOnly['signatureFileId'], defaultFiles: defaultSignatureFiles })] })), _jsx(PEPSwitch, { show: showIsPEP && !listActive, readOnly: readOnly['isPEP'] || noneEditable['is_relative_PEP'], isVerified: isPEPSwitchVerified }), _jsx(InfluencerSwitch, { show: showIsInfluencer && !listActive, readOnly: readOnly['isInfluencer'] || noneEditable['is_influencer'], isVerified: isInfluencerSwitchVerified })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) }))] }));
137
144
  };
138
145
  export default React.memo(AdditionalIndividualInfo);
139
146
  AdditionalIndividualInfo.defaultProps = {};
@@ -10,16 +10,18 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
- import { ScreenContainer } from '../../../../features/shared/Containers';
14
- import { styled } from '@mui/material/styles';
13
+ import React from 'react';
15
14
  import { useTranslation } from 'react-i18next';
16
15
  import { useController, useFormContext } from 'react-hook-form';
16
+ import { styled } from '@mui/material/styles';
17
17
  import { useAppDispatch, useAppSelector } from '../../../../hooks';
18
18
  import { DocumentPurpose } from '../../../../@types';
19
19
  import { FileType } from '../../../../constants';
20
+ import { hasVerifiedValue } from '../../../../utils';
20
21
  import Collapse from '../../../../components/Collapse';
21
22
  import { civilIDUploadingStatus, clearError, individualSelector } from '../../../app/individual/individualStore';
22
23
  import UploadMultipleFile from '../../../shared/UploadMultipleFile';
24
+ import { ScreenContainer } from '../../../shared/Containers';
23
25
  var FeatureStyled = styled(ScreenContainer)(function (_a) {
24
26
  var theme = _a.theme;
25
27
  return ({
@@ -27,12 +29,16 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
27
29
  });
28
30
  });
29
31
  var CivilIDFile = function (_a) {
32
+ var _b;
30
33
  var defaultFiles = _a.defaultFiles, readOnly = _a.readOnly, show = _a.show;
31
34
  var t = useTranslation().t;
32
35
  var dispatch = useAppDispatch();
33
36
  var control = useFormContext().control;
34
37
  var civilIDFileIdControl = useController({ name: 'civilID', control: control });
35
- var _b = useAppSelector(individualSelector), loading = _b.loading, error = _b.error;
38
+ var _c = useAppSelector(individualSelector), loading = _c.loading, error = _c.error, data = _c.data;
39
+ var data_verification = (((_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.user) || {}).data_verification;
40
+ var uploadedIds = civilIDFileIdControl.field.value;
41
+ var isDocumentVerified = React.useMemo(function () { var _a; return !!((_a = defaultFiles === null || defaultFiles === void 0 ? void 0 : defaultFiles[0]) === null || _a === void 0 ? void 0 : _a.docId) && hasVerifiedValue(data_verification, "documents.".concat(defaultFiles[0].docId)); }, [data_verification]);
36
42
  var handleCivilIDChange = function (ids) {
37
43
  if (error)
38
44
  dispatch(clearError());
@@ -43,6 +49,6 @@ var CivilIDFile = function (_a) {
43
49
  dispatch(clearError());
44
50
  civilIDFileIdControl.field.onChange(ids);
45
51
  };
46
- return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { readOnly: readOnly, id: 'civilID', control: control, 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, defaultFiles: defaultFiles, purpose: DocumentPurpose.IDENTITY_DOCUMENT, fileUploadingStatus: function (uploading) { return dispatch(civilIDUploadingStatus(uploading)); }, fileType: FileType.IMAGES }) }) })));
52
+ return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { readOnly: readOnly, id: 'civilID', control: control, 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, defaultFiles: defaultFiles, purpose: DocumentPurpose.IDENTITY_DOCUMENT, fileUploadingStatus: function (uploading) { return dispatch(civilIDUploadingStatus(uploading)); }, fileType: FileType.IMAGES, isVerified: !(uploadedIds === null || uploadedIds === void 0 ? void 0 : uploadedIds.length) && isDocumentVerified }) }) })));
47
53
  };
48
54
  export default CivilIDFile;
@@ -2,6 +2,7 @@ import * as React from 'react';
2
2
  export interface InfluencerSwitchProps {
3
3
  show: boolean;
4
4
  readOnly?: boolean;
5
+ isVerified?: boolean;
5
6
  }
6
- declare const _default: React.MemoExoticComponent<({ show, readOnly }: InfluencerSwitchProps) => JSX.Element>;
7
+ declare const _default: React.MemoExoticComponent<({ show, readOnly, isVerified }: InfluencerSwitchProps) => JSX.Element>;
7
8
  export default _default;
@@ -13,18 +13,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import * as React from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { useFormContext, useController } from 'react-hook-form';
16
- import { ScreenContainer } from '../../../shared/Containers';
17
- import Collapse from '../../../../components/Collapse';
16
+ import Box from '@mui/material/Box';
18
17
  import { useAppDispatch, useAppSelector } from '../../../../hooks';
19
- import { styled, alpha } from '@mui/material/styles';
20
- import Mandatory from '../../../shared/Mandatory';
18
+ import Collapse from '../../../../components/Collapse';
19
+ import Tooltip from '../../../../components/Tooltip';
21
20
  import Text from '../../../../components/Text';
22
21
  import RadioGroup from '../../../../components/RadioGroup';
23
22
  import RadioLabel from '../../../../components/RadioLabel';
24
- import { InfoIconStyled, InfoOutlinedIconStyled } from './PEPSwitch';
25
- import Box from '@mui/material/Box';
26
- import Tooltip from '../../../../components/Tooltip';
23
+ import { styled, alpha } from '@mui/material/styles';
24
+ import Mandatory from '../../../shared/Mandatory';
25
+ import CheckIcon from '../../../shared/CheckIcon';
26
+ import { ScreenContainer } from '../../../shared/Containers';
27
27
  import { individualSelector, clearError } from '../../../app/individual/individualStore';
28
+ import { InfoIconStyled, InfoOutlinedIconStyled } from './PEPSwitch';
28
29
  var LabelTextStyled = styled(Text)(function (_a) {
29
30
  var theme = _a.theme;
30
31
  return (__assign(__assign({}, theme.typography.caption), { color: alpha(theme.palette.text.primary, 0.6), marginBlockEnd: theme.spacing(0.625) }));
@@ -35,15 +36,17 @@ var RadioGroupStyled = styled(RadioGroup)(function (_a) {
35
36
  marginInlineStart: theme.spacing(0.25)
36
37
  });
37
38
  });
39
+ var RadioLabelStyled = styled('span')(function () { return ({
40
+ display: 'flex'
41
+ }); });
38
42
  var InfluencerSwitch = function (_a) {
39
- var show = _a.show, readOnly = _a.readOnly;
43
+ var show = _a.show, readOnly = _a.readOnly, isVerified = _a.isVerified;
40
44
  var _b = React.useState(false), isHovered = _b[0], setIsHovered = _b[1];
41
45
  var control = useFormContext().control;
42
46
  var t = useTranslation().t;
43
47
  var dispatch = useAppDispatch();
44
48
  var influencerControl = useController({ name: 'isInfluencer', control: control });
45
49
  var error = useAppSelector(individualSelector).error;
46
- var disabled = false;
47
50
  var handleOnChange = function (_a) {
48
51
  var target = _a.target;
49
52
  if (error)
@@ -51,6 +54,6 @@ var InfluencerSwitch = function (_a) {
51
54
  influencerControl.field.onChange(target.value === 'yes');
52
55
  };
53
56
  var influencerValue = influencerControl.field.value;
54
- return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pt: 2.5, pl: 2.5, pr: 2.5 } }, { children: [_jsxs(Box, __assign({ style: { display: 'flex', justifyContent: 'space-between' } }, { children: [_jsxs(LabelTextStyled, { children: [t('tap_js_are_you_an_influencer'), _jsx(Mandatory, {})] }), _jsx(Tooltip, __assign({ title: t('influencer_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] })), _jsxs(RadioGroupStyled, __assign({ readOnly: readOnly, value: influencerValue != null ? (influencerValue ? 'yes' : 'no') : false, onChange: disabled || readOnly ? undefined : handleOnChange }, { children: [_jsx(RadioLabel, { value: 'yes', label: t('yes') }), _jsx(RadioLabel, { value: 'no', label: t('no') })] }))] })) })));
57
+ return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pt: 2.5, pl: 2.5, pr: 2.5 } }, { children: [_jsxs(Box, __assign({ style: { display: 'flex', justifyContent: 'space-between' } }, { children: [_jsxs(LabelTextStyled, { children: [t('tap_js_are_you_an_influencer'), _jsx(Mandatory, {})] }), _jsx(Tooltip, __assign({ title: t('influencer_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] })), _jsxs(RadioGroupStyled, __assign({ readOnly: readOnly, value: influencerValue != null ? (influencerValue ? 'yes' : 'no') : false, onChange: readOnly ? undefined : handleOnChange }, { children: [_jsx(RadioLabel, { value: 'yes', label: _jsxs(RadioLabelStyled, { children: [t('yes'), influencerValue && isVerified && _jsx(CheckIcon, { sx: { marginInlineStart: '5px' }, isVerified: isVerified })] }) }), _jsx(RadioLabel, { value: 'no', label: _jsxs(RadioLabelStyled, { children: [t('no'), influencerValue === false && isVerified && _jsx(CheckIcon, { sx: { marginInlineStart: '5px' }, isVerified: isVerified })] }) })] }))] })) })));
55
58
  };
56
59
  export default React.memo(InfluencerSwitch);
@@ -9,23 +9,23 @@ var __assign = (this && this.__assign) || function () {
9
9
  };
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
- import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import * as React from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { useController, useFormContext } from 'react-hook-form';
16
16
  import Box from '@mui/material/Box';
17
17
  import { styled } from '@mui/material/styles';
18
- import { ScreenContainer } from '../../../shared/Containers';
19
- import Input from '../../../shared/Input';
20
- import CheckIcon from '../../../shared/CheckIcon';
21
- import Collapse from '../../../../components/Collapse';
18
+ import { settingsSelector } from '../../../../app/settings';
19
+ import { findCurrencyByIso2, hasVerifiedValue } from '../../../../utils';
22
20
  import { useAppDispatch, useAppSelector, useLanguage } from '../../../../hooks';
23
- import { individualSelector, clearError } from '../../../app/individual/individualStore';
21
+ import Collapse from '../../../../components/Collapse';
24
22
  import Text from '../../../../components/Text';
25
23
  import ExpandIcon from '../../../../components/ExpandIcon';
26
24
  import SimpleList from '../../../../components/SimpleList';
27
- import { findCurrencyByIso2 } from '../../../../utils';
28
- import { settingsSelector } from '../../../../app/settings';
25
+ import { individualSelector, clearError } from '../../../app/individual/individualStore';
26
+ import Input from '../../../shared/Input';
27
+ import CheckIcon from '../../../shared/CheckIcon';
28
+ import { ScreenContainer } from '../../../shared/Containers';
29
29
  var Container = styled(Box)(function () { return ({
30
30
  display: 'flex'
31
31
  }); });
@@ -41,14 +41,6 @@ var IncomeText = styled(Text, { shouldForwardProp: function (prop) { return prop
41
41
  var theme = _a.theme, isSelected = _a.isSelected;
42
42
  return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
43
43
  });
44
- var CheckIconStyled = styled(CheckIcon)(function (_a) {
45
- var theme = _a.theme;
46
- return ({
47
- color: theme.palette.success.main,
48
- display: 'flex',
49
- alignItems: 'flex-end'
50
- });
51
- });
52
44
  var MonthlyIncome = function (props) {
53
45
  var _a;
54
46
  var _b = React.useState([]), incomeList = _b[0], setIncomeList = _b[1];
@@ -62,7 +54,10 @@ var MonthlyIncome = function (props) {
62
54
  var monthlyIncomeList = (data.individualData.responseBody || {}).monthlyIncomeList;
63
55
  var monthlyIncomeControl = useController({ control: control, name: 'monthlyIncome' });
64
56
  var countryCode = settingsData.businessCountry;
65
- var disabled = false;
57
+ var user = (data.verify.responseBody || {}).user;
58
+ var isMonthlyIncomeVerified = function (item) {
59
+ return hasVerifiedValue(user === null || user === void 0 ? void 0 : user.data_verification, "monthly_income.".concat(item.id));
60
+ };
66
61
  React.useEffect(function () {
67
62
  if ((monthlyIncomeList === null || monthlyIncomeList === void 0 ? void 0 : monthlyIncomeList.length) > 0) {
68
63
  setIncomeList(monthlyIncomeList);
@@ -93,8 +88,8 @@ var MonthlyIncome = function (props) {
93
88
  var error = (_a = monthlyIncomeControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
94
89
  return (_jsx(Collapse, __assign({ in: props.show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pb: 0 } }, { children: [_jsx(InputStyled, { label: t('please_enter_actual_income', {
95
90
  currency: t(findCurrencyByIso2(countryCode.iso2))
96
- }), disabled: disabled, readOnly: props.readOnly, onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_any_source_of_income'), value: (isAr ? income === null || income === void 0 ? void 0 : income.range.ar : income === null || income === void 0 ? void 0 : income.range.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'range.en', searchValuePath: ['range.en', 'range.ar'], list: incomeList, onSelectItem: onSelectItem, renderItem: function (item) {
97
- return (_jsxs(_Fragment, { children: [_jsx(Container, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (income === null || income === void 0 ? void 0 : income.id) }, { children: isAr ? item.range.ar : item === null || item === void 0 ? void 0 : item.range.en })) }), item.id === (income === null || income === void 0 ? void 0 : income.id) && _jsx(CheckIconStyled, {})] }));
91
+ }), readOnly: props.readOnly, onClick: !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_any_source_of_income'), value: (isAr ? income === null || income === void 0 ? void 0 : income.range.ar : income === null || income === void 0 ? void 0 : income.range.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'range.en', searchValuePath: ['range.en', 'range.ar'], list: incomeList, onSelectItem: onSelectItem, renderItem: function (item) {
92
+ return (_jsxs(_Fragment, { children: [_jsx(Container, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (income === null || income === void 0 ? void 0 : income.id) }, { children: isAr ? item.range.ar : item === null || item === void 0 ? void 0 : item.range.en })) }), item.id === (income === null || income === void 0 ? void 0 : income.id) && _jsx(CheckIcon, { isVerified: isMonthlyIncomeVerified(item) })] }));
98
93
  } }) }))] })) })));
99
94
  };
100
95
  export default React.memo(MonthlyIncome);
@@ -6,6 +6,7 @@ interface OccupationProps {
6
6
  onListOpen?: () => void;
7
7
  onListClose?: () => void;
8
8
  readOnly?: boolean;
9
+ isVerified?: boolean;
9
10
  }
10
11
  declare const Occupation: (props: OccupationProps) => JSX.Element;
11
12
  export default Occupation;
@@ -9,21 +9,21 @@ var __assign = (this && this.__assign) || function () {
9
9
  };
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
- import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import * as React from 'react';
14
- import Box from '@mui/material/Box';
15
- import { styled } from '@mui/material/styles';
16
14
  import { useTranslation } from 'react-i18next';
17
15
  import { useController, useFormContext } from 'react-hook-form';
16
+ import Box from '@mui/material/Box';
17
+ import { styled } from '@mui/material/styles';
18
18
  import { useAppSelector, useLanguage, useAppDispatch } from '../../../../hooks';
19
- import { individualSelector, clearError } from '../../../app/individual/individualStore';
20
19
  import Text from '../../../../components/Text';
20
+ import SimpleList from '../../../../components/SimpleList';
21
21
  import Collapse from '../../../../components/Collapse';
22
- import CheckIcon from '@mui/icons-material/Check';
23
22
  import ScreenContainer from '../../../shared/Containers/ScreenContainer';
24
23
  import Input from '../../../shared/Input';
25
- import ExpandIcon from '../../../../components/ExpandIcon';
26
- import SimpleList from '../../../../components/SimpleList';
24
+ import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
25
+ import CheckIcon from '../../../shared/CheckIcon';
26
+ import { individualSelector, clearError } from '../../../app/individual/individualStore';
27
27
  var Container = styled(Box)(function () { return ({
28
28
  display: 'flex'
29
29
  }); });
@@ -39,14 +39,6 @@ var IncomeText = styled(Text, { shouldForwardProp: function (prop) { return prop
39
39
  var theme = _a.theme, isSelected = _a.isSelected;
40
40
  return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
41
41
  });
42
- var CheckIconStyled = styled(CheckIcon)(function (_a) {
43
- var theme = _a.theme;
44
- return ({
45
- color: theme.palette.success.main,
46
- display: 'flex',
47
- alignItems: 'flex-end'
48
- });
49
- });
50
42
  var Occupation = function (props) {
51
43
  var _a, _b;
52
44
  var _c = React.useState([]), occupationList = _c[0], setOccupationList = _c[1];
@@ -58,7 +50,6 @@ var Occupation = function (props) {
58
50
  var control = useFormContext().control;
59
51
  var occupationsList = ((_a = data.individualData.responseBody) === null || _a === void 0 ? void 0 : _a.occupationList) || [];
60
52
  var occupationControl = useController({ control: control, name: 'occupation' });
61
- var disabled = false;
62
53
  React.useEffect(function () {
63
54
  if ((occupationsList === null || occupationsList === void 0 ? void 0 : occupationsList.length) > 0) {
64
55
  setOccupationList(occupationsList);
@@ -84,9 +75,9 @@ var Occupation = function (props) {
84
75
  };
85
76
  var occupation = occupationControl.field.value;
86
77
  var error = (_b = occupationControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
87
- return (_jsx(Collapse, __assign({ in: props.show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pb: 2.5 } }, { children: [_jsx(InputStyled, { required: true, disabled: disabled, label: t('occupation_title'), readOnly: props.readOnly, onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }), placeholder: t('choose_any_occupation'), value: (isAr ? occupation === null || occupation === void 0 ? void 0 : occupation.name.ar : occupation === null || occupation === void 0 ? void 0 : occupation.name.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.en', 'name.ar'], list: occupationList, onSelectItem: onSelectItem, renderItem: function (item) {
78
+ return (_jsx(Collapse, __assign({ in: props.show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pb: 2.5 } }, { children: [_jsx(InputStyled, { required: true, label: t('occupation_title'), readOnly: props.readOnly, onClick: !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: _jsx(EndAdornmentExpanded, { isVerified: props.isVerified, anchorEl: anchorEl }), placeholder: t('choose_any_occupation'), value: (isAr ? occupation === null || occupation === void 0 ? void 0 : occupation.name.ar : occupation === null || occupation === void 0 ? void 0 : occupation.name.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.en', 'name.ar'], list: occupationList, onSelectItem: onSelectItem, renderItem: function (item) {
88
79
  var _a, _b;
89
- return (_jsxs(_Fragment, { children: [_jsx(Container, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (occupation === null || occupation === void 0 ? void 0 : occupation.id) }, { children: isAr ? (_a = item === null || item === void 0 ? void 0 : item.name) === null || _a === void 0 ? void 0 : _a.ar : (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.en })) }), item.id === (occupation === null || occupation === void 0 ? void 0 : occupation.id) && _jsx(CheckIconStyled, {})] }));
80
+ return (_jsxs(_Fragment, { children: [_jsx(Container, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (occupation === null || occupation === void 0 ? void 0 : occupation.id) }, { children: isAr ? (_a = item === null || item === void 0 ? void 0 : item.name) === null || _a === void 0 ? void 0 : _a.ar : (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.en })) }), item.id === (occupation === null || occupation === void 0 ? void 0 : occupation.id) && _jsx(CheckIcon, { isVerified: props.isVerified })] }));
90
81
  } }) }))] })) })));
91
82
  };
92
83
  export default Occupation;
@@ -30,6 +30,7 @@ export declare const InfoOutlinedIconStyled: import("@emotion/styled").StyledCom
30
30
  export interface PEPSwitchProps {
31
31
  show: boolean;
32
32
  readOnly?: boolean;
33
+ isVerified?: boolean;
33
34
  }
34
- declare const _default: React.MemoExoticComponent<({ show, readOnly }: PEPSwitchProps) => JSX.Element>;
35
+ declare const _default: React.MemoExoticComponent<({ show, readOnly, isVerified }: PEPSwitchProps) => JSX.Element>;
35
36
  export default _default;
@@ -14,17 +14,18 @@ import * as React from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import { useFormContext, useController } from 'react-hook-form';
16
16
  import { styled, alpha } from '@mui/material/styles';
17
+ import InfoIcon from '@mui/icons-material/Info';
18
+ import Box from '@mui/material/Box';
19
+ import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
17
20
  import { ScreenContainer } from '../../../shared/Containers';
18
- import Collapse from '../../../../components/Collapse';
19
- import Mandatory from '../../../shared/Mandatory';
20
- import Text from '../../../../components/Text';
21
21
  import { useAppSelector, useAppDispatch } from '../../../../hooks';
22
+ import Collapse from '../../../../components/Collapse';
22
23
  import RadioGroup from '../../../../components/RadioGroup';
23
24
  import RadioLabel from '../../../../components/RadioLabel';
25
+ import Text from '../../../../components/Text';
24
26
  import Tooltip from '../../../../components/Tooltip';
25
- import InfoIcon from '@mui/icons-material/Info';
26
- import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
27
- import Box from '@mui/material/Box';
27
+ import Mandatory from '../../../shared/Mandatory';
28
+ import CheckIcon from '../../../shared/CheckIcon';
28
29
  import { individualSelector, clearError } from '../../../app/individual/individualStore';
29
30
  var LabelTextStyled = styled(Text)(function (_a) {
30
31
  var theme = _a.theme;
@@ -54,15 +55,17 @@ export var InfoOutlinedIconStyled = styled(InfoOutlinedIcon)(function (_a) {
54
55
  color: alpha(theme.palette.text.primary, 0.4)
55
56
  });
56
57
  });
58
+ var RadioLabelStyled = styled('span')(function () { return ({
59
+ display: 'flex'
60
+ }); });
57
61
  var PEPSwitch = function (_a) {
58
- var show = _a.show, readOnly = _a.readOnly;
62
+ var show = _a.show, readOnly = _a.readOnly, isVerified = _a.isVerified;
59
63
  var _b = React.useState(false), isHovered = _b[0], setIsHovered = _b[1];
60
64
  var control = useFormContext().control;
61
65
  var t = useTranslation().t;
62
66
  var pepControl = useController({ name: 'isPEP', control: control });
63
67
  var error = useAppSelector(individualSelector).error;
64
68
  var dispatch = useAppDispatch();
65
- var disabled = false;
66
69
  var handleOnChange = function (_a) {
67
70
  var target = _a.target;
68
71
  if (error)
@@ -70,6 +73,6 @@ var PEPSwitch = function (_a) {
70
73
  pepControl.field.onChange(target.value === 'yes');
71
74
  };
72
75
  var pepValue = pepControl.field.value;
73
- return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pt: 2.5, pl: 2.5, pr: 2.5 } }, { children: [_jsxs(Box, __assign({ style: { display: 'flex', justifyContent: 'space-between' } }, { children: [_jsxs(LabelTextStyled, { children: [t('tap_js_is_close_relative_in_pep'), _jsx(Mandatory, {})] }), _jsx(Tooltip, __assign({ title: t('pep_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] })), _jsxs(RadioGroupStyled, __assign({ readOnly: readOnly, value: pepValue != null ? (pepValue ? 'yes' : 'no') : false, onChange: disabled || readOnly ? undefined : handleOnChange }, { children: [_jsx(RadioLabel, { value: 'yes', label: t('yes') }), _jsx(RadioLabel, { value: 'no', label: t('no') })] }))] })) })));
76
+ return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { pt: 2.5, pl: 2.5, pr: 2.5 } }, { children: [_jsxs(Box, __assign({ style: { display: 'flex', justifyContent: 'space-between' } }, { children: [_jsxs(LabelTextStyled, { children: [t('tap_js_is_close_relative_in_pep'), _jsx(Mandatory, {})] }), _jsx(Tooltip, __assign({ title: t('pep_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] })), _jsxs(RadioGroupStyled, __assign({ readOnly: readOnly, value: pepValue != null ? (pepValue ? 'yes' : 'no') : false, onChange: readOnly ? undefined : handleOnChange }, { children: [_jsx(RadioLabel, { value: 'yes', label: _jsxs(RadioLabelStyled, { children: [t('yes'), pepValue && isVerified && _jsx(CheckIcon, { sx: { marginInlineStart: '5px' }, isVerified: isVerified })] }) }), _jsx(RadioLabel, { value: 'no', label: _jsxs(RadioLabelStyled, { children: [t('no'), pepValue === false && isVerified && _jsx(CheckIcon, { sx: { marginInlineStart: '5px' }, isVerified: isVerified })] }) })] }))] })) })));
74
77
  };
75
78
  export default React.memo(PEPSwitch);