@tap-payments/auth-jsconnect 2.1.37-test → 2.1.39-test

package/build/features/connect/screens/Merchant/SalesChannels.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { useController, useFormContext } from 'react-hook-form';
 import { useAppSelector, useAppDispatch } from '../../../../hooks';
@@ -7,12 +7,13 @@ import { mapSalesChannel } from '../../../../utils';
 import SalesChannel from '../../../shared/SalesChannels';
 var SalesChannels = function (_a) {
     var _b;
-    var _c = useFormContext(), control = _c.control, setValue = _c.setValue;
+    var _c = useFormContext(), control = _c.control, setValue = _c.setValue, getValues = _c.getValues;
     var dispatch = useAppDispatch();
     var _d = useController({ control: control, name: 'salesChannels' }), fieldState = _d.fieldState, field = _d.field;
     var _e = useAppSelector(connectSelector), data = _e.data, error = _e.error;
     var _f = data.brandData, selectedBrandItem = _f.selectedBrandItem, responseBody = _f.responseBody, defaultSalesChannels = _f.salesChannels;
     var channelList = (responseBody || {}).channel_list;
+    var selectedBrandControl = getValues('selectedBrandItem');
     React.useEffect(function () {
         if (selectedBrandItem.id) {
             setValue('selectedBrandItem', selectedBrandItem);
@@ -32,6 +33,6 @@ var SalesChannels = function (_a) {
             dispatch(clearError());
         field.onChange(channels);
     };
-    return (_jsx(_Fragment, { children: _jsx(SalesChannel, { error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, list: channelList, onChange: onChange, defaultValues: selectedSalesChannels }) }));
+    return (_jsx(SalesChannel, { error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, list: channelList, selectFirstIconListener: selectedBrandControl === null || selectedBrandControl === void 0 ? void 0 : selectedBrandControl.id, onChange: onChange, defaultValue: selectedSalesChannels }));
 };
 export default SalesChannels;

package/build/features/connectExpress/ConnectExpress.d.ts

@@ -6,5 +6,6 @@ export interface ConnectExpressLibProps extends LibConfig {
     postURL: string;
 }
 export declare function ConnectExpressLib(props: ConnectExpressLibProps): JSX.Element;
-export declare function renderConnectExpressLib(config: ConnectExpressLibProps, elementId: string): void;
-export declare function unmountConnectExpressLib(elementId: string, unmountTimeout?: number): void;
+export declare function renderConnectExpressLib(config: ConnectExpressLibProps, elementId: string): {
+    unmount: () => void;
+};

package/build/features/connectExpress/ConnectExpress.js

@@ -63,12 +63,12 @@ import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepSta
 import { handleCurrentActiveScreen, settingsSelector, handleOpen } from '../../app/settings';
 import AnimationFlow from '../../components/AnimationFlow';
 import { store } from '../../app/store';
-import { connectExpressSelector, setIsLeadIdPassed, setResponseData, setPostUrl } from '../app/connectExpress/connectExpressStore';
+import { connectExpressSelector, setIsLeadIdPassed, setResponseData, setPostUrl, setLeadId } from '../app/connectExpress/connectExpressStore';
 import API from '../../api';
 import { ReduxProvider, ThemeProvider } from '../../components/Providers';
 import Collapse from '../../components/Collapse';
-import { reactElement, removeElement, isKW } from '../../utils';
-import { CONNECT_EXPRESS_SCREENS_NAVIGATION, DIALOG_ID } from '../../constants';
+import { reactElement, isKW } from '../../utils';
+import { CONNECT_EXPRESS_SCREENS_NAVIGATION } from '../../constants';
 import { connectExpressFeatureScreens } from '../featuresScreens';
 import CustomFooter from '../shared/Footer';
 import Background from '../shared/Background';
@@ -89,6 +89,7 @@ var ConnectExpress = memo(function (_a) {
                     if (!leadId)
                         return [2];
                     dispatch(setIsLeadIdPassed(true));
+                    dispatch(setLeadId(leadId));
                     return [4, API.leadService.getLeadById(leadId)];
                 case 1:
                     leadData = _a.sent();
@@ -120,15 +121,7 @@ export function ConnectExpressLib(props) {
     return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(ConnectExpress, __assign({}, props)) })));
 }
 export function renderConnectExpressLib(config, elementId) {
-    reactElement(elementId).render(_jsx(ConnectExpress, __assign({}, config)));
-}
-export function unmountConnectExpressLib(elementId, unmountTimeout) {
-    if (unmountTimeout === void 0) { unmountTimeout = 1000; }
-    var element = document.getElementById(elementId);
-    setTimeout(function () {
-        var _a;
-        ((_a = element === null || element === void 0 ? void 0 : element.children) === null || _a === void 0 ? void 0 : _a.length) && element.removeChild(element.children[0]);
-        removeElement(DIALOG_ID);
-        elementId && reactElement(elementId).unmount();
-    }, unmountTimeout);
+    var _a = reactElement(elementId), render = _a.render, unmount = _a.unmount;
+    render(_jsx(ConnectExpress, __assign({}, config)));
+    return { unmount: unmount };
 }

package/build/features/connectExpress/screens/CivilID/CivilID.js

@@ -9,17 +9,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
@@ -27,9 +16,9 @@ import { alpha, styled } from '@mui/material/styles';
 import { useForm, FormProvider } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { civilIDValidationSchema } from './validation';
-import { useAppDispatch, useLanguage, useAppSelector, useSetFromDefaultValues } from '../../../../hooks';
-import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
-import { clearError, connectSelector, createCivilIdAuth, resetMobileScreen, resetStore } from '../../../app/connect/connectStore';
+import { useAppDispatch, useLanguage, useAppSelector } from '../../../../hooks';
+import { handlePrevScreenStep } from '../../../../app/settings';
+import { clearError, connectExpressSelector, createCivilAuthAsync, resetStore } from '../../../app/connectExpress/connectExpressStore';
 import Form from '../../../../components/Form';
 import Button, { MobileButton } from '../../../shared/Button';
 import { ScreenContainer } from '../../../shared/Containers';
@@ -70,33 +59,26 @@ var CivilID = function (_a) {
     var isAr = useLanguage().isAr;
     var dispatch = useAppDispatch();
     var t = useTranslation().t;
-    var _b = useAppSelector(connectSelector), data = _b.data, loading = _b.loading, error = _b.error;
-    var settingsStore = useAppSelector(settingsSelector);
-    var _c = data.civilIdData, responseBody = _c.responseBody, defaultValues = __rest(_c, ["responseBody"]);
+    var _b = useAppSelector(connectExpressSelector), data = _b.data, loading = _b.loading, error = _b.error;
     var methods = useForm({
         resolver: yupResolver(civilIDValidationSchema),
-        defaultValues: defaultValues,
+        defaultValues: data.civilIdData,
         mode: 'onChange'
     });
-    useSetFromDefaultValues(methods, data.civilIdData);
     React.useEffect(function () {
-        handleClearError();
-    }, [methods.formState.isValid]);
-    var onSubmit = function (data) {
-        dispatch(createCivilIdAuth(data));
-        dispatch(resetMobileScreen(settingsStore.data.businessCountry));
-    };
-    var handleClearError = function () {
         if (error)
             dispatch(clearError());
-    };
-    var onBack = function () {
-        dispatch(handlePrevScreenStep('CONNECT_MOBILE_STEP'));
-    };
+    }, [methods.formState.isValid]);
     React.useEffect(function () {
         dispatch(resetStore());
     }, []);
+    var onSubmit = function (data) {
+        dispatch(createCivilAuthAsync(data));
+    };
+    var onBack = function () {
+        dispatch(handlePrevScreenStep('CONNECT_EXPRESS_MOBILE_STEP'));
+    };
     var disabled = !methods.formState.isValid || !!error;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(IDNumber, { sx: { mb: methods.formState.isValid ? 7.5 : 0, transition: 'mb 0.3s' } }), _jsx(Button, __assign({ loading: loading, isAr: isAr, disableBack: true, disabled: disabled || settingsStore.loading, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(MobileButton, __assign({ onClick: function () { return onBack(); }, disabled: loading || settingsStore.loading }, { children: t('mobile_button_label') }))] }))] })) })) }));
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(IDNumber, { sx: { mb: methods.formState.isValid ? 7.5 : 0, transition: 'mb 0.3s' } }), _jsx(Button, __assign({ loading: loading, isAr: isAr, disableBack: true, disabled: disabled, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(MobileButton, __assign({ onClick: function () { return onBack(); }, disabled: loading }, { children: t('mobile_button_label') }))] }))] })) })) }));
 };
 export default React.memo(CivilID);

package/build/features/connectExpress/screens/CivilID/IDNumber.js

@@ -40,10 +40,6 @@ var IDNumber = React.forwardRef(function (_a, ref) {
     var t = useTranslation().t;
     var _c = useFormContext(), control = _c.control, setValue = _c.setValue;
     var civilIdControl = useController({ control: control, name: 'civilId' });
-    React.useEffect(function () {
-        if (civilIdControl.field.value)
-            setValue('civilId', civilIdControl.field.value, { shouldValidate: true });
-    }, []);
     var handleIdChange = function (_a) {
         var target = _a.target;
         var value = removeAllOtherThanCharsAndNumber(target.value);

package/build/features/connectExpress/screens/Mobile/Mobile.js

@@ -9,17 +9,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import Box from '@mui/material/Box';
@@ -30,13 +19,12 @@ import { styled, alpha } from '@mui/material/styles';
 import Collapse from '../../../../components/Collapse';
 import Form from '../../../../components/Form';
 import Button, { AbsherButton, MobileButton } from '../../../shared/Button';
-import { useAppDispatch, useAppSelector, useSetFromDefaultValues } from '../../../../hooks';
+import { useAppDispatch, useAppSelector, useCountry } from '../../../../hooks';
 import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
 import ScreenContainer from '../../../shared/Containers/ScreenContainer';
-import { clearError, connectSelector, createMobileAuth, resetNIDScreen, resetCivilScreen, resetOTPScreen, resetStore } from '../../../app/connect/connectStore';
+import { clearError, resetStore, connectExpressSelector, createMobileAuthAsync } from '../../../app/connectExpress/connectExpressStore';
 import { useLanguage } from '../../../../hooks';
 import Divider from '@mui/material/Divider';
-import { isKW } from '../../../../utils';
 import Text from '../../../../components/Text';
 import MIDTitle from './Title';
 import MobileNumber from './MobileNumber';
@@ -79,55 +67,43 @@ var OrBoxStyled = styled(Box)(function (_a) {
         marginInline: theme.spacing(2.5)
     });
 });
-var ListType;
-(function (ListType) {
-    ListType["BusinessList"] = "BusinessList";
-    ListType["CountryCodeList"] = "CountryCodeList";
-})(ListType || (ListType = {}));
 var Mobile = function (_a) {
-    var _b;
-    var settingsStore = useAppSelector(settingsSelector);
-    var _c = useAppSelector(connectSelector), data = _c.data, loading = _c.loading, error = _c.error;
-    var _d = React.useState(), listType = _d[0], setListType = _d[1];
-    var _e = data.mobileData, countryCode = _e.countryCode, mobile = _e.mobile;
+    var settingData = useAppSelector(settingsSelector).data;
+    var _b = useAppSelector(connectExpressSelector), data = _b.data, loading = _b.loading, error = _b.error;
+    var _c = React.useState(false), anchor = _c[0], setAnchor = _c[1];
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
     var dispatch = useAppDispatch();
-    var _f = data.mobileData, responseBody = _f.responseBody, defaultValues = __rest(_f, ["responseBody"]);
+    var isKuwait = useCountry(settingData.businessCountry.iso2).isKuwait;
     var methods = useForm({
         resolver: yupResolver(PhoneValidationSchema),
-        defaultValues: defaultValues,
+        defaultValues: data.mobileData,
         mode: 'onChange'
     });
-    useSetFromDefaultValues(methods, defaultValues);
-    var t = useTranslation().t;
-    var isAr = useLanguage().isAr;
-    var handleMenuListClick = function (flag) {
-        setListType(flag);
-    };
-    React.useEffect(function () {
-        dispatch(resetOTPScreen());
-    }, []);
     React.useEffect(function () {
         if (error)
             dispatch(clearError());
     }, [methods.formState.isValid]);
+    React.useEffect(function () {
+        dispatch(resetStore());
+    }, []);
+    React.useEffect(function () {
+        dispatch(resetStore());
+    }, []);
     var onSubmit = function (formData) {
-        dispatch(createMobileAuth(formData));
-        dispatch(resetNIDScreen());
-        dispatch(resetCivilScreen());
+        dispatch(createMobileAuthAsync(formData));
     };
-    var isKWCountry = React.useMemo(function () { var _a; return isKW((_a = settingsStore.data.businessCountry) === null || _a === void 0 ? void 0 : _a.iso2); }, [(_b = settingsStore.data.businessCountry) === null || _b === void 0 ? void 0 : _b.iso2]);
     var onBack = function () {
-        dispatch(handlePrevScreenStep(isKWCountry ? 'CONNECT_CIVIL_ID_STEP' : 'CONNECT_NID_STEP'));
+        var screen = isKuwait ? 'CONNECT_EXPRESS_CIVIL_ID_STEP' : 'CONNECT_EXPRESS_NID_STEP';
+        dispatch(handlePrevScreenStep(screen));
+    };
+    var handleCountryOpen = function () {
+        setAnchor(true);
+    };
+    var handleCountryClose = function () {
+        setAnchor(false);
     };
-    React.useEffect(function () {
-        dispatch(resetStore());
-    }, []);
-    var isBusinessListActive = listType === ListType.BusinessList;
-    var isCountryListActive = listType === ListType.CountryCodeList;
-    var listActive = isBusinessListActive || isCountryListActive;
     var disabled = !methods.formState.isValid || !!error;
-    var title = t('join_our_community');
-    var subTitle = t('ide_terms_and_conditions_description');
-    return (_jsxs(ScreenContainer, { children: [(title || subTitle) && _jsx(MIDTitle, { show: !listActive, title: title, description: subTitle }), _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(InputsContainerStyled, { children: _jsx(MobileNumber, { show: !isBusinessListActive, countries: settingsStore.data.countries, onListOpen: function () { return handleMenuListClick(ListType.CountryCodeList); }, onListClose: function () { return handleMenuListClick(); } }) }), _jsxs(Collapse, __assign({ in: !listActive }, { children: [_jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: disabled || settingsStore.loading, loading: loading, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), isKWCountry ? (_jsx(MobileButton, __assign({ disabled: settingsStore.loading || loading, onClick: function () { return onBack(); }, icon: ICONS_NAMES.PACI_ICON }, { children: t('paci_button_label') }))) : (_jsx(AbsherButton, __assign({ disabled: settingsStore.loading || loading, onClick: function () { return onBack(); } }, { children: t('absher_button_label') })))] }))] }))] })) }))] }));
+    return (_jsxs(ScreenContainer, { children: [_jsx(MIDTitle, { show: !anchor, title: t('join_our_community'), description: t('ide_terms_and_conditions_description') }), _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(InputsContainerStyled, { children: _jsx(MobileNumber, { show: !anchor, countries: settingData.countries, onListOpen: handleCountryOpen, onListClose: handleCountryClose }) }), _jsxs(Collapse, __assign({ in: !anchor }, { children: [_jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), isKuwait ? (_jsx(MobileButton, __assign({ disabled: loading, onClick: function () { return onBack(); }, icon: ICONS_NAMES.PACI_ICON }, { children: t('paci_button_label') }))) : (_jsx(AbsherButton, __assign({ disabled: loading, onClick: function () { return onBack(); } }, { children: t('absher_button_label') })))] }))] }))] })) }))] }));
 };
 export default React.memo(Mobile);

package/build/features/connectExpress/screens/NID/DOB.js

@@ -16,7 +16,7 @@ import { useAppDispatch, useAppSelector } from '../../../../hooks';
 import { ScreenContainer } from '../../../shared/Containers';
 import DatePicker from '../../../../components/DatePicker';
 import { alpha, styled } from '@mui/material/styles';
-import { clearError, connectSelector } from '../../../app/connect/connectStore';
+import { clearError, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
 import Text from '../../../../components/Text';
 var InputLabelStyled = styled(Text)(function (_a) {
     var theme = _a.theme;
@@ -29,7 +29,7 @@ var DOB = function (_a) {
     var control = useFormContext().control;
     var dispatch = useAppDispatch();
     var dobControl = useController({ control: control, name: 'dob' });
-    var error = useAppSelector(connectSelector).error;
+    var error = useAppSelector(connectExpressSelector).error;
     var handleBirthDateChange = function (data) {
         dobControl.field.onChange(data);
         handleClearError();

package/build/features/connectExpress/screens/NID/IDNumber.js

@@ -39,12 +39,8 @@ var IDNumber = React.forwardRef(function (_a, ref) {
     var _b;
     var show = _a.show;
     var t = useTranslation().t;
-    var _c = useFormContext(), control = _c.control, setValue = _c.setValue;
+    var control = useFormContext().control;
     var nidControl = useController({ control: control, name: 'nid' });
-    React.useEffect(function () {
-        if (nidControl.field.value)
-            setValue('nid', nidControl.field.value, { shouldValidate: true });
-    }, [show]);
     var handleIdChange = function (_a) {
         var target = _a.target;
         var value = removeAllCharsFromNumber(target.value);

package/build/features/connectExpress/screens/NID/NID.js

@@ -17,8 +17,8 @@ import { useForm, FormProvider } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { NIDValidationSchema } from './validation';
 import { useAppDispatch, useLanguage, useAppSelector } from '../../../../hooks';
-import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
-import { clearError, connectSelector, createNIDAuth, resetMobileScreen, resetStore } from '../../../app/connect/connectStore';
+import { handlePrevScreenStep } from '../../../../app/settings';
+import { clearError, connectExpressSelector, createNIDAuthAsync, resetStore } from '../../../app/connectExpress/connectExpressStore';
 import Form from '../../../../components/Form';
 import Button, { MobileButton } from '../../../shared/Button';
 import { ScreenContainer } from '../../../shared/Containers';
@@ -61,34 +61,29 @@ var NID = function (_a) {
     var isAr = useLanguage().isAr;
     var dispatch = useAppDispatch();
     var t = useTranslation().t;
-    var _c = useAppSelector(connectSelector), data = _c.data, loading = _c.loading, error = _c.error;
-    var settingsStore = useAppSelector(settingsSelector);
+    var _c = useAppSelector(connectExpressSelector), data = _c.data, loading = _c.loading, error = _c.error;
     var methods = useForm({
         resolver: yupResolver(NIDValidationSchema),
         defaultValues: data.nidData,
         mode: 'onChange'
     });
     React.useEffect(function () {
-        handleClearError();
+        if (error)
+            dispatch(clearError());
     }, [methods.formState.isValid]);
+    React.useEffect(function () {
+        dispatch(resetStore());
+    }, []);
     var onSubmit = function (data) {
-        dispatch(createNIDAuth(data));
-        dispatch(resetMobileScreen(settingsStore.data.businessCountry));
+        dispatch(createNIDAuthAsync(data));
     };
     var handleCollapseOpenClose = function (flag) {
         setCollapse(flag);
     };
-    var handleClearError = function () {
-        if (error)
-            dispatch(clearError());
-    };
     var onBack = function () {
-        dispatch(handlePrevScreenStep('CONNECT_MOBILE_STEP'));
+        dispatch(handlePrevScreenStep('CONNECT_EXPRESS_MOBILE_STEP'));
     };
-    React.useEffect(function () {
-        dispatch(resetStore());
-    }, []);
     var disabled = !methods.formState.isValid || !!error;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(IDNumber, { show: !collapse }) })), _jsx(DOB, { onDateClicked: handleCollapseOpenClose }), _jsxs(Collapse, __assign({ in: !collapse }, { children: [_jsx(Button, __assign({ loading: loading, isAr: isAr, disableBack: true, disabled: disabled || settingsStore.loading, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(MobileButton, __assign({ onClick: function () { return onBack(); }, disabled: loading || settingsStore.loading }, { children: t('mobile_button_label') }))] }))] }))] })) })) }));
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Collapse, __assign({ in: !collapse }, { children: _jsx(IDNumber, { show: !collapse }) })), _jsx(DOB, { onDateClicked: handleCollapseOpenClose }), _jsxs(Collapse, __assign({ in: !collapse }, { children: [_jsx(Button, __assign({ loading: loading, isAr: isAr, disableBack: true, disabled: disabled, error: t(error || '') }, { children: t('next') })), _jsxs(Collapse, __assign({ in: !methods.formState.isValid }, { children: [_jsxs(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(MobileButton, __assign({ onClick: function () { return onBack(); }, disabled: loading }, { children: t('mobile_button_label') }))] }))] }))] })) })) }));
 };
 export default React.memo(NID);

package/build/features/connectExpress/screens/OTP/OTP.js

@@ -9,27 +9,16 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Box from '@mui/material/Box/Box';
 import { styled } from '@mui/material/styles';
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import Text from '../../../../components/Text';
-import { clearError, connectSelector, resetOTPScreen, verifyAuth } from '../../../app/connect/connectStore';
+import { clearError, connectExpressSelector, verifyOtpAsync, resetOTPValue } from '../../../app/connectExpress/connectExpressStore';
 import Button from '../../../shared/Button';
 import { ScreenContainer } from '../../../shared/Containers';
-import { useAppDispatch, useAppSelector, useSetFromDefaultValues } from '../../../../hooks';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
 import { handlePrevScreenStep } from '../../../../app/settings';
 import { useLanguage } from '../../../../hooks';
 import { AuthForType } from '../../../../@types';
@@ -61,29 +50,30 @@ var FormStyled = styled(Form)(function () { return ({
 var OTP = function () {
     var _a;
     var dispatch = useAppDispatch();
-    var _b = useAppSelector(connectSelector), data = _b.data, loading = _b.loading, error = _b.error;
-    var _c = data.otpData, responseBody = _c.responseBody, defaultValues = __rest(_c, ["responseBody"]);
+    var _b = useAppSelector(connectExpressSelector), data = _b.data, loading = _b.loading, error = _b.error;
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
     var methods = useForm({
         resolver: yupResolver(OTPValidation),
-        defaultValues: defaultValues,
+        defaultValues: data.otpData,
         mode: 'onChange'
     });
-    useSetFromDefaultValues(methods, defaultValues);
-    var t = useTranslation().t;
-    var isAr = useLanguage().isAr;
     var startWithNID = data.otpData.authFor === AuthForType.NATIONAL_ID;
     React.useEffect(function () {
         if (error)
             dispatch(clearError());
+    }, [methods.formState.isValid]);
+    React.useEffect(function () {
         return function () {
-            dispatch(resetOTPScreen());
+            dispatch(resetOTPValue());
         };
-    }, [methods.formState.isValid]);
+    }, []);
     var onSubmit = function (formData) {
-        dispatch(verifyAuth(formData));
+        dispatch(verifyOtpAsync(formData));
     };
     var onBack = function () {
-        dispatch(handlePrevScreenStep(startWithNID ? 'CONNECT_NID_STEP' : 'CONNECT_MOBILE_STEP'));
+        var screen = startWithNID ? 'CONNECT_EXPRESS_NID_STEP' : 'CONNECT_EXPRESS_MOBILE_STEP';
+        dispatch(handlePrevScreenStep(screen));
     };
     var disabled = !methods.formState.isValid || !!error;
     var phone = ((_a = data.mobileData.countryCode) === null || _a === void 0 ? void 0 : _a.idd_prefix) + (data.mobileData.mobile || '');

package/build/features/entity/screens/EntityCapital/ActivityList.js

@@ -167,7 +167,7 @@ var ActivitiesList = function (_a) {
     var getSelectedActivityFlag = function (item) {
         return controlValue === null || controlValue === void 0 ? void 0 : controlValue.find(function (activity) { return activity.id === item.id; });
     };
-    return (_jsxs(ScreenContainer, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t(isCR ? 'activities' : 'category') }), _jsx(Tooltip, __assign({ title: t('activities_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] }), _jsxs(Box, { children: [_jsx(InputStyled, { readOnly: true, disabled: disabled, value: getSelectedActivities() || '', placeholder: isCR ? t('choose_activities') : t('category_name'), onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl, timeout: 300 }, { children: _jsx(SimpleListStyled, { searchKeyPath: 'name.en', searchValuePath: isAr ? 'name.ar' : 'name.en', list: activitiesMenuList, onSelectItem: onSelectItem, renderItem: function (item) {
+    return (_jsxs(ScreenContainer, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t(isCR ? 'activities' : 'category') }), _jsx(Tooltip, __assign({ title: t('activities_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] }), _jsxs(Box, { children: [_jsx(InputStyled, { readOnly: true, disabled: disabled, value: getSelectedActivities() || '', placeholder: isCR ? t('choose_activities') : t('category_name'), onClick: disabled ? undefined : !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: disabled ? _jsx(_Fragment, {}) : _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl, timeout: 300 }, { children: _jsx(SimpleListStyled, { searchKeyPath: 'name.en', searchValuePath: ['name.ar', 'name.en'], list: activitiesMenuList, onSelectItem: onSelectItem, renderItem: function (item) {
                                 var _a, _b, _c;
                                 return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(NameContainer, __assign({ isSelected: item.id === ((_a = getSelectedActivityFlag(item)) === null || _a === void 0 ? void 0 : _a.id) }, { children: isAr ? (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.ar : (_c = item === null || item === void 0 ? void 0 : item.name) === null || _c === void 0 ? void 0 : _c.en })) })), getSelectedActivityFlag(item) && _jsx(CheckIconStyled, {})] }));
                             } }) }))] })] }));

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

@@ -48,14 +48,27 @@ var AdditionalIndividualInfo = function (_a) {
     var settingsData = useAppSelector(settingsSelector).data;
     var countries = settingsData.countries;
     var user = (data.verify.responseBody || {}).user;
+    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;
     var methods = useForm({
         resolver: yupResolver(IndividualInfoValidationSchema),
-        defaultValues: data.individualData,
+        defaultValues: {
+            occupation: occupation,
+            sourceIncome: sourceIncome,
+            monthlyIncome: monthlyIncome,
+            employerName: employerName,
+            employerLocation: employerLocation,
+            isPEP: isPEP,
+            isInfluencer: isInfluencer,
+            civilID: civilID,
+            signatureFileId: signatureFileId,
+            civilIDUploading: civilIDUploading,
+            signatureFileUploading: signatureFileUploading
+        },
         mode: 'onChange'
     });
     useSetFromDefaultValues(methods, data.individualData, true);
-    var _c = React.useState(), listActive = _c[0], setListActive = _c[1];
-    var _d = React.useState(false), employerFieldsActive = _d[0], setEmployerFieldsActive = _d[1];
+    var _d = React.useState(), listActive = _d[0], setListActive = _d[1];
+    var _e = React.useState(false), employerFieldsActive = _e[0], setEmployerFieldsActive = _e[1];
     React.useEffect(function () {
         var _a, _b;
         if (((_b = (_a = methods.getValues('sourceIncome')) === null || _a === void 0 ? void 0 : _a.name.en) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'salary')
@@ -76,7 +89,8 @@ var AdditionalIndividualInfo = function (_a) {
     var isEmployerLocationListActive = listActive === ListType.EmployerLocationList;
     var isMonthlyIncomeListActive = listActive === ListType.MonthlyIncomeList;
     var isOccupationListActive = listActive === ListType.OccupationList;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive && !isOccupationListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, {}), _jsx(SignatureFile, { show: user === null || user === void 0 ? void 0 : user.is_authorized })] })), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
+    var disabled = !methods.formState.isValid || civilIDUploading || signatureFileUploading;
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive && !isOccupationListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, {}), _jsx(SignatureFile, { show: user === null || user === void 0 ? void 0 : user.is_authorized })] })), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
 };
 export default React.memo(AdditionalIndividualInfo);
 AdditionalIndividualInfo.defaultProps = {};

package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js

@@ -1,14 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
 import { ScreenContainer } from '../../../../features/shared/Containers';
 import { styled } from '@mui/material/styles';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { individualSelector, uploadCivilIdFile } from '../../../../features/app/individual/individualStore';
-import { MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
-import UploadFile from '../../../../features/shared/UploadFile';
-import { maskFileName } from '../../../../utils';
+import { civilIDUploadingStatus, individualSelector } from '../../../app/individual/individualStore';
+import UploadMultipleFile from '../../../shared/UploadMultipleFile';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -16,66 +13,18 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var CivilIDFile = function () {
-    var _a, _b;
-    var _c = React.useState(0), progress = _c[0], setProgress = _c[1];
+    var _a;
     var t = useTranslation().t;
-    var _d = useFormContext(), control = _d.control, setError = _d.setError, clearErrors = _d.clearErrors, setValue = _d.setValue;
-    var civilIDFileControl = useController({ name: 'civilIDFile', control: control });
-    var civilIDFileIdControl = useController({ name: 'civilID', control: control });
-    var _e = useAppSelector(individualSelector), data = _e.data, loading = _e.loading, sysError = _e.error;
-    var _f = data.attachmentsData, civilIDUploading = _f.civilIDUploading, civilIDFile = _f.civilIDFile, civilID = _f.civilID;
     var dispatch = useAppDispatch();
-    var civilIDValue = civilIDFileControl.field.value;
-    var error = ((_a = civilIDFileControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message) || ((_b = civilIDFileIdControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message);
-    var handleCivilIDChange = function (files) {
-        var _a;
-        var file = files === null || files === void 0 ? void 0 : files[0];
-        if (!VALID_FILE_FORMATS.includes(file === null || file === void 0 ? void 0 : file.type)) {
-            setError('civilIDFile', { message: 'file_not_supported_alert' });
-        }
-        else if ((file === null || file === void 0 ? void 0 : file.size) > MAX_FILE_SIZE) {
-            setError('civilIDFile', { message: 'file_size_alert' });
-        }
-        else {
-            civilIDFileControl.field.onChange(file);
-            dispatch(uploadCivilIdFile({
-                file: file,
-                onProgress: function (value) {
-                    setProgress(value);
-                },
-                title: (_a = data.verify.responseBody) === null || _a === void 0 ? void 0 : _a.merchant_id
-            }));
-        }
+    var control = useFormContext().control;
+    var civilIDFileIdControl = useController({ name: 'civilID', control: control });
+    var _b = useAppSelector(individualSelector), loading = _b.loading, data = _b.data;
+    var handleCivilIDChange = function (ids) {
+        civilIDFileIdControl.field.onChange(ids);
     };
-    var handleReset = function () {
-        civilIDFileControl.field.onChange(null);
-        civilIDFileIdControl.field.onChange('');
-        setProgress(0);
+    var handleReset = function (ids) {
+        civilIDFileIdControl.field.onChange(ids);
     };
-    React.useEffect(function () {
-        if (!!civilIDFile) {
-            setValue('civilIDFile', civilIDFile);
-            setValue('civilID', civilID);
-        }
-    }, [civilIDFile, civilID]);
-    React.useEffect(function () {
-        if (sysError === 'file_upload_error') {
-            setError('civilIDFileId', { message: sysError });
-            civilIDFileControl.field.onChange(null);
-            setProgress(0);
-        }
-    }, [sysError]);
-    React.useEffect(function () {
-        if ((civilIDFileControl.formState.isValid || !!civilIDValue) && error != 'file_upload_error')
-            clearErrors();
-    }, [civilIDFileControl.formState.isValid, civilIDValue]);
-    React.useEffect(function () {
-        if (!!civilIDFile) {
-            civilIDFileControl.field.onChange(civilIDFile);
-            civilIDFileIdControl.field.onChange(civilID);
-        }
-    }, []);
-    var fileName = civilIDValue ? maskFileName(civilIDValue === null || civilIDValue === void 0 ? void 0 : civilIDValue.name) : '';
-    return (_jsx(FeatureStyled, { children: _jsx(UploadFile, { 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, isFileUploaded: !civilIDUploading && !!civilIDValue, isSubmitting: loading, isUploading: civilIDUploading, progress: progress, onReset: handleReset, initialFileName: fileName, error: error && t(error) }) }));
+    return (_jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_civil_id'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_civilID'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_civil_id'), onFileUploaded: handleCivilIDChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, fileTitle: (_a = data.verify.responseBody) === null || _a === void 0 ? void 0 : _a.merchant_id, purpose: 'identity_document', fileUploadingStatus: function (uploading) { return dispatch(civilIDUploadingStatus(uploading)); } }) }));
 };
 export default CivilIDFile;