@bytexbyte/berifyme-react-sdk 1.0.0 → 1.0.2
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/dist/components/AllSet/index.js +36 -21
- package/dist/components/Login/sumsub/index.js +212 -0
- package/dist/components/Login/veriff/Login.js +168 -0
- package/dist/components/Login/veriff/index.js +14 -0
- package/dist/components/Login/yoti/Login.js +235 -0
- package/dist/components/Login/yoti/index.js +14 -0
- package/dist/components/OnBoarding/sumsub/index.js +183 -0
- package/dist/components/OnBoarding/veriff/index.js +152 -0
- package/dist/components/OnBoarding/yoti/OnBoarding.js +228 -0
- package/dist/components/OnBoarding/yoti/index.js +14 -0
- package/dist/types/components/Login/sumsub/index.d.ts +10 -0
- package/dist/types/components/Login/veriff/Login.d.ts +12 -0
- package/dist/types/components/Login/veriff/index.d.ts +11 -0
- package/dist/types/components/Login/yoti/Login.d.ts +11 -0
- package/dist/types/components/Login/yoti/index.d.ts +10 -0
- package/dist/types/components/OnBoarding/sumsub/index.d.ts +10 -0
- package/dist/types/components/OnBoarding/veriff/index.d.ts +11 -0
- package/dist/types/components/OnBoarding/yoti/OnBoarding.d.ts +12 -0
- package/dist/types/components/OnBoarding/yoti/index.d.ts +11 -0
- package/package.json +1 -1
|
@@ -35,7 +35,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
35
35
|
}
|
|
36
36
|
};
|
|
37
37
|
import React from "react";
|
|
38
|
-
import { Button, Stack, Typography } from "@mui/material";
|
|
38
|
+
import { Box, Button, CircularProgress, Stack, Typography } from "@mui/material";
|
|
39
39
|
import theme from "../theme";
|
|
40
40
|
import GppGoodOutlinedIcon from '@mui/icons-material/GppGoodOutlined';
|
|
41
41
|
import { useSpeedTest } from "../speedTest/SpeedProvider";
|
|
@@ -65,6 +65,8 @@ var AllSet = function (_a) {
|
|
|
65
65
|
var user = _a.user, token = _a.token, desktopRedirectUrlId = _a.desktopRedirectUrlId;
|
|
66
66
|
var _b = useState(''), error = _b[0], setError = _b[1];
|
|
67
67
|
var _c = useState(), desktopStatusMessage = _c[0], setDesktopStatusMessage = _c[1];
|
|
68
|
+
var _d = useState(true), loading = _d[0], setLoading = _d[1];
|
|
69
|
+
var _e = useState(''), redirectUrl = _e[0], setRedirectUrl = _e[1];
|
|
68
70
|
var checkOldDeviceId = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
69
71
|
var deviceId, deviceUser;
|
|
70
72
|
return __generator(this, function (_a) {
|
|
@@ -109,7 +111,7 @@ var AllSet = function (_a) {
|
|
|
109
111
|
startSpeedTest();
|
|
110
112
|
checkAndIssueToken();
|
|
111
113
|
}, []);
|
|
112
|
-
var
|
|
114
|
+
var getRedirectUrl = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
113
115
|
var res;
|
|
114
116
|
return __generator(this, function (_a) {
|
|
115
117
|
switch (_a.label) {
|
|
@@ -127,12 +129,13 @@ var AllSet = function (_a) {
|
|
|
127
129
|
action: 'getRedirectUrl',
|
|
128
130
|
sessionToken: token,
|
|
129
131
|
});
|
|
132
|
+
setLoading(false);
|
|
130
133
|
if (!res.redirectUrl) {
|
|
131
134
|
setError('Oops! Something went wrong...');
|
|
132
135
|
return [2 /*return*/];
|
|
133
136
|
}
|
|
134
137
|
if (desktopRedirectUrlId === undefined) {
|
|
135
|
-
|
|
138
|
+
setRedirectUrl(res.redirectUrl);
|
|
136
139
|
}
|
|
137
140
|
else {
|
|
138
141
|
if (res.heartbeatStopped)
|
|
@@ -144,26 +147,38 @@ var AllSet = function (_a) {
|
|
|
144
147
|
}
|
|
145
148
|
});
|
|
146
149
|
}); };
|
|
150
|
+
useEffect(function () {
|
|
151
|
+
getRedirectUrl();
|
|
152
|
+
}, []);
|
|
147
153
|
return (React.createElement(React.Fragment, null, error ?
|
|
148
154
|
React.createElement(TryAgain, { message: error }) :
|
|
149
|
-
React.createElement(React.Fragment, null,
|
|
150
|
-
React.createElement(
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
155
|
+
React.createElement(React.Fragment, null, loading ?
|
|
156
|
+
React.createElement(Box, { sx: {
|
|
157
|
+
display: 'flex',
|
|
158
|
+
justifyContent: 'center',
|
|
159
|
+
alignItems: 'center',
|
|
160
|
+
height: '100vh',
|
|
161
|
+
background: '#FFFFFF'
|
|
162
|
+
} },
|
|
163
|
+
React.createElement(CircularProgress, null)) :
|
|
164
|
+
React.createElement(React.Fragment, null, desktopStatusMessage ?
|
|
165
|
+
React.createElement(Stack, { height: 1, justifyContent: "center", alignItems: "center" },
|
|
166
|
+
React.createElement(Stack, { alignItems: "center", spacing: 2 },
|
|
157
167
|
React.createElement("img", { width: 40, height: 40, src: "https://staging.berify.me/berify.svg", alt: "berify" }),
|
|
158
|
-
React.createElement(Typography, { variant: "
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
+
React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, desktopStatusMessage)))
|
|
169
|
+
:
|
|
170
|
+
React.createElement(Stack, { height: 1, spacing: 4, justifyContent: 'space-between', py: 4, overflow: 'auto' },
|
|
171
|
+
React.createElement(Stack, { spacing: 2, textAlign: 'center', alignItems: 'center' },
|
|
172
|
+
React.createElement("img", { width: 40, height: 40, src: "https://staging.berify.me/berify.svg", alt: "berify" }),
|
|
173
|
+
React.createElement(Typography, { variant: "h2", fontWeight: 700 },
|
|
174
|
+
"You\u2019re Berified,",
|
|
175
|
+
React.createElement("br", null), user === null || user === void 0 ? void 0 :
|
|
176
|
+
user.fullName),
|
|
177
|
+
React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "Thank you for securely verifying your identity through Berify.me \uD83C\uDF89")),
|
|
178
|
+
React.createElement(Stack, { spacing: 2, alignItems: 'center' },
|
|
179
|
+
React.createElement(Button, { variant: "contained", onClick: function () { window.location.href = redirectUrl; }, sx: { minWidth: 160 } }, "Continue")),
|
|
180
|
+
React.createElement(Stack, { direction: 'row', spacing: 2, textAlign: 'center', justifyContent: 'center', color: theme.palette.text.secondary },
|
|
181
|
+
React.createElement(GppGoodOutlinedIcon, null),
|
|
182
|
+
React.createElement(Typography, { variant: "body1" }, "Securely powered by Berify.me")))))));
|
|
168
183
|
};
|
|
169
184
|
export default AllSet;
|
|
@@ -0,0 +1,212 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
11
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
12
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
13
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
14
|
+
function step(op) {
|
|
15
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
16
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
17
|
+
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;
|
|
18
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
19
|
+
switch (op[0]) {
|
|
20
|
+
case 0: case 1: t = op; break;
|
|
21
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
22
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
23
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
24
|
+
default:
|
|
25
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
26
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
27
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
28
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
29
|
+
if (t[2]) _.ops.pop();
|
|
30
|
+
_.trys.pop(); continue;
|
|
31
|
+
}
|
|
32
|
+
op = body.call(thisArg, _);
|
|
33
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
34
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
import SumsubWebSdk from '@sumsub/websdk-react';
|
|
38
|
+
import React, { useCallback, useEffect, useState } from 'react';
|
|
39
|
+
import berifymeApi from '../../../api/api';
|
|
40
|
+
import { delay } from '../../../common';
|
|
41
|
+
import { createDeveloperLog } from '../../createDeveloperLog';
|
|
42
|
+
import TryAgain from '../../TryAgain';
|
|
43
|
+
var OPTIONS = { addViewportTag: false, adaptIframeHeight: true };
|
|
44
|
+
var SumsubLogin = function (_a) {
|
|
45
|
+
var user = _a.user, setUser = _a.setUser, goToAllSet = _a.goToAllSet, token = _a.token;
|
|
46
|
+
var _b = useState(), accessToken = _b[0], setAccessToken = _b[1];
|
|
47
|
+
var _c = useState(), externalActionId = _c[0], setExternalActionId = _c[1];
|
|
48
|
+
var _d = useState(), error = _d[0], setError = _d[1];
|
|
49
|
+
var getAccessToken = useCallback((function (phoneNumber) { return __awaiter(void 0, void 0, void 0, function () {
|
|
50
|
+
var accessTokenResponse;
|
|
51
|
+
return __generator(this, function (_a) {
|
|
52
|
+
switch (_a.label) {
|
|
53
|
+
case 0: return [4 /*yield*/, berifymeApi.sumsub.createAccessToken({ phoneNumber: phoneNumber, levelName: 'face-login' })];
|
|
54
|
+
case 1:
|
|
55
|
+
accessTokenResponse = _a.sent();
|
|
56
|
+
if ('error' in accessTokenResponse) {
|
|
57
|
+
console.log('error', accessTokenResponse.error);
|
|
58
|
+
createDeveloperLog({
|
|
59
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
60
|
+
userDataJson: user,
|
|
61
|
+
source: 'FRONTEND',
|
|
62
|
+
action: 'sumsub api',
|
|
63
|
+
sessionToken: token,
|
|
64
|
+
firstDetail: 'createAccessToken',
|
|
65
|
+
secondDetail: accessTokenResponse.error,
|
|
66
|
+
});
|
|
67
|
+
return [2 /*return*/, { token: '' }];
|
|
68
|
+
}
|
|
69
|
+
return [2 /*return*/, accessTokenResponse];
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
}); }), [token, user]);
|
|
73
|
+
var initAccessToken = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
74
|
+
var accessToken;
|
|
75
|
+
return __generator(this, function (_a) {
|
|
76
|
+
switch (_a.label) {
|
|
77
|
+
case 0:
|
|
78
|
+
if (!user.phoneNumber)
|
|
79
|
+
return [2 /*return*/];
|
|
80
|
+
if (!user.sumsubId)
|
|
81
|
+
return [2 /*return*/];
|
|
82
|
+
return [4 /*yield*/, getAccessToken(user.phoneNumber)];
|
|
83
|
+
case 1:
|
|
84
|
+
accessToken = _a.sent();
|
|
85
|
+
setAccessToken(accessToken.token);
|
|
86
|
+
setExternalActionId(accessToken.externalActionId);
|
|
87
|
+
return [2 /*return*/];
|
|
88
|
+
}
|
|
89
|
+
});
|
|
90
|
+
}); }, [user.phoneNumber, user.sumsubId, getAccessToken]);
|
|
91
|
+
var onSumsubLoginSuccess = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
92
|
+
var faceLoginResult, userResponse;
|
|
93
|
+
return __generator(this, function (_a) {
|
|
94
|
+
switch (_a.label) {
|
|
95
|
+
case 0:
|
|
96
|
+
if (!user.sumsubId)
|
|
97
|
+
return [2 /*return*/];
|
|
98
|
+
return [4 /*yield*/, berifymeApi.sumsub.getSumsubFaceLoginResult({ sumsubId: user.sumsubId || '', externalActionId: externalActionId || '' })];
|
|
99
|
+
case 1:
|
|
100
|
+
faceLoginResult = _a.sent();
|
|
101
|
+
if ('error' in faceLoginResult) {
|
|
102
|
+
console.error(faceLoginResult.error);
|
|
103
|
+
createDeveloperLog({
|
|
104
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
105
|
+
userDataJson: user,
|
|
106
|
+
source: 'FRONTEND',
|
|
107
|
+
action: 'sumsub api',
|
|
108
|
+
sessionToken: token,
|
|
109
|
+
firstDetail: 'getFaceLoginResult',
|
|
110
|
+
secondDetail: faceLoginResult.error,
|
|
111
|
+
});
|
|
112
|
+
setError('Oops! Something went wrong...');
|
|
113
|
+
return [2 /*return*/];
|
|
114
|
+
}
|
|
115
|
+
if (!faceLoginResult.isVerified) {
|
|
116
|
+
console.error('faceLoginResult.isVerified is false');
|
|
117
|
+
createDeveloperLog({
|
|
118
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
119
|
+
userDataJson: user,
|
|
120
|
+
source: 'FRONTEND',
|
|
121
|
+
action: 'sumsub api',
|
|
122
|
+
sessionToken: token,
|
|
123
|
+
firstDetail: 'getFaceLoginResult',
|
|
124
|
+
secondDetail: 'isVerified is false',
|
|
125
|
+
});
|
|
126
|
+
setError('Face verification failed');
|
|
127
|
+
return [2 /*return*/];
|
|
128
|
+
}
|
|
129
|
+
return [4 /*yield*/, berifymeApi.user.getUserBySumsubId({ sumsubId: user.sumsubId })];
|
|
130
|
+
case 2:
|
|
131
|
+
userResponse = _a.sent();
|
|
132
|
+
if ('error' in userResponse) {
|
|
133
|
+
console.log('error', userResponse.error);
|
|
134
|
+
createDeveloperLog({
|
|
135
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
136
|
+
userDataJson: user,
|
|
137
|
+
source: 'FRONTEND',
|
|
138
|
+
action: 'sumsub api',
|
|
139
|
+
sessionToken: token,
|
|
140
|
+
firstDetail: 'getUserBySumsubId',
|
|
141
|
+
secondDetail: userResponse.error,
|
|
142
|
+
});
|
|
143
|
+
setError('Oops! Something went wrong...');
|
|
144
|
+
return [2 /*return*/];
|
|
145
|
+
}
|
|
146
|
+
setUser(userResponse.user);
|
|
147
|
+
goToAllSet();
|
|
148
|
+
return [2 /*return*/];
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
}); };
|
|
152
|
+
var accessTokenExpirationHandler = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
153
|
+
return __generator(this, function (_a) {
|
|
154
|
+
switch (_a.label) {
|
|
155
|
+
case 0:
|
|
156
|
+
console.log('accessTokenExpirationHandler');
|
|
157
|
+
if (!user.phoneNumber)
|
|
158
|
+
return [2 /*return*/, ''];
|
|
159
|
+
return [4 /*yield*/, getAccessToken(user.phoneNumber)];
|
|
160
|
+
case 1: return [2 /*return*/, _a.sent()];
|
|
161
|
+
}
|
|
162
|
+
});
|
|
163
|
+
}); }, [getAccessToken, user.phoneNumber]);
|
|
164
|
+
var messageHandler = function (type, payload) { return __awaiter(void 0, void 0, void 0, function () {
|
|
165
|
+
var _a;
|
|
166
|
+
return __generator(this, function (_b) {
|
|
167
|
+
switch (_b.label) {
|
|
168
|
+
case 0:
|
|
169
|
+
console.log('onMessage', type, payload);
|
|
170
|
+
createDeveloperLog({
|
|
171
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
172
|
+
userDataJson: user,
|
|
173
|
+
source: 'FRONTEND',
|
|
174
|
+
action: 'sumsub step',
|
|
175
|
+
sessionToken: token,
|
|
176
|
+
firstDetail: type,
|
|
177
|
+
secondDetail: JSON.stringify(payload),
|
|
178
|
+
});
|
|
179
|
+
if (!(type === 'idCheck.onApplicantActionCompleted')) return [3 /*break*/, 5];
|
|
180
|
+
_a = payload.answer;
|
|
181
|
+
switch (_a) {
|
|
182
|
+
case 'GREEN': return [3 /*break*/, 1];
|
|
183
|
+
case 'RED': return [3 /*break*/, 3];
|
|
184
|
+
}
|
|
185
|
+
return [3 /*break*/, 4];
|
|
186
|
+
case 1: return [4 /*yield*/, delay(1000)];
|
|
187
|
+
case 2:
|
|
188
|
+
_b.sent();
|
|
189
|
+
onSumsubLoginSuccess();
|
|
190
|
+
return [3 /*break*/, 5];
|
|
191
|
+
case 3:
|
|
192
|
+
setError('Face verification failed');
|
|
193
|
+
return [3 /*break*/, 5];
|
|
194
|
+
case 4:
|
|
195
|
+
setError('Oops! Something went wrong...');
|
|
196
|
+
_b.label = 5;
|
|
197
|
+
case 5: return [2 /*return*/];
|
|
198
|
+
}
|
|
199
|
+
});
|
|
200
|
+
}); };
|
|
201
|
+
var errorHandler = function (error) {
|
|
202
|
+
console.log('onError', error);
|
|
203
|
+
};
|
|
204
|
+
useEffect(function () {
|
|
205
|
+
initAccessToken();
|
|
206
|
+
}, [initAccessToken]);
|
|
207
|
+
if (error || !token)
|
|
208
|
+
return (React.createElement(TryAgain, { message: error }));
|
|
209
|
+
return (React.createElement(React.Fragment, null, accessToken &&
|
|
210
|
+
React.createElement(SumsubWebSdk, { accessToken: accessToken, expirationHandler: accessTokenExpirationHandler, options: OPTIONS, onMessage: messageHandler, onError: errorHandler })));
|
|
211
|
+
};
|
|
212
|
+
export default SumsubLogin;
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
11
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
12
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
13
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
14
|
+
function step(op) {
|
|
15
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
16
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
17
|
+
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;
|
|
18
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
19
|
+
switch (op[0]) {
|
|
20
|
+
case 0: case 1: t = op; break;
|
|
21
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
22
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
23
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
24
|
+
default:
|
|
25
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
26
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
27
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
28
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
29
|
+
if (t[2]) _.ops.pop();
|
|
30
|
+
_.trys.pop(); continue;
|
|
31
|
+
}
|
|
32
|
+
op = body.call(thisArg, _);
|
|
33
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
34
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
import { Box, CircularProgress } from '@mui/material';
|
|
38
|
+
import { createVeriffFrame, MESSAGES } from '@veriff/incontext-sdk';
|
|
39
|
+
//@ts-expect-error - Veriff sample code
|
|
40
|
+
import { Veriff } from '@veriff/js-sdk';
|
|
41
|
+
import React, { useCallback, useEffect, useState } from 'react';
|
|
42
|
+
import berifymeApi from '../../../api/api';
|
|
43
|
+
import { createDeveloperLog } from '../../createDeveloperLog';
|
|
44
|
+
export default function LoginComponent(_a) {
|
|
45
|
+
var _this = this;
|
|
46
|
+
var user = _a.user, setUser = _a.setUser, onSuccess = _a.onSuccess, onGoBack = _a.onGoBack, onError = _a.onError, token = _a.token;
|
|
47
|
+
var _b = useState(), step = _b[0], setStep = _b[1];
|
|
48
|
+
var _c = useState(false), initFinished = _c[0], setInitFinished = _c[1];
|
|
49
|
+
var _d = useState(), sessionId = _d[0], setSessionId = _d[1];
|
|
50
|
+
var onFinishedVeriff = useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
|
|
51
|
+
var faceLoginResult, userResponse;
|
|
52
|
+
return __generator(this, function (_a) {
|
|
53
|
+
switch (_a.label) {
|
|
54
|
+
case 0:
|
|
55
|
+
if (!user.veriffId)
|
|
56
|
+
return [2 /*return*/];
|
|
57
|
+
return [4 /*yield*/, berifymeApi.veriff.getVeriffFaceLoginResult({ sessionId: sessionId || '' })];
|
|
58
|
+
case 1:
|
|
59
|
+
faceLoginResult = _a.sent();
|
|
60
|
+
if ('error' in faceLoginResult) {
|
|
61
|
+
console.error(faceLoginResult.error);
|
|
62
|
+
createDeveloperLog({
|
|
63
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
64
|
+
userDataJson: user,
|
|
65
|
+
source: 'FRONTEND',
|
|
66
|
+
action: 'veriff api',
|
|
67
|
+
sessionToken: token,
|
|
68
|
+
firstDetail: 'getFaceLoginResult',
|
|
69
|
+
secondDetail: faceLoginResult.error,
|
|
70
|
+
});
|
|
71
|
+
onError('Oops! Something went wrong...');
|
|
72
|
+
return [2 /*return*/];
|
|
73
|
+
}
|
|
74
|
+
if (!faceLoginResult.isVerified) {
|
|
75
|
+
console.error('faceLoginResult.isVerified is false');
|
|
76
|
+
createDeveloperLog({
|
|
77
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
78
|
+
userDataJson: user,
|
|
79
|
+
source: 'FRONTEND',
|
|
80
|
+
action: 'veriff api',
|
|
81
|
+
sessionToken: token,
|
|
82
|
+
firstDetail: 'getFaceLoginResult',
|
|
83
|
+
secondDetail: 'isVerified is false',
|
|
84
|
+
});
|
|
85
|
+
onError('Face verification failed');
|
|
86
|
+
return [2 /*return*/];
|
|
87
|
+
}
|
|
88
|
+
return [4 /*yield*/, berifymeApi.veriff.getUserByVeriffId({ veriffId: user.veriffId })];
|
|
89
|
+
case 2:
|
|
90
|
+
userResponse = _a.sent();
|
|
91
|
+
if ('error' in userResponse) {
|
|
92
|
+
console.log('error', userResponse.error);
|
|
93
|
+
createDeveloperLog({
|
|
94
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
95
|
+
userDataJson: user,
|
|
96
|
+
source: 'FRONTEND',
|
|
97
|
+
action: 'veriff api',
|
|
98
|
+
sessionToken: token,
|
|
99
|
+
firstDetail: 'getUserByVeriffId',
|
|
100
|
+
secondDetail: userResponse.error,
|
|
101
|
+
});
|
|
102
|
+
onError('Oops! Something went wrong...');
|
|
103
|
+
return [2 /*return*/];
|
|
104
|
+
}
|
|
105
|
+
setUser(userResponse.user);
|
|
106
|
+
onSuccess();
|
|
107
|
+
return [2 /*return*/];
|
|
108
|
+
}
|
|
109
|
+
});
|
|
110
|
+
}); }, [user, sessionId, setUser, onSuccess, token, onError]);
|
|
111
|
+
var onCancelVeriff = useCallback(function () {
|
|
112
|
+
onGoBack();
|
|
113
|
+
}, [onGoBack]);
|
|
114
|
+
useEffect(function () {
|
|
115
|
+
if (!user.phoneNumber)
|
|
116
|
+
return;
|
|
117
|
+
setInitFinished(false);
|
|
118
|
+
var veriff = Veriff({
|
|
119
|
+
host: 'https://api.veriff.me',
|
|
120
|
+
apiKey: 'ec9ca5ea-d883-4da3-a7e8-843d070d7cd1',
|
|
121
|
+
parentId: 'veriff-root',
|
|
122
|
+
onSession: function (err, response) {
|
|
123
|
+
console.log(err);
|
|
124
|
+
setSessionId(response.verification.id);
|
|
125
|
+
createVeriffFrame({ url: response.verification.url, onEvent: function (msg) { setStep(msg); } });
|
|
126
|
+
}
|
|
127
|
+
});
|
|
128
|
+
veriff.setParams({
|
|
129
|
+
person: {
|
|
130
|
+
givenName: ' ',
|
|
131
|
+
lastName: ' '
|
|
132
|
+
},
|
|
133
|
+
vendorData: user.phoneNumber,
|
|
134
|
+
});
|
|
135
|
+
veriff.mount();
|
|
136
|
+
setInitFinished(true);
|
|
137
|
+
}, [user.phoneNumber]);
|
|
138
|
+
useEffect(function () {
|
|
139
|
+
switch (step) {
|
|
140
|
+
case MESSAGES.FINISHED:
|
|
141
|
+
onFinishedVeriff();
|
|
142
|
+
break;
|
|
143
|
+
case MESSAGES.CANCELED:
|
|
144
|
+
onCancelVeriff();
|
|
145
|
+
break;
|
|
146
|
+
default:
|
|
147
|
+
break;
|
|
148
|
+
}
|
|
149
|
+
}, [onFinishedVeriff, onCancelVeriff, step]);
|
|
150
|
+
useEffect(function () {
|
|
151
|
+
var timeoutHandle = setTimeout(function () {
|
|
152
|
+
var _a;
|
|
153
|
+
if (!initFinished)
|
|
154
|
+
return;
|
|
155
|
+
(_a = document.getElementById('veriff-submit-btn')) === null || _a === void 0 ? void 0 : _a.click();
|
|
156
|
+
}, 100);
|
|
157
|
+
return function () { return clearTimeout(timeoutHandle); };
|
|
158
|
+
}, [initFinished]);
|
|
159
|
+
return (React.createElement(Box, { style: {
|
|
160
|
+
display: 'flex',
|
|
161
|
+
flexDirection: 'column',
|
|
162
|
+
alignItems: 'center',
|
|
163
|
+
justifyContent: 'center',
|
|
164
|
+
height: '100vh',
|
|
165
|
+
} },
|
|
166
|
+
React.createElement(CircularProgress, { color: "inherit" }),
|
|
167
|
+
React.createElement("div", { id: 'veriff-root', style: { height: 0, opacity: 0 } })));
|
|
168
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React, { useCallback, useState } from 'react';
|
|
2
|
+
import TryAgain from '../../TryAgain';
|
|
3
|
+
import Login from './Login';
|
|
4
|
+
var VeriffLogin = function (_a) {
|
|
5
|
+
var user = _a.user, setUser = _a.setUser, onSuccess = _a.onSuccess, onGoBack = _a.onGoBack, token = _a.token;
|
|
6
|
+
var _b = useState(), error = _b[0], setError = _b[1];
|
|
7
|
+
var handleError = useCallback(function (error) {
|
|
8
|
+
setError(error);
|
|
9
|
+
}, []);
|
|
10
|
+
if (error || !token)
|
|
11
|
+
return (React.createElement(TryAgain, { message: error }));
|
|
12
|
+
return (React.createElement(Login, { user: user, setUser: setUser, onSuccess: onSuccess, onGoBack: onGoBack, onError: handleError, token: token }));
|
|
13
|
+
};
|
|
14
|
+
export default VeriffLogin;
|