react-usehooks-ts
Version:
A collections of typescript supported react Custom hooks
79 lines (78 loc) • 3.4 kB
JavaScript
;
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());
});
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useAutoReadOtp = void 0;
const react_1 = require("react");
const useAutoReadOtp = ({ startOtpDetection = false, timeoutInMin = 5, }) => {
const [isOtpDetecting, setIsOtpDetecting] = (0, react_1.useState)(true);
const [detectedOTP, setDetectedOTP] = (0, react_1.useState)(null);
const [otpDetectError, setOtpDetectError] = (0, react_1.useState)("");
let timeId = null;
let signalId = null;
const autoReadSMS = () => {
signalId = new AbortController();
timeId = setTimeout(() => {
signalId.abort();
setIsOtpDetecting(false);
}, 1000 * 60 * timeoutInMin);
function main() {
return __awaiter(this, void 0, void 0, function* () {
if ("OTPCredential" in window) {
try {
if (navigator.credentials && "OTPCredential" in window) {
try {
const content = yield navigator.credentials.get({
abort: signalId,
otp: { transport: ["sms"] },
});
if (content && content.code) {
setDetectedOTP(content.code);
}
}
catch (e) {
setOtpDetectError("Error detecting OTP");
console.error(e);
}
}
else {
setOtpDetectError("Auto-detect OTP is not available in Desktop browsers");
setIsOtpDetecting(false);
}
}
catch (err) {
setOtpDetectError("Error detecting OTP");
console.error(err);
}
}
else {
setOtpDetectError("Auto-detect OTP is not available in Desktop browsers");
setIsOtpDetecting(false);
}
});
}
main();
};
(0, react_1.useEffect)(() => {
if (startOtpDetection) {
autoReadSMS();
}
return () => {
if (signalId) {
signalId.abort();
}
if (timeId) {
clearTimeout(timeId);
}
};
}, [startOtpDetection]);
return [detectedOTP, isOtpDetecting, otpDetectError];
};
exports.useAutoReadOtp = useAutoReadOtp;