@tap-payments/auth-jsconnect 2.3.40-test → 2.3.43-test

package/build/features/shared/Address/Address.js

@@ -22,7 +22,7 @@ import InputText from './InputText';
 import { Button } from '../Button';
 export default function Address(_a) {
     var format = _a.format, countryList = _a.countryList, onAddressChange = _a.onAddressChange, defaultValues = _a.defaultValues, disableCountry = _a.disableCountry, loading = _a.loading, error = _a.error, onBack = _a.onBack, showSubmitButton = _a.showSubmitButton, isEditable = _a.isEditable;
-    var _b = useForm({ defaultValues: defaultValues, mode: 'onChange' }), watch = _b.watch, control = _b.control, formState = _b.formState, getValues = _b.getValues, handleSubmit = _b.handleSubmit;
+    var _b = useForm({ defaultValues: defaultValues, mode: 'onChange' }), watch = _b.watch, control = _b.control, formState = _b.formState, getValues = _b.getValues;
     var values = getValues();
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
@@ -32,49 +32,42 @@ export default function Address(_a) {
     }, [values, formState.isValid]);
     var countryIso2 = useMemo(function () {
         var _a;
-        var index = countryList.findIndex(function (item) { return item.iso2 === watch('country'); });
+        var index = countryList.findIndex(function (item) { return item.countryId === watch('country'); });
         return (_a = countryList[index]) === null || _a === void 0 ? void 0 : _a.iso2;
     }, [watch('country')]);
-    var getName = function (item) {
-        return (isAr ? item.name.ar : item.name.en) || '';
-    };
-    var getRequiredValue = function (item) {
-        return "".concat(getName(item), " ").concat(t('is_required'));
-    };
-    var onSubmit = function (values) {
-        console.log(values);
-        onAddressChange(values, formState.isValid);
-    };
-    return (_jsxs(Box, __assign({ component: 'form', onSubmit: handleSubmit(onSubmit) }, { children: [format.map(function (item) {
+    return (_jsxs(Box, __assign({ component: 'form' }, { children: [format.map(function (item) {
                 var isCountry = item.code === 'country';
                 var isSelect = item.type === 'select';
                 if (isCountry) {
                     return (_jsx(Controller, { render: function (_a) {
                             var _b;
                             var field = _a.field, fieldState = _a.fieldState;
-                            return (_jsx(CountryListComponent, { label: getName(item), placeholder: getName(item), list: countryList, onSelect: function (value) {
+                            return (_jsx(CountryListComponent, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), list: countryList, onSelect: function (value) {
                                     console.log('value', value);
                                     field.onChange(value);
                                 }, value: field.value, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, disabled: isEditable ? !!disableCountry : false, isRequired: item.required }));
                         }, rules: {
-                            required: item.required && getRequiredValue(item)
+                            required: item.required && "address_".concat(item.code, "_required")
                         }, control: control, name: item.code }, item.code));
                 }
                 if (isSelect) {
                     return (_jsx(Controller, { render: function (_a) {
                             var _b;
                             var field = _a.field, fieldState = _a.fieldState;
-                            return (_jsx(InputSelect, { label: getName(item), placeholder: getName(item), countryIso2: countryIso2, fetchURL: item.retrieve_uri, onSelect: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, value: field.value || '', disabled: isEditable ? !countryIso2 : false }));
+                            return (_jsx(InputSelect, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), countryIso2: countryIso2, fetchURL: item.retrieve_uri, onSelect: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, value: field.value || '', disabled: isEditable ? !countryIso2 : false }));
                         }, rules: {
-                            required: item.required && getRequiredValue(item)
+                            required: item.required && "address_".concat(item.code, "_required")
                         }, control: control, name: item.code }, item.code));
                 }
                 return (_jsx(Controller, { render: function (_a) {
                         var _b;
                         var field = _a.field, fieldState = _a.fieldState;
-                        return (_jsx(InputText, { label: getName(item), placeholder: getName(item), onChange: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, disabled: !isEditable, value: field.value || '' }));
+                        return (_jsx(InputText, { label: "address_".concat(item.code, "_label"), placeholder: "address_".concat(item.code, "_placeholder"), onChange: function (value) { return field.onChange(value); }, error: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message, isRequired: item.required, disabled: !isEditable, value: field.value || '' }));
                     }, rules: {
-                        required: item.required && getRequiredValue(item)
+                        required: item.required && "address_".concat(item.code, "_required")
                     }, control: control, name: item.code }, item.code));
-            }), _jsx(Collapse, __assign({ in: showSubmitButton }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, isAr: isAr, disabled: !formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })));
+            }), _jsx(Collapse, __assign({ in: showSubmitButton }, { children: _jsx(Button, __assign({ onClick: function (e) {
+                        e.preventDefault();
+                        onAddressChange(values, formState.isValid);
+                    }, onBackClicked: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, isAr: isAr, disabled: !formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })));
 }

package/build/features/shared/Address/CountryList.js

@@ -72,17 +72,17 @@ function CountryList(_a) {
     };
     var handleValueChange = function (value) {
         setAnchorEl(null);
-        onSelect(value.iso2);
+        onSelect(value.countryId);
     };
     var nameValue = React.useMemo(function () {
-        var item = list.find(function (item) { return item.iso2 === value; });
+        var item = list.find(function (item) { return item.countryId === value; });
         if (!item)
             return '';
         return isAr ? item.name.arabic : item.name.english;
     }, [isAr, list, value]);
     return (_jsxs(Box, { children: [_jsx(LabelContainerStyled, { children: _jsxs(InputLabelStyled, { children: [t(label), " ", isRequired && _jsx(MandatoryStyled, { children: "*" })] }) }), _jsxs(Box, { children: [_jsx(InputStyled, { readOnly: true, value: nameValue, placeholder: placeholder, onClick: handleListOpenClose, endAdornment: !disabled && _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleListStyled, { searchValuePath: ['name.english', 'name.arabic'], searchKeyPath: 'name.english', list: list, onSelectItem: handleValueChange, renderItem: function (item) {
                                 var _a, _b;
-                                var isChecked = item.iso2 === value;
+                                var isChecked = item.countryId === value;
                                 return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(NameContainer, __assign({ isSelected: isChecked }, { children: isAr ? (_a = item.name) === null || _a === void 0 ? void 0 : _a.arabic : (_b = item.name) === null || _b === void 0 ? void 0 : _b.english })) })), isChecked && _jsx(CheckIconStyled, {})] }));
                             } }) })), _jsx(Collapse, __assign({ in: !!error && !anchorEl, timeout: 400 }, { children: _jsx(Warning, __assign({ warningType: 'hint' }, { children: t(error || '') })) }))] })] }));
 }

package/build/features/shared/Button/FlowsButtons.js

@@ -79,36 +79,31 @@ var ButtonBoxStyled = styled(Box)(function (_a) {
         _b);
 });
 var ButtonStyled = styled(Button, {
-    shouldForwardProp: function (prop) { return prop !== 'isCompleted'; }
+    shouldForwardProp: function (prop) { return prop !== 'isCompleted' && prop !== 'hasUrl'; }
 })(function (_a) {
     var _b;
-    var theme = _a.theme, isCompleted = _a.isCompleted;
+    var theme = _a.theme, isCompleted = _a.isCompleted, hasUrl = _a.hasUrl;
     return ({
         '&.MuiButton-outlined': __assign(__assign({}, (isCompleted && {
             paddingInlineEnd: theme.spacing(1.625),
             color: theme.palette.success.main,
             border: "1px solid ".concat(theme.palette.success.main)
-        })), (_b = { '&:hover': __assign({}, (isCompleted && {
-                    backgroundColor: theme.palette.common.white,
-                    border: "1px solid ".concat(theme.palette.success.main),
-                    color: theme.palette.success.main,
-                    cursor: 'initial',
-                    img: {
+        })), (_b = { '&:hover': __assign({}, (isCompleted && __assign({ backgroundColor: hasUrl ? theme.palette.success.main : theme.palette.common.white, border: "1px solid ".concat(theme.palette.success.main), color: hasUrl ? theme.palette.common.white : theme.palette.success.main, cursor: hasUrl ? 'pointer' : 'initial', img: {
                         filter: 'none'
+                    } }, (hasUrl && {
+                    svg: {
+                        filter: 'brightness(3)'
                     }
-                })) }, _b[theme.breakpoints.down('sm')] = {
+                })))) }, _b[theme.breakpoints.down('sm')] = {
             '&:hover': __assign({ backgroundColor: theme.palette.common.white, border: "1px solid ".concat(theme.palette.primary.main), img: {
                     filter: 'none'
-                }, color: theme.palette.primary.main }, (isCompleted && {
-                backgroundColor: theme.palette.common.white,
-                border: "1px solid ".concat(theme.palette.success.main),
-                paddingInlineEnd: theme.spacing(1.625),
-                color: theme.palette.success.main,
-                cursor: 'initial',
-                img: {
+                }, color: theme.palette.primary.main }, (isCompleted && __assign({ backgroundColor: hasUrl ? theme.palette.success.main : theme.palette.common.white, border: "1px solid ".concat(theme.palette.success.main), paddingInlineEnd: theme.spacing(1.625), color: hasUrl ? theme.palette.common.white : theme.palette.success.main, cursor: hasUrl ? 'pointer' : 'initial', img: {
                     filter: 'none'
+                } }, (hasUrl && {
+                svg: {
+                    filter: 'brightness(3)'
                 }
-            }))
+            }))))
         }, _b['&:disabled'] = {
             backgroundColor: theme.palette.common.white,
             color: alpha(theme.palette.primary.main, 0.3)
@@ -153,7 +148,7 @@ export default function FlowsButtons(_a) {
     var _b = useState(false), loading = _b[0], setLoading = _b[1];
     var isAr = useLanguage().isAr;
     var onRedirect = function (item) {
-        if (item.isCompleted)
+        if (!item.href)
             return;
         if (flowName === item.name && item.name !== 'password') {
             dispatch(handleCurrentActiveScreen(getScreenNameBasedOnFlow(item.name, isAuthorizedUser)));
@@ -221,6 +216,6 @@ export default function FlowsButtons(_a) {
                         onResetPassword();
                     else
                         onRedirect({ title: title, href: href, src: src, hoverSrc: hoverSrc, isCompleted: isCompleted, name: name, status: status, token: token });
-                } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', disabled: isResetPassword(name, status) && loading, isCompleted: isCompleted, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: isAr ? 'scale(-1)' : 'scale(1)' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isBrand(name) ? (_jsx(_Fragment, { children: _jsx(BrandImage, { children: _jsx(BrandNameStyled, { children: brandName }) }) })) : (_jsx(Image, { src: src, alt: title })), type: 'button' }, { children: title })) }), idx));
+                } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', disabled: isResetPassword(name, status) && loading, isCompleted: isCompleted, hasUrl: !!href, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: isAr ? 'scale(-1)' : 'scale(1)' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: isResetPassword(name, status) && loading ? (_jsx(_Fragment, {})) : isBrand(name) ? (_jsx(_Fragment, { children: _jsx(BrandImage, { children: _jsx(BrandNameStyled, { children: brandName }) }) })) : (_jsx(Image, { src: src, alt: title })), type: 'button' }, { children: title })) }), idx));
         }) }));
 }

package/build/features/shared/OTP/OTP.d.ts

@@ -5,6 +5,7 @@ interface OTPProps extends OTPFieldProps {
     onResetClick?: () => void;
     timeEndLabel?: string;
     loading?: boolean;
+    hasError?: boolean;
 }
-declare const _default: React.MemoExoticComponent<({ timeEndLabel, loading, timerInSeconds, onResetClick, ...props }: OTPProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ timeEndLabel, loading, timerInSeconds, onResetClick, hasError, ...props }: OTPProps) => JSX.Element>;
 export default _default;

package/build/features/shared/OTP/OTP.js

@@ -80,7 +80,7 @@ var LoaderBoxStyled = styled(OTPBox)(function (_a) {
     });
 });
 var OTPInput = function (_a) {
-    var timeEndLabel = _a.timeEndLabel, loading = _a.loading, timerInSeconds = _a.timerInSeconds, onResetClick = _a.onResetClick, props = __rest(_a, ["timeEndLabel", "loading", "timerInSeconds", "onResetClick"]);
+    var timeEndLabel = _a.timeEndLabel, loading = _a.loading, timerInSeconds = _a.timerInSeconds, onResetClick = _a.onResetClick, hasError = _a.hasError, props = __rest(_a, ["timeEndLabel", "loading", "timerInSeconds", "onResetClick", "hasError"]);
     var otpRef = React.useRef(null);
     var width = useContainerDimensions(otpRef).width;
     React.useEffect(function () {
@@ -88,6 +88,6 @@ var OTPInput = function (_a) {
         if (el)
             el.className = 'middle-input-element';
     }, [props.value]);
-    return (_jsxs(_Fragment, { children: [_jsx(OTPBox, __assign({ id: 'otp-container', ref: otpRef }, { children: _jsx(OTPStyled, __assign({}, props, { parentWidth: width })) })), typeof timerInSeconds != 'undefined' && (_jsx(BoxStyled, { children: loading ? (_jsx(LoaderBoxStyled, { children: _jsx(CircularProgress, { size: 20, thickness: 5 }) })) : (_jsx(OTPTimer, { timeEndLabel: timeEndLabel || '', timeInSeconds: timerInSeconds, onResetClick: onResetClick })) }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(OTPBox, __assign({ id: 'otp-container', ref: otpRef }, { children: _jsx(OTPStyled, __assign({}, props, { parentWidth: width })) })), typeof timerInSeconds != 'undefined' && (_jsx(BoxStyled, { children: loading ? (_jsx(LoaderBoxStyled, { children: _jsx(CircularProgress, { size: 20, thickness: 5 }) })) : hasError ? (_jsx(_Fragment, {})) : (_jsx(OTPTimer, { timeEndLabel: timeEndLabel || '', timeInSeconds: timerInSeconds, onResetClick: onResetClick })) }))] }));
 };
 export default React.memo(OTPInput);

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

@@ -11,14 +11,15 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import { useAppDispatch } from '../../../../hooks';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
 import Box from '@mui/material/Box/Box';
 import { styled } from '@mui/material/styles';
 import OTPField from '../../../shared/OTP';
 import { useController, useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { DEFAULT_TIMER_VALUE } from '../../../../constants';
-import { resendOTP } from '../../../app/tax/taxStore';
+import { isTokenExpired } from '../../../../utils';
+import { resendOTP, taxSelector } from '../../../app/tax/taxStore';
 var BoxStyled = styled(Box)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -33,6 +34,7 @@ var OTPInput = function (_a) {
     var t = useTranslation().t;
     var otpControl = useController({ name: 'otp', control: control });
     var dispatch = useAppDispatch();
+    var error = useAppSelector(taxSelector).error;
     var handleOnOTPChange = function (otp) {
         otpControl.field.onChange(otp);
     };
@@ -42,6 +44,6 @@ var OTPInput = function (_a) {
         dispatch(resendOTP());
     };
     var otpValue = otpControl.field.value;
-    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { loading: loading, timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
+    return (_jsx(BoxStyled, __assign({ dir: 'ltr' }, { children: _jsx(OTPField, { loading: loading, timeEndLabel: t('ide_otp_resend_label'), timerInSeconds: DEFAULT_TIMER_VALUE, onResetClick: handleOnResendOTP, value: otpValue, hasError: isTokenExpired(error), onChange: function (number) { return handleOnOTPChange(number.toString()); } }) })));
 };
 export default React.memo(OTPInput);

package/build/utils/error.d.ts

@@ -1 +1,2 @@
 export declare const isNetworkError: (error: string | null) => boolean;
+export declare const isTokenExpired: (error: string | null) => boolean;

package/build/utils/error.js

@@ -1,3 +1,6 @@
 export var isNetworkError = function (error) {
     return ['network error', 'network request failed'].includes((error || '').trim().toLowerCase());
 };
+export var isTokenExpired = function (error) {
+    return ['token expired'].includes((error || '').trim().toLowerCase());
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/auth-jsconnect",
-	"version": "2.3.40-test",
+	"version": "2.3.43-test",
 	"description": "connect library, auth",
 	"private": false,
 	"main": "build/index.js",

package/build/api/address.d.ts

@@ -1,4 +0,0 @@
-declare const addressService: {
-    retrieveAddressFormat: (countryCode: string) => Promise<any>;
-};
-export { addressService };

package/build/api/address.js

@@ -1,12 +0,0 @@
-import { httpClient } from './axios';
-import { ENDPOINT_PATHS } from '../constants';
-var retrieveAddressFormat = function (countryCode) {
-    return httpClient({
-        method: 'get',
-        url: "".concat(ENDPOINT_PATHS.ADDRESS_PATH, "/").concat(countryCode)
-    });
-};
-var addressService = {
-    retrieveAddressFormat: retrieveAddressFormat
-};
-export { addressService };

package/build/features/entity/screens/EntityAddress/EntityAddress.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export interface EntityAddressProps {
-}
-declare const EntityAddress: ({}: EntityAddressProps) => JSX.Element;
-export default EntityAddress;

package/build/features/entity/screens/EntityAddress/EntityAddress.js

@@ -1,42 +0,0 @@
-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 } from "react/jsx-runtime";
-import { useTranslation } from 'react-i18next';
-import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { entitySelector, updateEntityAddress } from '../../../app/entity/entityStore';
-import { handlePrevScreenStep, settingsSelector } from '../../../../app/settings';
-import { ScreenContainer } from '../../../shared/Containers';
-import Address from '../../../shared/Address';
-var EntityAddress = function (_a) {
-    var settings = useAppSelector(settingsSelector).data;
-    var _b = useAppSelector(entitySelector), data = _b.data, loading = _b.loading, error = _b.error;
-    var t = useTranslation().t;
-    var dispatch = useAppDispatch();
-    var _c = data.verify.responseBody || {}, addressFormat = _c.addressFormat, entity = _c.entity;
-    var billingAddress = data.entityAddressData.billingAddress;
-    var isNonEditable = false;
-    var countries = settings.countries;
-    var onAddressChange = function (_a, isValid) {
-        var country = _a.country, address = __rest(_a, ["country"]);
-        if (isValid) {
-            var data_1 = {
-                billingAddress: address
-            };
-            dispatch(updateEntityAddress(data_1));
-        }
-    };
-    var onBack = function () {
-        dispatch(handlePrevScreenStep());
-    };
-    return (_jsx(ScreenContainer, { children: _jsx(Address, { defaultValues: billingAddress, countryList: countries, format: addressFormat || [], disableCountry: true, onAddressChange: onAddressChange, isEditable: !isNonEditable, showSubmitButton: true, loading: loading, error: t(error || ''), onBack: function () { return onBack(); } }) }));
-};
-export default EntityAddress;

package/build/features/entity/screens/EntityAddress/index.d.ts

@@ -1,2 +0,0 @@
-import EntityAddress from './EntityAddress';
-export default EntityAddress;

package/build/features/entity/screens/EntityAddress/index.js

@@ -1,2 +0,0 @@
-import EntityAddress from './EntityAddress';
-export default EntityAddress;