@tap-payments/auth-jsconnect 2.0.0 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/build/@types/app.d.ts +2 -2
  2. package/build/api/auth.d.ts +2 -0
  3. package/build/api/axios.d.ts +2 -0
  4. package/build/api/axios.js +65 -0
  5. package/build/api/country.d.ts +1 -2
  6. package/build/api/country.js +7 -8
  7. package/build/api/firebase.d.ts +1 -1
  8. package/build/api/firebase.js +5 -2
  9. package/build/api/index.d.ts +4 -5
  10. package/build/api/ip.d.ts +1 -1
  11. package/build/api/ip.js +5 -2
  12. package/build/api/lead.d.ts +2 -0
  13. package/build/api/operator.d.ts +1 -1
  14. package/build/api/operator.js +60 -4
  15. package/build/app/settings.d.ts +9 -12
  16. package/build/app/settings.js +87 -111
  17. package/build/components/AnimationFlow/Loader.js +1 -1
  18. package/build/components/DatePicker/customStyle.css +86 -86
  19. package/build/constants/app.d.ts +1 -0
  20. package/build/constants/app.js +1 -0
  21. package/build/features/app/bank/bankStore.js +2 -2
  22. package/build/features/app/business/businessStore.d.ts +1 -7
  23. package/build/features/app/business/businessStore.js +4 -41
  24. package/build/features/app/connect/connectStore.d.ts +1 -7
  25. package/build/features/app/connect/connectStore.js +11 -45
  26. package/build/features/app/individual/individualStore.d.ts +1 -6
  27. package/build/features/app/individual/individualStore.js +15 -46
  28. package/build/features/app/password/passwordStore.js +2 -2
  29. package/build/features/app/tax/taxStore.js +2 -2
  30. package/build/features/bank/Bank.js +3 -3
  31. package/build/features/business/Business.js +4 -7
  32. package/build/features/connect/Connect.js +3 -7
  33. package/build/features/connect/screens/Merchant/BrandName.js +3 -2
  34. package/build/features/connect/screens/Mobile/Mobile.js +1 -1
  35. package/build/features/individual/Individual.js +4 -7
  36. package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js +4 -2
  37. package/build/features/password/Password.js +3 -3
  38. package/build/features/shared/Background/Background.js +3 -2
  39. package/build/features/shared/Background/LogoBackground.d.ts +1 -4
  40. package/build/features/shared/Background/LogoBackground.js +4 -32
  41. package/build/features/shared/Button/FlowsButtons.js +3 -2
  42. package/build/features/shared/Footer/Footer.js +2 -3
  43. package/build/features/tax/Tax.js +3 -3
  44. package/build/hooks/useAppConfig.d.ts +1 -4
  45. package/build/hooks/useAppConfig.js +13 -110
  46. package/build/index.css +135 -135
  47. package/build/utils/array.d.ts +3 -0
  48. package/build/utils/array.js +10 -0
  49. package/package.json +1 -1
@@ -49,7 +49,7 @@ var _a;
49
49
  import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
50
50
  import API from '../../../api';
51
51
  import { FlowsTypes } from '../../../@types';
52
- import { hasKey, removeRequestHeaders } from '../../../utils';
52
+ import { hasKey } from '../../../utils';
53
53
  import { handleNextScreenStep } from '../../../app/settings';
54
54
  import { TAX_STEP_NAMES } from '../../../constants';
55
55
  export var verifyLeadToken = createAsyncThunk('verifyLeadToken', function (token, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
@@ -183,6 +183,7 @@ export var updateLeadSuccess = createAsyncThunk('updateLeadSuccess', function (p
183
183
  if (!id)
184
184
  return [2];
185
185
  payload = {
186
+ lang: settings.data.language,
186
187
  step_name: TAX_STEP_NAMES.TAX_SUCCESS,
187
188
  id: id,
188
189
  encryption_contract: []
@@ -345,7 +346,6 @@ export var taxSlice = createSlice({
345
346
  }
346
347
  var flows = response.flows, steps = response.steps;
347
348
  state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), { flows: flows, steps: steps });
348
- removeRequestHeaders();
349
349
  })
350
350
  .addCase(updateLeadSuccess.pending, function (state) {
351
351
  state.loading = true;
@@ -29,7 +29,7 @@ var Bank = memo(function (props) {
29
29
  var dispatch = useAppDispatch();
30
30
  var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
31
  var _b = useAppSelector(bankSelector), customLoading = _b.customLoading, bankError = _b.error;
32
- var loading = useAppConfig(__assign({ navigation: BANK_SCREENS_NAVIGATION }, props)).loading;
32
+ useAppConfig(__assign({ navigation: BANK_SCREENS_NAVIGATION }, props));
33
33
  useErrorListener(bankError || error);
34
34
  useStepStartedListener();
35
35
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
@@ -44,9 +44,9 @@ var Bank = memo(function (props) {
44
44
  dispatch(verifyLeadToken(token));
45
45
  };
46
46
  useEffect(function () {
47
- if (!loading)
47
+ if (!settingLoading)
48
48
  verifyToken();
49
- }, [loading]);
49
+ }, [settingLoading]);
50
50
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: bankFeatureScreens.map(function (_a, index) {
51
51
  var Element = _a.element, name = _a.name;
52
52
  var isActive = activeScreen.name === name;
@@ -14,7 +14,7 @@ import { memo, useEffect } from 'react';
14
14
  import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
15
15
  import { handleLanguage, settingsSelector } from '../../app/settings';
16
16
  import { FeatureContainer } from '../shared/Containers';
17
- import { businessSelector, getCountries, verifyLeadToken } from '../app/business/businessStore';
17
+ import { businessSelector, verifyLeadToken } from '../app/business/businessStore';
18
18
  import AnimationFlow from '../../components/AnimationFlow';
19
19
  import { store } from '../../app/store';
20
20
  import { ReduxProvider, ThemeProvider } from '../../components/Providers';
@@ -29,7 +29,7 @@ var Business = memo(function (props) {
29
29
  var dispatch = useAppDispatch();
30
30
  var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
31
  var _b = useAppSelector(businessSelector), customLoading = _b.customLoading, businessError = _b.error;
32
- var loading = useAppConfig(__assign({ navigation: BUSINESS_SCREENS_NAVIGATION }, props)).loading;
32
+ useAppConfig(__assign({ navigation: BUSINESS_SCREENS_NAVIGATION }, props));
33
33
  useErrorListener(businessError || error);
34
34
  useStepStartedListener();
35
35
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
@@ -44,12 +44,9 @@ var Business = memo(function (props) {
44
44
  dispatch(verifyLeadToken(token));
45
45
  };
46
46
  useEffect(function () {
47
- if (!loading)
47
+ if (!settingLoading)
48
48
  verifyToken();
49
- }, [loading]);
50
- useEffect(function () {
51
- dispatch(getCountries());
52
- }, []);
49
+ }, [settingLoading]);
53
50
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: businessFeatureScreens.map(function (_a, index) {
54
51
  var Element = _a.element, name = _a.name;
55
52
  var isActive = activeScreen.name === name;
@@ -10,13 +10,13 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
- import { memo, useEffect } from 'react';
13
+ import { memo } from 'react';
14
14
  import { FeatureContainer } from '../shared/Containers';
15
- import { useAppTheme, useAppDispatch, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
15
+ import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener } from '../../hooks';
16
16
  import { settingsSelector } from '../../app/settings';
17
17
  import AnimationFlow from '../../components/AnimationFlow';
18
18
  import { store } from '../../app/store';
19
- import { connectSelector, getCountries } from '../app/connect/connectStore';
19
+ import { connectSelector } from '../app/connect/connectStore';
20
20
  import { ReduxProvider, ThemeProvider } from '../../components/Providers';
21
21
  import Collapse from '../../components/Collapse';
22
22
  import { reactElement } from '../../utils';
@@ -26,16 +26,12 @@ import CustomFooter from '../shared/Footer';
26
26
  import Background from '../shared/Background';
27
27
  var Connect = memo(function (props) {
28
28
  var theme = useAppTheme().theme;
29
- var dispatch = useAppDispatch();
30
29
  var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
30
  var connectError = useAppSelector(connectSelector).error;
32
31
  useAppConfig(__assign({ navigation: CONNECT_SCREENS_NAVIGATION }, props));
33
32
  useErrorListener(connectError || error);
34
33
  useStepStartedListener();
35
34
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
36
- useEffect(function () {
37
- dispatch(getCountries());
38
- }, []);
39
35
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading, error: error, open: open, footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: connectFeatureScreens.map(function (_a, index) {
40
36
  var Element = _a.element, name = _a.name;
41
37
  var isActive = activeScreen.name === name;
@@ -63,9 +63,10 @@ import Tooltip from '../../../../components/Tooltip';
63
63
  import Collapse from '../../../../components/Collapse';
64
64
  import { removeAllOtherThanCharsNumbersAndSpace } from '../../../../utils';
65
65
  import CheckIcon from '../../../shared/CheckIcon';
66
- import { checkBrandNameAvailability, connectSelector } from '../../../app/connect/connectStore';
66
+ import { checkBrandNameAvailability } from '../../../app/connect/connectStore';
67
67
  import { useAppDispatch, useAppSelector } from '../../../../hooks';
68
68
  import { debounce } from 'lodash-es';
69
+ import { settingsSelector } from '../../../../app/settings';
69
70
  var LabelContainerStyled = styled(Box)(function (_a) {
70
71
  var theme = _a.theme;
71
72
  return ({
@@ -107,7 +108,7 @@ var BrandName = function (_a) {
107
108
  var brandControl = useController({ control: control, name: 'brandName' });
108
109
  var brandNameValue = brandControl.field.value;
109
110
  var error = (_b = brandControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
110
- var data = useAppSelector(connectSelector).data;
111
+ var data = useAppSelector(settingsSelector).data;
111
112
  var checkBrand = debounce(function (value) { return __awaiter(void 0, void 0, void 0, function () {
112
113
  var onSuccess;
113
114
  return __generator(this, function (_a) {
@@ -107,6 +107,6 @@ var Mobile = function (_a) {
107
107
  var disabled = !methods.formState.isValid || !!error;
108
108
  var title = t('join_our_community');
109
109
  var subTitle = t('ide_terms_and_conditions_description');
110
- 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: 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(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(AbsherButton, __assign({ disabled: settingsStore.loading || loading, onClick: function () { return onBack(); } }, { children: t('absher_button_label') }))] }))] })) }))] }));
110
+ 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(OrBoxStyled, { children: [_jsx(DividerStyled, {}), _jsx(TextStyled, { children: t('or') }), _jsx(DividerStyled, {})] }), _jsx(AbsherButton, __assign({ disabled: settingsStore.loading || loading, onClick: function () { return onBack(); } }, { children: t('absher_button_label') }))] }))] })) }))] }));
111
111
  };
112
112
  export default React.memo(Mobile);
@@ -21,7 +21,7 @@ import { getParameterByName, reactElement } from '../../utils';
21
21
  import { FeatureContainer } from '../shared/Containers';
22
22
  import { INDIVIDUAL_SCREENS_NAVIGATION } from '../../constants';
23
23
  import { individualFeatureScreens } from '../featuresScreens';
24
- import { getCountries, individualSelector, verifyLeadToken } from '../app/individual/individualStore';
24
+ import { individualSelector, verifyLeadToken } from '../app/individual/individualStore';
25
25
  import CustomFooter from '../shared/Footer';
26
26
  import Background from '../shared/Background';
27
27
  var Individual = memo(function (props) {
@@ -29,7 +29,7 @@ var Individual = memo(function (props) {
29
29
  var dispatch = useAppDispatch();
30
30
  var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
31
  var _b = useAppSelector(individualSelector), customLoading = _b.customLoading, individualError = _b.error;
32
- var loading = useAppConfig(__assign({ navigation: INDIVIDUAL_SCREENS_NAVIGATION }, props)).loading;
32
+ useAppConfig(__assign({ navigation: INDIVIDUAL_SCREENS_NAVIGATION }, props));
33
33
  useErrorListener(individualError || error);
34
34
  useStepStartedListener();
35
35
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
@@ -44,12 +44,9 @@ var Individual = memo(function (props) {
44
44
  dispatch(verifyLeadToken(token));
45
45
  };
46
46
  useEffect(function () {
47
- if (!loading)
47
+ if (!settingLoading)
48
48
  verifyToken();
49
- }, [loading]);
50
- useEffect(function () {
51
- dispatch(getCountries());
52
- }, []);
49
+ }, [settingLoading]);
53
50
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: individualFeatureScreens.map(function (_a, index) {
54
51
  var Element = _a.element, name = _a.name;
55
52
  var isActive = activeScreen.name === name;
@@ -16,7 +16,7 @@ import { useForm, FormProvider } from 'react-hook-form';
16
16
  import Box from '@mui/material/Box';
17
17
  import { useTranslation } from 'react-i18next';
18
18
  import { useAppDispatch, useAppSelector } from '../../../../hooks';
19
- import { handleCurrentActiveScreen } from '../../../../app/settings';
19
+ import { handleCurrentActiveScreen, settingsSelector } from '../../../../app/settings';
20
20
  import Form from '../../../../components/Form';
21
21
  import Collapse from '../../../../components/Collapse';
22
22
  import Button from '../../../shared/Button';
@@ -41,6 +41,8 @@ var AdditionalIndividualInfo = function (_a) {
41
41
  var isAr = useLanguage().isAr;
42
42
  var dispatch = useAppDispatch();
43
43
  var _b = useAppSelector(individualSelector), data = _b.data, loading = _b.loading, error = _b.error;
44
+ var settingsData = useAppSelector(settingsSelector).data;
45
+ var countries = settingsData.countries;
44
46
  var methods = useForm({
45
47
  resolver: yupResolver(IndividualInfoValidationSchema),
46
48
  defaultValues: data.individualData,
@@ -73,7 +75,7 @@ var AdditionalIndividualInfo = function (_a) {
73
75
  var isSourceOfIncomeListActive = listActive === ListType.SourceOfIncomeList;
74
76
  var isEmployerLocationListActive = listActive === ListType.EmployerLocationList;
75
77
  var isMonthlyIncomeListActive = listActive === ListType.MonthlyIncomeList;
76
- return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive, countries: data.countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
78
+ return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
77
79
  };
78
80
  export default React.memo(AdditionalIndividualInfo);
79
81
  AdditionalIndividualInfo.defaultProps = {};
@@ -29,7 +29,7 @@ var Password = memo(function (props) {
29
29
  var dispatch = useAppDispatch();
30
30
  var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
31
31
  var _b = useAppSelector(passwordSelector), customLoading = _b.customLoading, passwordError = _b.error;
32
- var loading = useAppConfig(__assign({ navigation: PASSWORD_SCREENS_NAVIGATION }, props)).loading;
32
+ useAppConfig(__assign({ navigation: PASSWORD_SCREENS_NAVIGATION }, props));
33
33
  useErrorListener(passwordError || error);
34
34
  useStepStartedListener();
35
35
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
@@ -44,9 +44,9 @@ var Password = memo(function (props) {
44
44
  dispatch(verifyLeadToken(token));
45
45
  };
46
46
  useEffect(function () {
47
- if (!loading)
47
+ if (!settingLoading)
48
48
  verifyToken();
49
- }, [loading]);
49
+ }, [settingLoading]);
50
50
  return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading, error: error, open: open, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: passwordFeatureScreens.map(function (_a, index) {
51
51
  var Element = _a.element, name = _a.name;
52
52
  var isActive = activeScreen.name === name;
@@ -15,7 +15,7 @@ import { styled } from '@mui/material/styles';
15
15
  import Box from '@mui/material/Box';
16
16
  import LogoBackground from './LogoBackground';
17
17
  var BackgroundStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'isTapOrigin'; } })(function (_a) {
18
- var isTapOrigin = _a.isTapOrigin;
18
+ var isTapOrigin = _a.isTapOrigin, theme = _a.theme;
19
19
  return ({
20
20
  width: '100vw',
21
21
  height: '100vh',
@@ -24,6 +24,7 @@ var BackgroundStyled = styled(Box, { shouldForwardProp: function (prop) { return
24
24
  });
25
25
  var Background = function (_a) {
26
26
  var children = _a.children, isTapOrigin = _a.isTapOrigin, loading = _a.loading;
27
- return (_jsxs(BackgroundStyled, __assign({ id: 'background', isTapOrigin: isTapOrigin }, { children: [_jsx(LogoBackground, { hide: loading || !isTapOrigin }), children] })));
27
+ var showLogo = !loading && isTapOrigin;
28
+ return (_jsxs(BackgroundStyled, __assign({ id: 'background', isTapOrigin: isTapOrigin }, { children: [showLogo && _jsx(LogoBackground, {}), children] })));
28
29
  };
29
30
  export default memo(Background);
@@ -1,6 +1,3 @@
1
1
  import React from 'react';
2
- declare type LogoBackgroundProps = {
3
- hide?: boolean;
4
- };
5
- declare const _default: React.MemoExoticComponent<({ hide }: LogoBackgroundProps) => JSX.Element>;
2
+ declare const _default: React.MemoExoticComponent<() => JSX.Element>;
6
3
  export default _default;
@@ -1,18 +1,6 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
2
  import { memo } from 'react';
14
3
  import { styled } from '@mui/material/styles';
15
- import Collapse from '@mui/material/Collapse';
16
4
  import Box from '@mui/material/Box';
17
5
  import Icon from '../../../components/Icon';
18
6
  import { ICONS_NAMES } from '../../../constants';
@@ -25,8 +13,7 @@ var BoxStyled = styled(Box)(function (_a) {
25
13
  flexDirection: 'column',
26
14
  justifyContent: 'center',
27
15
  alignItems: 'center',
28
- paddingTop: theme.spacing(5),
29
- paddingBottom: theme.spacing(2)
16
+ paddingTop: theme.spacing(5)
30
17
  },
31
18
  _b[theme.breakpoints.down('sm')] = {
32
19
  paddingTop: theme.spacing(11)
@@ -40,31 +27,16 @@ var LogoBadgeStyled = styled(Icon)(function (_a) {
40
27
  width: theme.spacing(8.875)
41
28
  });
42
29
  });
43
- var LogoIconBoxStyled = styled(Box)(function (_a) {
44
- var _b;
45
- var theme = _a.theme;
46
- return (_b = {
47
- paddingTop: theme.spacing(2.5),
48
- width: '100%',
49
- display: 'flex',
50
- justifyContent: 'center'
51
- },
52
- _b[theme.transitions.create(['top'])] = {
53
- duration: theme.transitions.duration.standard
54
- },
55
- _b);
56
- });
57
30
  var LogoIconStyled = styled(Icon)(function (_a) {
58
31
  var theme = _a.theme;
59
32
  return ({
60
33
  width: theme.spacing(5.875),
61
34
  height: theme.spacing(3.625),
62
- padding: theme.spacing(0)
35
+ marginTop: theme.spacing(2.5)
63
36
  });
64
37
  });
65
- var LogoBackground = function (_a) {
66
- var hide = _a.hide;
38
+ var LogoBackground = function () {
67
39
  var isAr = useLanguage().isAr;
68
- return (_jsx(Collapse, __assign({ in: !hide }, { children: _jsxs(BoxStyled, { children: [_jsx(LogoBadgeStyled, { src: ICONS_NAMES.TAP_LOGO_EN_ICON }), _jsx(LogoIconBoxStyled, { children: _jsx(LogoIconStyled, { src: isAr ? ICONS_NAMES.TAP_LOGO_TEXT_AR : ICONS_NAMES.TAP_LOGO_TEXT_EN, alt: 'tap logo' }) })] }) })));
40
+ return (_jsxs(BoxStyled, { children: [_jsx(LogoBadgeStyled, { src: ICONS_NAMES.TAP_LOGO_EN_ICON }), _jsx(LogoIconStyled, { src: isAr ? ICONS_NAMES.TAP_LOGO_TEXT_AR : ICONS_NAMES.TAP_LOGO_TEXT_EN, alt: 'tap logo' })] }));
69
41
  };
70
42
  export default memo(LogoBackground);
@@ -16,7 +16,7 @@ import Box from '@mui/material/Box';
16
16
  import Link from '@mui/material/Link';
17
17
  import { ICONS_NAMES } from '../../../constants';
18
18
  import CheckIcon from '@mui/icons-material/Check';
19
- import { useAppDispatch } from '../../../hooks';
19
+ import { useAppDispatch, useLanguage } from '../../../hooks';
20
20
  import { handleOpen, handleCurrentActiveScreen } from '../../../app/settings';
21
21
  import { getScreenNameBasedOnFlow } from '../../../utils';
22
22
  var Image = styled('img')(function (_a) {
@@ -87,6 +87,7 @@ var CheckIconStyled = styled(CheckIcon)(function (_a) {
87
87
  export default function FlowsButtons(_a) {
88
88
  var buttons = _a.buttons, flowName = _a.flowName;
89
89
  var dispatch = useAppDispatch();
90
+ var isAr = useLanguage().isAr;
90
91
  var onRedirect = function (item) {
91
92
  if (item.isCompleted)
92
93
  return;
@@ -104,6 +105,6 @@ export default function FlowsButtons(_a) {
104
105
  var isLast = idx === buttons.length - 1;
105
106
  return (_jsx(Link, __assign({ underline: 'none', onClick: function () {
106
107
  onRedirect({ title: title, href: href, src: src, hoverSrc: hoverSrc, isCompleted: isCompleted, name: name });
107
- } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', isCompleted: isCompleted, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: 'unset' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: _jsx(Image, { src: src, alt: title }), type: 'button' }, { children: title })) }), idx));
108
+ } }, { children: _jsx(ButtonStyled, __assign({ variant: 'outlined', isCompleted: isCompleted, sx: __assign({ mb: isLast ? 2.5 : 1.8 }, sx), endIcon: isCompleted ? (_jsx(CheckIconStyled, {})) : (_jsx(Image, { sx: { height: 15, transform: isAr ? 'scale(-1)' : 'scale(1)' }, src: ICONS_NAMES.Arrow_filled_right_icon })), startIcon: _jsx(Image, { src: src, alt: title }), type: 'button' }, { children: title })) }), idx));
108
109
  }) }));
109
110
  }
@@ -1,15 +1,14 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { LanguageMode } from '../../../@types';
3
3
  import { useAppDispatch, useLanguage, useAppSelector } from '../../../hooks';
4
- import { handleLanguage } from '../../../app/settings';
4
+ import { handleLanguage, settingsSelector } from '../../../app/settings';
5
5
  import Footer from '../../../components/Footer';
6
6
  import { useTranslation } from 'react-i18next';
7
- import { connectSelector } from '../../app/connect/connectStore';
8
7
  export default function CustomFooter() {
9
8
  var isEn = useLanguage().isEn;
10
9
  var t = useTranslation().t;
11
10
  var dispatch = useAppDispatch();
12
- var data = useAppSelector(connectSelector).data;
11
+ var data = useAppSelector(settingsSelector).data;
13
12
  var handleChangeLanguage = function () {
14
13
  var language = isEn ? LanguageMode.AR : LanguageMode.EN;
15
14
  dispatch(handleLanguage(language));
@@ -27,9 +27,9 @@ import Background from '../shared/Background';
27
27
  var Tax = memo(function (props) {
28
28
  var theme = useAppTheme().theme;
29
29
  var dispatch = useAppDispatch();
30
- var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, settingLoading = _a.loading;
30
+ var _a = useAppSelector(settingsSelector), data = _a.data, error = _a.error, loading = _a.loading;
31
31
  var _b = useAppSelector(taxSelector), customLoading = _b.customLoading, taxError = _b.error;
32
- var loading = useAppConfig(__assign({ navigation: TAX_SCREENS_NAVIGATION }, props)).loading;
32
+ useAppConfig(__assign({ navigation: TAX_SCREENS_NAVIGATION }, props));
33
33
  useErrorListener(taxError || error);
34
34
  useStepStartedListener();
35
35
  var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open;
@@ -47,7 +47,7 @@ var Tax = memo(function (props) {
47
47
  if (!loading)
48
48
  verifyToken();
49
49
  }, [loading]);
50
- return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: settingLoading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, open: open, error: error, loading: settingLoading || customLoading, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.map(function (_a, index) {
50
+ return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ isTapOrigin: isTapOrigin, loading: loading || customLoading }, { children: _jsx(AnimationFlow, __assign({ isTapOrigin: isTapOrigin, open: open, error: error, loading: loading || customLoading, breakpoint: 'sm', footer: _jsx(CustomFooter, {}) }, { children: _jsx(FeatureContainer, { children: taxFeatureScreens.map(function (_a, index) {
51
51
  var Element = _a.element, name = _a.name;
52
52
  var isActive = activeScreen.name === name;
53
53
  return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
@@ -2,8 +2,5 @@ import { LibConfig, ScreenStepNavigation } from '../@types';
2
2
  interface AppConfigProps extends LibConfig {
3
3
  navigation: ScreenStepNavigation[];
4
4
  }
5
- export declare const useAppConfig: ({ appInfo, navigation, publicKey, ...rest }: AppConfigProps) => {
6
- loading: boolean;
7
- error: string | null;
8
- };
5
+ export declare const useAppConfig: ({ appInfo, navigation, publicKey, ...rest }: AppConfigProps) => void;
9
6
  export {};
@@ -9,42 +9,6 @@ var __assign = (this && this.__assign) || function () {
9
9
  };
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
13
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14
- return new (P || (P = Promise))(function (resolve, reject) {
15
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
16
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
17
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
18
- step((generator = generator.apply(thisArg, _arguments || [])).next());
19
- });
20
- };
21
- var __generator = (this && this.__generator) || function (thisArg, body) {
22
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
23
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
24
- function verb(n) { return function (v) { return step([n, v]); }; }
25
- function step(op) {
26
- if (f) throw new TypeError("Generator is already executing.");
27
- while (_) try {
28
- 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;
29
- if (y = 0, t) op = [op[0] & 2, t.value];
30
- switch (op[0]) {
31
- case 0: case 1: t = op; break;
32
- case 4: _.label++; return { value: op[1], done: false };
33
- case 5: _.label++; y = op[1]; op = [0]; continue;
34
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
35
- default:
36
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
37
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
38
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
39
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
40
- if (t[2]) _.ops.pop();
41
- _.trys.pop(); continue;
42
- }
43
- op = body.call(thisArg, _);
44
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
45
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
46
- }
47
- };
48
12
  var __rest = (this && this.__rest) || function (s, e) {
49
13
  var t = {};
50
14
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -56,20 +20,15 @@ var __rest = (this && this.__rest) || function (s, e) {
56
20
  }
57
21
  return t;
58
22
  };
59
- import { useEffect, useState } from 'react';
60
- import { handleActiveFlowScreens, settingsSelector, getClientIp, getLocale, getBrowserFingerPrint, getOperator, handleSetAppConfig, handleLanguage, handleOpen, handleIsTapOrigin } from '../app/settings';
23
+ import { useEffect } from 'react';
24
+ import { handleActiveFlowScreens, handleSetAppConfig, handleLanguage, handleOpen, handleIsTapOrigin, fetchAppSettingsSync } from '../app/settings';
61
25
  import { useAppDispatch } from './useAppDispatch';
62
- import { useAppSelector } from './useAppSelector';
63
- import { setAxiosGlobalHeaders, axiosInstance } from '../api';
64
- import { getRequestHeaders, encryptString, isTapDomain } from '../utils';
26
+ import { axiosInstance } from '../api';
27
+ import { isTapDomain, removeRequestHeaders } from '../utils';
65
28
  import { ENDPOINT_PATHS } from '../constants';
66
29
  export var useAppConfig = function (_a) {
67
30
  var appInfo = _a.appInfo, navigation = _a.navigation, publicKey = _a.publicKey, rest = __rest(_a, ["appInfo", "navigation", "publicKey"]);
68
- var _b = useState(true), loading = _b[0], setLoading = _b[1];
69
31
  var dispatch = useAppDispatch();
70
- var _c = useAppSelector(settingsSelector), data = _c.data, error = _c.error;
71
- var deviceInfo = data.deviceInfo, language = data.language, appConfig = data.appConfig;
72
- var device = deviceInfo.device, browser = deviceInfo.browser, connection = deviceInfo.connection;
73
32
  var setBaseUrl = function () {
74
33
  var isProd = publicKey.includes('pk_live');
75
34
  if (isProd) {
@@ -78,79 +37,23 @@ export var useAppConfig = function (_a) {
78
37
  }
79
38
  axiosInstance.defaults.baseURL = ENDPOINT_PATHS.DEV_BASE_URL;
80
39
  };
81
- var addAxiosHeader = function () {
82
- setAxiosGlobalHeaders(__assign(__assign({}, getRequestHeaders(deviceInfo)), { authorization: encryptString(publicKey), mdn: encryptString(window.location.origin) }));
40
+ var setAppConfig = function () {
41
+ dispatch(handleSetAppConfig(__assign({ appInfo: appInfo, publicKey: publicKey }, rest)));
42
+ dispatch(handleActiveFlowScreens(navigation));
83
43
  };
84
- var handleAppConfig = function () { return __awaiter(void 0, void 0, void 0, function () {
85
- return __generator(this, function (_a) {
86
- dispatch(handleSetAppConfig(__assign({ appInfo: appInfo, publicKey: publicKey }, rest)));
87
- setBaseUrl();
88
- dispatch(handleActiveFlowScreens(navigation));
89
- return [2];
90
- });
91
- }); };
92
44
  var checkDomain = function () {
93
45
  var isTap = isTapDomain(rest.merchantDomain);
94
46
  dispatch(handleIsTapOrigin(isTap));
95
47
  };
96
- var handleAppApiConfig = function () { return __awaiter(void 0, void 0, void 0, function () {
97
- return __generator(this, function (_a) {
98
- switch (_a.label) {
99
- case 0:
100
- checkDomain();
101
- return [4, dispatch(getLocale())];
102
- case 1:
103
- _a.sent();
104
- return [4, dispatch(getClientIp())];
105
- case 2:
106
- _a.sent();
107
- return [4, dispatch(getBrowserFingerPrint(appInfo))];
108
- case 3:
109
- _a.sent();
110
- return [2];
111
- }
112
- });
113
- }); };
114
- var handleGetOperator = function () { return __awaiter(void 0, void 0, void 0, function () {
115
- var payload;
116
- var _a, _b;
117
- return __generator(this, function (_c) {
118
- switch (_c.label) {
119
- case 0:
120
- payload = {
121
- type: 'website',
122
- app_client_version: 'js-auth-connect',
123
- requirer_browser: "".concat(browser === null || browser === void 0 ? void 0 : browser.name, " , ").concat(browser === null || browser === void 0 ? void 0 : browser.version),
124
- os: "".concat((_a = device.os) === null || _a === void 0 ? void 0 : _a.name, " , ").concat((_b = device.os) === null || _b === void 0 ? void 0 : _b.version),
125
- locale: language
126
- };
127
- return [4, dispatch(getOperator(payload))];
128
- case 1:
129
- _c.sent();
130
- setLoading(false);
131
- return [2];
132
- }
133
- });
134
- }); };
135
48
  useEffect(function () {
136
49
  dispatch(handleOpen(rest.open));
137
50
  }, [rest.open]);
138
51
  useEffect(function () {
139
- if (data.appConfig.language)
140
- dispatch(handleLanguage(data.appConfig.language));
141
- }, [data.appConfig.language]);
142
- useEffect(function () {
143
- handleAppConfig();
52
+ removeRequestHeaders();
53
+ checkDomain();
54
+ setBaseUrl();
55
+ setAppConfig();
56
+ dispatch(handleLanguage(rest.language));
57
+ dispatch(fetchAppSettingsSync());
144
58
  }, []);
145
- useEffect(function () {
146
- if (appConfig.publicKey)
147
- handleAppApiConfig();
148
- }, [appConfig]);
149
- useEffect(function () {
150
- if (connection.ip && browser.browser_id) {
151
- addAxiosHeader();
152
- handleGetOperator();
153
- }
154
- }, [connection, browser]);
155
- return { loading: loading, error: error };
156
59
  };