@tap-payments/auth-jsconnect 2.0.101-test → 2.0.103-test

package/build/features/connect/screens/Merchant/validation.d.ts

@@ -1,32 +1,32 @@
-import * as yup from 'yup';
-export declare const MerchantValidationSchema: (isNewBrand?: boolean) => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>[] | undefined>;
-}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>[] | undefined>;
-}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
-        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    }>>[] | undefined>;
-}>>>;
+import * as yup from 'yup';
+export declare const MerchantValidationSchema: (isNewBrand?: boolean) => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>[] | undefined>;
+}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>[] | undefined>;
+}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+    salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
+        id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    }>>[] | undefined>;
+}>>>;

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

@@ -1,132 +1,132 @@
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { REGEX_WEBSITE, REGEX_BRAND_NAME, LINKEDIN_URL, SOCIAL_USERNAME, DIGITS_ONLY, REGEX_PHONE_APP_NAME } from '../../../../constants';
-import * as yup from 'yup';
-var validationSalesChannels = function (channels) {
-    if (channels === void 0) { channels = []; }
-    var dic = {};
-    var typeDic = {};
-    channels.forEach(function (channel) {
-        var _a, _b, _c;
-        if ((_a = channel.sub) === null || _a === void 0 ? void 0 : _a.length) {
-            var key_1 = (_b = channel.code) === null || _b === void 0 ? void 0 : _b.toLowerCase();
-            if (key_1)
-                dic[key_1] = [];
-            channel.sub.forEach(function (sub) {
-                dic[key_1].push(sub.address || '');
-                typeDic[sub.code] = sub.address || '';
-            });
-        }
-        else {
-            var key = (_c = channel.code) === null || _c === void 0 ? void 0 : _c.toLowerCase();
-            if (key)
-                dic[key] = [channel.address || ''];
-            typeDic[key] = channel.address || '';
-        }
-    });
-    for (var key in dic) {
-        var values = dic[key];
-        var atLestOne = values.every(function (item) { return item === ''; });
-        if (atLestOne)
-            return "enter_at_least_one_".concat(key);
-    }
-    console.log('dic', dic);
-    console.log('typeDic', typeDic);
-    for (var key in typeDic) {
-        var value = typeDic[key];
-        if (key === 'website' && value && !value.match(REGEX_WEBSITE)) {
-            return 'invalid_url';
-        }
-        if (key === 'linkedin' && value && !value.match(LINKEDIN_URL)) {
-            return 'invalid_linkedin_profile_url';
-        }
-        if (key === 'facebook' && value && !value.match(SOCIAL_USERNAME)) {
-            return 'invalid_facebook_username';
-        }
-        if (key === 'instagram' && value && !value.match(SOCIAL_USERNAME)) {
-            return 'invalid_instagram_username';
-        }
-        if (key === 'twitter' && value && !value.match(SOCIAL_USERNAME)) {
-            return 'invalid_twitter_username';
-        }
-        if (key === 'physical_store' && value && value.length < 3) {
-            return 'invalid_physical_store_location';
-        }
-        if (key === 'ios' && value && !value.match(REGEX_PHONE_APP_NAME)) {
-            return 'invalid_ios_app';
-        }
-        if (key === 'android' && value && !value.match(REGEX_PHONE_APP_NAME)) {
-            return 'invalid_android_app';
-        }
-        if (key === 'call_center' && value && !value.match(DIGITS_ONLY)) {
-            return 'invalid_call_center_number';
-        }
-    }
-    return true;
-};
-export var MerchantValidationSchema = function (isNewBrand) {
-    if (isNewBrand === void 0) { isNewBrand = true; }
-    if (isNewBrand)
-        return yup.object().shape({
-            brandName: yup
-                .string()
-                .test({
-                test: function (value) {
-                    if (length === 0)
-                        return true;
-                    if (length < 3 || !(value === null || value === void 0 ? void 0 : value.match(REGEX_BRAND_NAME)))
-                        return this.createError({ message: 'enter_brand_name_english_chars_numbers_space' });
-                    return true;
-                }
-            })
-                .required('enter_brand_name_english_chars_numbers_space'),
-            termAndConditionChecked: yup.boolean().isTrue('check_terms_cond').required('check_terms_cond'),
-            salesChannels: yup
-                .array()
-                .min(1, 'choose_atleast_one_channel')
-                .of(yup.object().shape({
-                id: yup.string().required('choose_atleast_one_channel')
-            }))
-                .test({
-                test: function (value) {
-                    var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
-                    if (length === 0)
-                        return true;
-                    var channels = __spreadArray([], (value || []), true);
-                    var result = validationSalesChannels(channels);
-                    if (result === true)
-                        return true;
-                    return this.createError({ message: result });
-                }
-            })
-                .required('choose_atleast_one_channel')
-        });
-    return yup.object().shape({
-        salesChannels: yup
-            .array()
-            .min(1, 'choose_atleast_one_channel')
-            .of(yup.object().shape({
-            id: yup.string().required('choose_atleast_one_channel')
-        }))
-            .test({
-            test: function (value) {
-                var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
-                if (length === 0)
-                    return true;
-                var channels = __spreadArray([], (value || []), true);
-                var result = validationSalesChannels(channels);
-                if (result === true)
-                    return true;
-                return this.createError({ message: result });
-            }
-        })
-            .required('choose_atleast_one_channel')
-    });
-};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { REGEX_WEBSITE, REGEX_BRAND_NAME, LINKEDIN_URL, SOCIAL_USERNAME, DIGITS_ONLY, REGEX_PHONE_APP_NAME } from '../../../../constants';
+import * as yup from 'yup';
+var validationSalesChannels = function (channels) {
+    if (channels === void 0) { channels = []; }
+    var dic = {};
+    var typeDic = {};
+    channels.forEach(function (channel) {
+        var _a, _b, _c;
+        if ((_a = channel.sub) === null || _a === void 0 ? void 0 : _a.length) {
+            var key_1 = (_b = channel.code) === null || _b === void 0 ? void 0 : _b.toLowerCase();
+            if (key_1)
+                dic[key_1] = [];
+            channel.sub.forEach(function (sub) {
+                dic[key_1].push(sub.address || '');
+                typeDic[sub.code] = sub.address || '';
+            });
+        }
+        else {
+            var key = (_c = channel.code) === null || _c === void 0 ? void 0 : _c.toLowerCase();
+            if (key)
+                dic[key] = [channel.address || ''];
+            typeDic[key] = channel.address || '';
+        }
+    });
+    for (var key in dic) {
+        var values = dic[key];
+        var atLestOne = values.every(function (item) { return item === ''; });
+        if (atLestOne)
+            return "enter_at_least_one_".concat(key);
+    }
+    console.log('dic', dic);
+    console.log('typeDic', typeDic);
+    for (var key in typeDic) {
+        var value = typeDic[key];
+        if (key === 'website' && value && !value.match(REGEX_WEBSITE)) {
+            return 'invalid_url';
+        }
+        if (key === 'linkedin' && value && !value.match(LINKEDIN_URL)) {
+            return 'invalid_linkedin_profile_url';
+        }
+        if (key === 'facebook' && value && !value.match(SOCIAL_USERNAME)) {
+            return 'invalid_facebook_username';
+        }
+        if (key === 'instagram' && value && !value.match(SOCIAL_USERNAME)) {
+            return 'invalid_instagram_username';
+        }
+        if (key === 'twitter' && value && !value.match(SOCIAL_USERNAME)) {
+            return 'invalid_twitter_username';
+        }
+        if (key === 'physical_store' && value && value.length < 3) {
+            return 'invalid_physical_store_location';
+        }
+        if (key === 'ios' && value && !value.match(REGEX_PHONE_APP_NAME)) {
+            return 'invalid_ios_app';
+        }
+        if (key === 'android' && value && !value.match(REGEX_PHONE_APP_NAME)) {
+            return 'invalid_android_app';
+        }
+        if (key === 'call_center' && value && !value.match(DIGITS_ONLY)) {
+            return 'invalid_call_center_number';
+        }
+    }
+    return true;
+};
+export var MerchantValidationSchema = function (isNewBrand) {
+    if (isNewBrand === void 0) { isNewBrand = true; }
+    if (isNewBrand)
+        return yup.object().shape({
+            brandName: yup
+                .string()
+                .test({
+                test: function (value) {
+                    if (length === 0)
+                        return true;
+                    if (length < 3 || !(value === null || value === void 0 ? void 0 : value.match(REGEX_BRAND_NAME)))
+                        return this.createError({ message: 'enter_brand_name_english_chars_numbers_space' });
+                    return true;
+                }
+            })
+                .required('enter_brand_name_english_chars_numbers_space'),
+            termAndConditionChecked: yup.boolean().isTrue('check_terms_cond').required('check_terms_cond'),
+            salesChannels: yup
+                .array()
+                .min(1, 'choose_atleast_one_channel')
+                .of(yup.object().shape({
+                id: yup.string().required('choose_atleast_one_channel')
+            }))
+                .test({
+                test: function (value) {
+                    var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
+                    if (length === 0)
+                        return true;
+                    var channels = __spreadArray([], (value || []), true);
+                    var result = validationSalesChannels(channels);
+                    if (result === true)
+                        return true;
+                    return this.createError({ message: result });
+                }
+            })
+                .required('choose_atleast_one_channel')
+        });
+    return yup.object().shape({
+        salesChannels: yup
+            .array()
+            .min(1, 'choose_atleast_one_channel')
+            .of(yup.object().shape({
+            id: yup.string().required('choose_atleast_one_channel')
+        }))
+            .test({
+            test: function (value) {
+                var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
+                if (length === 0)
+                    return true;
+                var channels = __spreadArray([], (value || []), true);
+                var result = validationSalesChannels(channels);
+                if (result === true)
+                    return true;
+                return this.createError({ message: result });
+            }
+        })
+            .required('choose_atleast_one_channel')
+    });
+};

package/build/features/connect/screens/Mobile/Mobile.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
-export interface MobileProps {
-}
-declare const _default: React.MemoExoticComponent<({}: MobileProps) => JSX.Element>;
-export default _default;
+import * as React from 'react';
+export interface MobileProps {
+}
+declare const _default: React.MemoExoticComponent<({}: MobileProps) => JSX.Element>;
+export default _default;

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

@@ -1,121 +1,121 @@
-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 Box from '@mui/material/Box';
-import { useForm, FormProvider } from 'react-hook-form';
-import { yupResolver } from '@hookform/resolvers/yup';
-import { useTranslation } from 'react-i18next';
-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 } from '../../../../hooks';
-import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
-import ScreenContainer from '../../../shared/Containers/ScreenContainer';
-import { clearError, connectSelector, createMobileAuth, resetNIDScreen, resetCivilScreen, resetOTPScreen } from '../../../app/connect/connectStore';
-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';
-import { PhoneValidationSchema } from './validation';
-import { ICONS_NAMES } from '../../../../constants';
-var FormStyled = styled(Form)(function () { return ({
-    display: 'flex',
-    flexDirection: 'column'
-}); });
-var InputsContainerStyled = styled(Box)(function (_a) {
-    var _b;
-    var theme = _a.theme;
-    return (_b = {},
-        _b[theme.transitions.create(['padding-bottom'])] = {
-            duration: theme.transitions.duration.standard
-        },
-        _b);
-});
-var TextStyled = styled(Text)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        color: alpha(theme.palette.primary.dark, 0.4)
-    });
-});
-var DividerStyled = styled(Divider)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        width: '45%',
-        borderColor: alpha(theme.palette.primary.dark, 0.4),
-        marginBlockEnd: theme.spacing(0.62)
-    });
-});
-var OrBoxStyled = styled(Box)(function (_a) {
-    var theme = _a.theme;
-    return ({
-        display: 'flex',
-        justifyContent: 'space-between',
-        marginBlockEnd: theme.spacing(1.62),
-        marginBlockStart: theme.spacing(-1.25),
-        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 dispatch = useAppDispatch();
-    var methods = useForm({
-        resolver: yupResolver(PhoneValidationSchema),
-        defaultValues: data.mobileData,
-        mode: 'onChange'
-    });
-    var t = useTranslation().t;
-    var isAr = useLanguage().isAr;
-    var handleMenuListClick = function (flag) {
-        setListType(flag);
-    };
-    React.useEffect(function () {
-        if (data.mobileData.countryCode) {
-            methods.setValue('countryCode', data.mobileData.countryCode);
-        }
-    }, [data.mobileData]);
-    React.useEffect(function () {
-        dispatch(resetOTPScreen());
-    }, []);
-    React.useEffect(function () {
-        if (error)
-            dispatch(clearError());
-    }, [methods.formState.isValid]);
-    var onSubmit = function (formData) {
-        dispatch(createMobileAuth(formData));
-        dispatch(resetNIDScreen());
-        dispatch(resetCivilScreen());
-    };
-    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 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') })))] }))] }))] })) }))] }));
-};
-export default React.memo(Mobile);
+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 Box from '@mui/material/Box';
+import { useForm, FormProvider } from 'react-hook-form';
+import { yupResolver } from '@hookform/resolvers/yup';
+import { useTranslation } from 'react-i18next';
+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 } from '../../../../hooks';
+import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
+import ScreenContainer from '../../../shared/Containers/ScreenContainer';
+import { clearError, connectSelector, createMobileAuth, resetNIDScreen, resetCivilScreen, resetOTPScreen } from '../../../app/connect/connectStore';
+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';
+import { PhoneValidationSchema } from './validation';
+import { ICONS_NAMES } from '../../../../constants';
+var FormStyled = styled(Form)(function () { return ({
+    display: 'flex',
+    flexDirection: 'column'
+}); });
+var InputsContainerStyled = styled(Box)(function (_a) {
+    var _b;
+    var theme = _a.theme;
+    return (_b = {},
+        _b[theme.transitions.create(['padding-bottom'])] = {
+            duration: theme.transitions.duration.standard
+        },
+        _b);
+});
+var TextStyled = styled(Text)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        color: alpha(theme.palette.primary.dark, 0.4)
+    });
+});
+var DividerStyled = styled(Divider)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        width: '45%',
+        borderColor: alpha(theme.palette.primary.dark, 0.4),
+        marginBlockEnd: theme.spacing(0.62)
+    });
+});
+var OrBoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'space-between',
+        marginBlockEnd: theme.spacing(1.62),
+        marginBlockStart: theme.spacing(-1.25),
+        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 dispatch = useAppDispatch();
+    var methods = useForm({
+        resolver: yupResolver(PhoneValidationSchema),
+        defaultValues: data.mobileData,
+        mode: 'onChange'
+    });
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
+    var handleMenuListClick = function (flag) {
+        setListType(flag);
+    };
+    React.useEffect(function () {
+        if (data.mobileData.countryCode) {
+            methods.setValue('countryCode', data.mobileData.countryCode);
+        }
+    }, [data.mobileData]);
+    React.useEffect(function () {
+        dispatch(resetOTPScreen());
+    }, []);
+    React.useEffect(function () {
+        if (error)
+            dispatch(clearError());
+    }, [methods.formState.isValid]);
+    var onSubmit = function (formData) {
+        dispatch(createMobileAuth(formData));
+        dispatch(resetNIDScreen());
+        dispatch(resetCivilScreen());
+    };
+    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 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') })))] }))] }))] })) }))] }));
+};
+export default React.memo(Mobile);

package/build/features/connect/screens/Mobile/MobileNumber.d.ts

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