@tap-payments/auth-jsconnect 2.6.18-test → 2.6.19-test

package/build/features/shared/BusinessCountry/BusinessCountry.js

@@ -0,0 +1,170 @@
+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);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { useTranslation } from 'react-i18next';
+import Box from '@mui/material/Box';
+import CircularProgress from '@mui/material/CircularProgress';
+import { styled } from '@mui/material/styles';
+import { useLanguage } from '../../../hooks';
+import SimpleList from '../../../components/SimpleList';
+import Text from '../../../components/Text';
+import Collapse from '../../../components/Collapse';
+import ExpandIcon from '../../../components/ExpandIcon';
+import Icon from '../../../components/Icon';
+import { ScreenContainer } from '../../shared/Containers';
+import Search from '../../shared/Search';
+import InputSelect from '../../shared/InputSelect';
+var NameContainer = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
+    var theme = _a.theme, isSelected = _a.isSelected;
+    return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.caption), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25), display: 'flex' }));
+});
+var ListItem = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'space-between',
+        width: '100%',
+        paddingInlineStart: theme.spacing(2.5),
+        paddingInlineEnd: theme.spacing(2.5),
+        paddingTop: theme.spacing(1.5),
+        paddingBottom: theme.spacing(1.5)
+    });
+});
+var CountryListItem = styled(ListItem, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
+    var theme = _a.theme, isSelected = _a.isSelected;
+    return (__assign({ marginLeft: theme.spacing(2), marginRight: theme.spacing(2), paddingInlineStart: theme.spacing(1), paddingInlineEnd: theme.spacing(1) }, (isSelected && {
+        backgroundColor: '#EDF6FF',
+        borderRadius: theme.spacing(0.5)
+    })));
+});
+var ListItemContainer = styled(Box)(function () { return ({
+    display: 'flex',
+    flexDirection: 'column',
+    width: '100%'
+}); });
+var SimpleListStyled = styled((SimpleList))(function () { return ({
+    height: 'fit-content'
+}); });
+var CountryListStyled = styled((SimpleList))(function () { return ({
+    height: 'fit-content'
+}); });
+var BusinessCountry = function (_a) {
+    var _b, _c;
+    var countries = _a.countries, loading = _a.loading, defaultCountryIso2 = _a.defaultCountryIso2, onSelectCountry = _a.onSelectCountry;
+    var _d = React.useState(countries || []), countryList = _d[0], setCountryList = _d[1];
+    var _e = React.useState(null), anchorEl = _e[0], setAnchorEl = _e[1];
+    var _f = React.useState(''), subIndex = _f[0], setSubIndex = _f[1];
+    var _g = React.useState(), selectedCountry = _g[0], setSelectedCountry = _g[1];
+    var t = useTranslation().t;
+    var isAr = useLanguage().isAr;
+    var countryValue = selectedCountry;
+    var onSelectItem = function (item) { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            setSelectedCountry(item);
+            onSelectCountry(item);
+            return [2];
+        });
+    }); };
+    var handleCloseMainMenu = function () {
+        setAnchorEl(null);
+        handleSearch('');
+    };
+    var handleOpenMainMenu = function (event) {
+        setAnchorEl(event.currentTarget);
+    };
+    var handleOpenSubMenu = function (index) {
+        if (subIndex === index)
+            setSubIndex('');
+        else
+            setSubIndex(index);
+    };
+    React.useEffect(function () {
+        if (!defaultCountryIso2)
+            return;
+        countryList.forEach(function (r) {
+            return (r.countries || []).find(function (c) {
+                if (c.country.iso2 === defaultCountryIso2) {
+                    setSelectedCountry(c);
+                    return;
+                }
+            });
+        });
+    }, [defaultCountryIso2]);
+    var handleSearch = function (value) {
+        var filteredList = countryList === null || countryList === void 0 ? void 0 : countryList.filter(function (country) {
+            var _a, _b;
+            return ((_a = country.countries) === null || _a === void 0 ? void 0 : _a.find(function (obj) { return obj.country.name_en.toLowerCase().includes(value.toLowerCase()); })) ||
+                ((_b = country.countries) === null || _b === void 0 ? void 0 : _b.find(function (obj) { return obj.country.name_ar.toLowerCase().includes(value.toLowerCase()); }));
+        });
+        setCountryList(filteredList);
+    };
+    React.useEffect(function () {
+        var item = countryList === null || countryList === void 0 ? void 0 : countryList.find(function (r) { var _a; return (_a = r.countries) === null || _a === void 0 ? void 0 : _a.find(function (c) { var _a; return c.country.iso2 === ((_a = countryValue === null || countryValue === void 0 ? void 0 : countryValue.country) === null || _a === void 0 ? void 0 : _a.iso2); }); });
+        if (item)
+            setSubIndex(item.id.toString());
+    }, [anchorEl]);
+    return (_jsxs(ScreenContainer, __assign({ sx: { pb: 2.5 } }, { children: [_jsx(InputSelect, { required: true, label: t('country_list_title'), value: (isAr ? (_b = countryValue === null || countryValue === void 0 ? void 0 : countryValue.country) === null || _b === void 0 ? void 0 : _b.name_ar : (_c = countryValue === null || countryValue === void 0 ? void 0 : countryValue.country) === null || _c === void 0 ? void 0 : _c.name_en) || '', onClick: !!anchorEl ? handleCloseMainMenu : handleOpenMainMenu, placeholder: t('choose_any_country'), endAdornment: _jsx(ExpandIcon, { anchorEl: !!anchorEl }) }), _jsxs(Collapse, __assign({ in: !!anchorEl }, { children: [_jsx(Search, { onSearchValue: handleSearch }), _jsx(SimpleListStyled, { sx: { maxHeight: '350px', paddingTop: 0 }, list: countryList, listItemProps: { sx: { padding: 0 } }, onSelectItem: function (item, e) {
+                            e.stopPropagation();
+                            handleOpenSubMenu(item.id.toString());
+                        }, renderItem: function (item) {
+                            var isSelected = !!item.countries.find(function (c) { var _a; return c.country.iso2.toLocaleLowerCase() === ((_a = countryValue === null || countryValue === void 0 ? void 0 : countryValue.country) === null || _a === void 0 ? void 0 : _a.iso2.toLocaleLowerCase()); });
+                            return (_jsxs(ListItemContainer, { children: [_jsxs(ListItem, { children: [_jsx(NameContainer, __assign({ sx: { padding: 0 }, isSelected: isSelected }, { children: item.title })), _jsx(ExpandIcon, { anchorEl: subIndex === item.id.toString() })] }), _jsx(Collapse, __assign({ in: item.id.toString() === subIndex }, { children: _jsx(CountryListStyled, { sx: { pt: 0, pb: 0 }, list: item.countries || [], onSelectItem: function (i, e) {
+                                                e.stopPropagation();
+                                                onSelectItem(i);
+                                            }, listItemProps: { sx: { padding: 0, '&:last-child': { paddingBottom: 0 } } }, renderItem: function (item, idx) {
+                                                var _a;
+                                                var isSelected = item.country.iso2.toLocaleLowerCase() === ((_a = countryValue === null || countryValue === void 0 ? void 0 : countryValue.country) === null || _a === void 0 ? void 0 : _a.iso2.toLocaleLowerCase());
+                                                return (_jsxs(CountryListItem, __assign({ isSelected: isSelected, sx: { mt: idx === 0 ? 1 : 0 } }, { children: [_jsxs(NameContainer, __assign({ sx: { display: 'flex', alignItems: 'center', padding: 0 }, isSelected: isSelected }, { children: [_jsx(Icon, { sx: { marginInlineEnd: 1 }, src: item.country.logo }), isAr ? item.country.name_ar : item.country.name_en] })), loading && isSelected ? (_jsx(CircularProgress, { size: 20, thickness: 3, sx: { height: 'auto !important' } })) : (_jsx(ExpandIcon, { sx: {
+                                                                color: isSelected ? 'rgba(31, 136, 208, 1)' : 'rgba(58, 65, 84, 0.7)',
+                                                                transform: isAr ? 'rotate(90deg)' : 'rotate(270deg)'
+                                                            } }))] })));
+                                            } }) }))] }));
+                        } })] }))] })));
+};
+export default BusinessCountry;

package/build/features/shared/BusinessCountry/index.d.ts

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

package/build/features/shared/BusinessCountry/index.js

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

package/build/features/shared/Footer/Footer.js

@@ -6,6 +6,7 @@ import Footer from '../../../components/Footer';
 import { useTranslation } from 'react-i18next';
 import { sendCustomEventToGTM } from '../../../utils';
 export default function CustomFooter() {
+    var _a;
     var isEn = useLanguage().isEn;
     var t = useTranslation().t;
     var dispatch = useAppDispatch();
@@ -21,7 +22,7 @@ export default function CustomFooter() {
         });
         dispatch(handleLanguage(language));
     };
-    var country = data.businessCountry;
+    var country = ((_a = data.businessCountry) === null || _a === void 0 ? void 0 : _a.iso2) ? data.businessCountry : data.ipCountry;
     var countryName = isEn ? country.name.english : country.name.arabic;
     var countryFlag = country.logo;
     return _jsx(Footer, { onSwitchLanguage: handleChangeLanguage, language: t('language'), countryName: countryName, countryFlag: countryFlag });

package/package.json

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