@bytexbyte/berifyme-react-sdk 1.0.0

package/dist/components/VerifyWithPhoneNumber/NewUser/index.js

@@ -0,0 +1,189 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React from "react";
+import { Box, CircularProgress, IconButton, Input, Stack, Typography } from "@mui/material";
+import theme from "../../theme";
+import { useEffect, useState } from "react";
+import berifymeApi from "../../../api/api";
+import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded';
+import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
+import Footer from "../../Footer";
+import webauthn from "../../../lib/webauthb";
+import { environmentDomains } from "../../../lib/environmentDomains";
+import { createDeveloperLog } from "../../createDeveloperLog";
+import { processPhoneNumber } from "../../phoneNumberProcesser";
+var VerifyNewUser = function (_a) {
+    var token = _a.token, inputValue = _a.inputValue, setPageStatus = _a.setPageStatus, setUser = _a.setUser, environment = _a.environment;
+    var _b = useState(60), countdown = _b[0], setCountdown = _b[1]; // 倒數計時器，秒數為0表示可重新發送
+    var _c = useState(false), loading = _c[0], setLoading = _c[1]; // 控制API撥打時顯示loading
+    var _d = useState(""), code = _d[0], setCode = _d[1]; // 儲存輸入的驗證碼
+    var _e = useState(''), errorMessage = _e[0], setErrorMessage = _e[1];
+    useEffect(function () {
+        if (countdown > 0) {
+            var timer_1 = setInterval(function () {
+                setCountdown(function (prevCount) { return prevCount - 1; });
+            }, 1000);
+            return function () { return clearInterval(timer_1); };
+        }
+    }, [countdown]);
+    var handleResend = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var processedInputValue, res;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setLoading(true);
+                    processedInputValue = inputValue;
+                    processedInputValue = processPhoneNumber(processedInputValue);
+                    return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
+                case 1:
+                    res = _a.sent();
+                    setLoading(false);
+                    if (res.error)
+                        setErrorMessage(res.error);
+                    setCountdown(60);
+                    createDeveloperLog({
+                        source: 'FRONTEND',
+                        action: 'resend otp',
+                        sessionToken: token,
+                        firstDetail: processedInputValue,
+                        secondDetail: "success: ".concat(res.success, ", error: ").concat(res.error),
+                    });
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleChange = function (e) { return __awaiter(void 0, void 0, void 0, function () {
+        var value, processedInputValue, res, urlString, url;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    value = e.target.value;
+                    setCode(value);
+                    processedInputValue = inputValue;
+                    processedInputValue = processPhoneNumber(processedInputValue);
+                    if (!(value.length === 6)) return [3 /*break*/, 3];
+                    e.target.blur();
+                    setLoading(true);
+                    return [4 /*yield*/, berifymeApi.user.getUserByPhoneNumberAndVerifyCode({ phoneNumber: processedInputValue, code: value })];
+                case 1:
+                    res = _c.sent();
+                    createDeveloperLog({
+                        userId: (_a = res.user) === null || _a === void 0 ? void 0 : _a.id,
+                        userDataJson: res.user,
+                        source: 'FRONTEND',
+                        action: 'check otp code and get user',
+                        sessionToken: token,
+                        firstDetail: processedInputValue,
+                        secondDetail: "user: ".concat(res.user, ", error: ").concat(res.error),
+                    });
+                    if (res.error) {
+                        setLoading(false);
+                        setErrorMessage(res.error);
+                        return [2 /*return*/];
+                    }
+                    if (!res.user) {
+                        setLoading(false);
+                        setErrorMessage('Oops! Something went wrong...');
+                        return [2 /*return*/];
+                    }
+                    setErrorMessage('');
+                    setUser(res.user);
+                    setLoading(false);
+                    urlString = window.location.href;
+                    url = new URL(urlString);
+                    return [4 /*yield*/, webauthn.register({
+                            phoneNumber: processedInputValue,
+                            backendDomain: environmentDomains[environment],
+                            frontendDomain: "".concat(url.protocol, "//").concat(url.host),
+                            frontendDomainName: url.host,
+                        })];
+                case 2:
+                    _c.sent();
+                    createDeveloperLog({
+                        userId: (_b = res.user) === null || _b === void 0 ? void 0 : _b.id,
+                        userDataJson: res.user,
+                        source: 'FRONTEND',
+                        action: 'webauthn register success',
+                        sessionToken: token,
+                    });
+                    setPageStatus(1.1);
+                    _c.label = 3;
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (React.createElement(Stack, { height: 1, width: 1, justifyContent: 'space-between', overflow: 'auto' },
+        React.createElement("form", { onSubmit: handleResend, style: { width: '100%' } },
+            React.createElement(Stack, { height: 1, spacing: 2, pt: 1 },
+                React.createElement(Stack, { direction: 'row' },
+                    React.createElement(IconButton, { color: 'primary', onClick: function () {
+                            setPageStatus(0);
+                        } },
+                        React.createElement(ArrowBackRoundedIcon, null))),
+                React.createElement(Stack, { spacing: 2 },
+                    React.createElement(Typography, { variant: 'h2', fontWeight: 700 }, "Sign up"),
+                    React.createElement(Stack, { spacing: 1 },
+                        React.createElement(Typography, { variant: 'h5' },
+                            "Enter the 6-digit code sent to ",
+                            inputValue,
+                            "."),
+                        React.createElement(Box, { sx: { position: 'relative', width: '100%' } },
+                            React.createElement(Input, { fullWidth: true, disableUnderline: true, inputProps: { maxLength: 6, type: 'tel' }, sx: {
+                                    borderRadius: '12px',
+                                    padding: '10px 15px',
+                                    backgroundColor: '#f0f0f0',
+                                    fontSize: '18px',
+                                }, endAdornment: loading && React.createElement(CircularProgress, { size: 24, sx: { color: theme.palette.info.light } }), value: code, onChange: handleChange }))),
+                    React.createElement(Stack, null,
+                        React.createElement(Typography, { variant: 'body2', color: theme.palette.error.main, alignSelf: 'end' }, errorMessage),
+                        React.createElement(Stack, null,
+                            React.createElement(Typography, { variant: "body2", color: theme.palette.info.light, onClick: countdown === 0 ? handleResend : undefined },
+                                countdown > 0 && "Resend available in 00:".concat(countdown.toString().padStart(2, '0')),
+                                countdown === 0 && "Resend code")))),
+                React.createElement(Stack, { spacing: 2, px: 2, py: 1, bgcolor: theme.palette.secondary.light, borderRadius: 2 },
+                    React.createElement(Stack, { direction: 'row', spacing: 2, color: theme.palette.secondary.dark },
+                        React.createElement(InfoOutlinedIcon, null),
+                        React.createElement(Typography, { variant: 'h5', fontWeight: 700 }, "2 Easy Steps")),
+                    React.createElement(Stack, { component: 'ol', color: theme.palette.secondary.dark, pl: 8 },
+                        React.createElement(Typography, { variant: 'body1', component: 'li' }, "Choose verification provider"),
+                        React.createElement(Typography, { variant: 'body1', component: 'li' }, "Upload your ID or Passport and Take a Selfie")),
+                    React.createElement(Stack, { pl: 5, color: theme.palette.secondary.dark },
+                        React.createElement(Typography, { variant: 'h5', fontWeight: 700 }, "Congrats, you\u2019re Berified!"))))),
+        React.createElement(Footer, null)));
+};
+export default VerifyNewUser;

package/dist/components/VerifyWithPhoneNumber/User/index.js

@@ -0,0 +1,322 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React from "react";
+import { environmentDomains } from "../../../lib/environmentDomains";
+import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded';
+import { Box, Button, CircularProgress, IconButton, Input, Stack, Typography } from "@mui/material";
+import { useEffect, useState } from "react";
+import berifymeApi, { ActionType } from "../../../api/api";
+import theme from "../../theme";
+import { createAuthenticationLog } from "../../AuthenticationLogs";
+import { createDeveloperLog } from "../../createDeveloperLog";
+import Footer from "../../Footer";
+import webauthn from "../../../lib/webauthb";
+import { processPhoneNumber } from "../../phoneNumberProcesser";
+var VerifyUser = function (_a) {
+    var token = _a.token, inputValue = _a.inputValue, setError = _a.setError, setPageStatus = _a.setPageStatus, setUser = _a.setUser, setModalHeight = _a.setModalHeight, environment = _a.environment;
+    var _b = useState(60), countdown = _b[0], setCountdown = _b[1]; // 倒數計時器，秒數為0表示可重新發送
+    var _c = useState(false), loading = _c[0], setLoading = _c[1]; // 控制API撥打時顯示loading
+    var _d = useState(""), code = _d[0], setCode = _d[1]; // 儲存輸入的驗證碼
+    var _e = useState(''), errorMessage = _e[0], setErrorMessage = _e[1];
+    var _f = useState(), login = _f[0], setLogin = _f[1];
+    var _g = useState(), fullName = _g[0], setFullName = _g[1];
+    useEffect(function () {
+        if (countdown > 0) {
+            var timer_1 = setInterval(function () {
+                setCountdown(function (prevCount) { return prevCount - 1; });
+            }, 1000);
+            return function () { return clearInterval(timer_1); };
+        }
+    }, [countdown]);
+    var handleResend = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var processedInputValue, res;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setLoading(true);
+                    processedInputValue = inputValue;
+                    processedInputValue = processPhoneNumber(processedInputValue);
+                    return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
+                case 1:
+                    res = _a.sent();
+                    setLoading(false);
+                    if (res.error)
+                        setErrorMessage(res.error);
+                    setCountdown(60);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    var handleChange = function (e) { return __awaiter(void 0, void 0, void 0, function () {
+        var processedInputValue, value, res, urlString, url, deviceId, deviceUser, getVender;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        return __generator(this, function (_l) {
+            switch (_l.label) {
+                case 0:
+                    processedInputValue = inputValue;
+                    processedInputValue = processPhoneNumber(processedInputValue);
+                    value = e.target.value;
+                    setCode(value);
+                    if (!(value.length === 6)) return [3 /*break*/, 6];
+                    e.target.blur();
+                    setLoading(true);
+                    createDeveloperLog({
+                        source: 'FRONTEND',
+                        action: 'handle phone number code start loading',
+                        sessionToken: token,
+                        firstDetail: processedInputValue,
+                    });
+                    return [4 /*yield*/, berifymeApi.user.getUserByPhoneNumberAndVerifyCode({ phoneNumber: processedInputValue, code: value })];
+                case 1:
+                    res = _l.sent();
+                    createDeveloperLog({
+                        userId: (_a = res.user) === null || _a === void 0 ? void 0 : _a.id,
+                        userDataJson: res.user,
+                        source: 'FRONTEND',
+                        action: 'check otp code and get user',
+                        sessionToken: token,
+                        firstDetail: processedInputValue,
+                        secondDetail: "user: ".concat(res.user, ", error: ").concat(res.error),
+                    });
+                    if (res.error) {
+                        setLoading(false);
+                        setErrorMessage(res.error);
+                        createDeveloperLog({
+                            source: 'FRONTEND',
+                            action: 'handle phone number submit stop loading',
+                            sessionToken: token,
+                            firstDetail: processedInputValue,
+                            secondDetail: 'get vender error'
+                        });
+                        return [2 /*return*/];
+                    }
+                    setErrorMessage('');
+                    setUser(res.user);
+                    urlString = window.location.href;
+                    url = new URL(urlString);
+                    return [4 /*yield*/, webauthn.register({
+                            phoneNumber: processedInputValue,
+                            backendDomain: environmentDomains[environment],
+                            frontendDomain: "".concat(url.protocol, "//").concat(url.host),
+                            frontendDomainName: url.host,
+                        })];
+                case 2:
+                    _l.sent();
+                    createDeveloperLog({
+                        userId: (_b = res.user) === null || _b === void 0 ? void 0 : _b.id,
+                        userDataJson: res.user,
+                        source: 'FRONTEND',
+                        action: 'webauthn register success',
+                        sessionToken: token,
+                    });
+                    deviceId = localStorage.getItem('deviceId');
+                    if (!(deviceId && token)) return [3 /*break*/, 4];
+                    return [4 /*yield*/, berifymeApi.user.checkDeviceId({ phoneNumber: processedInputValue, deviceId: deviceId, token: token })];
+                case 3:
+                    deviceUser = _l.sent();
+                    if (deviceUser.user) {
+                        createDeveloperLog({
+                            userId: (_c = deviceUser.user.id) !== null && _c !== void 0 ? _c : '',
+                            source: 'FRONTEND',
+                            action: 'checkDeviceId success',
+                            sessionToken: token,
+                            userDataJson: deviceUser.user,
+                            firstDetail: "deviceId: ".concat(deviceId),
+                        });
+                        createAuthenticationLog({
+                            actionType: ActionType.LOGIN,
+                            userId: deviceUser.user.id,
+                            vender: 'auto verify',
+                            token: token,
+                            isPass: true,
+                        });
+                        setUser(deviceUser.user);
+                        setModalHeight('60vh');
+                        setPageStatus(10);
+                        createDeveloperLog({
+                            source: 'FRONTEND',
+                            action: 'handle phone number submit stop loading',
+                            sessionToken: token,
+                            firstDetail: processedInputValue,
+                            secondDetail: 'device id success'
+                        });
+                        return [2 /*return*/];
+                    }
+                    createDeveloperLog({
+                        userId: (_d = res.user) === null || _d === void 0 ? void 0 : _d.id,
+                        source: 'FRONTEND',
+                        action: 'checkDeviceId failed',
+                        sessionToken: token,
+                        firstDetail: deviceUser.error,
+                        secondDetail: "deviceId: ".concat(deviceId),
+                    });
+                    _l.label = 4;
+                case 4: return [4 /*yield*/, berifymeApi.user.getUserVenderByPhone({ phoneNumber: processedInputValue })];
+                case 5:
+                    getVender = _l.sent();
+                    if (getVender.error) {
+                        setError('Oops! Something went wrong...');
+                        setLoading(false);
+                        createDeveloperLog({
+                            userId: (_e = res.user) === null || _e === void 0 ? void 0 : _e.id,
+                            source: 'FRONTEND',
+                            action: 'getUserVenderByPhone error',
+                            sessionToken: token,
+                            firstDetail: (_f = getVender.error) !== null && _f !== void 0 ? _f : 'error',
+                        });
+                        createDeveloperLog({
+                            userId: (_g = res.user) === null || _g === void 0 ? void 0 : _g.id,
+                            source: 'FRONTEND',
+                            action: 'handle phone number submit stop loading',
+                            sessionToken: token,
+                            firstDetail: processedInputValue,
+                            secondDetail: 'get vender error'
+                        });
+                        return [2 /*return*/];
+                    }
+                    else {
+                        createDeveloperLog({
+                            userId: (_h = res.user) === null || _h === void 0 ? void 0 : _h.id,
+                            source: 'FRONTEND',
+                            action: 'getUserVenderByPhone success',
+                            sessionToken: token,
+                            firstDetail: (_j = getVender.vender) !== null && _j !== void 0 ? _j : 'null',
+                        });
+                    }
+                    if (getVender.vender === 'authid') {
+                        setLogin(3);
+                        setModalHeight('50vh');
+                        setFullName(getVender.fullName);
+                    }
+                    else if (getVender.vender === 'clear') {
+                        setLogin(4);
+                        setModalHeight('50vh');
+                        setFullName(getVender.fullName);
+                    }
+                    else if (getVender.vender === 'incode') {
+                        setLogin(5);
+                        setModalHeight('50vh');
+                        setFullName(getVender.fullName);
+                    }
+                    else if (getVender.vender === 'sumsub') {
+                        setLogin(8);
+                        setModalHeight('50vh');
+                        setFullName(getVender.fullName);
+                    }
+                    else if (getVender.vender === 'veriff') {
+                        setLogin(9);
+                        setModalHeight('50vh');
+                        setFullName(getVender.fullName);
+                    }
+                    setLoading(false);
+                    createDeveloperLog({
+                        userId: (_k = res.user) === null || _k === void 0 ? void 0 : _k.id,
+                        source: 'FRONTEND',
+                        action: 'handle phone number submit stop loading',
+                        sessionToken: token,
+                        firstDetail: processedInputValue,
+                        secondDetail: 'webauthn success'
+                    });
+                    _l.label = 6;
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); };
+    var initAuthId = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var authIdTokenRes;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, berifymeApi.authID.getAuthIDToken()];
+                case 1:
+                    authIdTokenRes = _a.sent();
+                    if (!authIdTokenRes.token) {
+                        setError('Auth id error');
+                        return [2 /*return*/];
+                    }
+                    localStorage.setItem('authID_token', authIdTokenRes.token);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () { initAuthId(); }, []);
+    return (React.createElement(React.Fragment, null,
+        login &&
+            React.createElement(Stack, { height: 1, spacing: 4, justifyContent: 'space-between', pt: 2 },
+                React.createElement(Stack, { spacing: 2, textAlign: 'center', alignItems: 'center' },
+                    React.createElement(Typography, { variant: "h1" }, "\uD83D\uDC4B"),
+                    React.createElement(Stack, null,
+                        React.createElement(Typography, { variant: "h2", fontWeight: 700 }, "Welcome back,"),
+                        React.createElement(Typography, { variant: "h2", fontWeight: 700 }, fullName)),
+                    React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "Take a selfie to verify your identity.")),
+                React.createElement(Stack, { alignItems: 'center' },
+                    React.createElement(Button, { variant: "contained", size: 'large', sx: { minWidth: 170, borderRadius: 4 }, type: "submit", onClick: function () { setPageStatus(login); } },
+                        React.createElement(Typography, { variant: 'body1', color: theme.palette.common.white }, "Take my selfie"))),
+                React.createElement(Footer, null)),
+        !login && React.createElement(Stack, { height: 1, width: 1, justifyContent: 'space-between', overflow: 'auto' },
+            React.createElement("form", { onSubmit: handleResend, style: { width: '100%' } },
+                React.createElement(Stack, { height: 1, spacing: 2, pt: 1 },
+                    React.createElement(Stack, { direction: 'row' },
+                        React.createElement(IconButton, { color: 'primary', onClick: function () {
+                                setPageStatus(0);
+                            } },
+                            React.createElement(ArrowBackRoundedIcon, null))),
+                    React.createElement(Stack, { spacing: 2 },
+                        React.createElement(Typography, { variant: 'h2', fontWeight: 700 }, "Verify your identity"),
+                        React.createElement(Stack, { spacing: 1 },
+                            React.createElement(Typography, { variant: 'h5' },
+                                "Enter the 6-digit code sent to ",
+                                inputValue,
+                                "."),
+                            React.createElement(Box, { sx: { position: 'relative', width: '100%' } },
+                                React.createElement(Input, { fullWidth: true, disableUnderline: true, inputProps: { maxLength: 6, type: 'tel' }, sx: {
+                                        borderRadius: '12px',
+                                        padding: '10px 15px',
+                                        backgroundColor: '#f0f0f0',
+                                        fontSize: '18px',
+                                        '& input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active': {
+                                            transition: 'background-color 5000s ease-in-out 0s'
+                                        }
+                                    }, endAdornment: loading && React.createElement(CircularProgress, { size: 24, sx: { color: theme.palette.info.light } }), value: code, onChange: handleChange })),
+                            React.createElement(Stack, null,
+                                React.createElement(Typography, { variant: 'body2', color: theme.palette.error.main, alignSelf: 'end' }, errorMessage),
+                                React.createElement(Stack, null,
+                                    React.createElement(Typography, { variant: "body2", color: theme.palette.info.light, onClick: countdown === 0 ? handleResend : undefined },
+                                        countdown > 0 && "Resend available in 00:".concat(countdown.toString().padStart(2, '0')),
+                                        countdown === 0 && "Resend code"))))))),
+            React.createElement(Footer, null))));
+};
+export default VerifyUser;

package/dist/components/createDeveloperLog.js

@@ -0,0 +1,60 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import berifymeApi from "../api/api";
+export var createDeveloperLog = function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
+    var userAgent;
+    var userId = _b.userId, sessionToken = _b.sessionToken, action = _b.action, firstDetail = _b.firstDetail, secondDetail = _b.secondDetail, userDataJson = _b.userDataJson, source = _b.source, browser = _b.browser;
+    return __generator(this, function (_c) {
+        switch (_c.label) {
+            case 0:
+                userAgent = navigator.userAgent || navigator.vendor || window.opera;
+                return [4 /*yield*/, berifymeApi.developerLogs.createDeveloperLog({
+                        userId: userId,
+                        sessionToken: sessionToken,
+                        action: action,
+                        firstDetail: firstDetail,
+                        secondDetail: secondDetail,
+                        userDataJson: userDataJson,
+                        source: source,
+                        browser: browser ? browser : userAgent,
+                    })];
+            case 1:
+                _c.sent();
+                return [2 /*return*/];
+        }
+    });
+}); };

package/dist/components/phoneNumberProcesser.js

@@ -0,0 +1,32 @@
+// 各國區碼前綴處理規則
+var countryPhonePatterns = [
+    { code: '886', regex: /^8860+/, replacement: '886' }, // 台灣
+    { code: '81', regex: /^810+/, replacement: '81' }, // 日本
+    { code: '82', regex: /^820+/, replacement: '82' }, // 韓國
+    { code: '44', regex: /^440+/, replacement: '44' }, // 英國
+    { code: '61', regex: /^610+/, replacement: '61' }, // 澳大利亞
+    { code: '49', regex: /^490+/, replacement: '49' }, // 德國
+    { code: '27', regex: /^270+/, replacement: '27' }, // 南非
+    { code: '39', regex: /^390+/, replacement: '39' }, // 意大利
+    // 可根據需求擴展其他國家
+];
+/**
+ * 處理電話號碼，根據不同國家的格式進行標準化
+ * @param {string} inputValue - 要處理的電話號碼
+ * @returns {string} - 標準化後的電話號碼
+ */
+export function processPhoneNumber(inputValue) {
+    var processedInputValue = inputValue.trim();
+    // 移除前面的 + 號
+    if (/^\+/.test(processedInputValue)) {
+        processedInputValue = processedInputValue.replace(/^\+/, '');
+    }
+    // 根據不同國家進行前綴的處理
+    countryPhonePatterns.forEach(function (_a) {
+        var regex = _a.regex, replacement = _a.replacement;
+        if (regex.test(processedInputValue)) {
+            processedInputValue = processedInputValue.replace(regex, replacement);
+        }
+    });
+    return processedInputValue;
+}