@tap-payments/auth-jsconnect 2.10.1-beta → 2.10.1-sandbox

package/build/features/terminal/screens/shared/styles.js

@@ -0,0 +1,155 @@
+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 Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import { alpha, styled } from '@mui/material/styles';
+import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
+import Typography from '@mui/material/Typography';
+import Radio from '@mui/material/Radio';
+import Icon from '../../../../components/Icon';
+import DeviceCard from '../../../../components/DeviceCard';
+export var Container = styled(Box)(function () { return ({
+    display: 'flex',
+    flexDirection: 'column',
+    width: '100%'
+}); });
+export var LinkNewTerminalContainer = styled(Container)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        gap: spacing(1)
+    });
+});
+export var TextTypography = styled(Typography)(function (_a) {
+    var _b = _a.theme, palette = _b.palette, typography = _b.typography;
+    return (__assign(__assign({}, typography.caption), { color: alpha(palette.text.primary, 0.6) }));
+});
+export var LinkWithText = styled(TextTypography)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        paddingBlock: spacing(1)
+    });
+});
+export var LinkTerminalText = styled(TextTypography)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        paddingInline: spacing(2.625)
+    });
+});
+export var QRCodeDescription = styled(Box)(function (_a) {
+    var _b = _a.theme, palette = _b.palette, spacing = _b.spacing, typography = _b.typography;
+    return (__assign(__assign({ backgroundColor: palette.common.white, borderWidth: spacing(0.125, 0, 0.125, 0), borderStyle: 'solid', borderColor: palette.divider, padding: spacing(1.5, 2.5, 1.5, 2.5), marginTop: spacing(1), color: palette.text.primary }, typography.body1), { fontWeight: typography.fontWeightLight }));
+});
+export var SuccessContainerStyled = styled(Container)(function () { return ({
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    pointerEvents: 'auto'
+}); });
+export var ScrollContainer = styled(Box)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        maxHeight: spacing(20.625),
+        overflow: 'scroll'
+    });
+});
+export var TerminalListContainer = styled(Box)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        display: 'flex',
+        justifyContent: 'space-between',
+        flexDirection: 'column',
+        alignItems: 'center',
+        width: '100%',
+        gap: spacing(0.75)
+    });
+});
+export var ListContainer = styled(Box)(function (_a) {
+    var _b = _a.theme, spacing = _b.spacing, _c = _b.palette, common = _c.common, toastDeviceSelectorDropdown = _c.components.toastDeviceSelectorDropdown;
+    return ({
+        marginTop: spacing(1),
+        border: "1px solid ".concat(toastDeviceSelectorDropdown.border),
+        backgroundColor: common.white,
+        borderRadius: spacing(1)
+    });
+});
+export var TitleContainer = styled(Box)(function (_a) {
+    var _b = _a.theme, spacing = _b.spacing, toastDeviceSelectorDropdown = _b.palette.components.toastDeviceSelectorDropdown;
+    return ({
+        padding: spacing(1.5, 2, 1.5, 2),
+        display: 'flex',
+        flexDirection: 'row',
+        gap: spacing(0.75),
+        alignItems: 'center',
+        borderBottom: "1px solid ".concat(toastDeviceSelectorDropdown.border)
+    });
+});
+export var Image = styled(Icon)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        width: spacing(3),
+        height: spacing(3)
+    });
+});
+export var Title = styled(Typography)(function (_a) {
+    var _b = _a.theme, typography = _b.typography, palette = _b.palette;
+    return (__assign(__assign({}, typography.body2), { color: palette.components.deviceCard.title, fontWeight: typography.fontWeightBold }));
+});
+export var ListItem = styled(DeviceCard)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        paddingTop: spacing(1),
+        paddingBottom: spacing(1)
+    });
+});
+export var StyledRadio = styled(Radio)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        '&.Mui-checked': {
+            color: theme.palette.primary.main
+        }
+    });
+});
+export var ArrowIcon = styled(ArrowForwardIosIcon)(function (_a) {
+    var _b = _a.theme, palette = _b.palette, direction = _b.direction;
+    return (__assign({ color: palette.components.deviceCard.title, fontSize: '16px' }, (direction === 'rtl' && {
+        transform: 'rotate(180deg)'
+    })));
+});
+export var HeadContainer = styled(Box)(function (_a) {
+    var spacing = _a.theme.spacing;
+    return ({
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        width: '100%',
+        paddingBottom: spacing(2)
+    });
+});
+export var LinkButton = styled(Button)(function (_a) {
+    var _b = _a.theme, spacing = _b.spacing, palette = _b.palette, typography = _b.typography;
+    return (__assign(__assign({}, typography.button_small), { fontWeight: typography.fontWeightRegular, textTransform: 'none', color: palette.primary.main, display: 'flex', alignItems: 'center', gap: spacing(0.5) }));
+});
+export var AddIconContainer = styled(Box)(function (_a) {
+    var _b = _a.theme, spacing = _b.spacing, palette = _b.palette;
+    return ({
+        background: alpha(palette.primary.main, 0.1),
+        height: spacing(2.25),
+        width: spacing(2.25),
+        display: 'flex',
+        justifyContent: 'center',
+        borderRadius: spacing(11.25),
+        alignItems: 'center'
+    });
+});
+export var LinkText = styled(Typography)(function (_a) {
+    var typography = _a.theme.typography;
+    return (__assign({}, typography.button_small));
+});

package/build/features/terminal/screens/shared/utils.d.ts

@@ -0,0 +1,7 @@
+import { TerminalDeviceInfo, TerminalInfo } from '../../../../@types';
+export declare const getPairedWith: (device: TerminalDeviceInfo) => string | undefined;
+export declare const getId: (device: TerminalDeviceInfo) => string;
+export declare const getIdLabel: (device: TerminalDeviceInfo) => "terminal_device_id" | "terminal_serial_number";
+export declare const getTerminalId: (terminal: TerminalInfo) => string;
+export declare const getTerminalName: (terminal: TerminalInfo) => string;
+export declare const getTerminalIdLabel: (terminal: TerminalInfo) => "terminal_device_id" | "terminal_id";

package/build/features/terminal/screens/shared/utils.js

@@ -0,0 +1,24 @@
+export var getPairedWith = function (device) {
+    var _a, _b, _c, _d;
+    return (_c = (_b = (_a = device === null || device === void 0 ? void 0 : device.terminal) === null || _a === void 0 ? void 0 : _a.device) === null || _b === void 0 ? void 0 : _b.display_name) !== null && _c !== void 0 ? _c : (_d = device === null || device === void 0 ? void 0 : device.terminal) === null || _d === void 0 ? void 0 : _d.name.en;
+};
+export var getId = function (device) {
+    var _a, _b, _c;
+    return (_c = (_b = (_a = device === null || device === void 0 ? void 0 : device.terminal) === null || _a === void 0 ? void 0 : _a.device) === null || _b === void 0 ? void 0 : _b.id) !== null && _c !== void 0 ? _c : device.serial_number;
+};
+export var getIdLabel = function (device) {
+    var _a, _b;
+    return ((_b = (_a = device === null || device === void 0 ? void 0 : device.terminal) === null || _a === void 0 ? void 0 : _a.device) === null || _b === void 0 ? void 0 : _b.id) ? 'terminal_device_id' : 'terminal_serial_number';
+};
+export var getTerminalId = function (terminal) {
+    var _a, _b;
+    return (_b = (_a = terminal === null || terminal === void 0 ? void 0 : terminal.device) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : terminal.legacy_id;
+};
+export var getTerminalName = function (terminal) {
+    var _a, _b, _c;
+    return (_b = (_a = terminal === null || terminal === void 0 ? void 0 : terminal.device) === null || _a === void 0 ? void 0 : _a.display_name) !== null && _b !== void 0 ? _b : (_c = terminal === null || terminal === void 0 ? void 0 : terminal.name) === null || _c === void 0 ? void 0 : _c.en;
+};
+export var getTerminalIdLabel = function (terminal) {
+    var _a;
+    return ((_a = terminal === null || terminal === void 0 ? void 0 : terminal.device) === null || _a === void 0 ? void 0 : _a.id) ? 'terminal_device_id' : 'terminal_id';
+};

package/build/hooks/useAppConfig.js

@@ -48,7 +48,7 @@ export var useAppConfig = function (_a) {
         if (!disableSettingFetching && !configToken)
             removeRequestHeaders();
         checkDomain();
-        setBaseUrl(publicKey);
+        setBaseUrl(publicKey, rest.businessCountryCode);
         setAppConfig();
         if (typeof boardMaturity === 'boolean')
             dispatch(handelBoardMaturity(boardMaturity));

package/build/hooks/useAppDispatch.d.ts

@@ -13,4 +13,5 @@ export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{
     auth: import("../features/app/auth/authStore").AuthState;
     board: import("../features/app/board/boardStore").BoardState;
     kyc: import("../features/app/kyc/kycStore").KYCDataState;
+    terminal: import("../features/app/terminal/terminalStore").TerminalDataState;
 }, undefined, import("redux").AnyAction> & import("redux").Dispatch<import("redux").AnyAction>;

package/build/index.d.ts

@@ -13,5 +13,6 @@ import { EntityElement, EntityLibProps } from './features/entity';
 import { BrandElement, BrandLibProps } from './features/brand';
 import { BoardLibProps, BoardElement } from './features/board';
 import { KYCLibProps, KYCElement } from './features/kyc';
-export type { ConnectLibProps, ConnectExpressLibProps, AuthLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, EntityLibProps, BrandLibProps, SignInLibProps, BoardLibProps, KYCLibProps };
-export { ConnectElement, ConnectExpressElement, AuthElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement, BoardElement, KYCElement };
+import { TerminalLibProps, TerminalElement } from './features/terminal';
+export type { ConnectLibProps, ConnectExpressLibProps, AuthLibProps, BusinessLibProps, PasswordLibProps, IndividualLibProps, BankLibProps, TaxLibProps, EntityLibProps, BrandLibProps, SignInLibProps, BoardLibProps, KYCLibProps, TerminalLibProps };
+export { ConnectElement, ConnectExpressElement, AuthElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement, BoardElement, KYCElement, TerminalElement };

package/build/index.js

@@ -13,7 +13,8 @@ import { EntityElement, renderEntityLib } from './features/entity';
 import { BrandElement, renderBrandLib } from './features/brand';
 import { BoardElement, renderBoardLib } from './features/board';
 import { KYCElement, renderKYCLib } from './features/kyc';
-export { ConnectElement, ConnectExpressElement, AuthElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement, BoardElement, KYCElement };
+import { TerminalElement, renderTerminalLib } from './features/terminal';
+export { ConnectElement, ConnectExpressElement, AuthElement, BusinessElement, PasswordElement, IndividualElement, BankElement, TaxElement, EntityElement, BrandElement, SignInElement, BoardElement, KYCElement, TerminalElement };
 window['TapAuth'] = {
     renderConnectLib: renderConnectLib,
     renderConnectExpressLib: renderConnectExpressLib,
@@ -27,6 +28,7 @@ window['TapAuth'] = {
     renderBrandLib: renderBrandLib,
     renderSignInLib: renderSignInLib,
     renderBoardLib: renderBoardLib,
-    renderKYCLib: renderKYCLib
+    renderKYCLib: renderKYCLib,
+    renderTerminalLib: renderTerminalLib
 };
 console.log("TapAuth version: ".concat(require('../package.json').version));

package/build/theme/palette.js

@@ -48,6 +48,18 @@ export var lightPalette = {
         main: '#808592',
         light: '#EAECEF',
         dark: '#3B4152'
+    },
+    components: {
+        deviceCard: {
+            title: '#20232B',
+            statusText: '#1F222A80',
+            statusBackground: ' #F0F0F0',
+            deviceInfoBackground: 'linear-gradient(127.37deg, rgba(255, 255, 255, 0.6) 59.07%, rgba(255, 255, 255, 0.444) 100.12%);',
+            border: '#e8ecf2'
+        },
+        toastDeviceSelectorDropdown: {
+            border: '#f2f2f2'
+        }
     }
 };
 export var darkPalette = {

package/build/theme/typography.js

@@ -5,6 +5,7 @@ export var typography = {
     fontWeightLight: 300,
     fontWeightRegular: 400,
     fontWeightMedium: 500,
+    fontWeightSemiBold: 600,
     fontWeightBold: 700,
     allVariants: {
         fontFamily: '"Lato", "Tajawal", "Roboto"',
@@ -19,6 +20,7 @@ export var typography = {
     h2: { fontSize: '3rem' },
     h3: { fontSize: '2.5rem' },
     h4: { fontSize: '2rem' },
+    h4_small: { fontSize: '1.625rem' },
     h5: { fontSize: '1.5rem' },
     h6: { fontSize: '1.25rem' },
     subtitle1: { fontSize: '1.125rem' },
@@ -26,6 +28,8 @@ export var typography = {
     body1: { fontSize: '1rem' },
     body2: { fontSize: '0.875rem' },
     button: { fontSize: '0.875rem' },
+    button_small: { fontSize: '0.813rem' },
     caption: { fontSize: '0.75rem' },
+    caption_small: { fontSize: '0.625rem' },
     overline: { fontSize: '0.5rem' }
 };

package/build/utils/common.d.ts

@@ -1,6 +1,6 @@
 export declare const sleep: (milliseconds?: number) => Promise<unknown>;
 export declare const dangerousMessage: (message: string, callBack?: Function) => void;
-export declare const setBaseUrl: (publicKey: string) => void;
+export declare const setBaseUrl: (publicKey: string, countryCode?: string) => void;
 export declare const updateLocationUrlWithCountry: (countryIso2: string) => void;
 export declare const openConnect: (pk: string, countryCode?: string) => void;
 export declare function getMetaData(): Record<string, string> | undefined;

package/build/utils/common.js

@@ -1,6 +1,7 @@
 import { axiosInstance } from '../api';
-import { ENDPOINT_PATHS, CONNECT_SANDBOX_URL, CONNECT_BETA_URL } from '../constants';
+import { ENDPOINT_PATHS, CONNECT_SANDBOX_URL, CONNECT_PROD_URL } from '../constants';
 import { objectHasValues } from './object';
+import { isSA } from './string';
 export var sleep = function (milliseconds) {
     if (milliseconds === void 0) { milliseconds = 1000; }
     return new Promise(function (resolve) { return setTimeout(resolve, milliseconds); });
@@ -11,10 +12,11 @@ export var dangerousMessage = function (message, callBack) {
     }
     callBack === null || callBack === void 0 ? void 0 : callBack({ message: message });
 };
-export var setBaseUrl = function (publicKey) {
+export var setBaseUrl = function (publicKey, countryCode) {
+    if (countryCode === void 0) { countryCode = ''; }
     var isProd = publicKey.includes('pk_live');
     if (isProd) {
-        axiosInstance.defaults.baseURL = ENDPOINT_PATHS.BETA_BASE_URL;
+        axiosInstance.defaults.baseURL = isSA(countryCode) ? ENDPOINT_PATHS.PRODUCTION_BASE_URL_SA : ENDPOINT_PATHS.PRODUCTION_BASE_URL;
         return;
     }
     axiosInstance.defaults.baseURL = ENDPOINT_PATHS.SANDBOX_BASE_URL;
@@ -36,7 +38,7 @@ export var updateLocationUrlWithCountry = function (countryIso2) {
     window.history.replaceState({}, '', newUrl);
 };
 export var openConnect = function (pk, countryCode) {
-    var newUrl = new URL(pk.includes('pk_live') ? CONNECT_BETA_URL : CONNECT_SANDBOX_URL);
+    var newUrl = new URL(pk.includes('pk_live') ? CONNECT_PROD_URL : CONNECT_SANDBOX_URL);
     if (countryCode) {
         newUrl.pathname = "/".concat(countryCode.toLowerCase());
     }

package/build/utils/error.d.ts

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

package/build/utils/error.js

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

package/build/utils/string.d.ts

@@ -43,7 +43,7 @@ export declare const getRequestHeaders: (deviceInfo: DeviceInfo) => {
 };
 export declare const removeRequestHeaders: () => void;
 export declare const getBaseUrl: () => string;
-export declare const getScreenNameBasedOnFlow: (flow: string, isAuthorizedUser?: boolean, isOtherThanSAOrKWCountry?: boolean) => "CONNECT_NID_STEP" | "" | "BUSINESS_BUSINESS_TYPE_STEP" | "INDIVIDUAL_PERSONAL_INDIVIDUAL_INFO_STEP" | "INDIVIDUAL_LIST_STEP" | "PASSWORD_CREATE_PASSWORD_STEP" | "BANK_BANK_DETAILS_STEP" | "TAX_TAX_DETAILS_STEP" | "ENTITY_NAME_STEP" | "BRAND_INFO_STEP";
+export declare const getScreenNameBasedOnFlow: (flow: string, isAuthorizedUser?: boolean, isOtherThanSAOrKWCountry?: boolean) => string;
 export declare const getEighteenYearsAgo: () => string;
 export declare const isKW: (flag: string) => boolean;
 export declare const isSA: (flag: string) => boolean;
@@ -75,6 +75,7 @@ export declare const getFileType: (type: string) => "" | "image/jpeg" | "image/p
 export declare const isStringHasOneAsterisk: (value: string) => boolean;
 export declare const isOtherLicense: (item?: License) => boolean;
 export declare const formatNumberAsCurrency: (number: string) => string;
-export declare const getCurrencyByCountryIso2: (countryCode: string) => string;
+export declare const getCurrencyByCountryIso2: (countryCode?: string) => string;
 export declare const getMobileNumberLen: (initialLen: number, number: string) => number;
 export declare const getWebsiteLink: (isAr: boolean, countryCode: string, path: string) => string;
+export declare function formatCode(code: string, chunkSize?: number, delimiter?: string): string;

package/build/utils/string.js

@@ -1,7 +1,7 @@
 import { FlowsTypes } from '../@types';
 import { concatenateObjectValues, encryptString } from '.';
 import { removeAxiosGlobalHeaders } from '../api';
-import { COUNTRY_TO_CURRENCY, ENDPOINT_PATHS, ICONS_FULL_PATH, LANGUAGE_ABBREVIATIONS, TAP_WEBSITE } from '../constants';
+import { CONNECT_FLOWS, COUNTRY_TO_CURRENCY, ENDPOINT_PATHS, ICONS_FULL_PATH, LANGUAGE_ABBREVIATIONS, TAP_WEBSITE } from '../constants';
 import moment from 'moment';
 export var maskPhone = function (str) {
     if (str === void 0) { str = ''; }
@@ -204,6 +204,9 @@ export var getScreenNameBasedOnFlow = function (flow, isAuthorizedUser, isOtherT
     if (flow === FlowsTypes.PASSWORD) {
         return 'PASSWORD_CREATE_PASSWORD_STEP';
     }
+    if (flow === FlowsTypes.TERMINAL) {
+        return CONNECT_FLOWS.terminal.terminalDeviceList;
+    }
     return '';
 };
 export var getEighteenYearsAgo = function () {
@@ -344,3 +347,9 @@ export var getWebsiteLink = function (isAr, countryCode, path) {
     var language = isAr ? LANGUAGE_ABBREVIATIONS.ARABIC : LANGUAGE_ABBREVIATIONS.ENGLISH;
     return TAP_WEBSITE + language + '-' + countryCode + path;
 };
+export function formatCode(code, chunkSize, delimiter) {
+    var _a;
+    if (chunkSize === void 0) { chunkSize = 3; }
+    if (delimiter === void 0) { delimiter = ' - '; }
+    return ((_a = code.match(new RegExp(".{1,".concat(chunkSize, "}"), 'g'))) === null || _a === void 0 ? void 0 : _a.join(delimiter)) || code;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tap-payments/auth-jsconnect",
-	"version": "2.10.1-beta",
+	"version": "2.10.1-sandbox",
 	"description": "connect library, auth",
 	"private": false,
 	"main": "build/index.js",
@@ -21,7 +21,7 @@
 		"copy:files": "copyfiles -u 1 src/**/*.css build/",
 		"tsc:alias": "tsc-alias -p tsconfig.json",
 		"ts:build": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
-		"push": "npm publish --access public --tag beta"
+		"push": "npm publish --access public --tag sandbox"
 	},
 	"keywords": [],
 	"author": {
@@ -112,8 +112,7 @@
 	"lint-staged": {
 		"src/**/*.{ts,tsx,json,js,jsx}": [
 			"yarn run prettier:fix",
-			"yarn run lint",
-			"git add ."
+			"yarn run lint"
 		]
 	},
 	"browserslist": {