@tap-payments/auth-jsconnect 2.8.98-development → 2.8.99-development
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.
- package/build/@types/app.d.ts +2 -1
- package/build/@types/app.js +1 -0
- package/build/api/auth.d.ts +4 -0
- package/build/api/index.d.ts +5 -2
- package/build/api/lead.d.ts +2 -0
- package/build/api/lead.js +16 -0
- package/build/api/user.d.ts +7 -0
- package/build/api/user.js +9 -1
- package/build/app/rootReducer.d.ts +1 -0
- package/build/app/rootReducer.js +3 -1
- package/build/app/store.d.ts +2 -0
- package/build/assets/locales/ar.json +24 -13
- package/build/assets/locales/en.json +21 -10
- package/build/constants/app.d.ts +10 -0
- package/build/constants/app.js +54 -0
- package/build/constants/flows.d.ts +22 -0
- package/build/constants/flows.js +23 -0
- package/build/constants/index.d.ts +1 -0
- package/build/constants/index.js +1 -0
- package/build/features/app/individual/individualStore.d.ts +1 -1
- package/build/features/app/individual/individualStore.js +38 -29
- package/build/features/app/kyc/kycStore.d.ts +67 -0
- package/build/features/app/kyc/kycStore.js +410 -0
- package/build/features/featuresScreens.d.ts +1 -0
- package/build/features/featuresScreens.js +38 -0
- package/build/features/kyc/KYC.d.ts +11 -0
- package/build/features/kyc/KYC.js +95 -0
- package/build/features/kyc/index.d.ts +1 -0
- package/build/features/kyc/index.js +1 -0
- package/build/features/kyc/screens/Loading/Loading.d.ts +4 -0
- package/build/features/kyc/screens/Loading/Loading.js +10 -0
- package/build/features/kyc/screens/Loading/index.d.ts +2 -0
- package/build/features/kyc/screens/Loading/index.js +2 -0
- package/build/features/kyc/screens/OperatorError/OperatorError.d.ts +5 -0
- package/build/features/kyc/screens/OperatorError/OperatorError.js +9 -0
- package/build/features/kyc/screens/OperatorError/index.d.ts +2 -0
- package/build/features/kyc/screens/OperatorError/index.js +2 -0
- package/build/features/kyc/screens/Success/Success.d.ts +5 -0
- package/build/features/kyc/screens/Success/Success.js +19 -0
- package/build/features/kyc/screens/Success/index.d.ts +2 -0
- package/build/features/kyc/screens/Success/index.js +2 -0
- package/build/features/kyc/screens/Terms/Header.d.ts +6 -0
- package/build/features/kyc/screens/Terms/Header.js +36 -0
- package/build/features/kyc/screens/Terms/Terms.d.ts +4 -0
- package/build/features/kyc/screens/Terms/Terms.js +72 -0
- package/build/features/kyc/screens/Terms/index.d.ts +2 -0
- package/build/features/kyc/screens/Terms/index.js +2 -0
- package/build/features/kyc/screens/Users/Users.d.ts +3 -0
- package/build/features/kyc/screens/Users/Users.js +73 -0
- package/build/features/kyc/screens/Users/index.d.ts +2 -0
- package/build/features/kyc/screens/Users/index.js +2 -0
- package/build/features/kyc/screens/VerifyNafath/VerifyNafath.d.ts +5 -0
- package/build/features/kyc/screens/VerifyNafath/VerifyNafath.js +45 -0
- package/build/features/kyc/screens/VerifyNafath/index.d.ts +3 -0
- package/build/features/kyc/screens/VerifyNafath/index.js +2 -0
- package/build/features/kyc/screens/VerifyPaci/VerifyPACI.d.ts +5 -0
- package/build/features/kyc/screens/VerifyPaci/VerifyPACI.js +44 -0
- package/build/features/kyc/screens/VerifyPaci/index.d.ts +3 -0
- package/build/features/kyc/screens/VerifyPaci/index.js +2 -0
- package/build/features/shared/SuccessScreen/SuccessScreen.js +1 -1
- package/build/hooks/useAppDispatch.d.ts +1 -0
- package/build/hooks/useSanitizedTranslation.d.ts +2 -1
- package/build/hooks/useSanitizedTranslation.js +2 -2
- package/build/index.d.ts +3 -2
- package/build/index.js +4 -2
- package/build/theme/shadows.js +1 -1
- package/build/utils/string.d.ts +1 -0
- package/build/utils/string.js +4 -0
- package/package.json +1 -1
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { CONNECT_FLOWS } from '../constants';
|
|
1
2
|
import BusinessCountry from './connect/screens/BusinessCountry/BusinessCountry';
|
|
2
3
|
import MobileScreen from './connect/screens/Mobile';
|
|
3
4
|
import NIDScreen from './connect/screens/NID';
|
|
@@ -126,6 +127,13 @@ import BoardSuccessWithFlowPage from './board/screens/SuccessWithFlowButtons';
|
|
|
126
127
|
import BoardResetPasswordSuccessPage from './board/screens/ResetPasswordSuccess';
|
|
127
128
|
import BoardDataLoadingPage from './board/screens/PrepareDataLoading';
|
|
128
129
|
import BoardOperatorError from './board/screens/OperatorError';
|
|
130
|
+
import KycLoadingPage from './kyc/screens/Loading';
|
|
131
|
+
import KycVerifyNafathPage from './kyc/screens/VerifyNafath';
|
|
132
|
+
import KycVerifyPaciPage from './kyc/screens/VerifyPaci';
|
|
133
|
+
import KycOperatorErrorPage from './kyc/screens/OperatorError';
|
|
134
|
+
import KycSuccessPage from './kyc/screens/Success';
|
|
135
|
+
import KycTermsPage from './kyc/screens/Terms';
|
|
136
|
+
import KycUsersPage from './kyc/screens/Users';
|
|
129
137
|
export var connectFeatureScreens = [
|
|
130
138
|
{
|
|
131
139
|
name: 'CONNECT_BUSINESS_COUNTRY_STEP',
|
|
@@ -632,3 +640,33 @@ export var boardFeatureScreens = [
|
|
|
632
640
|
element: BoardOperatorError
|
|
633
641
|
}
|
|
634
642
|
];
|
|
643
|
+
export var kycFeatureScreens = [
|
|
644
|
+
{
|
|
645
|
+
name: CONNECT_FLOWS.kyc.loadingData,
|
|
646
|
+
element: KycLoadingPage
|
|
647
|
+
},
|
|
648
|
+
{
|
|
649
|
+
name: CONNECT_FLOWS.kyc.terms,
|
|
650
|
+
element: KycTermsPage
|
|
651
|
+
},
|
|
652
|
+
{
|
|
653
|
+
name: CONNECT_FLOWS.kyc.users,
|
|
654
|
+
element: KycUsersPage
|
|
655
|
+
},
|
|
656
|
+
{
|
|
657
|
+
name: CONNECT_FLOWS.kyc.operatorError,
|
|
658
|
+
element: KycOperatorErrorPage
|
|
659
|
+
},
|
|
660
|
+
{
|
|
661
|
+
name: CONNECT_FLOWS.kyc.verifyPACI,
|
|
662
|
+
element: KycVerifyPaciPage
|
|
663
|
+
},
|
|
664
|
+
{
|
|
665
|
+
name: CONNECT_FLOWS.kyc.verifyNafath,
|
|
666
|
+
element: KycVerifyNafathPage
|
|
667
|
+
},
|
|
668
|
+
{
|
|
669
|
+
name: CONNECT_FLOWS.kyc.success,
|
|
670
|
+
element: KycSuccessPage
|
|
671
|
+
}
|
|
672
|
+
];
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { LibConfig } from '../../@types';
|
|
3
|
+
export interface KYCLibProps extends LibConfig {
|
|
4
|
+
verifyToken?: string;
|
|
5
|
+
configToken?: string;
|
|
6
|
+
loaderColor?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare function KYCElement(props: KYCLibProps): JSX.Element;
|
|
9
|
+
export declare function renderKYCLib(config: KYCLibProps, elementId: string): {
|
|
10
|
+
unmount: () => void;
|
|
11
|
+
};
|
|
@@ -0,0 +1,95 @@
|
|
|
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
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
24
|
+
import React, { memo } from 'react';
|
|
25
|
+
import { createRoot } from 'react-dom/client';
|
|
26
|
+
import { useAppTheme, useAppSelector, useAppConfig, useErrorListener, useStepStartedListener, useVerifyToken, useAppDispatch } from '../../hooks';
|
|
27
|
+
import { handleCurrentActiveScreen, settingsSelector } from '../../app/settings';
|
|
28
|
+
import { store } from '../../app/store';
|
|
29
|
+
import AnimationFlow from '../../components/AnimationFlow';
|
|
30
|
+
import { ReduxProvider, ThemeProvider } from '../../components/Providers';
|
|
31
|
+
import Collapse from '../../components/Collapse';
|
|
32
|
+
import { findOrCreateElementAndInject, initializeGTM, sendPageView } from '../../utils';
|
|
33
|
+
import { CONNECT_FLOWS, KYC_SCREENS_NAVIGATION } from '../../constants';
|
|
34
|
+
import { FeatureContainer } from '../shared/Containers';
|
|
35
|
+
import { kycSelector, verifyTokenApi } from '../app/kyc/kycStore';
|
|
36
|
+
import { kycFeatureScreens } from '../featuresScreens';
|
|
37
|
+
import Background from '../shared/Background';
|
|
38
|
+
var KYC = memo(function (_a) {
|
|
39
|
+
var _b, _c;
|
|
40
|
+
var configToken = _a.configToken, verifyToken = _a.verifyToken, loaderColor = _a.loaderColor, props = __rest(_a, ["configToken", "verifyToken", "loaderColor"]);
|
|
41
|
+
var theme = useAppTheme().theme;
|
|
42
|
+
var dispatch = useAppDispatch();
|
|
43
|
+
var _d = useAppSelector(settingsSelector), data = _d.data, error = _d.error, settingLoading = _d.loading;
|
|
44
|
+
var _e = useAppSelector(kycSelector), customLoading = _e.customLoading, kycError = _e.error, loading = _e.loading;
|
|
45
|
+
useAppConfig(__assign(__assign({ navigation: KYC_SCREENS_NAVIGATION }, props), { disableSettingFetching: props.mode === 'content' ? false : !!verifyToken }));
|
|
46
|
+
useErrorListener(kycError || error);
|
|
47
|
+
useStepStartedListener();
|
|
48
|
+
var activeScreen = data.activeScreen, isTapOrigin = data.isTapOrigin, open = data.open, featureScreensNavigation = data.featureScreensNavigation, merchant = data.merchant, isMaturityExpress = data.isMaturityExpress, appConfig = data.appConfig;
|
|
49
|
+
var animationDirection = open ? (_b = appConfig.features) === null || _b === void 0 ? void 0 : _b.dialogStartTransition : (_c = appConfig.features) === null || _c === void 0 ? void 0 : _c.dialogEndTransition;
|
|
50
|
+
var verifyTokenAndMoveToNextScreen = function (_a) {
|
|
51
|
+
var token = _a.token;
|
|
52
|
+
return function () {
|
|
53
|
+
dispatch(verifyTokenApi({ token: token }))
|
|
54
|
+
.unwrap()
|
|
55
|
+
.then(function (_a) {
|
|
56
|
+
var nextScreen = _a.nextScreen;
|
|
57
|
+
dispatch(handleCurrentActiveScreen(nextScreen));
|
|
58
|
+
})
|
|
59
|
+
.catch(function () { });
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
useVerifyToken({
|
|
63
|
+
verify: verifyTokenAndMoveToNextScreen,
|
|
64
|
+
loadingScreenName: CONNECT_FLOWS.kyc.loadingData,
|
|
65
|
+
navigation: featureScreensNavigation,
|
|
66
|
+
open: open,
|
|
67
|
+
mode: props.mode,
|
|
68
|
+
internalToken: verifyToken,
|
|
69
|
+
settingLoading: settingLoading,
|
|
70
|
+
operatorErrorScreenName: CONNECT_FLOWS.kyc.operatorError,
|
|
71
|
+
isValidOperator: data.isValidOperator
|
|
72
|
+
});
|
|
73
|
+
React.useEffect(function () {
|
|
74
|
+
initializeGTM();
|
|
75
|
+
sendPageView({
|
|
76
|
+
title: 'KYC'
|
|
77
|
+
});
|
|
78
|
+
}, []);
|
|
79
|
+
var initialLoading = verifyToken && props.mode !== 'content' ? settingLoading : settingLoading || customLoading;
|
|
80
|
+
return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Background, __assign({ mode: props.mode, open: open, isTapOrigin: isTapOrigin, loading: initialLoading }, { children: _jsx(AnimationFlow, __assign({ pointerEvents: loading ? 'none' : 'auto', isTapOrigin: isTapOrigin, animationDirection: animationDirection, open: open, error: error, loading: initialLoading, loaderColor: loaderColor, breakpoint: 'sm', screenId: activeScreen.name, merchantInfo: merchant, isMaturityExpress: isMaturityExpress, type: props.mode === 'content' ? 'CONTENT' : undefined, dialogEdgeFormat: data.appConfig.dialogEdgeFormat, features: appConfig.features }, { children: _jsx(FeatureContainer, __assign({ mode: props.mode, isMaturityExpress: isMaturityExpress }, { children: kycFeatureScreens.map(function (_a, index) {
|
|
81
|
+
var Element = _a.element, name = _a.name;
|
|
82
|
+
var isActive = activeScreen.name === name;
|
|
83
|
+
return (_jsx(Collapse, __assign({ in: isActive, timeout: { enter: 1000, exit: 800 } }, { children: _jsx(Element, {}) }), index));
|
|
84
|
+
}) })) })) })) })));
|
|
85
|
+
});
|
|
86
|
+
export function KYCElement(props) {
|
|
87
|
+
return (_jsx(ReduxProvider, __assign({ store: store }, { children: _jsx(KYC, __assign({}, props)) })));
|
|
88
|
+
}
|
|
89
|
+
export function renderKYCLib(config, elementId) {
|
|
90
|
+
var element = findOrCreateElementAndInject(elementId);
|
|
91
|
+
var root = createRoot(element);
|
|
92
|
+
root.render(_jsx(KYCElement, __assign({}, config)));
|
|
93
|
+
var unmount = function () { return root.unmount(); };
|
|
94
|
+
return { unmount: unmount };
|
|
95
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './KYC';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './KYC';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
import { useAppSelector } from '../../../../hooks';
|
|
4
|
+
import DataLoading from '../../../shared/DataLoading';
|
|
5
|
+
import { kycSelector } from '../../../app/kyc/kycStore';
|
|
6
|
+
export var Loading = function () {
|
|
7
|
+
var error = useAppSelector(kycSelector).error;
|
|
8
|
+
return _jsx(DataLoading, { error: error });
|
|
9
|
+
};
|
|
10
|
+
export default memo(Loading);
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { useTranslation } from 'react-i18next';
|
|
4
|
+
import GenericError from '../../../shared/GenericError';
|
|
5
|
+
var OperatorError = function (_a) {
|
|
6
|
+
var t = useTranslation().t;
|
|
7
|
+
return _jsx(GenericError, { error: t('operator_is_invalid'), errorTitle: t('oops') });
|
|
8
|
+
};
|
|
9
|
+
export default React.memo(OperatorError);
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { useTranslation } from 'react-i18next';
|
|
4
|
+
import SuccessScreen from '../../../shared/SuccessScreen';
|
|
5
|
+
import { useAppSelector } from '../../../../hooks';
|
|
6
|
+
import { kycSelector } from '../../../app/kyc/kycStore';
|
|
7
|
+
var Success = function (_a) {
|
|
8
|
+
var t = useTranslation().t;
|
|
9
|
+
var _b = useAppSelector(kycSelector), error = _b.error, loading = _b.loading, data = _b.data;
|
|
10
|
+
var redirectToBoard = function () {
|
|
11
|
+
var _a, _b;
|
|
12
|
+
var baseUrl = window.location.origin;
|
|
13
|
+
var boardId = ((_b = (_a = data.responseData) === null || _a === void 0 ? void 0 : _a.verifyTokenData) === null || _b === void 0 ? void 0 : _b.boardId) || '';
|
|
14
|
+
var boardUrl = "".concat(baseUrl, "/board?board_id=").concat(boardId);
|
|
15
|
+
window.open(boardUrl, '_self');
|
|
16
|
+
};
|
|
17
|
+
return (_jsx(SuccessScreen, { title: t('kyc_success_title'), onSuccess: redirectToBoard, successTitle: t('kyc_success_button'), loading: loading, error: error || '' }));
|
|
18
|
+
};
|
|
19
|
+
export default React.memo(Success);
|
|
@@ -0,0 +1,36 @@
|
|
|
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
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import * as React from 'react';
|
|
14
|
+
import { styled } from '@mui/material/styles';
|
|
15
|
+
import { useSanitizedTranslation } from '../../../../hooks';
|
|
16
|
+
import Text from '../../../../components/Text';
|
|
17
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
18
|
+
var ScreenContainerStyled = styled(ScreenContainer)(function () { return ({
|
|
19
|
+
alignItems: 'center',
|
|
20
|
+
justifyContent: 'center',
|
|
21
|
+
textAlign: 'center'
|
|
22
|
+
}); });
|
|
23
|
+
var TitleStyled = styled(Text)(function (_a) {
|
|
24
|
+
var theme = _a.theme;
|
|
25
|
+
return (__assign(__assign({}, theme.typography.body1), { fontWeight: theme.typography.fontWeightBold, color: theme.palette.info.dark, marginBlockEnd: theme.spacing(2), padding: theme.spacing(0, 2.5), lineHeight: '19.2px' }));
|
|
26
|
+
});
|
|
27
|
+
var DescriptionStyled = styled(Text)(function (_a) {
|
|
28
|
+
var theme = _a.theme;
|
|
29
|
+
return (__assign(__assign({}, theme.typography.body2), { fontWeight: theme.typography.fontWeightMedium, color: theme.palette.info.dark, marginBlockEnd: theme.spacing(2), padding: theme.spacing(0, 2.5), lineHeight: '16.8px' }));
|
|
30
|
+
});
|
|
31
|
+
var Header = function (_a) {
|
|
32
|
+
var idNumber = _a.idNumber;
|
|
33
|
+
var st = useSanitizedTranslation();
|
|
34
|
+
return (_jsxs(ScreenContainerStyled, { children: [_jsx(TitleStyled, { children: st('kyc_terms_title') }), _jsx(DescriptionStyled, { children: idNumber ? st('kyc_terms_description_single_user', { id_number: idNumber }) : st('kyc_terms_description') })] }));
|
|
35
|
+
};
|
|
36
|
+
export default React.memo(Header);
|
|
@@ -0,0 +1,72 @@
|
|
|
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
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React, { memo } from 'react';
|
|
14
|
+
import { handleNextScreenStep, settingsSelector } from '../../../../app/settings';
|
|
15
|
+
import Box from '@mui/material/Box';
|
|
16
|
+
import { styled } from '@mui/material/styles';
|
|
17
|
+
import { useAppDispatch, useAppSelector, useLanguage, useSanitizedTranslation } from '../../../../hooks';
|
|
18
|
+
import { isSA, maskIDNumber } from '../../../../utils';
|
|
19
|
+
import { CONNECT_FLOWS } from '../../../../constants';
|
|
20
|
+
import Button from '../../../shared/Button';
|
|
21
|
+
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
22
|
+
import { createNafathAuth, createPaciAuth, kycSelector } from '../../../app/kyc/kycStore';
|
|
23
|
+
import Header from './Header';
|
|
24
|
+
var BoxStyled = styled(Box)(function (_a) {
|
|
25
|
+
var theme = _a.theme;
|
|
26
|
+
return ({
|
|
27
|
+
margin: theme.spacing(0, 2.5),
|
|
28
|
+
marginTop: theme.spacing(1.5),
|
|
29
|
+
boxShadow: theme.shadows[3],
|
|
30
|
+
backgroundColor: theme.palette.common.white,
|
|
31
|
+
fontWeight: theme.typography.fontWeightMedium,
|
|
32
|
+
fontSize: theme.spacing(1.875),
|
|
33
|
+
padding: theme.spacing(1.5),
|
|
34
|
+
borderRadius: theme.spacing(3.875),
|
|
35
|
+
textAlign: 'center'
|
|
36
|
+
});
|
|
37
|
+
});
|
|
38
|
+
export var Terms = function () {
|
|
39
|
+
var _a, _b, _c;
|
|
40
|
+
var st = useSanitizedTranslation();
|
|
41
|
+
var isAr = useLanguage().isAr;
|
|
42
|
+
var dispatch = useAppDispatch();
|
|
43
|
+
var settingsData = useAppSelector(settingsSelector).data;
|
|
44
|
+
var _d = useAppSelector(kycSelector), loading = _d.loading, error = _d.error, data = _d.data;
|
|
45
|
+
var hasOneUserOnly = ((_b = (_a = data.responseData) === null || _a === void 0 ? void 0 : _a.userList) === null || _b === void 0 ? void 0 : _b.length) === 1;
|
|
46
|
+
var user = hasOneUserOnly ? (_c = data.responseData) === null || _c === void 0 ? void 0 : _c.userList[0] : undefined;
|
|
47
|
+
var idNumber = user ? maskIDNumber(user.identification.id) : '';
|
|
48
|
+
var isSACountry = React.useMemo(function () { return isSA(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
|
|
49
|
+
var onNext = function () {
|
|
50
|
+
if (hasOneUserOnly) {
|
|
51
|
+
if (isSACountry) {
|
|
52
|
+
dispatch(createNafathAuth(user))
|
|
53
|
+
.unwrap()
|
|
54
|
+
.then(function () {
|
|
55
|
+
dispatch(handleNextScreenStep(CONNECT_FLOWS.kyc.verifyNafath));
|
|
56
|
+
})
|
|
57
|
+
.catch(function () { });
|
|
58
|
+
return;
|
|
59
|
+
}
|
|
60
|
+
dispatch(createPaciAuth(user))
|
|
61
|
+
.unwrap()
|
|
62
|
+
.then(function () {
|
|
63
|
+
dispatch(handleNextScreenStep(CONNECT_FLOWS.kyc.verifyPACI));
|
|
64
|
+
})
|
|
65
|
+
.catch(function () { });
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
68
|
+
dispatch(handleNextScreenStep(CONNECT_FLOWS.kyc.users));
|
|
69
|
+
};
|
|
70
|
+
return (_jsxs(ScreenContainer, { children: [_jsx(Header, { idNumber: idNumber }), _jsx(BoxStyled, { children: st('kyc_terms_conditions') }), _jsx(BoxStyled, { children: st('kyc_refund_policy') }), _jsx(BoxStyled, __assign({ sx: { mb: error ? 3 : 0 } }, { children: st('kyc_dispute_policy') })), _jsx(Button, __assign({ sx: { mt: 3 }, disableBack: true, isAr: isAr, loading: loading, error: st(error || ''), onClick: onNext }, { children: isSACountry ? st('approve_with_nafath_app') : st('approve_with_paci_app') }))] }));
|
|
71
|
+
};
|
|
72
|
+
export default memo(Terms);
|
|
@@ -0,0 +1,73 @@
|
|
|
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
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React, { memo } from 'react';
|
|
14
|
+
import Box from '@mui/material/Box';
|
|
15
|
+
import { styled } from '@mui/material/styles';
|
|
16
|
+
import { handleNextScreenStep, settingsSelector } from '../../../../app/settings';
|
|
17
|
+
import Text from '../../../../components/Text';
|
|
18
|
+
import Loader from '../../../../components/Loader';
|
|
19
|
+
import { isSA, maskIDNumber } from '../../../../utils';
|
|
20
|
+
import { CONNECT_FLOWS, ICONS_NAMES } from '../../../../constants';
|
|
21
|
+
import { useAppDispatch, useAppSelector, useSanitizedTranslation } from '../../../../hooks';
|
|
22
|
+
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
23
|
+
import { createNafathAuth, createPaciAuth, kycSelector } from '../../../app/kyc/kycStore';
|
|
24
|
+
var BoxStyled = styled(Box, { shouldForwardProp: function (prop) { return !['loading'].includes(prop.toString()); } })(function (_a) {
|
|
25
|
+
var theme = _a.theme, loading = _a.loading;
|
|
26
|
+
return (__assign({ marginTop: theme.spacing(1), boxShadow: theme.shadows[3], backgroundColor: theme.palette.common.white, fontWeight: theme.typography.fontWeightMedium, fontSize: theme.spacing(1.875), padding: theme.spacing(1.5), borderRadius: theme.spacing(3.875), textAlign: 'center', cursor: 'pointer', display: 'flex', justifyContent: 'space-between' }, (loading && {
|
|
27
|
+
justifyContent: 'center'
|
|
28
|
+
})));
|
|
29
|
+
});
|
|
30
|
+
var DescriptionStyled = styled(Text)(function (_a) {
|
|
31
|
+
var theme = _a.theme;
|
|
32
|
+
return (__assign(__assign({}, theme.typography.body2), { fontWeight: theme.typography.fontWeightMedium, color: theme.palette.info.dark, marginBlockEnd: theme.spacing(2), padding: '0px 20px', lineHeight: '16.8px', textAlign: 'center' }));
|
|
33
|
+
});
|
|
34
|
+
var ImgStyled = styled('img')(function (_a) {
|
|
35
|
+
var theme = _a.theme;
|
|
36
|
+
return ({
|
|
37
|
+
filter: 'brightness(0)',
|
|
38
|
+
width: theme.spacing(2.25),
|
|
39
|
+
height: theme.spacing(2.25)
|
|
40
|
+
});
|
|
41
|
+
});
|
|
42
|
+
var Users = function () {
|
|
43
|
+
var _a;
|
|
44
|
+
var st = useSanitizedTranslation();
|
|
45
|
+
var dispatch = useAppDispatch();
|
|
46
|
+
var settingsData = useAppSelector(settingsSelector).data;
|
|
47
|
+
var _b = useAppSelector(kycSelector), loading = _b.loading, error = _b.error, data = _b.data;
|
|
48
|
+
var _c = React.useState(), activeUser = _c[0], setActiveUser = _c[1];
|
|
49
|
+
var userList = ((_a = data.responseData) === null || _a === void 0 ? void 0 : _a.userList) || [];
|
|
50
|
+
var isSACountry = React.useMemo(function () { return isSA(settingsData.businessCountry.iso2); }, [settingsData.businessCountry.iso2]);
|
|
51
|
+
var onClickUser = function (user) {
|
|
52
|
+
setActiveUser(user);
|
|
53
|
+
if (isSACountry) {
|
|
54
|
+
dispatch(createNafathAuth(user))
|
|
55
|
+
.unwrap()
|
|
56
|
+
.then(function () {
|
|
57
|
+
dispatch(handleNextScreenStep(CONNECT_FLOWS.kyc.verifyNafath));
|
|
58
|
+
})
|
|
59
|
+
.catch(function () { });
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
dispatch(createPaciAuth(user))
|
|
63
|
+
.unwrap()
|
|
64
|
+
.then(function () {
|
|
65
|
+
dispatch(handleNextScreenStep(CONNECT_FLOWS.kyc.verifyPACI));
|
|
66
|
+
})
|
|
67
|
+
.catch(function () { });
|
|
68
|
+
};
|
|
69
|
+
return (_jsxs(ScreenContainer, __assign({ sx: { pl: 2, pr: 2 } }, { children: [_jsx(DescriptionStyled, { children: st('kyc_users_description', { provider: isSACountry ? 'NAFATH' : 'PACI' }) }), userList.map(function (user, index) {
|
|
70
|
+
return (_jsx(BoxStyled, __assign({ onClick: function () { return onClickUser(user); } }, { children: (activeUser === null || activeUser === void 0 ? void 0 : activeUser.id) === user.id && loading ? (_jsx(Loader, { innerColor: 'black', outerColor: 'black', size: 8, style: { height: 20, width: 20 }, toggleAnimation: !!loading })) : (_jsxs(_Fragment, { children: [_jsx(ImgStyled, { src: ICONS_NAMES.individual_filled_icon }), maskIDNumber(user.identification.id), _jsx("span", {})] })) }), index));
|
|
71
|
+
})] })));
|
|
72
|
+
};
|
|
73
|
+
export default memo(Users);
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { kycSelector, verifyNafath } from '../../../app/kyc/kycStore';
|
|
4
|
+
import NafathVerification from '../../../shared/NafathVerification';
|
|
5
|
+
import { handleNextScreenStep, handlePrevScreenStep } from '../../../../app/settings';
|
|
6
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
7
|
+
import { CONNECT_FLOWS } from '../../../../constants';
|
|
8
|
+
var VerifyNafathPage = function () {
|
|
9
|
+
var _a = React.useState(false), success = _a[0], setSuccess = _a[1];
|
|
10
|
+
var _b = React.useState(false), failed = _b[0], setFailed = _b[1];
|
|
11
|
+
var _c = React.useState(false), isReady = _c[0], setIsReady = _c[1];
|
|
12
|
+
var dispatch = useAppDispatch();
|
|
13
|
+
var data = useAppSelector(kycSelector).data;
|
|
14
|
+
var _d = data.responseData || {}, createAuthData = _d.createAuthData, userList = _d.userList;
|
|
15
|
+
var _e = createAuthData || {}, expiry = _e.expiry, app_url_android = _e.app_url_android, app_url_ios = _e.app_url_ios, random = _e.random;
|
|
16
|
+
var hasOneUserOnly = (userList === null || userList === void 0 ? void 0 : userList.length) === 1;
|
|
17
|
+
React.useEffect(function () {
|
|
18
|
+
if (createAuthData && !isReady) {
|
|
19
|
+
setIsReady(true);
|
|
20
|
+
}
|
|
21
|
+
}, [createAuthData]);
|
|
22
|
+
React.useEffect(function () {
|
|
23
|
+
if (!isReady)
|
|
24
|
+
return;
|
|
25
|
+
var promise = dispatch(verifyNafath({ onSuccess: function () { return setSuccess(true); }, onFailure: function () { return setFailed(true); } }));
|
|
26
|
+
promise
|
|
27
|
+
.unwrap()
|
|
28
|
+
.then(function (_a) {
|
|
29
|
+
var nextScreen = _a.nextScreen;
|
|
30
|
+
if (nextScreen)
|
|
31
|
+
dispatch(handleNextScreenStep(nextScreen));
|
|
32
|
+
})
|
|
33
|
+
.catch(function () { });
|
|
34
|
+
return function () {
|
|
35
|
+
promise === null || promise === void 0 ? void 0 : promise.abort();
|
|
36
|
+
};
|
|
37
|
+
}, [isReady]);
|
|
38
|
+
var onBack = React.useCallback(function () {
|
|
39
|
+
dispatch(handlePrevScreenStep(hasOneUserOnly ? CONNECT_FLOWS.kyc.terms : CONNECT_FLOWS.kyc.users));
|
|
40
|
+
}, []);
|
|
41
|
+
if (!isReady)
|
|
42
|
+
return null;
|
|
43
|
+
return (_jsx(NafathVerification, { randomNumber: random, expiryInSeconds: expiry, success: success, failed: failed, urls: { android: app_url_android, ios: app_url_ios }, onFinish: function () { return onBack(); } }));
|
|
44
|
+
};
|
|
45
|
+
export default React.memo(VerifyNafathPage);
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { handleNextScreenStep, handlePrevScreenStep } from '../../../../app/settings';
|
|
4
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
5
|
+
import { CONNECT_FLOWS } from '../../../../constants';
|
|
6
|
+
import { kycSelector, verifyPaci } from '../../../app/kyc/kycStore';
|
|
7
|
+
import PaciVerification from '../../../shared/PaciVerification';
|
|
8
|
+
var VerifyPaciPage = function () {
|
|
9
|
+
var _a = React.useState(false), success = _a[0], setSuccess = _a[1];
|
|
10
|
+
var _b = React.useState(false), isReady = _b[0], setIsReady = _b[1];
|
|
11
|
+
var dispatch = useAppDispatch();
|
|
12
|
+
var data = useAppSelector(kycSelector).data;
|
|
13
|
+
var _c = data.responseData || {}, createAuthData = _c.createAuthData, userList = _c.userList;
|
|
14
|
+
var _d = createAuthData || {}, expiry = _d.expiry, app_url_android = _d.app_url_android, app_url_ios = _d.app_url_ios, random = _d.random;
|
|
15
|
+
var hasOneUserOnly = (userList === null || userList === void 0 ? void 0 : userList.length) === 1;
|
|
16
|
+
React.useEffect(function () {
|
|
17
|
+
if (createAuthData && !isReady) {
|
|
18
|
+
setIsReady(true);
|
|
19
|
+
}
|
|
20
|
+
}, [createAuthData]);
|
|
21
|
+
React.useEffect(function () {
|
|
22
|
+
if (!isReady)
|
|
23
|
+
return;
|
|
24
|
+
var promise = dispatch(verifyPaci({ onSuccess: function () { return setSuccess(true); } }));
|
|
25
|
+
promise
|
|
26
|
+
.unwrap()
|
|
27
|
+
.then(function (_a) {
|
|
28
|
+
var nextScreen = _a.nextScreen;
|
|
29
|
+
if (nextScreen)
|
|
30
|
+
dispatch(handleNextScreenStep(nextScreen));
|
|
31
|
+
})
|
|
32
|
+
.catch(function () { });
|
|
33
|
+
return function () {
|
|
34
|
+
promise === null || promise === void 0 ? void 0 : promise.abort();
|
|
35
|
+
};
|
|
36
|
+
}, [isReady]);
|
|
37
|
+
var onBack = React.useCallback(function () {
|
|
38
|
+
dispatch(handlePrevScreenStep(hasOneUserOnly ? CONNECT_FLOWS.kyc.terms : CONNECT_FLOWS.kyc.users));
|
|
39
|
+
}, []);
|
|
40
|
+
if (!isReady)
|
|
41
|
+
return null;
|
|
42
|
+
return (_jsx(PaciVerification, { expiryInSeconds: expiry, success: success, urls: { android: app_url_android, ios: app_url_ios }, onFinish: function () { return onBack(); } }));
|
|
43
|
+
};
|
|
44
|
+
export default React.memo(VerifyPaciPage);
|
|
@@ -58,6 +58,6 @@ var ThankYou = function (_a) {
|
|
|
58
58
|
var title = _a.title, description = _a.description, showEmailProviders = _a.showEmailProviders, onSuccess = _a.onSuccess, successTitle = _a.successTitle, loading = _a.loading, error = _a.error, enableBack = _a.enableBack, onBack = _a.onBack;
|
|
59
59
|
var t = useTranslation().t;
|
|
60
60
|
var isAr = useLanguage().isAr;
|
|
61
|
-
return (_jsxs(ContainerStyled, { children: [_jsx(IconStyled, { src: ICONS_NAMES.SUCCESS_GIF, alt: 'loading...' }), _jsxs(TitleStyled, { children: [title, " "] }), _jsx(DescriptionStyled, { children: description }), showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(EmailProvidersButton, { gmail: { title: t('gmail_btn_open_title'), href: 'https://mail.google.com/mail/u/0/#inbox' }, outlook: { title: t('outlook_btn_open_title'), href: 'https://outlook.live.com/mail/0/' }, apple: { title: t('apple_btn_open_title'), href: 'mailto:' }, mail: { title: t('mail_btn_open_title'), href: 'mailto:' } }) })), onSuccess && !showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(SuccessButton, __assign({ onClick: onSuccess, disableBack: true, disableNextIcon: true, disabled: loading, isAr: isAr, loading: loading, error: t(error || '') }, { children: t(successTitle || '') })) })), enableBack && (_jsx(Button, __assign({ sx: { mb: 1.5, mt: 0 }, onClick: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, variant: 'text' }, { children: t('back') })))] }));
|
|
61
|
+
return (_jsxs(ContainerStyled, { children: [_jsx(IconStyled, { src: ICONS_NAMES.SUCCESS_GIF, alt: 'loading...' }), _jsxs(TitleStyled, { children: [title, " "] }), description && _jsx(DescriptionStyled, { children: description }), showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(EmailProvidersButton, { gmail: { title: t('gmail_btn_open_title'), href: 'https://mail.google.com/mail/u/0/#inbox' }, outlook: { title: t('outlook_btn_open_title'), href: 'https://outlook.live.com/mail/0/' }, apple: { title: t('apple_btn_open_title'), href: 'mailto:' }, mail: { title: t('mail_btn_open_title'), href: 'mailto:' } }) })), onSuccess && !showEmailProviders && (_jsx(MailBoxStyled, { children: _jsx(SuccessButton, __assign({ onClick: onSuccess, disableBack: true, disableNextIcon: true, disabled: loading, isAr: isAr, loading: loading, error: t(error || '') }, { children: t(successTitle || '') })) })), enableBack && (_jsx(Button, __assign({ sx: { mb: 1.5, mt: 0 }, onClick: function () { return onBack === null || onBack === void 0 ? void 0 : onBack(); }, variant: 'text' }, { children: t('back') })))] }));
|
|
62
62
|
};
|
|
63
63
|
export default React.memo(ThankYou);
|
|
@@ -12,4 +12,5 @@ export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{
|
|
|
12
12
|
connectExpress: import("../features/app/connectExpress/connectExpressStore").ConnectExpressState;
|
|
13
13
|
auth: import("../features/app/auth/authStore").AuthState;
|
|
14
14
|
board: import("../features/app/board/boardStore").BoardState;
|
|
15
|
+
kyc: import("../features/app/kyc/kycStore").KYCDataState;
|
|
15
16
|
}, undefined, import("redux").AnyAction> & import("redux").Dispatch<import("redux").AnyAction>;
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import { StringMap, TOptions } from 'i18next';
|
|
2
|
+
export declare const useSanitizedTranslation: () => (key: string, options?: string | TOptions<StringMap> | undefined) => string;
|