@tap-payments/auth-jsconnect 2.4.12 → 2.4.13
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/form.d.ts +3 -0
- package/build/constants/app.js +13 -1
- package/build/features/app/connectExpress/connectExpressStore.d.ts +8 -8
- package/build/features/app/connectExpress/connectExpressStore.js +43 -32
- package/build/features/connectExpress/screens/AccountCreatedLoader/AccountCreatedLoader.d.ts +5 -0
- package/build/features/connectExpress/screens/AccountCreatedLoader/AccountCreatedLoader.js +36 -0
- package/build/features/connectExpress/screens/AccountCreatedLoader/index.d.ts +2 -0
- package/build/features/connectExpress/screens/AccountCreatedLoader/index.js +2 -0
- package/build/features/connectExpress/screens/AuthMerchant/AuthMerchant.d.ts +5 -0
- package/build/features/connectExpress/screens/AuthMerchant/AuthMerchant.js +74 -0
- package/build/features/connectExpress/screens/{AuthenticationList → AuthMerchant}/MerchantList.d.ts +2 -1
- package/build/features/connectExpress/screens/AuthMerchant/MerchantList.js +64 -0
- package/build/features/connectExpress/screens/AuthMerchant/index.d.ts +2 -0
- package/build/features/connectExpress/screens/AuthMerchant/index.js +2 -0
- package/build/features/connectExpress/screens/AuthMerchant/validation.d.ts +8 -0
- package/build/features/connectExpress/screens/AuthMerchant/validation.js +4 -0
- package/build/features/connectExpress/screens/AuthenticationList/AuthenticationList.js +11 -20
- package/build/features/connectExpress/screens/AuthenticationList/EntityList.js +1 -3
- package/build/features/connectExpress/screens/AuthenticationList/validation.d.ts +3 -13
- package/build/features/connectExpress/screens/AuthenticationList/validation.js +44 -19
- package/build/features/featuresScreens.js +13 -3
- package/build/features/shared/DataLoading/DataLoading.d.ts +4 -1
- package/build/features/shared/DataLoading/DataLoading.js +2 -2
- package/package.json +1 -1
- package/build/features/connectExpress/screens/AuthenticationList/MerchantList.js +0 -126
package/build/@types/form.d.ts
CHANGED
package/build/constants/app.js
CHANGED
|
@@ -134,7 +134,7 @@ export var CONNECT_EXPRESS_SCREENS_NAVIGATION = [
|
|
|
134
134
|
},
|
|
135
135
|
{
|
|
136
136
|
name: 'CONNECT_EXPRESS_AUTHENTICATION_LIST_STEP',
|
|
137
|
-
next: '
|
|
137
|
+
next: ['CONNECT_EXPRESS_AUTH_MERCHANT_LIST_STEP', 'CONNECT_EXPRESS_AUTH_ACCOUNT_CREATED_STEP'],
|
|
138
138
|
prev: ['CONNECT_EXPRESS_MOBILE_STEP', 'CONNECT_EXPRESS_NID_STEP', 'CONNECT_EXPRESS_CIVIL_ID_STEP'],
|
|
139
139
|
order: 3
|
|
140
140
|
},
|
|
@@ -150,6 +150,18 @@ export var CONNECT_EXPRESS_SCREENS_NAVIGATION = [
|
|
|
150
150
|
prev: 'CONNECT_EXPRESS_MOBILE_STEP',
|
|
151
151
|
order: 3
|
|
152
152
|
},
|
|
153
|
+
{
|
|
154
|
+
name: 'CONNECT_EXPRESS_AUTH_ACCOUNT_CREATED_STEP',
|
|
155
|
+
next: '',
|
|
156
|
+
prev: 'CONNECT_EXPRESS_AUTHENTICATION_LIST_STEP',
|
|
157
|
+
order: 4
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
name: 'CONNECT_EXPRESS_AUTH_MERCHANT_LIST_STEP',
|
|
161
|
+
next: 'CONNECT_EXPRESS_SUCCESS_WITH_FLOW_BUTTONS_STEP',
|
|
162
|
+
prev: 'CONNECT_EXPRESS_AUTHENTICATION_LIST_STEP',
|
|
163
|
+
order: 4
|
|
164
|
+
},
|
|
153
165
|
{
|
|
154
166
|
name: 'CONNECT_EXPRESS_VERIFY_PACI_IDENTITY_STEP',
|
|
155
167
|
next: ['CONNECT_EXPRESS_COLLECT_INDIVIDUAL_INFO_STEP', 'CONNECT_EXPRESS_WAITING_FOR_CREATING_ACCOUNT_STEP'],
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { RootState } from '../../../app/store';
|
|
2
|
-
import { MobileFormValues, NIDFormValues, CivilFormValues, OTPFormValues, IndividualFormValues, SharedState, FlowsTypes, ActionState, CountryCode, AuthForType, BusinessDataFormValues, AsyncThunkParams, AuthenticationListFormValues } from '../../../@types';
|
|
2
|
+
import { MobileFormValues, NIDFormValues, CivilFormValues, OTPFormValues, IndividualFormValues, SharedState, FlowsTypes, ActionState, CountryCode, AuthForType, BusinessDataFormValues, AsyncThunkParams, AuthenticationListFormValues, AuthMerchantFormValues } from '../../../@types';
|
|
3
3
|
import { CancelToken } from 'axios';
|
|
4
4
|
export declare const updateBusinessCountryAsync: import("@reduxjs/toolkit").AsyncThunk<any, string, {
|
|
5
5
|
state?: unknown;
|
|
@@ -69,10 +69,11 @@ export declare const retrieveAuthenticationListAsync: import("@reduxjs/toolkit")
|
|
|
69
69
|
fulfilledMeta?: unknown;
|
|
70
70
|
rejectedMeta?: unknown;
|
|
71
71
|
}>;
|
|
72
|
-
export declare const getMerchantListAsync: import("@reduxjs/toolkit").AsyncThunk<
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
export declare const getMerchantListAsync: import("@reduxjs/toolkit").AsyncThunk<{
|
|
73
|
+
list: any;
|
|
74
|
+
brandInfo: import("../../../@types").BrandInfo | undefined;
|
|
75
|
+
entityInfo: import("../../../@types").EntityLicenseAuth | undefined;
|
|
76
|
+
}, AuthenticationListFormValues, {
|
|
76
77
|
state?: unknown;
|
|
77
78
|
dispatch?: import("redux").Dispatch<import("redux").AnyAction> | undefined;
|
|
78
79
|
extra?: unknown;
|
|
@@ -332,7 +333,7 @@ export declare const updateLeadBusinessDataAsync: import("@reduxjs/toolkit").Asy
|
|
|
332
333
|
fulfilledMeta?: unknown;
|
|
333
334
|
rejectedMeta?: unknown;
|
|
334
335
|
}>;
|
|
335
|
-
export declare const
|
|
336
|
+
export declare const confirmInfo: import("@reduxjs/toolkit").AsyncThunk<void, AuthenticationListFormValues, {
|
|
336
337
|
state?: unknown;
|
|
337
338
|
dispatch?: import("redux").Dispatch<import("redux").AnyAction> | undefined;
|
|
338
339
|
extra?: unknown;
|
|
@@ -369,12 +370,11 @@ export interface ConnectExpressData {
|
|
|
369
370
|
individualData: IndividualFormValues;
|
|
370
371
|
businessData: BusinessDataFormValues;
|
|
371
372
|
authenticationData: AuthenticationListFormValues;
|
|
373
|
+
authMerchantData: AuthMerchantFormValues;
|
|
372
374
|
isStartFromBusinessCountry?: boolean;
|
|
373
375
|
}
|
|
374
376
|
export interface ConnectExpressState extends SharedState<ConnectExpressData & ResponseData> {
|
|
375
377
|
customLoading?: boolean;
|
|
376
|
-
merchantLoading?: boolean;
|
|
377
|
-
terminalLoading?: boolean;
|
|
378
378
|
}
|
|
379
379
|
export declare const connectSlice: import("@reduxjs/toolkit").Slice<ConnectExpressState, {
|
|
380
380
|
setLeadId(state: ConnectExpressState, action: ActionState<string>): void;
|
|
@@ -213,25 +213,34 @@ export var retrieveAuthenticationListAsync = createAsyncThunk('connectExpress/re
|
|
|
213
213
|
});
|
|
214
214
|
});
|
|
215
215
|
});
|
|
216
|
-
export var getMerchantListAsync = createAsyncThunk('connectExpress/getMerchantListAsync', function (
|
|
217
|
-
var
|
|
218
|
-
return
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
216
|
+
export var getMerchantListAsync = createAsyncThunk('connectExpress/getMerchantListAsync', function (_a, thunkApi) {
|
|
217
|
+
var brandInfo = _a.brandInfo, entityInfo = _a.entityInfo;
|
|
218
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
219
|
+
var settings, payload, merchants, list;
|
|
220
|
+
return __generator(this, function (_b) {
|
|
221
|
+
switch (_b.label) {
|
|
222
|
+
case 0:
|
|
223
|
+
settings = thunkApi.getState().settings;
|
|
224
|
+
payload = {
|
|
225
|
+
business_entity_id: (entityInfo === null || entityInfo === void 0 ? void 0 : entityInfo.id) || '',
|
|
226
|
+
brand_id: (brandInfo === null || brandInfo === void 0 ? void 0 : brandInfo.id) || '',
|
|
227
|
+
create_if_not_present: true,
|
|
228
|
+
platforms: settings.data.appConfig.platforms
|
|
229
|
+
};
|
|
230
|
+
return [4, API.entityService.getMerchantListUsingEntityId(payload)];
|
|
231
|
+
case 1:
|
|
232
|
+
merchants = (_b.sent()).merchants;
|
|
233
|
+
list = merchants || [];
|
|
234
|
+
if ((list === null || list === void 0 ? void 0 : list.length) > 1) {
|
|
235
|
+
thunkApi.dispatch(handleNextScreenStep('CONNECT_EXPRESS_AUTH_MERCHANT_LIST_STEP'));
|
|
236
|
+
return [2, { list: list, brandInfo: brandInfo, entityInfo: entityInfo }];
|
|
237
|
+
}
|
|
238
|
+
sleep(50).then(function () { return thunkApi.dispatch(handleNextScreenStep('CONNECT_EXPRESS_AUTH_ACCOUNT_CREATED_STEP')); });
|
|
239
|
+
return [2, { list: list, brandInfo: brandInfo, entityInfo: entityInfo }];
|
|
240
|
+
}
|
|
241
|
+
});
|
|
233
242
|
});
|
|
234
|
-
});
|
|
243
|
+
});
|
|
235
244
|
export var createMobileAuthAsync = createAsyncThunk('connectExpress/createMobileAuthAsync', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
236
245
|
var _a, settings, connectExpress, requestBody, data;
|
|
237
246
|
var _b, _c;
|
|
@@ -993,7 +1002,7 @@ export var updateLeadBusinessDataAsync = createAsyncThunk('updateLeadBusinessDat
|
|
|
993
1002
|
});
|
|
994
1003
|
});
|
|
995
1004
|
});
|
|
996
|
-
export var
|
|
1005
|
+
export var confirmInfo = createAsyncThunk('connectExpress/confirmInfo', function (_a, thunkApi) {
|
|
997
1006
|
var brandInfo = _a.brandInfo, entityInfo = _a.entityInfo, merchantInfo = _a.merchantInfo;
|
|
998
1007
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
999
1008
|
var _b, connectExpress, settings, responseData, _c, postURL, redirectUrl, bi, authId, body, data, urlQueryStart;
|
|
@@ -1053,8 +1062,6 @@ var initialState = {
|
|
|
1053
1062
|
error: null,
|
|
1054
1063
|
loading: false,
|
|
1055
1064
|
customLoading: false,
|
|
1056
|
-
merchantLoading: false,
|
|
1057
|
-
terminalLoading: false,
|
|
1058
1065
|
data: {
|
|
1059
1066
|
showBoard: true,
|
|
1060
1067
|
isLeadIdPassed: false,
|
|
@@ -1090,7 +1097,9 @@ var initialState = {
|
|
|
1090
1097
|
},
|
|
1091
1098
|
authenticationData: {
|
|
1092
1099
|
brandInfo: undefined,
|
|
1093
|
-
entityInfo: undefined
|
|
1100
|
+
entityInfo: undefined
|
|
1101
|
+
},
|
|
1102
|
+
authMerchantData: {
|
|
1094
1103
|
merchantInfo: undefined
|
|
1095
1104
|
}
|
|
1096
1105
|
}
|
|
@@ -1519,33 +1528,35 @@ export var connectSlice = createSlice({
|
|
|
1519
1528
|
state.error = action.error.message;
|
|
1520
1529
|
})
|
|
1521
1530
|
.addCase(getMerchantListAsync.pending, function (state) {
|
|
1522
|
-
state.
|
|
1531
|
+
state.loading = true;
|
|
1523
1532
|
state.error = null;
|
|
1524
1533
|
})
|
|
1525
1534
|
.addCase(getMerchantListAsync.fulfilled, function (state, action) {
|
|
1526
|
-
state.
|
|
1535
|
+
state.loading = false;
|
|
1527
1536
|
state.error = null;
|
|
1528
1537
|
var data = state.data.responseData;
|
|
1529
|
-
var
|
|
1530
|
-
|
|
1531
|
-
|
|
1538
|
+
var _a = action.payload, list = _a.list, brandInfo = _a.brandInfo, entityInfo = _a.entityInfo;
|
|
1539
|
+
state.data.authenticationData.brandInfo = brandInfo;
|
|
1540
|
+
state.data.authenticationData.entityInfo = entityInfo;
|
|
1541
|
+
if (list === null || list === void 0 ? void 0 : list.length) {
|
|
1542
|
+
state.data.authMerchantData.merchantInfo = list[0];
|
|
1532
1543
|
}
|
|
1533
|
-
state.data.responseData = __assign(__assign({}, data), {
|
|
1544
|
+
state.data.responseData = __assign(__assign({}, data), { authMerchantData: __assign(__assign({}, data === null || data === void 0 ? void 0 : data.authMerchantData), { merchantList: list }) });
|
|
1534
1545
|
})
|
|
1535
1546
|
.addCase(getMerchantListAsync.rejected, function (state, action) {
|
|
1536
|
-
state.
|
|
1547
|
+
state.loading = false;
|
|
1537
1548
|
state.error = action.error.message;
|
|
1538
1549
|
})
|
|
1539
|
-
.addCase(
|
|
1550
|
+
.addCase(confirmInfo.pending, function (state) {
|
|
1540
1551
|
state.loading = true;
|
|
1541
1552
|
state.error = null;
|
|
1542
1553
|
})
|
|
1543
|
-
.addCase(
|
|
1554
|
+
.addCase(confirmInfo.fulfilled, function (state) {
|
|
1544
1555
|
state.loading = false;
|
|
1545
1556
|
state.error = null;
|
|
1546
1557
|
state.data.responseData = __assign({}, state.data.responseData);
|
|
1547
1558
|
})
|
|
1548
|
-
.addCase(
|
|
1559
|
+
.addCase(confirmInfo.rejected, function (state, action) {
|
|
1549
1560
|
state.loading = false;
|
|
1550
1561
|
state.error = action.error.message;
|
|
1551
1562
|
})
|
|
@@ -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 } from "react/jsx-runtime";
|
|
13
|
+
import * as React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
|
+
import { isNetworkError } from '../../../../utils';
|
|
16
|
+
import { useAppDispatch, useAppSelector, useLanguage } from '../../../../hooks';
|
|
17
|
+
import { confirmInfo, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
|
|
18
|
+
import Button from '../../../shared/Button';
|
|
19
|
+
import DataLoading from '../../../shared/DataLoading';
|
|
20
|
+
var AccountCreatedLoader = function (_a) {
|
|
21
|
+
var dispatch = useAppDispatch();
|
|
22
|
+
var isAr = useLanguage().isAr;
|
|
23
|
+
var t = useTranslation().t;
|
|
24
|
+
var _b = useAppSelector(connectExpressSelector), error = _b.error, loading = _b.loading, data = _b.data;
|
|
25
|
+
var _c = data.authenticationData, brandInfo = _c.brandInfo, entityInfo = _c.entityInfo;
|
|
26
|
+
var merchantInfo = data.authMerchantData.merchantInfo;
|
|
27
|
+
React.useEffect(function () {
|
|
28
|
+
dispatch(confirmInfo({ entityInfo: entityInfo, brandInfo: brandInfo, merchantInfo: merchantInfo }));
|
|
29
|
+
}, []);
|
|
30
|
+
var onReTry = function () {
|
|
31
|
+
dispatch(confirmInfo({ entityInfo: entityInfo, brandInfo: brandInfo, merchantInfo: merchantInfo }));
|
|
32
|
+
};
|
|
33
|
+
var isNE = React.useMemo(function () { return isNetworkError(error); }, [error]);
|
|
34
|
+
return (_jsx(DataLoading, __assign({ error: error, title: 'account_already_created', hideSubtitle: true }, { children: isNE && (_jsx(Button, __assign({ onClick: onReTry, disableBack: true, isAr: isAr, loading: loading }, { children: t('try_again') }))) })));
|
|
35
|
+
};
|
|
36
|
+
export default React.memo(AccountCreatedLoader);
|
|
@@ -0,0 +1,74 @@
|
|
|
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 { useForm, FormProvider } from 'react-hook-form';
|
|
15
|
+
import { useTranslation } from 'react-i18next';
|
|
16
|
+
import Collapse from '@mui/material/Collapse';
|
|
17
|
+
import { yupResolver } from '@hookform/resolvers/yup';
|
|
18
|
+
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
19
|
+
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
20
|
+
import { deepCopy, sendCustomEventToGTM } from '../../../../utils';
|
|
21
|
+
import Form from '../../../../components/Form';
|
|
22
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
23
|
+
import Button from '../../../shared/Button';
|
|
24
|
+
import { clearError, connectExpressSelector, confirmInfo } from '../../../app/connectExpress/connectExpressStore';
|
|
25
|
+
import { useLanguage } from '../../../../hooks';
|
|
26
|
+
import { AuthMerchantValidationSchema } from './validation';
|
|
27
|
+
import MerchantList from './MerchantList';
|
|
28
|
+
var AuthMerchant = function (_a) {
|
|
29
|
+
var _b;
|
|
30
|
+
var _c = useAppSelector(connectExpressSelector), data = _c.data, loading = _c.loading, error = _c.error;
|
|
31
|
+
var _d = data.authenticationData, brandInfo = _d.brandInfo, entityInfo = _d.entityInfo;
|
|
32
|
+
var merchantInfo = data.authMerchantData.merchantInfo;
|
|
33
|
+
var _e = React.useState(false), listActive = _e[0], setListActive = _e[1];
|
|
34
|
+
var merchantList = (((_b = data.responseData) === null || _b === void 0 ? void 0 : _b.authMerchantData) || {}).merchantList;
|
|
35
|
+
React.useEffect(function () {
|
|
36
|
+
sendCustomEventToGTM({
|
|
37
|
+
event: 'Send Event',
|
|
38
|
+
event_category: 'User Authentication Flow',
|
|
39
|
+
event_action: 'Authentication Merchant List Step'
|
|
40
|
+
});
|
|
41
|
+
}, []);
|
|
42
|
+
var methods = useForm({
|
|
43
|
+
resolver: yupResolver(AuthMerchantValidationSchema),
|
|
44
|
+
defaultValues: {
|
|
45
|
+
merchantInfo: merchantInfo
|
|
46
|
+
},
|
|
47
|
+
mode: 'onChange'
|
|
48
|
+
});
|
|
49
|
+
var t = useTranslation().t;
|
|
50
|
+
var isAr = useLanguage().isAr;
|
|
51
|
+
var dispatch = useAppDispatch();
|
|
52
|
+
var onSubmit = function (formData) {
|
|
53
|
+
dispatch(confirmInfo(__assign({ brandInfo: brandInfo, entityInfo: entityInfo }, deepCopy(formData))));
|
|
54
|
+
};
|
|
55
|
+
var onBack = function () {
|
|
56
|
+
dispatch(handlePrevScreenStep());
|
|
57
|
+
};
|
|
58
|
+
React.useEffect(function () {
|
|
59
|
+
if (merchantInfo && !methods.getValues('merchantInfo'))
|
|
60
|
+
methods.setValue('merchantInfo', merchantInfo, { shouldValidate: true });
|
|
61
|
+
}, [merchantInfo]);
|
|
62
|
+
React.useEffect(function () {
|
|
63
|
+
if (error)
|
|
64
|
+
dispatch(clearError());
|
|
65
|
+
}, [methods.formState.isValid]);
|
|
66
|
+
var disabled = !methods.formState.isValid;
|
|
67
|
+
var handleMenuClick = function (flag) {
|
|
68
|
+
if (error)
|
|
69
|
+
dispatch(clearError());
|
|
70
|
+
setListActive(flag);
|
|
71
|
+
};
|
|
72
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(MerchantList, { list: merchantList || [], onListOpen: function () { return handleMenuClick(true); }, onListClose: function () { return handleMenuClick(false); } }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('confirm') })) }))] })) })) }));
|
|
73
|
+
};
|
|
74
|
+
export default React.memo(AuthMerchant);
|
|
@@ -0,0 +1,64 @@
|
|
|
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 * as React from 'react';
|
|
14
|
+
import Box from '@mui/material/Box';
|
|
15
|
+
import { useTranslation } from 'react-i18next';
|
|
16
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
17
|
+
import { styled } from '@mui/material/styles';
|
|
18
|
+
import Collapse from '../../../../components/Collapse';
|
|
19
|
+
import Text from '../../../../components/Text';
|
|
20
|
+
import SimpleList from '../../../../components/SimpleList';
|
|
21
|
+
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
22
|
+
import InputSelect from '../../../shared/InputSelect';
|
|
23
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
24
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
25
|
+
var MerchantContainer = styled(Box)(function () { return ({
|
|
26
|
+
display: 'flex'
|
|
27
|
+
}); });
|
|
28
|
+
var MerchantNameText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
29
|
+
var theme = _a.theme, isSelected = _a.isSelected;
|
|
30
|
+
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
|
|
31
|
+
});
|
|
32
|
+
var MerchantList = React.forwardRef(function (_a, ref) {
|
|
33
|
+
var _b;
|
|
34
|
+
var list = _a.list, onListOpen = _a.onListOpen, onListClose = _a.onListClose, readOnly = _a.readOnly, isVerified = _a.isVerified;
|
|
35
|
+
var _c = React.useState(null), anchorEl = _c[0], setAnchorEl = _c[1];
|
|
36
|
+
var t = useTranslation().t;
|
|
37
|
+
var _d = useFormContext(), control = _d.control, getValues = _d.getValues;
|
|
38
|
+
var merchantInfoControl = useController({ control: control, name: 'merchantInfo' });
|
|
39
|
+
var merchantValue = merchantInfoControl.field.value;
|
|
40
|
+
var error = (_b = merchantInfoControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message;
|
|
41
|
+
var onOpenMerchantSelect = function (event) {
|
|
42
|
+
if (readOnly)
|
|
43
|
+
return;
|
|
44
|
+
setAnchorEl(event.currentTarget);
|
|
45
|
+
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
46
|
+
};
|
|
47
|
+
var onCloseMerchantSelect = function () {
|
|
48
|
+
setAnchorEl(null);
|
|
49
|
+
onListClose === null || onListClose === void 0 ? void 0 : onListClose();
|
|
50
|
+
};
|
|
51
|
+
var onSelectItem = function (merchant) {
|
|
52
|
+
onCloseMerchantSelect();
|
|
53
|
+
merchantInfoControl.field.onChange(merchant);
|
|
54
|
+
};
|
|
55
|
+
var getName = function (merchant) {
|
|
56
|
+
if (!merchant)
|
|
57
|
+
return '';
|
|
58
|
+
return merchant.display_name;
|
|
59
|
+
};
|
|
60
|
+
return (_jsxs(ScreenContainer, __assign({ ref: ref, sx: { mt: 2.5, mb: 2.5 } }, { children: [_jsx(InputSelect, { label: t('select_merchant_label'), readOnly: readOnly, placeholder: t('select_merchant_placeholder'), value: getName(getValues('merchantInfo')) || '', warningMessage: error && t(error), onClick: !!anchorEl ? function () { return onCloseMerchantSelect(); } : onOpenMerchantSelect, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl, isVerified: isVerified }) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { list: list || [], onSelectItem: onSelectItem, renderItem: function (item) {
|
|
61
|
+
return (_jsxs(_Fragment, { children: [_jsx(MerchantContainer, { children: _jsx(MerchantNameText, __assign({ isSelected: item.id === (merchantValue === null || merchantValue === void 0 ? void 0 : merchantValue.id) }, { children: getName(item) })) }), item.id === (merchantValue === null || merchantValue === void 0 ? void 0 : merchantValue.id) && _jsx(CheckIcon, { isVerified: isVerified })] }));
|
|
62
|
+
} }) }))] })));
|
|
63
|
+
});
|
|
64
|
+
export default React.memo(MerchantList);
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as yup from 'yup';
|
|
2
|
+
export declare const AuthMerchantValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
|
+
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
4
|
+
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
5
|
+
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
6
|
+
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
7
|
+
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
8
|
+
}>>>;
|
|
@@ -22,28 +22,26 @@ import { AuthForType } from '../../../../@types';
|
|
|
22
22
|
import Form from '../../../../components/Form';
|
|
23
23
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
24
24
|
import Button from '../../../shared/Button';
|
|
25
|
-
import { clearError, connectExpressSelector, createEntity, resetAuthenticationScreen,
|
|
25
|
+
import { clearError, connectExpressSelector, createEntity, resetAuthenticationScreen, getMerchantListAsync } from '../../../app/connectExpress/connectExpressStore';
|
|
26
26
|
import { useLanguage } from '../../../../hooks';
|
|
27
|
-
import {
|
|
27
|
+
import { AuthenticationListValidationSchema } from './validation';
|
|
28
28
|
import BrandList from './BrandList';
|
|
29
29
|
import EntityList from './EntityList';
|
|
30
|
-
import MerchantList from './MerchantList';
|
|
31
30
|
import LicenseNumber from './LicenseNumber';
|
|
32
31
|
import EntityLegalName from './EntityLegalName';
|
|
33
32
|
var ListType;
|
|
34
33
|
(function (ListType) {
|
|
35
34
|
ListType["BrandList"] = "BrandList";
|
|
36
35
|
ListType["EntityList"] = "EntityList";
|
|
37
|
-
ListType["MerchantList"] = "MerchantList";
|
|
38
36
|
})(ListType || (ListType = {}));
|
|
39
37
|
var AuthenticationList = function (_a) {
|
|
40
38
|
var _b;
|
|
41
39
|
var settingsData = useAppSelector(settingsSelector).data;
|
|
42
|
-
var _c = useAppSelector(connectExpressSelector), data = _c.data, loading = _c.loading, error = _c.error
|
|
43
|
-
var _d = data.authenticationData, brandInfo = _d.brandInfo, entityInfo = _d.entityInfo
|
|
40
|
+
var _c = useAppSelector(connectExpressSelector), data = _c.data, loading = _c.loading, error = _c.error;
|
|
41
|
+
var _d = data.authenticationData, brandInfo = _d.brandInfo, entityInfo = _d.entityInfo;
|
|
44
42
|
var _e = React.useState(), listActive = _e[0], setListActive = _e[1];
|
|
45
|
-
var
|
|
46
|
-
var
|
|
43
|
+
var brandList = (((_b = data.responseData) === null || _b === void 0 ? void 0 : _b.authenticationData) || {}).brandList;
|
|
44
|
+
var _f = React.useState(false), isAddEntity = _f[0], setIsAddEntity = _f[1];
|
|
47
45
|
var otpData = data.otpData;
|
|
48
46
|
var startWithNID = otpData.authFor === AuthForType.NATIONAL_ID;
|
|
49
47
|
React.useEffect(function () {
|
|
@@ -54,11 +52,10 @@ var AuthenticationList = function (_a) {
|
|
|
54
52
|
});
|
|
55
53
|
}, []);
|
|
56
54
|
var methods = useForm({
|
|
57
|
-
resolver: yupResolver(
|
|
55
|
+
resolver: yupResolver(AuthenticationListValidationSchema),
|
|
58
56
|
defaultValues: {
|
|
59
57
|
brandInfo: brandInfo,
|
|
60
|
-
entityInfo: entityInfo
|
|
61
|
-
merchantInfo: merchantInfo
|
|
58
|
+
entityInfo: entityInfo
|
|
62
59
|
},
|
|
63
60
|
mode: 'onChange'
|
|
64
61
|
});
|
|
@@ -71,7 +68,7 @@ var AuthenticationList = function (_a) {
|
|
|
71
68
|
dispatch(createEntity(deepCopy(data_1)));
|
|
72
69
|
return;
|
|
73
70
|
}
|
|
74
|
-
dispatch(
|
|
71
|
+
dispatch(getMerchantListAsync(deepCopy(formData)));
|
|
75
72
|
};
|
|
76
73
|
var onBack = function () {
|
|
77
74
|
var _a;
|
|
@@ -87,15 +84,11 @@ var AuthenticationList = function (_a) {
|
|
|
87
84
|
dispatch(resetAuthenticationScreen());
|
|
88
85
|
dispatch(handlePrevScreenStep(screen));
|
|
89
86
|
};
|
|
90
|
-
React.useEffect(function () {
|
|
91
|
-
if (merchantInfo && !methods.getValues('merchantInfo'))
|
|
92
|
-
methods.setValue('merchantInfo', merchantInfo, { shouldValidate: true });
|
|
93
|
-
}, [merchantInfo]);
|
|
94
87
|
React.useEffect(function () {
|
|
95
88
|
if (error)
|
|
96
89
|
dispatch(clearError());
|
|
97
90
|
}, [methods.formState.isValid]);
|
|
98
|
-
var disabled = !methods.formState.isValid
|
|
91
|
+
var disabled = !methods.formState.isValid;
|
|
99
92
|
var handleMenuClick = function (flag) {
|
|
100
93
|
if (error)
|
|
101
94
|
dispatch(clearError());
|
|
@@ -103,8 +96,6 @@ var AuthenticationList = function (_a) {
|
|
|
103
96
|
};
|
|
104
97
|
var isBrandList = listActive === ListType.BrandList;
|
|
105
98
|
var isEntityList = listActive === ListType.EntityList;
|
|
106
|
-
|
|
107
|
-
var showLoader = !(merchantList === null || merchantList === void 0 ? void 0 : merchantList.length) ? merchantLoading : merchantList.length === 1 && merchantLoading;
|
|
108
|
-
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandList, { list: brandList || [], show: !isAddEntity && !isEntityList && !isMerchantList, onListOpen: function () { return handleMenuClick(ListType.BrandList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EntityList, { countryList: settingsData.countries || [], show: !isBrandList && !isMerchantList, handleAddEntity: function (flag) { return setIsAddEntity(flag); }, onListOpen: function () { return handleMenuClick(ListType.EntityList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: isAddEntity && !isBrandList && !isEntityList }, { children: [_jsx(EntityLegalName, {}), _jsx(LicenseNumber, {})] })), _jsx(Collapse, __assign({ in: !isAddEntity }, { children: _jsx(MerchantList, { show: !isBrandList && !isEntityList, onListOpen: function () { return handleMenuClick(ListType.MerchantList); }, onListClose: function () { return handleMenuClick(); } }) })), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading || showLoader }, { children: isAddEntity ? t('create_new_entity') : t('next') })) }))] })) })) }));
|
|
99
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandList, { list: brandList || [], show: !isAddEntity && !isEntityList, onListOpen: function () { return handleMenuClick(ListType.BrandList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EntityList, { countryList: settingsData.countries || [], show: !isBrandList, handleAddEntity: function (flag) { return setIsAddEntity(flag); }, onListOpen: function () { return handleMenuClick(ListType.EntityList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: isAddEntity && !isBrandList && !isEntityList }, { children: [_jsx(EntityLegalName, {}), _jsx(LicenseNumber, {})] })), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: isAddEntity ? t('create_new_entity') : t('next') })) }))] })) })) }));
|
|
109
100
|
};
|
|
110
101
|
export default React.memo(AuthenticationList);
|
|
@@ -119,10 +119,8 @@ var EntityList = function (_a) {
|
|
|
119
119
|
};
|
|
120
120
|
var onSelectItem = function (entity) {
|
|
121
121
|
selectedEntityControl.field.onChange(entity);
|
|
122
|
-
if (entity.id === ADD_ENTITY)
|
|
123
|
-
setValue('merchantInfo', undefined);
|
|
122
|
+
if (entity.id === ADD_ENTITY)
|
|
124
123
|
handleAddEntity === null || handleAddEntity === void 0 ? void 0 : handleAddEntity(true);
|
|
125
|
-
}
|
|
126
124
|
else
|
|
127
125
|
handleAddEntity === null || handleAddEntity === void 0 ? void 0 : handleAddEntity(false);
|
|
128
126
|
onCloseEntityList();
|
|
@@ -1,27 +1,17 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
2
|
export declare const AuthenticationListValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
3
|
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
4
|
-
entityInfo:
|
|
5
|
-
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
6
|
-
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
7
|
-
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
8
|
-
entityInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
9
|
-
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
10
|
-
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
11
|
-
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
12
|
-
entityInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
13
|
-
merchantInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
14
|
-
}>>>;
|
|
15
|
-
export declare const AddEntityValidationSchema: yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
16
|
-
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
4
|
+
entityInfo: any;
|
|
17
5
|
licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
18
6
|
legalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
19
7
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
20
8
|
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
9
|
+
entityInfo: any;
|
|
21
10
|
licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
22
11
|
legalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
23
12
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
24
13
|
brandInfo: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
14
|
+
entityInfo: any;
|
|
25
15
|
licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
26
16
|
legalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
27
17
|
}>>>;
|
|
@@ -1,33 +1,58 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
|
-
import { LICENSE_NUMBER_MIN_LENGTH, REGEX_LEGAL_NAME } from '../../../../constants';
|
|
2
|
+
import { ADD_ENTITY, LICENSE_NUMBER_MIN_LENGTH, REGEX_LEGAL_NAME } from '../../../../constants';
|
|
3
|
+
var objectElements = {
|
|
4
|
+
id: yup.string().required(),
|
|
5
|
+
business_id: yup.string(),
|
|
6
|
+
legal_name: yup.object().shape({
|
|
7
|
+
ar: yup.string(),
|
|
8
|
+
en: yup.string()
|
|
9
|
+
}),
|
|
10
|
+
license: yup.object().shape({
|
|
11
|
+
number: yup.string()
|
|
12
|
+
})
|
|
13
|
+
};
|
|
3
14
|
export var AuthenticationListValidationSchema = yup.object().shape({
|
|
4
15
|
brandInfo: yup.object().required('auth_brand_required'),
|
|
5
|
-
entityInfo: yup.object().required('auth_entity_required'),
|
|
6
|
-
merchantInfo: yup.object().required('auth_merchant_required')
|
|
7
|
-
});
|
|
8
|
-
export var AddEntityValidationSchema = yup.object().shape({
|
|
9
|
-
brandInfo: yup.object().required('auth_brand_required'),
|
|
16
|
+
entityInfo: yup.object().shape(objectElements).required('auth_entity_required'),
|
|
10
17
|
licenseNumber: yup
|
|
11
18
|
.string()
|
|
12
|
-
.
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
return true;
|
|
17
|
-
return length >= LICENSE_NUMBER_MIN_LENGTH ? true : this.createError({ message: 'enter_license_number' });
|
|
19
|
+
.when('entityInfo', function (entityInfo) {
|
|
20
|
+
var isAddEntity = (entityInfo === null || entityInfo === void 0 ? void 0 : entityInfo.id) === ADD_ENTITY;
|
|
21
|
+
if (!isAddEntity) {
|
|
22
|
+
return yup.string().optional();
|
|
18
23
|
}
|
|
24
|
+
return yup
|
|
25
|
+
.string()
|
|
26
|
+
.test({
|
|
27
|
+
test: function (value) {
|
|
28
|
+
var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
|
|
29
|
+
if (length === 0)
|
|
30
|
+
return true;
|
|
31
|
+
return length >= LICENSE_NUMBER_MIN_LENGTH ? true : this.createError({ message: 'enter_license_number' });
|
|
32
|
+
}
|
|
33
|
+
})
|
|
34
|
+
.required('');
|
|
19
35
|
})
|
|
20
36
|
.required(''),
|
|
21
37
|
legalName: yup
|
|
22
38
|
.string()
|
|
23
|
-
.
|
|
24
|
-
.
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
if (length === 0)
|
|
28
|
-
return true;
|
|
29
|
-
return (value === null || value === void 0 ? void 0 : value.match(REGEX_LEGAL_NAME)) && length >= 3 ? true : this.createError({ message: 'enter_valid_legal_name' });
|
|
39
|
+
.when('entityInfo', function (entityInfo) {
|
|
40
|
+
var isAddEntity = (entityInfo === null || entityInfo === void 0 ? void 0 : entityInfo.id) === ADD_ENTITY;
|
|
41
|
+
if (!isAddEntity) {
|
|
42
|
+
return yup.string().optional();
|
|
30
43
|
}
|
|
44
|
+
return yup
|
|
45
|
+
.string()
|
|
46
|
+
.required('')
|
|
47
|
+
.test({
|
|
48
|
+
test: function (value) {
|
|
49
|
+
var length = (value === null || value === void 0 ? void 0 : value.length) || 0;
|
|
50
|
+
if (length === 0)
|
|
51
|
+
return true;
|
|
52
|
+
return (value === null || value === void 0 ? void 0 : value.match(REGEX_LEGAL_NAME)) && length >= 3 ? true : this.createError({ message: 'enter_valid_legal_name' });
|
|
53
|
+
}
|
|
54
|
+
})
|
|
55
|
+
.required('');
|
|
31
56
|
})
|
|
32
57
|
.required('')
|
|
33
58
|
});
|
|
@@ -22,9 +22,11 @@ import ConnectExpressIdentityVerifyOTPScreen from './connectExpress/screens/Iden
|
|
|
22
22
|
import ConnectExpressCollectIndividualScreen from './connectExpress/screens/CollectIndividualInfo';
|
|
23
23
|
import ConnectExpressCollectBusinessScreen from './connectExpress/screens/CollectBusinessInfo';
|
|
24
24
|
import ConnectExpressCreateAccountLoaderScreen from './connectExpress/screens/CreateAccountLoader';
|
|
25
|
-
import ConnectExpressSuccessFlowButtonsScreen from '
|
|
26
|
-
import ConnectExpressAccountAlreadyCreatedScreen from '
|
|
27
|
-
import ConnectExpressAuthenticationListScreen from '
|
|
25
|
+
import ConnectExpressSuccessFlowButtonsScreen from './connectExpress/screens/SuccessWithFlowButtons';
|
|
26
|
+
import ConnectExpressAccountAlreadyCreatedScreen from './connectExpress/screens/AccountAlreadyCreated';
|
|
27
|
+
import ConnectExpressAuthenticationListScreen from './connectExpress/screens/AuthenticationList';
|
|
28
|
+
import ConnectExpressAuthMerchantScreen from './connectExpress/screens/AuthMerchant';
|
|
29
|
+
import ConnectExpressAuthAccountCreatedLoaderScreen from './connectExpress/screens/AccountCreatedLoader';
|
|
28
30
|
import CustomersPage from './business/screens/Customers';
|
|
29
31
|
import IDBODPage from './business/screens/IDBOD';
|
|
30
32
|
import BusinessVerifyPage from './business/screens/Verify';
|
|
@@ -196,6 +198,14 @@ export var connectExpressFeatureScreens = [
|
|
|
196
198
|
{
|
|
197
199
|
name: 'CONNECT_EXPRESS_AUTHENTICATION_LIST_STEP',
|
|
198
200
|
element: ConnectExpressAuthenticationListScreen
|
|
201
|
+
},
|
|
202
|
+
{
|
|
203
|
+
name: 'CONNECT_EXPRESS_AUTH_MERCHANT_LIST_STEP',
|
|
204
|
+
element: ConnectExpressAuthMerchantScreen
|
|
205
|
+
},
|
|
206
|
+
{
|
|
207
|
+
name: 'CONNECT_EXPRESS_AUTH_ACCOUNT_CREATED_STEP',
|
|
208
|
+
element: ConnectExpressAuthAccountCreatedLoaderScreen
|
|
199
209
|
}
|
|
200
210
|
];
|
|
201
211
|
export var businessFeatureScreens = [
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
export interface DataLoadingProps {
|
|
3
3
|
error?: string | null;
|
|
4
|
+
children?: React.ReactNode;
|
|
5
|
+
title?: string;
|
|
6
|
+
hideSubtitle?: boolean;
|
|
4
7
|
}
|
|
5
|
-
declare const _default: React.MemoExoticComponent<({ error }: DataLoadingProps) => import("react/jsx-runtime").JSX.Element>;
|
|
8
|
+
declare const _default: React.MemoExoticComponent<({ error, children, title, hideSubtitle }: DataLoadingProps) => import("react/jsx-runtime").JSX.Element>;
|
|
6
9
|
export default _default;
|
|
@@ -51,8 +51,8 @@ var SubTitleStyled = styled(Text)(function (_a) {
|
|
|
51
51
|
return (__assign(__assign({}, theme.typography.body2), { color: theme.palette.text.primary, fontWeight: theme.typography.fontWeightMedium, lineHeight: '16.8px', textAlign: 'center' }));
|
|
52
52
|
});
|
|
53
53
|
var DataLoading = function (_a) {
|
|
54
|
-
var error = _a.error;
|
|
54
|
+
var error = _a.error, children = _a.children, title = _a.title, hideSubtitle = _a.hideSubtitle;
|
|
55
55
|
var t = useTranslation().t;
|
|
56
|
-
return (
|
|
56
|
+
return (_jsxs(ScreenContainer, __assign({ sx: { mb: 2.5 } }, { children: [_jsxs(TitleContainerStyled, { children: [_jsx(Collapse, __assign({ in: !!error }, { children: _jsx(GenericError, { error: error || '', errorTitle: 'oops' }) })), _jsxs(Collapse, __assign({ in: !error }, { children: [_jsx(Container, { children: _jsx(LottieFile, { file: LottieAnimationFiles.account_creation, loop: true, height: '375px' }) }), _jsxs(_Fragment, { children: [_jsx(TitleStyled, { children: t(title || 'prepare_data_title') }), !hideSubtitle && _jsx(SubTitleStyled, { children: t('prepare_data_description') })] })] }))] }), children] })));
|
|
57
57
|
};
|
|
58
58
|
export default React.memo(DataLoading);
|
package/package.json
CHANGED
|
@@ -1,126 +0,0 @@
|
|
|
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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
13
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
14
|
-
if (ar || !(i in from)) {
|
|
15
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
16
|
-
ar[i] = from[i];
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
20
|
-
};
|
|
21
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
|
-
import * as React from 'react';
|
|
23
|
-
import Box from '@mui/material/Box';
|
|
24
|
-
import { useTranslation } from 'react-i18next';
|
|
25
|
-
import { useController, useFormContext } from 'react-hook-form';
|
|
26
|
-
import { styled } from '@mui/material/styles';
|
|
27
|
-
import CircularProgress from '@mui/material/CircularProgress';
|
|
28
|
-
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
29
|
-
import Collapse from '../../../../components/Collapse';
|
|
30
|
-
import Text from '../../../../components/Text';
|
|
31
|
-
import SimpleList from '../../../../components/SimpleList';
|
|
32
|
-
import ScreenContainer from '../../../shared/Containers/ScreenContainer';
|
|
33
|
-
import InputSelect from '../../../shared/InputSelect';
|
|
34
|
-
import { getMerchantListAsync, connectExpressSelector } from '../../../app/connectExpress/connectExpressStore';
|
|
35
|
-
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
36
|
-
import CheckIcon from '../../../shared/CheckIcon';
|
|
37
|
-
import { ADD_ENTITY } from '../../../../constants';
|
|
38
|
-
import { isNetworkError } from '../../../../utils';
|
|
39
|
-
var MerchantContainer = styled(Box)(function () { return ({
|
|
40
|
-
display: 'flex'
|
|
41
|
-
}); });
|
|
42
|
-
var MerchantNameText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
43
|
-
var theme = _a.theme, isSelected = _a.isSelected;
|
|
44
|
-
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25) }));
|
|
45
|
-
});
|
|
46
|
-
var MerchantList = React.forwardRef(function (_a, ref) {
|
|
47
|
-
var _b, _c;
|
|
48
|
-
var show = _a.show, onListOpen = _a.onListOpen, onListClose = _a.onListClose, readOnly = _a.readOnly, isVerified = _a.isVerified;
|
|
49
|
-
var _d = React.useState([]), list = _d[0], setList = _d[1];
|
|
50
|
-
var _e = React.useState(0), count = _e[0], setCount = _e[1];
|
|
51
|
-
var _f = React.useState(null), anchorEl = _f[0], setAnchorEl = _f[1];
|
|
52
|
-
var t = useTranslation().t;
|
|
53
|
-
var dispatch = useAppDispatch();
|
|
54
|
-
var _g = useFormContext(), control = _g.control, watch = _g.watch, setValue = _g.setValue, getValues = _g.getValues;
|
|
55
|
-
var _h = useAppSelector(connectExpressSelector), data = _h.data, merchantLoading = _h.merchantLoading, bckError = _h.error;
|
|
56
|
-
var merchantList = (((_b = data.responseData) === null || _b === void 0 ? void 0 : _b.authenticationData) || {}).merchantList;
|
|
57
|
-
var merchantInfoControl = useController({ control: control, name: 'merchantInfo' });
|
|
58
|
-
var entityInfo = watch('entityInfo');
|
|
59
|
-
var brandInfo = getValues('brandInfo');
|
|
60
|
-
var merchantValue = merchantInfoControl.field.value;
|
|
61
|
-
var error = (_c = merchantInfoControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message;
|
|
62
|
-
React.useEffect(function () {
|
|
63
|
-
if ((merchantList === null || merchantList === void 0 ? void 0 : merchantList.length) > 0) {
|
|
64
|
-
var list_1 = __spreadArray([], merchantList, true);
|
|
65
|
-
setList(list_1);
|
|
66
|
-
}
|
|
67
|
-
}, [merchantList]);
|
|
68
|
-
React.useEffect(function () {
|
|
69
|
-
if (!bckError)
|
|
70
|
-
return;
|
|
71
|
-
if (!isNetworkError(bckError) || count > 2)
|
|
72
|
-
return;
|
|
73
|
-
if ((brandInfo === null || brandInfo === void 0 ? void 0 : brandInfo.id) && (entityInfo === null || entityInfo === void 0 ? void 0 : entityInfo.id)) {
|
|
74
|
-
setCount(count + 1);
|
|
75
|
-
dispatch(getMerchantListAsync({ entityId: entityInfo.id, brandId: brandInfo.id }));
|
|
76
|
-
}
|
|
77
|
-
}, [bckError]);
|
|
78
|
-
React.useEffect(function () {
|
|
79
|
-
var _a;
|
|
80
|
-
if (!entityInfo)
|
|
81
|
-
return;
|
|
82
|
-
if (merchantLoading)
|
|
83
|
-
return;
|
|
84
|
-
var brandInfoId = brandInfo === null || brandInfo === void 0 ? void 0 : brandInfo.id;
|
|
85
|
-
var entityId = (merchantList === null || merchantList === void 0 ? void 0 : merchantList.length) > 0 ? (_a = merchantList[0]) === null || _a === void 0 ? void 0 : _a.business_entity_id : '';
|
|
86
|
-
var id = (entityInfo || {}).id;
|
|
87
|
-
if (!id || id === ADD_ENTITY)
|
|
88
|
-
return;
|
|
89
|
-
if (entityId && id && entityId !== id) {
|
|
90
|
-
setValue('merchantInfo', undefined);
|
|
91
|
-
dispatch(getMerchantListAsync({ entityId: id, brandId: brandInfoId }));
|
|
92
|
-
return;
|
|
93
|
-
}
|
|
94
|
-
if (entityId && id && entityId === id && (merchantList === null || merchantList === void 0 ? void 0 : merchantList.length)) {
|
|
95
|
-
setValue('merchantInfo', merchantList[0], { shouldValidate: true });
|
|
96
|
-
return;
|
|
97
|
-
}
|
|
98
|
-
if (!(merchantList === null || merchantList === void 0 ? void 0 : merchantList.length)) {
|
|
99
|
-
dispatch(getMerchantListAsync({ entityId: id, brandId: brandInfoId }));
|
|
100
|
-
}
|
|
101
|
-
}, [entityInfo, merchantList]);
|
|
102
|
-
var onOpenMerchantSelect = function (event) {
|
|
103
|
-
if (readOnly)
|
|
104
|
-
return;
|
|
105
|
-
setAnchorEl(event.currentTarget);
|
|
106
|
-
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
107
|
-
};
|
|
108
|
-
var onCloseMerchantSelect = function () {
|
|
109
|
-
setAnchorEl(null);
|
|
110
|
-
onListClose === null || onListClose === void 0 ? void 0 : onListClose();
|
|
111
|
-
setList(merchantList);
|
|
112
|
-
};
|
|
113
|
-
var onSelectItem = function (merchant) {
|
|
114
|
-
onCloseMerchantSelect();
|
|
115
|
-
merchantInfoControl.field.onChange(merchant);
|
|
116
|
-
};
|
|
117
|
-
var getName = function (merchant) {
|
|
118
|
-
if (!merchant)
|
|
119
|
-
return '';
|
|
120
|
-
return merchant.display_name;
|
|
121
|
-
};
|
|
122
|
-
return (_jsx(Collapse, __assign({ in: show && (merchantList === null || merchantList === void 0 ? void 0 : merchantList.length) > 1 }, { children: _jsxs(ScreenContainer, __assign({ ref: ref, sx: { mt: 2.5 } }, { children: [_jsx(InputSelect, { label: t('select_merchant_label'), readOnly: readOnly, placeholder: t('select_merchant_placeholder'), value: getName(getValues('merchantInfo')) || '', warningMessage: error && t(error), onClick: merchantLoading ? undefined : !!anchorEl ? function () { return onCloseMerchantSelect(); } : onOpenMerchantSelect, endAdornment: merchantLoading ? (_jsx(CircularProgress, { size: 25, thickness: 5, sx: { height: 'auto !important' } })) : (_jsx(EndAdornmentExpanded, { anchorEl: anchorEl, isVerified: isVerified })) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { list: list || [], onSelectItem: onSelectItem, renderItem: function (item) {
|
|
123
|
-
return (_jsxs(_Fragment, { children: [_jsx(MerchantContainer, { children: _jsx(MerchantNameText, __assign({ isSelected: item.id === (merchantValue === null || merchantValue === void 0 ? void 0 : merchantValue.id) }, { children: getName(item) })) }), item.id === (merchantValue === null || merchantValue === void 0 ? void 0 : merchantValue.id) && _jsx(CheckIcon, { isVerified: isVerified })] }));
|
|
124
|
-
} }) }))] })) })));
|
|
125
|
-
});
|
|
126
|
-
export default React.memo(MerchantList);
|