tomosa.sarkar/IB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat :VerifyOtp and SendOtp creation for "seetings", "send monet", "password expiry" and "set login and tpassword"

Browse Source
This commit is contained in:
nabanita.jana
2025-10-14 12:11:30 +05:30
parent 242e8d544b
commit f2235818e5
12 changed files with 224 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
src/app/(main)/funds_transfer/add_beneficiary/addBeneficiaryOthers.tsx
View File

@@ -4,6 +4,7 @@ import { TextInput, Button, Grid, Text, PasswordInput, Loader, Group, Select, St
import { notifications } from '@mantine/notifications';
import { useRouter } from "next/navigation";
import { IconRefresh } from '@tabler/icons-react';
import { sendOtp, verifyOtp } from '@/app/_util/otp';
export default function AddBeneficiaryOthers() {
const router = useRouter();
@@ -18,7 +19,6 @@ export default function AddBeneficiaryOthers() {
const [nickName, setNickName] = useState('');
const [beneficiaryName, setBeneficiaryName] = useState<string | null>(null);
const [otp, setOtp] = useState('');
const [generatedOtp, setGeneratedOtp] = useState('');
const [otpSent, setOtpSent] = useState(false);
const [otpVerified, setOtpVerified] = useState(false);
const [countdown, setCountdown] = useState(180);
@@ -27,19 +27,39 @@ export default function AddBeneficiaryOthers() {
const [isVisibilityLocked, setIsVisibilityLocked] = useState(false);
const [showPayeeAcc, setShowPayeeAcc] = useState(true);
const getFullMaskedAccount = (acc: string) => { return "X".repeat(acc.length); };
const [generateOtp, setGenerateOtp] = useState("");
const handleGenerateOtp = async () => {
const value = "123456"; // Or call your API to generate OTP
setGeneratedOtp(value);
// start countdown at 180 seconds (3 minutes)
setCountdown(180);
setTimerActive(true);
return value;
};
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: 'BENEFICIARY_ADD', beneficiary: beneficiaryName || undefined, ifsc: ifsccode });
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;
}
}
// Countdown effect
useEffect(() => {
@@ -113,29 +133,6 @@ export default function AddBeneficiaryOthers() {
}
}, [ifsccode]);
// useEffect(() => {
// let interval: number | undefined;
// if (timerActive && countdown > 0) {
// interval = window.setInterval(() => {
// setCountdown((prev) => prev - 1);
// }, 1000);
// }
// if (countdown === 0) {
// if (interval) clearInterval(interval);
// setTimerActive(false);
// }
// return () => {
// if (interval) clearInterval(interval);
// };
// }, [timerActive, countdown]);
// const handleGenerateOtp = async () => {
// const value = "123456"; // Or generate a random OTP
// setGeneratedOtp(value);
// return value;
// };
const validateAndSendOtp = async () => {
if (!bankName || !ifsccode || !branchName || !accountNo || !confirmAccountNo || !beneficiaryType) {
notifications.show({
@@ -202,8 +199,7 @@ export default function AddBeneficiaryOthers() {
setValidationStatus("success");
setIsVisibilityLocked(true);
setOtpSent(true);
await handleGenerateOtp();
const otp = await handleSendOtp();
notifications.show({
withBorder: true,
color: "green",
@@ -227,7 +223,7 @@ export default function AddBeneficiaryOthers() {
}
};
const verifyOtp = () => {
const verify_otp = async () => {
if (!otp) {
notifications.show({
withBorder: true,
@@ -239,24 +235,21 @@ export default function AddBeneficiaryOthers() {
return;
}
if (otp === generatedOtp) {
setOtpVerified(true);
const verified = await handleVerifyOtp();
if (!verified) {
notifications.show({
withBorder: true,
color: "green",
title: "OTP Verified",
message: "OTP validated successfully.",
autoClose: 5000,
});
} else {
notifications.show({
withBorder: true,
title: "Invalid OTP",
message: "The OTP entered does not match",
color: "red",
title: "OTP Error",
message: "OTP does not match.",
autoClose: 5000,
});
return;
}
setOtpVerified(true);
notifications.show({
title: "OTP Verified",
message: "OTP successfully verified.",
color: "green",
});
};
const AddBen = async () => {
try {
@@ -468,14 +461,14 @@ export default function AddBeneficiaryOthers() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}
</Grid.Col >
<Grid.Col >
{!otpVerified ? (
<Button onClick={verifyOtp}>Validate OTP</Button>
<Button onClick={verify_otp}>Validate OTP</Button>
) : (
<Button color="blue" size="sm" onClick={AddBen}>
Add

27
src/app/(main)/funds_transfer/page.tsx
View File

@@ -41,16 +41,6 @@ export default function QuickPay() {
const [countdown, setCountdown] = useState(180);
const [timerActive, setTimerActive] = useState(false);
const [otp, setOtp] = useState("");
const [generateOtp, setGenerateOtp] = useState("");
// async function handleGenerateOtp() {
// // const value = await generateOTP(6);
// const value = "123456";
// setGenerateOtp(value);
// setCountdown(180);
// setTimerActive(true);
// return value;
// }
async function handleSendOtp() {
const mobileNumber = localStorage.getItem('remitter_mobile_no');
@@ -63,7 +53,7 @@ export default function QuickPay() {
return;
}
try {
await sendOtp({ type: 'BENEFICIARY_DELETE' });
await sendOtp({ type: 'IMPS' });
setShowOtpField(true);
setCountdown(180);
setTimerActive(true);
@@ -86,10 +76,6 @@ export default function QuickPay() {
}
}
const selectedAccount = accountData.find((acc) => acc.stAccountNo === selectedAccNo);
const getFullMaskedAccount = (acc: string) => { return "X".repeat(acc.length); };
@@ -251,7 +237,16 @@ export default function QuickPay() {
});
return;
}
if (otp !== generateOtp) {
// if (otp !== generateOtp) {
// notifications.show({
// title: "Invalid OTP",
// message: "The OTP entered does not match",
// color: "red",
// });
// return;
// }
const verified = await handleVerifyOtp();
if (!verified) {
notifications.show({
title: "Invalid OTP",
message: "The OTP entered does not match",

11
src/app/(main)/funds_transfer/view_beneficiary/page.tsx
View File

@@ -24,7 +24,6 @@ export default function ViewBeneficiary() {
const [authorized, setAuthorized] = useState<boolean | null>(null);
const [beneficiaries, setBeneficiaries] = useState<Beneficiary[]>([]);
const [loading, setLoading] = useState(true);
const [opened, setOpened] = useState(false);
const [otpStep, setOtpStep] = useState(false);
const [otp, setOtp] = useState("");
@@ -32,6 +31,14 @@ export default function ViewBeneficiary() {
const [countdown, setCountdown] = useState(180);
const [timerActive, setTimerActive] = useState(false);
const maskAccount = (account: string) => {
if (!account) return undefined;
const length = account.length;
if (length <= 4) return account;
const masked = "X".repeat(length - 4) + account.slice(length - 4);
return masked;
};
async function handleSendOtp() {
const mobileNumber = localStorage.getItem('remitter_mobile_no');
if (!mobileNumber) {
@@ -43,7 +50,7 @@ export default function ViewBeneficiary() {
return;
}
try {
await sendOtp({ type: 'IMPS' }); // type will be "BENEFICIARY_DELETE"
await sendOtp({ type: 'BENEFICIARY_DELETE', beneficiary: selectedAccount ? maskAccount(selectedAccount) : undefined });
setCountdown(180);
setTimerActive(true);
} catch (err: any) {