feat :VerifyOtp and SendOtp creation for "seetings", "send monet", "password expiry" and "set login and tpassword"
This commit is contained in:
@@ -9,6 +9,9 @@ import logo from '@/app/image/logo1.jpg';
|
||||
import changePwdImage from '@/app/image/set_tran_pass.jpg';
|
||||
import { generateCaptcha } from '@/app/captcha';
|
||||
import { IconLock, IconLogout, IconRefresh } from '@tabler/icons-react';
|
||||
import { sendOtp, verifyOtp } from "../_util/otp";
|
||||
|
||||
|
||||
|
||||
export default function SetTransactionPwd() {
|
||||
const router = useRouter();
|
||||
@@ -23,6 +26,45 @@ export default function SetTransactionPwd() {
|
||||
const [timerActive, setTimerActive] = useState(false);
|
||||
const icon = <IconLock size={18} stroke={1.5} />;
|
||||
const [generateOtp, setGenerateOtp] = useState("");
|
||||
const [showOtpField, setShowOtpField] = useState(false);
|
||||
const [step, setStep] = useState<"form" | "otp" | "final">("form");
|
||||
const [otpValidated, setOtpValidated] = useState(false);
|
||||
|
||||
|
||||
|
||||
|
||||
async function handleSendOtp() {
|
||||
const mobileNumber = localStorage.getItem('remitter_mobile_no');
|
||||
if (!mobileNumber) {
|
||||
notifications.show({
|
||||
title: 'Error',
|
||||
message: 'Mobile number not found.Contact to administrator',
|
||||
color: 'red',
|
||||
});
|
||||
return;
|
||||
}
|
||||
try {
|
||||
await sendOtp({ type: 'CHANGE_LPWORD' });
|
||||
setCountdown(180);
|
||||
setTimerActive(true);
|
||||
} catch (err: any) {
|
||||
console.error('Send OTP failed', err);
|
||||
notifications.show({
|
||||
title: 'Error',
|
||||
message: err.message || 'Send OTP failed.Please try again later.',
|
||||
color: 'red',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function handleVerifyOtp() {
|
||||
try {
|
||||
await verifyOtp(otp);
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
async function handleGenerateOtp() {
|
||||
// const value = await generateOTP(6);
|
||||
@@ -128,7 +170,7 @@ export default function SetTransactionPwd() {
|
||||
}
|
||||
if (!captchaValidate) {
|
||||
setCaptchaValidate(true);
|
||||
handleGenerateOtp();
|
||||
handleSendOtp();
|
||||
return;
|
||||
}
|
||||
if (!otp) {
|
||||
@@ -139,14 +181,33 @@ export default function SetTransactionPwd() {
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (otp !== generateOtp) {
|
||||
|
||||
// Step 2 → validate OTP
|
||||
if (step === "otp") {
|
||||
const verified = await handleVerifyOtp();
|
||||
if (!verified) {
|
||||
notifications.show({
|
||||
title: "Invalid OTP",
|
||||
message: "The OTP entered does not match",
|
||||
color: "red",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
setOtpValidated(true);
|
||||
setStep("final");
|
||||
notifications.show({
|
||||
title: "Invalid OTP",
|
||||
message: "The OTP entered does not match",
|
||||
color: "red",
|
||||
title: "OTP Verified",
|
||||
message: "OTP has been successfully verified.",
|
||||
color: "green",
|
||||
});
|
||||
return;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
const token = localStorage.getItem("access_token");
|
||||
const response = await fetch('api/auth/transaction_password', {
|
||||
method: 'POST',
|
||||
@@ -306,7 +367,7 @@ export default function SetTransactionPwd() {
|
||||
<Button
|
||||
variant="subtle"
|
||||
px={8}
|
||||
onClick={handleGenerateOtp}
|
||||
onClick={handleSendOtp}
|
||||
leftSection={<IconRefresh size={16} />}
|
||||
>
|
||||
Resend
|
||||
|
||||
Reference in New Issue
Block a user