@tap-payments/auth-jsconnect 2.3.4-test → 2.3.4

package/build/features/individual/screens/IndividualPersonalInfo/ID.js

@@ -1,47 +1,40 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { useTranslation } from 'react-i18next';
-import { useController, useFormContext } from 'react-hook-form';
-import { removeAllCharsFromNumber } from '../../../../utils';
-import { useAppSelector } from '../../../../hooks';
-import { ID_NUMBER_LENGTH } from '../../../../constants';
-import Collapse from '../../../../components/Collapse';
-import { ScreenContainer } from '../../../shared/Containers';
-import Input from '../../../shared/Input';
-import ClearIcon from '../../../shared/ClearIcon';
-import CheckIcon from '../../../shared/CheckIcon';
-import { individualSelector } from '../../../app/individual/individualStore';
-var IDNumber = function (_a) {
-    var _b;
-    var show = _a.show;
-    var t = useTranslation().t;
-    var control = useFormContext().control;
-    var data = useAppSelector(individualSelector).data;
-    var verify = data.verify;
-    var user = (verify.responseBody || {}).user;
-    var nidControl = useController({ control: control, name: 'nid' });
-    var handleIdChange = function (_a) {
-        var target = _a.target;
-        var value = removeAllCharsFromNumber(target.value);
-        nidControl.field.onChange(value);
-    };
-    var clearIdNumber = function () {
-        nidControl.field.onChange('');
-    };
-    var nidValue = nidControl.field.value;
-    var error = (_b = nidControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
-    var disabled = false;
-    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, { children: _jsx(Input, { label: t('enter_national_id'), disabled: disabled, inputProps: { maxLength: ID_NUMBER_LENGTH }, onChange: handleIdChange, value: nidValue, endAdornment: !error && nidValue ? _jsx(CheckIcon, {}) : nidValue && _jsx(ClearIcon, { onClick: clearIdNumber }), placeholder: '0000000000', warningType: 'alert', warningMessage: error && t(error, { number: '1' }) }) }) })));
-};
-export default React.memo(IDNumber);
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { useTranslation } from 'react-i18next';
+import { useController, useFormContext } from 'react-hook-form';
+import { removeAllCharsFromNumber } from '../../../../utils';
+import { ID_NUMBER_LENGTH } from '../../../../constants';
+import Collapse from '../../../../components/Collapse';
+import { ScreenContainer } from '../../../shared/Containers';
+import Input from '../../../shared/Input';
+import { EndAdornment } from '../../../shared/EndAdornment';
+var IDNumber = function (_a) {
+    var _b;
+    var show = _a.show, readOnly = _a.readOnly, isVerified = _a.isVerified;
+    var t = useTranslation().t;
+    var control = useFormContext().control;
+    var nidControl = useController({ control: control, name: 'nid' });
+    var handleIdChange = function (_a) {
+        var target = _a.target;
+        var value = removeAllCharsFromNumber(target.value);
+        nidControl.field.onChange(value);
+    };
+    var clearIdNumber = function () {
+        nidControl.field.onChange('');
+    };
+    var nidValue = nidControl.field.value;
+    var error = (_b = nidControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
+    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(ScreenContainer, { children: _jsx(Input, { readOnly: readOnly, label: t('enter_national_id'), inputProps: { maxLength: ID_NUMBER_LENGTH }, onChange: handleIdChange, value: nidValue, endAdornment: _jsx(EndAdornment, { value: nidValue, isVerified: isVerified, onClear: clearIdNumber, error: error }), placeholder: '0000000000', warningType: 'alert', warningMessage: error && t(error, { number: '1' }) }) }) })));
+};
+export default React.memo(IDNumber);

package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.d.ts

@@ -1,21 +1,21 @@
-import * as React from 'react';
-export declare const RoleTextStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material/styles").Theme> & {
-    align?: "right" | "left" | "center" | "inherit" | "justify" | undefined;
-    children?: React.ReactNode;
-    classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
-    variant?: "button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "overline" | "subtitle1" | "subtitle2" | "body1" | "body2" | undefined;
-    variantMapping?: Partial<Record<"button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "overline" | "subtitle1" | "subtitle2" | "body1" | "body2", string>> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof React.HTMLAttributes<HTMLSpanElement>> & {
-    ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
-}, ("border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform") | "children" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export interface IndividualPersonalInfoProps {
-}
-declare const _default: React.MemoExoticComponent<{
-    ({}: IndividualPersonalInfoProps): JSX.Element;
-    defaultProps: {};
-}>;
-export default _default;
+import * as React from 'react';
+export declare const RoleTextStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material/styles").Theme> & {
+    align?: "right" | "left" | "center" | "inherit" | "justify" | undefined;
+    children?: React.ReactNode;
+    classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
+    gutterBottom?: boolean | undefined;
+    noWrap?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+    variant?: "button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "subtitle1" | "subtitle2" | "body1" | "body2" | "overline" | undefined;
+    variantMapping?: Partial<Record<"button" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "subtitle1" | "subtitle2" | "body1" | "body2" | "overline", string>> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof React.HTMLAttributes<HTMLSpanElement>> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | ("border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform") | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export interface IndividualPersonalInfoProps {
+}
+declare const _default: React.MemoExoticComponent<{
+    ({}: IndividualPersonalInfoProps): JSX.Element;
+    defaultProps: {};
+}>;
+export default _default;

package/build/features/individual/screens/IndividualPersonalInfo/IndividualPersonalInfo.js

@@ -1,139 +1,182 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { yupResolver } from '@hookform/resolvers/yup';
-import { useForm, FormProvider } from 'react-hook-form';
-import { useTranslation } from 'react-i18next';
-import { handleCurrentActiveScreen, settingsSelector } from '../../../../app/settings';
-import Box from '@mui/material/Box';
-import { alpha, styled } from '@mui/material/styles';
-import { useAppDispatch, useAppSelector, useSetFromDefaultValues, useLanguage } from '../../../../hooks';
-import { IndividualType } from '../../../../@types';
-import Form from '../../../../components/Form';
-import Collapse from '../../../../components/Collapse';
-import Text from '../../../../components/Text';
-import { clearError, individualSelector, updateIndividualPersonalInfo } from '../../../app/individual/individualStore';
-import Button from '../../../shared/Button';
-import ScreenContainer from '../../../shared/Containers/ScreenContainer';
-import { IndividualInfoValidationSchema } from './validation';
-import Name from './Name';
-import MobileNumber from './MobileNumber';
-import Email from './Email';
-import Gender from './Gender';
-import ID from './ID';
-import DOB from './DOB';
-import IssuedCountry from './IssuedCountry';
-import ExpiryDate from './ExpiryDate';
-import BirthCountry from './BirthCountry';
-import Nationality from './Nationality';
-import BirthCity from './BirthCity';
-var TextBoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({ display: 'flex', justifyContent: 'center', flexDirection: 'row', padding: theme.spacing(1.8, 2.5, 1.8, 2.5) }, theme.typography.body1), { lineHeight: theme.spacing(2.5), color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightMedium }));
-});
-export var RoleTextStyled = styled(Text)(function (_a) {
-    var theme = _a.theme;
-    return (__assign(__assign({}, theme.typography.body1), { display: 'inline', paddingInlineStart: theme.spacing(1.5), color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }));
-});
-var ListType;
-(function (ListType) {
-    ListType["MobileCountryList"] = "MobileCountryList";
-    ListType["IssuedCountryList"] = "IssuedCountryList";
-    ListType["BirthCountryList"] = "BirthCountryList";
-    ListType["BirthCityList"] = "BirthCityList";
-    ListType["NationalityList"] = "NationalityList";
-})(ListType || (ListType = {}));
-var IndividualPersonalInfo = function (_a) {
-    var t = useTranslation().t;
-    var isAr = useLanguage().isAr;
-    var dispatch = useAppDispatch();
-    var _b = useAppSelector(individualSelector), data = _b.data, loading = _b.loading, error = _b.error, cityLoading = _b.cityLoading;
-    var settingsData = useAppSelector(settingsSelector).data;
-    var countries = settingsData.countries;
-    var verify = data.verify, individualPersonalData = data.individualPersonalData;
-    var user = (verify.responseBody || {}).user;
-    var name = individualPersonalData.name, email = individualPersonalData.email, mobile = individualPersonalData.mobile, countryCode = individualPersonalData.countryCode, gender = individualPersonalData.gender, nid = individualPersonalData.nid, issuedCountry = individualPersonalData.issuedCountry, expiryDate = individualPersonalData.expiryDate, dob = individualPersonalData.dob, placeOfBirthCountry = individualPersonalData.placeOfBirthCountry, placeOfBirthCity = individualPersonalData.placeOfBirthCity, nationality = individualPersonalData.nationality;
-    var methods = useForm({
-        resolver: yupResolver(IndividualInfoValidationSchema),
-        defaultValues: {
-            name: name,
-            email: email,
-            mobile: mobile,
-            countryCode: countryCode,
-            gender: gender,
-            nid: nid,
-            issuedCountry: issuedCountry,
-            expiryDate: expiryDate,
-            dob: dob,
-            placeOfBirthCountry: placeOfBirthCountry,
-            placeOfBirthCity: placeOfBirthCity,
-            nationality: nationality
-        },
-        mode: 'onChange'
-    });
-    useSetFromDefaultValues(methods, data.individualPersonalData);
-    var _c = React.useState(), listActive = _c[0], setListActive = _c[1];
-    var _d = React.useState(false), dobActive = _d[0], setDobActive = _d[1];
-    var _e = React.useState(false), expiryDateActive = _e[0], setExpiryDateActive = _e[1];
-    var onSubmit = function (data) {
-        dispatch(updateIndividualPersonalInfo(data));
-    };
-    React.useEffect(function () {
-        if (error)
-            dispatch(clearError());
-    }, [methods.formState.isValid]);
-    var onBack = function () {
-        if (error)
-            dispatch(clearError());
-        dispatch(handleCurrentActiveScreen('INDIVIDUAL_LIST_STEP'));
-    };
-    var handleMenuClick = function (flag) {
-        setListActive(flag);
-    };
-    var handleDobActive = function (flag) {
-        setDobActive(flag);
-    };
-    var handleExpiryDateActive = function (flag) {
-        setExpiryDateActive(flag);
-    };
-    var getUserName = function () {
-        var _a, _b, _c, _d;
-        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;
-        return name;
-    };
-    var getUserOccupation = function () {
-        var _a, _b, _c, _d, _e;
-        if ((((_a = user === null || user === void 0 ? void 0 : user.role) === null || _a === void 0 ? void 0 : _a.length) || 0) > 0)
-            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;
-        if ((user === null || user === void 0 ? void 0 : user.type) === IndividualType.SHARE_HOLDER)
-            return t('type_share_holder');
-        if ((user === null || user === void 0 ? void 0 : user.type) === IndividualType.BOARD_MEMBER)
-            return t('type_board_member');
-        return t('type_user');
-    };
-    var disabled = !methods.formState.isValid || cityLoading;
-    var isDateFieldActive = dobActive || expiryDateActive;
-    var showField = !listActive && !isDateFieldActive;
-    var isMobileCountryListActive = listActive === ListType.MobileCountryList;
-    var isIssuedCountryListActive = listActive === ListType.IssuedCountryList;
-    var isBirthCountryListActive = listActive === ListType.BirthCountryList;
-    var isBirthCityListActive = listActive === ListType.BirthCityList;
-    var isNationalityListActive = listActive === ListType.NationalityList;
-    return (_jsxs(ScreenContainer, { children: [_jsx(Collapse, __assign({ in: showField && !!(user === null || user === void 0 ? void 0 : user.is_authorized), timeout: 500 }, { children: _jsxs(TextBoxStyled, { children: [getUserName() || '', _jsx(RoleTextStyled, { children: getUserOccupation() || '' })] }) })), _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Name, { show: showField }), _jsx(MobileNumber, { show: !isDateFieldActive && !isBirthCountryListActive && !isBirthCityListActive && !isNationalityListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.MobileCountryList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(Email, { show: showField }), _jsx(Gender, { show: showField }), _jsx(ID, { show: showField }), _jsx(IssuedCountry, { show: !isMobileCountryListActive && !isDateFieldActive && !isBirthCountryListActive && !isBirthCityListActive && !isNationalityListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.IssuedCountryList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(ExpiryDate, { show: !listActive && !dobActive, onDateClicked: handleExpiryDateActive }), _jsx(DOB, { show: !listActive && !expiryDateActive, onDateClicked: handleDobActive }), _jsx(BirthCountry, { show: !isMobileCountryListActive && !isDateFieldActive && !isIssuedCountryListActive && !isBirthCityListActive && !isNationalityListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.BirthCountryList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(BirthCity, { show: !isMobileCountryListActive &&
-                                        !isDateFieldActive &&
-                                        !isIssuedCountryListActive &&
-                                        !isBirthCountryListActive &&
-                                        !isNationalityListActive, onListOpen: function () { return handleMenuClick(ListType.BirthCityList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(Nationality, { show: !isMobileCountryListActive && !isDateFieldActive && !isIssuedCountryListActive && !isBirthCityListActive && !isBirthCountryListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.NationalityList); }, onListClose: function () { return handleMenuClick(); } })] }), _jsx(Collapse, __assign({ in: showField, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: !(user === null || user === void 0 ? void 0 : user.is_authorized), disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) }))] }));
-};
-export default React.memo(IndividualPersonalInfo);
-IndividualPersonalInfo.defaultProps = {};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { yupResolver } from '@hookform/resolvers/yup';
+import { useForm, FormProvider } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+import { handleCurrentActiveScreen, handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
+import Box from '@mui/material/Box';
+import { alpha, styled } from '@mui/material/styles';
+import { useAppDispatch, useAppSelector, useSetFromDefaultValues, useLanguage, useFormReadOnly, useDataNoneEditable, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
+import { convertToEnglishDateFormat, getUserName } from '../../../../utils';
+import Form from '../../../../components/Form';
+import Collapse from '../../../../components/Collapse';
+import Text from '../../../../components/Text';
+import { clearError, individualSelector, retrieveBoardStatus, updateIndividualPersonalInfo } from '../../../app/individual/individualStore';
+import Button from '../../../shared/Button';
+import ScreenContainer from '../../../shared/Containers/ScreenContainer';
+import { IndividualInfoValidationSchema } from './validation';
+import Name from './Name';
+import MobileNumber from './MobileNumber';
+import Email from './Email';
+import Gender from './Gender';
+import ID from './ID';
+import DOB from './DOB';
+import IssuedCountry from './IssuedCountry';
+import ExpiryDate from './ExpiryDate';
+import BirthCountry from './BirthCountry';
+import Nationality from './Nationality';
+import BirthCity from './BirthCity';
+export var RoleTextStyled = styled(Text)(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({}, theme.typography.body1), { display: 'inline', paddingInlineStart: theme.spacing(1.5), color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightMedium }));
+});
+var ListType;
+(function (ListType) {
+    ListType["MobileCountryList"] = "MobileCountryList";
+    ListType["IssuedCountryList"] = "IssuedCountryList";
+    ListType["BirthCountryList"] = "BirthCountryList";
+    ListType["BirthCityList"] = "BirthCityList";
+    ListType["NationalityList"] = "NationalityList";
+})(ListType || (ListType = {}));
+var IndividualPersonalInfo = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
+    var dispatch = useAppDispatch();
+    var _l = useAppSelector(individualSelector), data = _l.data, loading = _l.loading, error = _l.error, cityLoading = _l.cityLoading;
+    var settingsData = useAppSelector(settingsSelector).data;
+    var countries = settingsData.countries;
+    var verify = data.verify, individualPersonalData = data.individualPersonalData;
+    var _m = verify.responseBody || {}, user = _m.user, flows = _m.flows;
+    var name = individualPersonalData.name, email = individualPersonalData.email, mobile = individualPersonalData.mobile, countryCode = individualPersonalData.countryCode, gender = individualPersonalData.gender, nid = individualPersonalData.nid, issuedCountry = individualPersonalData.issuedCountry, expiryDate = individualPersonalData.expiryDate, dob = individualPersonalData.dob, placeOfBirthCountry = individualPersonalData.placeOfBirthCountry, placeOfBirthCity = individualPersonalData.placeOfBirthCity, nationality = individualPersonalData.nationality;
+    var _o = user || {}, data_status = _o.data_status, is_authorized = _o.is_authorized, data_verification = _o.data_verification, contact = _o.contact, genderRes = _o.gender, identification = _o.identification, birth = _o.birth, nationalityRes = _o.nationality;
+    var methods = useForm({
+        resolver: yupResolver(IndividualInfoValidationSchema),
+        defaultValues: {
+            name: name,
+            email: email,
+            mobile: mobile,
+            countryCode: countryCode,
+            gender: gender,
+            nid: nid,
+            issuedCountry: issuedCountry,
+            expiryDate: expiryDate,
+            dob: dob,
+            placeOfBirthCountry: placeOfBirthCountry,
+            placeOfBirthCity: placeOfBirthCity,
+            nationality: nationality
+        },
+        mode: 'onChange'
+    });
+    var watch = methods.watch;
+    useSetFromDefaultValues(methods, data.individualPersonalData);
+    var _p = React.useState(), listActive = _p[0], setListActive = _p[1];
+    var _q = React.useState(false), dobActive = _q[0], setDobActive = _q[1];
+    var _r = React.useState(false), expiryDateActive = _r[0], setExpiryDateActive = _r[1];
+    var originalReadOnly = useFormReadOnly(methods);
+    var noneEditable = useDataNoneEditable(data_status, [
+        'name.en',
+        'name.ar',
+        'contact.phone.number',
+        'contact.phone.country_code',
+        'contact.email',
+        'identification.id',
+        'identification.type',
+        'identification.issuer_country',
+        'identification.expiry',
+        'birth.date',
+        'birth.country',
+        'birth.city',
+        'nationality',
+        'gender'
+    ]);
+    var readOnly = useFormErrorAndUpdateReadOnly(methods, originalReadOnly, noneEditable);
+    var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
+    var dataVerified = useDataVerified(data_verification, [
+        'name.en',
+        'name.ar',
+        'contact.phone.number',
+        'contact.phone.country_code',
+        'contact.email',
+        'identification.id',
+        'identification.type',
+        'identification.issuer_country',
+        'identification.expiry',
+        'birth.date',
+        'birth.country',
+        'birth.city',
+        'nationality',
+        'gender'
+    ]);
+    var expDateRes = (identification === null || identification === void 0 ? void 0 : identification.expiry) && convertToEnglishDateFormat(new Date(identification === null || identification === void 0 ? void 0 : identification.expiry));
+    var dobDateRes = (birth === null || birth === void 0 ? void 0 : birth.date) && convertToEnglishDateFormat(new Date(birth === null || birth === void 0 ? void 0 : birth.date));
+    var isNameVerified = dataVerified['name.en'] && dataVerified['name.ar'] && getUserName(user, isAr) === watch('name');
+    var isPhoneNumberVerified = dataVerified['contact.phone.number'] &&
+        dataVerified['contact.phone.country_code'] &&
+        ((_b = contact === null || contact === void 0 ? void 0 : contact.phone) === null || _b === void 0 ? void 0 : _b.number) === watch('mobile') &&
+        ((_c = contact === null || contact === void 0 ? void 0 : contact.phone) === null || _c === void 0 ? void 0 : _c.country_code) === ((_e = (_d = watch('countryCode')) === null || _d === void 0 ? void 0 : _d.idd_prefix) === null || _e === void 0 ? void 0 : _e.toString());
+    var isEmailVerified = dataVerified['contact.email'] && (contact === null || contact === void 0 ? void 0 : contact.email) === watch('email');
+    var isGenderVerified = dataVerified['gender'] && genderRes === watch('gender');
+    var isIDVerified = dataVerified['identification.id'] && (identification === null || identification === void 0 ? void 0 : identification.id) === watch('nid');
+    var isIssuedCountryVerified = dataVerified['identification.issuer_country'] && (identification === null || identification === void 0 ? void 0 : identification.issued_country_code) === ((_f = watch('issuedCountry')) === null || _f === void 0 ? void 0 : _f.iso2);
+    var isExpiryDateVerified = dataVerified['identification.expiry'] && expDateRes === watch('expiryDate');
+    var isDOBVerified = dataVerified['birth.date'] && dobDateRes === watch('dob');
+    var isBirthCountryVerified = dataVerified['birth.country'] && (birth === null || birth === void 0 ? void 0 : birth.country) === ((_g = watch('placeOfBirthCountry')) === null || _g === void 0 ? void 0 : _g.iso2);
+    var isBirthCityVerified = dataVerified['birth.city'] && ((_h = birth === null || birth === void 0 ? void 0 : birth.city) === null || _h === void 0 ? void 0 : _h.cityId) === ((_j = watch('placeOfBirthCity')) === null || _j === void 0 ? void 0 : _j.id);
+    var isNationalityVerified = dataVerified['nationality'] && nationalityRes === ((_k = watch('nationality')) === null || _k === void 0 ? void 0 : _k.iso2);
+    var onSubmit = function (data) {
+        dispatch(updateIndividualPersonalInfo(getFelids(data)));
+    };
+    React.useEffect(function () {
+        if (error)
+            dispatch(clearError());
+    }, [methods.formState.isValid]);
+    var onBack = function () {
+        if (error)
+            dispatch(clearError());
+        if (is_authorized) {
+            dispatch(handleCurrentActiveScreen('INDIVIDUAL_LIST_STEP'));
+            return;
+        }
+        if ((flows === null || flows === void 0 ? void 0 : flows.length) > 0) {
+            dispatch(handlePrevScreenStep('INDIVIDUAL_SUCCESS_FOUR_FLOWS_BUTTONS_STEP'));
+            return;
+        }
+        dispatch(retrieveBoardStatus());
+    };
+    var handleMenuClick = function (flag) {
+        setListActive(flag);
+    };
+    var handleDobActive = function (flag) {
+        setDobActive(flag);
+    };
+    var handleExpiryDateActive = function (flag) {
+        setExpiryDateActive(flag);
+    };
+    var disabled = !methods.formState.isValid || cityLoading;
+    var isDateFieldActive = dobActive || expiryDateActive;
+    var showField = !listActive && !isDateFieldActive;
+    var isMobileCountryListActive = listActive === ListType.MobileCountryList;
+    var isIssuedCountryListActive = listActive === ListType.IssuedCountryList;
+    var isBirthCountryListActive = listActive === ListType.BirthCountryList;
+    var isBirthCityListActive = listActive === ListType.BirthCityList;
+    var isNationalityListActive = listActive === ListType.NationalityList;
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Name, { show: showField, readOnly: readOnly['name'] || (noneEditable['name.en'] && noneEditable['name.ar']), isVerified: isNameVerified }), _jsx(MobileNumber, { readOnly: readOnly['mobile'] || noneEditable['contact.phone.number'] || noneEditable['contact.phone.country_code'], show: !isDateFieldActive && !isBirthCountryListActive && !isBirthCityListActive && !isNationalityListActive && !isIssuedCountryListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.MobileCountryList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isPhoneNumberVerified }), _jsx(Email, { show: showField, readOnly: readOnly['email'] || noneEditable['contact.email'], isVerified: isEmailVerified }), _jsx(Gender, { show: showField, readOnly: readOnly['gender'] || noneEditable['gender'], isVerified: isGenderVerified }), _jsx(ID, { show: showField, readOnly: readOnly['nid'] || noneEditable['identification.id'], isVerified: isIDVerified }), _jsx(IssuedCountry, { readOnly: readOnly['issuedCountry'] || noneEditable['identification.issuer_country'], show: !isMobileCountryListActive && !isDateFieldActive && !isBirthCountryListActive && !isBirthCityListActive && !isNationalityListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.IssuedCountryList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isIssuedCountryVerified }), _jsx(ExpiryDate, { show: !listActive && !dobActive, onDateClicked: handleExpiryDateActive, readOnly: readOnly['expiryDate'] || noneEditable['identification.expiry'], isVerified: isExpiryDateVerified }), _jsx(DOB, { show: !listActive && !expiryDateActive, onDateClicked: handleDobActive, readOnly: readOnly['dob'] || noneEditable['birth.date'], isVerified: isDOBVerified }), _jsx(BirthCountry, { readOnly: readOnly['placeOfBirthCountry'] || noneEditable['birth.country'], show: !isMobileCountryListActive && !isDateFieldActive && !isIssuedCountryListActive && !isBirthCityListActive && !isNationalityListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.BirthCountryList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isBirthCountryVerified }), _jsx(BirthCity, { readOnly: readOnly['placeOfBirthCity'] || noneEditable['birth.city'], show: !isMobileCountryListActive &&
+                                    !isDateFieldActive &&
+                                    !isIssuedCountryListActive &&
+                                    !isBirthCountryListActive &&
+                                    !isNationalityListActive, onListOpen: function () { return handleMenuClick(ListType.BirthCityList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isBirthCityVerified }), _jsx(Nationality, { readOnly: readOnly['nationality'] || noneEditable['nationality'], show: !isMobileCountryListActive && !isDateFieldActive && !isIssuedCountryListActive && !isBirthCityListActive && !isBirthCountryListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.NationalityList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isNationalityVerified })] }), _jsx(Collapse, __assign({ in: showField, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
+};
+IndividualPersonalInfo.defaultProps = {};
+export default React.memo(IndividualPersonalInfo);

package/build/features/individual/screens/IndividualPersonalInfo/IssuedCountry.d.ts

@@ -1,10 +1,12 @@
-import * as React from 'react';
-import { CountryCode } from '../../../../@types';
-interface IssuedCountryProps {
-    countries: Array<CountryCode>;
-    show: boolean;
-    onListOpen?: () => void;
-    onListClose?: () => void;
-}
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<IssuedCountryProps & React.RefAttributes<unknown>>>;
-export default _default;
+import * as React from 'react';
+import { CountryCode } from '../../../../@types';
+interface IssuedCountryProps {
+    countries: Array<CountryCode>;
+    show: boolean;
+    onListOpen?: () => void;
+    onListClose?: () => void;
+    readOnly?: boolean;
+    isVerified?: boolean;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<IssuedCountryProps & React.RefAttributes<unknown>>>;
+export default _default;