@tap-payments/auth-jsconnect 2.5.23-test → 2.6.0

package/build/features/tax/screens/Verify/Verify.d.ts

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

package/build/features/tax/screens/Verify/Verify.js

@@ -46,9 +46,9 @@ var FormStyled = styled(Form)(function () { return ({
     flexDirection: 'column'
 }); });
 var VerifyNumber = function (_a) {
-    var _b, _c, _d, _e;
+    var _b, _c;
     var dispatch = useAppDispatch();
-    var _f = useAppSelector(taxSelector), data = _f.data, loading = _f.loading, error = _f.error;
+    var _d = useAppSelector(taxSelector), data = _d.data, loading = _d.loading, error = _d.error;
     var methods = useForm({
         resolver: yupResolver(OTPValidation),
         defaultValues: data.otpData,
@@ -57,8 +57,8 @@ var VerifyNumber = function (_a) {
     useSetFromDefaultValues(methods, data.otpData);
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
-    var _g = React.useState(false), resendLoading = _g[0], setResendLoading = _g[1];
-    var phone = (_e = (_d = (_c = (_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.user) === null || _c === void 0 ? void 0 : _c.contact) === null || _d === void 0 ? void 0 : _d.phone) === null || _e === void 0 ? void 0 : _e.number;
+    var _e = React.useState(false), resendLoading = _e[0], setResendLoading = _e[1];
+    var phone = (_c = (_b = data.verify.responseBody) === null || _b === void 0 ? void 0 : _b.verification_by) === null || _c === void 0 ? void 0 : _c.sent_to;
     React.useEffect(function () {
         if (error && methods.formState.isValid && phone)
             dispatch(clearError());
@@ -69,7 +69,7 @@ var VerifyNumber = function (_a) {
     var onSubmit = function (formData) {
         dispatch(verifyTaxLeadOTP(deepCopy(formData)));
     };
-    var disabled = !methods.formState.isValid || !!error || !phone || resendLoading;
+    var disabled = !methods.formState.isValid || !phone || resendLoading;
     return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(OTPTitleContainerStyled, { children: _jsxs(OTPTitleStyled, { children: [loading ? t('ide_otp_waiting_title') : t('ide_opt_sent_title'), !loading && phone && _jsx("span", __assign({ dir: 'ltr' }, { children: "".concat(maskPhone(phone || '')) }))] }) }), _jsx(OTPInput, { loading: resendLoading, setLoading: setResendLoading }), _jsx(Button, __assign({ disableBack: true, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('next') }))] })) })) }));
 };
 export default React.memo(VerifyNumber);

package/build/hooks/index.d.ts

@@ -13,6 +13,7 @@ export * from './useStepStartedListener';
 export * from './useScreen';
 export * from './useSetFromDefaultValues';
 export * from './useCountUp';
+export * from './useCountDown';
 export * from './useCountry';
 export * from './useVerifyToken';
 export * from './useFormReadOnly';
@@ -20,3 +21,4 @@ export * from './useDataNoneEditable';
 export * from './useFormErrorAndUpdateReadOnly';
 export * from './useExcludeReadOnlyFelids';
 export * from './useDataVerified';
+export * from './useFormDirtyCheck';

package/build/hooks/index.js

@@ -13,6 +13,7 @@ export * from './useStepStartedListener';
 export * from './useScreen';
 export * from './useSetFromDefaultValues';
 export * from './useCountUp';
+export * from './useCountDown';
 export * from './useCountry';
 export * from './useVerifyToken';
 export * from './useFormReadOnly';
@@ -20,3 +21,4 @@ export * from './useDataNoneEditable';
 export * from './useFormErrorAndUpdateReadOnly';
 export * from './useExcludeReadOnlyFelids';
 export * from './useDataVerified';
+export * from './useFormDirtyCheck';

package/build/hooks/useAppConfig.d.ts

@@ -1,4 +1,4 @@
-import { ConfigExpressTokenParams, LibConfig, ScreenStepNavigation } from '../@types';
+import { ConfigInfo, LibConfig, ScreenStepNavigation } from '../@types';
 interface AppConfigProps extends LibConfig {
     navigation: ScreenStepNavigation[];
     disableCountries?: boolean;
@@ -6,7 +6,7 @@ interface AppConfigProps extends LibConfig {
     disableSettingFetching?: boolean;
     maturity?: 'full' | 'express';
     configToken?: string;
-    onVerifyConfigTokenSuccess?: (data: ConfigExpressTokenParams) => Promise<void>;
+    onVerifyConfigTokenSuccess?: (data: ConfigInfo) => Promise<void>;
 }
-export declare const useAppConfig: ({ appInfo, navigation, publicKey, disableCountries, disableLocale, disableSettingFetching, maturity, boardMaturity, configToken, onVerifyConfigTokenSuccess, ...rest }: AppConfigProps) => void;
+export declare const useAppConfig: ({ appInfo, navigation, publicKey, disableCountries, disableLocale, disableSettingFetching, maturity, boardMaturity, configToken, onVerifyConfigTokenSuccess, scope, mode, showBoard, features, ...rest }: AppConfigProps) => void;
 export {};

package/build/hooks/useAppConfig.js

@@ -24,17 +24,19 @@ import { useEffect } from 'react';
 import { handleActiveFlowScreens, handleSetAppConfig, handleLanguage, handleOpen, handleIsTapOrigin, fetchAppSettingsSync, handelBoardMaturity, settingsSelector } from '../app/settings';
 import { useAppDispatch } from './useAppDispatch';
 import { useAppSelector } from './useAppSelector';
-import { isTapDomain, removeRequestHeaders, setBaseUrl } from '../utils';
+import { isConnectTapDomain, removeRequestHeaders, setBaseUrl } from '../utils';
 export var useAppConfig = function (_a) {
-    var appInfo = _a.appInfo, navigation = _a.navigation, publicKey = _a.publicKey, disableCountries = _a.disableCountries, disableLocale = _a.disableLocale, disableSettingFetching = _a.disableSettingFetching, maturity = _a.maturity, boardMaturity = _a.boardMaturity, configToken = _a.configToken, onVerifyConfigTokenSuccess = _a.onVerifyConfigTokenSuccess, rest = __rest(_a, ["appInfo", "navigation", "publicKey", "disableCountries", "disableLocale", "disableSettingFetching", "maturity", "boardMaturity", "configToken", "onVerifyConfigTokenSuccess"]);
+    var appInfo = _a.appInfo, navigation = _a.navigation, publicKey = _a.publicKey, disableCountries = _a.disableCountries, disableLocale = _a.disableLocale, disableSettingFetching = _a.disableSettingFetching, maturity = _a.maturity, boardMaturity = _a.boardMaturity, configToken = _a.configToken, onVerifyConfigTokenSuccess = _a.onVerifyConfigTokenSuccess, scope = _a.scope, mode = _a.mode, showBoard = _a.showBoard, features = _a.features, rest = __rest(_a, ["appInfo", "navigation", "publicKey", "disableCountries", "disableLocale", "disableSettingFetching", "maturity", "boardMaturity", "configToken", "onVerifyConfigTokenSuccess", "scope", "mode", "showBoard", "features"]);
     var dispatch = useAppDispatch();
     var data = useAppSelector(settingsSelector).data;
     var setAppConfig = function () {
-        dispatch(handleSetAppConfig(__assign({ appInfo: appInfo, publicKey: publicKey }, rest)));
+        if (!disableSettingFetching) {
+            dispatch(handleSetAppConfig(__assign({ appInfo: appInfo, publicKey: publicKey, scope: scope === null || scope === void 0 ? void 0 : scope.toLowerCase(), mode: mode !== null && mode !== void 0 ? mode : 'page', showBoard: showBoard !== null && showBoard !== void 0 ? showBoard : true, features: __assign({ merchantLogo: true, switchLanguage: true, overlay: true, loaderOverlay: true }, features) }, rest)));
+        }
         dispatch(handleActiveFlowScreens(navigation));
     };
     var checkDomain = function () {
-        var isTap = isTapDomain(rest.merchantDomain);
+        var isTap = isConnectTapDomain(rest.merchantDomain);
         dispatch(handleIsTapOrigin(isTap));
     };
     useEffect(function () {
@@ -43,7 +45,7 @@ export var useAppConfig = function (_a) {
     useEffect(function () {
         if (rest.open === false)
             return;
-        if (!disableSettingFetching)
+        if (!disableSettingFetching && !configToken)
             removeRequestHeaders();
         checkDomain();
         setBaseUrl(publicKey);
@@ -59,7 +61,8 @@ export var useAppConfig = function (_a) {
                 mdn: rest.merchantDomain,
                 maturity: maturity,
                 onVerifyConfigTokenSuccess: onVerifyConfigTokenSuccess,
-                configToken: configToken
+                configToken: configToken,
+                settingData: rest.settingData
             }));
     }, []);
 };

package/build/hooks/useAppDispatch.d.ts

@@ -10,4 +10,6 @@ export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{
     entity: import("../features/app/entity/entityStore").EntityState;
     brand: import("../features/app/brand/brandStore").BrandState;
     connectExpress: import("../features/app/connectExpress/connectExpressStore").ConnectExpressState;
+    auth: import("../features/app/auth/authStore").AuthState;
+    board: import("../features/app/board/boardStore").BoardState;
 }, undefined, import("redux").AnyAction> & import("redux").Dispatch<import("redux").AnyAction>;

package/build/hooks/useAppTheme.js

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { LanguageMode, DirectionMode } from '../@types';
 import { settingsSelector } from '../app/settings';
-import { isMobile } from 'react-device-detect';
+import { isMobile, isTablet } from 'react-device-detect';
 import { useAppSelector } from './useAppSelector';
 import { appTheme } from '../theme';
 export var useAppTheme = function () {
@@ -9,7 +9,8 @@ export var useAppTheme = function () {
     var data = useAppSelector(settingsSelector).data;
     useEffect(function () {
         var dir = data.language === LanguageMode.AR ? DirectionMode.RTL : DirectionMode.LTR;
-        setTheme(appTheme(data.skin, isMobile, dir));
-    }, [data.skin, data.language, isMobile]);
+        var isSmallScreen = isMobile && !isTablet;
+        setTheme(appTheme(data.skin, dir, isSmallScreen));
+    }, [data.skin, data.language, isMobile, isTablet]);
     return { theme: theme };
 };

package/build/hooks/useCountDown.d.ts

@@ -0,0 +1,10 @@
+interface CountDownOptions {
+    end?: number;
+    start: number;
+    startTimer: boolean;
+    sleepMS?: number;
+}
+export declare const useCountDown: ({ end, start, startTimer, sleepMS }: CountDownOptions) => {
+    count: number;
+};
+export {};

package/build/hooks/useCountDown.js

@@ -0,0 +1,17 @@
+import { useEffect, useState } from 'react';
+export var useCountDown = function (_a) {
+    var _b = _a.end, end = _b === void 0 ? 0 : _b, start = _a.start, startTimer = _a.startTimer, _c = _a.sleepMS, sleepMS = _c === void 0 ? 0 : _c;
+    var _d = useState(start), count = _d[0], setCount = _d[1];
+    var decrement = function () {
+        setCount(count - 1);
+    };
+    useEffect(function () {
+        if (count === end || !startTimer)
+            return;
+        var timer = setTimeout(function () {
+            decrement();
+        }, sleepMS);
+        return function () { return clearTimeout(timer); };
+    }, [count, startTimer]);
+    return { count: count };
+};

package/build/hooks/useCountry.d.ts

@@ -1,4 +1,5 @@
 export declare const useCountry: (code: string) => {
     isKuwait: boolean;
     isSaudi: boolean;
+    isOther: boolean;
 };

package/build/hooks/useCountry.js

@@ -1,7 +1,8 @@
-import { isKW } from '../utils';
+import { isKW, isSA } from '../utils';
 import { useMemo } from 'react';
 export var useCountry = function (code) {
     var isKuwait = useMemo(function () { return isKW(code); }, [code]);
-    var isSaudi = useMemo(function () { return isKW(code); }, [code]);
-    return { isKuwait: isKuwait, isSaudi: isSaudi };
+    var isSaudi = useMemo(function () { return isSA(code); }, [code]);
+    var isOther = useMemo(function () { return !isKW(code) && !isSA(code); }, [code]);
+    return { isKuwait: isKuwait, isSaudi: isSaudi, isOther: isOther };
 };

package/build/hooks/useDataVerified.d.ts

@@ -1,5 +1,5 @@
 import { FieldType } from '../@types';
-declare type DataVerified<T> = {
+type DataVerified<T> = {
     [K in keyof T]?: boolean;
 };
 export declare const useDataVerified: <T = undefined>(dataVerification: Record<keyof T, FieldType>, verifiedKeys: (keyof T)[]) => DataVerified<T>;

package/build/hooks/useExcludeReadOnlyFelids.d.ts

@@ -1,8 +1,8 @@
 import { FieldValues, UseFormReturn } from 'react-hook-form';
-declare type ReadOnly<TF, V> = {
+type ReadOnly<TF, V> = {
     [key in keyof TF]: V;
 };
-export declare const useExcludeReadOnlyFelids: <TF extends FieldValues = FieldValues>({ formState }: UseFormReturn<TF, any>, readOnly: ReadOnly<TF, boolean>) => {
+export declare const useExcludeReadOnlyFelids: <TF extends FieldValues = FieldValues>({ formState }: UseFormReturn<TF, any, undefined>, readOnly: ReadOnly<TF, boolean>) => {
     getFelids: <T extends TF = TF>(data: T) => {
         originalFormData: T;
         formData: T;

package/build/hooks/useFormDirtyCheck.d.ts

@@ -0,0 +1,10 @@
+import { FieldValues, UseFormReturn } from 'react-hook-form';
+type UseFormWithDirtyCheck = {
+    isDirty: boolean;
+};
+type CustomAttrProps = {
+    name: string;
+    keys: string[];
+};
+export declare const useFormDirtyCheck: <TFieldValues extends FieldValues>(method: UseFormReturn<TFieldValues, any, undefined>, backendData: TFieldValues, customAttrs?: CustomAttrProps[]) => UseFormWithDirtyCheck;
+export {};

package/build/hooks/useFormDirtyCheck.js

@@ -0,0 +1,66 @@
+import React from 'react';
+import _ from 'lodash';
+export var useFormDirtyCheck = function (method, backendData, customAttrs) {
+    var _a = React.useState(false), isDirty = _a[0], setIsDirty = _a[1];
+    var data = method.watch();
+    var isValidData = function (formValue, backendValue) {
+        if (_.isUndefined(formValue))
+            return false;
+        if (_.isArray(formValue) && formValue.length === 0)
+            return false;
+        if (_.isObject(formValue) && _.isEmpty(formValue))
+            return false;
+        if (formValue === '' && !backendValue)
+            return false;
+        return true;
+    };
+    var isArray = function (data, backendData) {
+        return backendData && data && _.isArray(backendData) && _.isArray(data);
+    };
+    var isObject = function (data, backendData) {
+        return backendData && data && _.isObject(data) && _.isObject(backendData);
+    };
+    var mapArrayOfObjectWithKeys = function (items, keys) {
+        return _.map(items, function (item) { return _.pick(item, keys); });
+    };
+    var mapObjectWithKeys = function (item, keys) {
+        return _.pick(item, keys);
+    };
+    var deepComparison = function (data, backendData, customAttrs) {
+        var _loop_1 = function (key) {
+            var formValue = data === null || data === void 0 ? void 0 : data[key];
+            var backEndValue = backendData === null || backendData === void 0 ? void 0 : backendData[key];
+            if (!isValidData(formValue, backEndValue))
+                return "continue";
+            var customAttr = customAttrs === null || customAttrs === void 0 ? void 0 : customAttrs.find(function (el) { return el.name === key; });
+            if (customAttr) {
+                var keys = customAttr.keys;
+                if (isArray(formValue, backEndValue)) {
+                    formValue = mapArrayOfObjectWithKeys(formValue, keys);
+                    backEndValue = mapArrayOfObjectWithKeys(backEndValue, keys);
+                    if (formValue.length !== backEndValue.length)
+                        return { value: true };
+                    if (_.differenceWith(formValue, backEndValue, _.isEqual).length > 0)
+                        return { value: true };
+                }
+                if (isObject(formValue, backEndValue)) {
+                    formValue = mapObjectWithKeys(formValue, keys);
+                    backEndValue = mapObjectWithKeys(backEndValue, keys);
+                }
+            }
+            if (!_.isEqual(formValue, backEndValue))
+                return { value: true };
+        };
+        for (var key in backendData) {
+            var state_1 = _loop_1(key);
+            if (typeof state_1 === "object")
+                return state_1.value;
+        }
+        return false;
+    };
+    React.useEffect(function () {
+        var isDirty = deepComparison(data, backendData, customAttrs);
+        setIsDirty(isDirty);
+    }, [data, backendData]);
+    return { isDirty: isDirty };
+};

package/build/hooks/useFormErrorAndUpdateReadOnly.d.ts

@@ -1,6 +1,6 @@
 import { FieldValues, UseFormReturn } from 'react-hook-form';
-declare type ReadOnly<TF, V> = {
+type ReadOnly<TF, V> = {
     [key in keyof TF]: V;
 };
-export declare const useFormErrorAndUpdateReadOnly: <TF extends FieldValues = FieldValues>(methods: UseFormReturn<TF, any>, readOnlyData: { [key in keyof TF]: boolean; }, noneEditable?: Record<any, boolean>) => ReadOnly<TF, boolean>;
+export declare const useFormErrorAndUpdateReadOnly: <TF extends FieldValues = FieldValues>(methods: UseFormReturn<TF, any, undefined>, readOnlyData: { [key in keyof TF]: boolean; }, noneEditable?: Record<any, boolean>) => ReadOnly<TF, boolean>;
 export {};

package/build/hooks/useFormReadOnly.d.ts

@@ -1,6 +1,6 @@
 import { FieldValues, UseFormReturn } from 'react-hook-form';
-declare type ReadOnly<TF, V> = {
+type ReadOnly<TF, V> = {
     [key in keyof TF]: V;
 };
-export declare const useFormReadOnly: <TF extends FieldValues = FieldValues>(methods: UseFormReturn<TF, any>, extraData?: { [key in keyof TF]?: any; }) => ReadOnly<TF, boolean>;
+export declare const useFormReadOnly: <TF extends FieldValues = FieldValues>(methods: UseFormReturn<TF, any, undefined>, extraData?: { [key in keyof TF]?: any; }) => ReadOnly<TF, boolean>;
 export {};

package/build/hooks/useSetFromDefaultValues.d.ts

@@ -1,2 +1,2 @@
 import { FieldValues, UseFormReturn } from 'react-hook-form';
-export declare const useSetFromDefaultValues: <TFieldValues extends FieldValues = FieldValues>(method: UseFormReturn<TFieldValues, any>, defaultValues: TFieldValues, shouldValidate?: boolean) => void;
+export declare const useSetFromDefaultValues: <TFieldValues extends FieldValues = FieldValues>(method: UseFormReturn<TFieldValues, any, undefined>, defaultValues: TFieldValues, shouldValidate?: boolean) => void;

package/build/hooks/useVerifyToken.d.ts

@@ -1,5 +1,5 @@
 import { ScreenStepNavigation } from '../@types';
-interface VerifyLeadTokenProps {
+export interface VerifyLeadTokenProps {
     token: string;
     isInternally?: boolean;
 }
@@ -8,8 +8,11 @@ interface IVerifyToken {
     internalToken?: string;
     open: boolean;
     settingLoading: boolean;
+    isValidOperator: boolean;
     navigation: ScreenStepNavigation[];
     loadingScreenName: string;
+    operatorErrorScreenName: string;
+    mode?: 'popup' | 'page' | 'content';
 }
-export declare const useVerifyToken: ({ verify, internalToken, navigation, open, settingLoading, loadingScreenName }: IVerifyToken) => void;
+export declare const useVerifyToken: ({ verify, internalToken, navigation, open, settingLoading, loadingScreenName, mode, isValidOperator, operatorErrorScreenName }: IVerifyToken) => void;
 export {};

package/build/hooks/useVerifyToken.js

@@ -3,7 +3,7 @@ import { getParameterByName } from '../utils';
 import { useAppDispatch } from './useAppDispatch';
 import { useEffect } from 'react';
 export var useVerifyToken = function (_a) {
-    var verify = _a.verify, internalToken = _a.internalToken, navigation = _a.navigation, open = _a.open, settingLoading = _a.settingLoading, loadingScreenName = _a.loadingScreenName;
+    var verify = _a.verify, internalToken = _a.internalToken, navigation = _a.navigation, open = _a.open, settingLoading = _a.settingLoading, loadingScreenName = _a.loadingScreenName, mode = _a.mode, isValidOperator = _a.isValidOperator, operatorErrorScreenName = _a.operatorErrorScreenName;
     var dispatch = useAppDispatch();
     var verifyTokenFun = function () {
         var token = internalToken ? internalToken : getParameterByName('token');
@@ -15,11 +15,16 @@ export var useVerifyToken = function (_a) {
         dispatch(verify({ token: token, isInternally: !!internalToken }));
     };
     useEffect(function () {
-        if (!settingLoading && open)
-            verifyTokenFun();
-    }, [settingLoading, open]);
+        if (settingLoading || !open)
+            return;
+        if (!isValidOperator) {
+            dispatch(handleCurrentActiveScreen(operatorErrorScreenName));
+            return;
+        }
+        verifyTokenFun();
+    }, [settingLoading, open, isValidOperator]);
     useEffect(function () {
-        if (internalToken && open)
+        if (internalToken && open && mode !== 'content')
             dispatch(handleCurrentActiveScreen(loadingScreenName));
     }, [navigation]);
 };