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

Merge branch 'dev' of https://7o9o-lb-526275444.ap-south-1.elb.amazonaws.com/tomosa.sarkar/IB into changes

Browse Source
This commit is contained in:
Tomosa Sarkar
2025-10-13 12:00:05 +05:30
parent b5cc4ac714 83ae6b055c
commit f394300498
8 changed files with 490 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -9,6 +9,7 @@ import OutsideQuickPay from "./outside_quick_pay";
import { IconRefresh } from "@tabler/icons-react";
import Image from "next/image";
import img from '@/app/image/logo1.jpg'
import { sendOtp, verifyOtp } from "@/app/_util/otp";
interface accountData {
stAccountNo: string;
@@ -42,15 +43,53 @@ export default function QuickPay() {
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 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');
if (!mobileNumber) {
notifications.show({
title: 'Error',
message: 'Mobile number not found.Contact to administrator',
color: 'red',
});
return;
}
try {
await sendOtp({ type: 'BENEFICIARY_DELETE' });
setShowOtpField(true);
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;
}
}
const selectedAccount = accountData.find((acc) => acc.stAccountNo === selectedAccNo);
const getFullMaskedAccount = (acc: string) => { return "X".repeat(acc.length); };
@@ -335,7 +374,7 @@ export default function QuickPay() {
color="blue"
onClick={async () => {
setConfirmModel(false);
const otp = await handleGenerateOtp();
const otp = await handleSendOtp();
setShowOtpField(true);
notifications.show({
title: "OTP Sent",
@@ -484,7 +523,7 @@ export default function QuickPay() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}

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

@@ -1,12 +1,14 @@
"use client";
import React, { useEffect, useState } from "react";
import { Center, Group, Loader, Paper, ScrollArea, Table, Text, Title, TextInput, Button, } from "@mantine/core";
import { Center, Group, Loader, Paper, ScrollArea, Table, Text, Title, TextInput, Button, Modal } from "@mantine/core";
import { notifications } from "@mantine/notifications";
import { useRouter } from "next/navigation";
import Image from "next/image";
import { getBankLogo } from "@/app/_util/getBankLogo";
import { IconTrash } from "@tabler/icons-react";
import { IconRefresh, IconTrash } from "@tabler/icons-react";
import { sendOtp, verifyOtp } from "@/app/_util/otp";
interface Beneficiary {
accountNo: string;
@@ -23,6 +25,118 @@ export default function ViewBeneficiary() {
const [beneficiaries, setBeneficiaries] = useState<Beneficiary[]>([]);
const [loading, setLoading] = useState(true);
const [opened, setOpened] = useState(false);
const [otpStep, setOtpStep] = useState(false);
const [otp, setOtp] = useState("");
const [selectedAccount, setSelectedAccount] = useState<string | null>(null);
const [countdown, setCountdown] = useState(180);
const [timerActive, setTimerActive] = 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: 'IMPS' }); // type will be "BENEFICIARY_DELETE"
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;
}
}
const openDeleteModal = (accountNo: string) => {
setSelectedAccount(accountNo);
setOpened(true);
setOtpStep(false); // Reset modal to confirmation step
setOtp("");
};
const handleModalConfirm = async () => {
if (!selectedAccount) return;
try {
await handleSendOtp(); // send OTP to user's mobile
setOtpStep(true); // move modal to OTP input step
} catch (err) {
notifications.show({
title: "Error",
message: "Failed to send OTP. Please try again.",
color: "red",
});
}
};
// Step 3: Handle OTP verification & delete
const handleVerifyOtpAndDelete = async () => {
if (!otp || !selectedAccount) return;
try {
const isOtpValid = await handleVerifyOtp(); // verify OTP
if (!isOtpValid) {
notifications.show({
title: "Invalid OTP",
message: "Please enter the correct OTP.",
color: "red",
});
return;
}
// OTP is valid → delete beneficiary
const token = localStorage.getItem("access_token");
const res = await fetch(`/api/beneficiary/${selectedAccount}`, {
method: "DELETE",
headers: { Authorization: `Bearer ${token}` },
});
if (res.ok) {
setBeneficiaries((prev) => prev.filter((b) => b.accountNo !== selectedAccount));
notifications.show({
title: "Deleted",
message: "Beneficiary deleted successfully.",
color: "green",
});
setOpened(false);
setOtpStep(false);
setOtp("");
} else {
notifications.show({
title: "Error",
message: "Failed to delete beneficiary.",
color: "red",
});
}
} catch (err) {
notifications.show({
title: "Error",
message: "Something went wrong.",
color: "red",
});
}
};
useEffect(() => {
const token = localStorage.getItem("access_token");
if (!token) {
@@ -59,6 +173,23 @@ export default function ViewBeneficiary() {
fetchBeneficiaries();
}, []);
//new use effect
useEffect(() => {
let interval: NodeJS.Timeout | null = null;
if (timerActive && countdown > 0) {
interval = setInterval(() => {
setCountdown((prev) => prev - 1);
}, 1000);
} else if (countdown === 0) {
setTimerActive(false);
}
return () => {
if (interval) clearInterval(interval);
};
}, [timerActive, countdown]);
if (loading) {
return (
<Center h="60vh">
@@ -69,60 +200,6 @@ export default function ViewBeneficiary() {
if (!authorized) return null;
//add delete beneficiary
async function handleDeleteBeneficiary(accountNo: string) {
const isConfirmed = window.confirm("Are you sure you want to delete this beneficiary?");
if (!isConfirmed) return;
try {
const token = localStorage.getItem("access_token");
// Step 1: generate OTP
await fetch("/api/otp/generate", {
method: "POST",
headers: { Authorization: `Bearer ${token}` },
});
const otp = prompt("An OTP has been sent to your registered number. Please enter it:");
if (!otp) return; // cancelled
// Step 2: verify OTP
const verify = await fetch("/api/otp/verify", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify({ otp }),
});
if (!verify.ok) {
alert("Invalid OTP!");
return;
}
// Step 3: delete beneficiary
const res = await fetch(`/api/beneficiary/${accountNo}`, {
method: "DELETE",
headers: { Authorization: `Bearer ${token}` },
});
if (res.ok) {
setBeneficiaries((prev) => prev.filter((b) => b.accountNo !== accountNo));
alert("Beneficiary deleted successfully.");
} else {
alert("Error deleting beneficiary.");
}
} catch (err) {
alert("Something went wrong. Please try again.");
}
}
//add delete beneficiary
return (
@@ -131,52 +208,115 @@ export default function ViewBeneficiary() {
{beneficiaries.length === 0 ? (
<Text>No beneficiaries found.</Text>
) : (
<ScrollArea h={300} type="always">
<Table highlightOnHover withTableBorder stickyHeader style={{ borderCollapse: "collapse", width: "100%" }}>
<Table.Thead>
<Table.Tr style={{ backgroundColor: "#3385ff" }}>
<Table.Th>Bank</Table.Th>
<Table.Th style={{ textAlign: "right" }}>Account No</Table.Th>
<Table.Th>Name</Table.Th>
<Table.Th>Type</Table.Th>
<Table.Th style={{ textAlign: "center" }}>IFSC</Table.Th>
<Table.Th style={{ textAlign: "center" }}>Action Icon</Table.Th>
</Table.Tr>
</Table.Thead>
<Table.Tbody>
{beneficiaries.map((b, i) => (
<Table.Tr key={i}>
<Table.Td>
<Group gap='sm'>
<Image
// src={getBankLogo(b.bankName) ??logo}
src={getBankLogo(b.bankName)}
alt={b.bankName}
width={20}
height={15}
/>
{b.bankName}
</Group>
</Table.Td>
<Table.Td style={{ textAlign: "right" }}>{b.accountNo}</Table.Td>
<Table.Td>{b.name}</Table.Td>
<Table.Td>{b.accountType}</Table.Td>
<Table.Td style={{ textAlign: "center" }}>{b.ifscCode}</Table.Td>
{/* <Table.Td style={{ textAlign: "center" }}><IconTrash color="red" /></Table.Td> */}
<Table.Td style={{ textAlign: "center" }}>
<IconTrash
color="red"
style={{ cursor: "pointer" }}
onClick={() => handleDeleteBeneficiary(b.accountNo)}
/>
</Table.Td>
<>
<ScrollArea h={300} type="always">
<Table highlightOnHover withTableBorder stickyHeader style={{ borderCollapse: "collapse", width: "100%" }}>
<Table.Thead>
<Table.Tr style={{ backgroundColor: "#3385ff" }}>
<Table.Th>Bank</Table.Th>
<Table.Th style={{ textAlign: "right" }}>Account No</Table.Th>
<Table.Th>Name</Table.Th>
<Table.Th>Type</Table.Th>
<Table.Th style={{ textAlign: "center" }}>IFSC</Table.Th>
<Table.Th style={{ textAlign: "center" }}>Action Icon</Table.Th>
</Table.Tr>
))}
</Table.Tbody>
</Table>
</ScrollArea>
</Table.Thead>
<Table.Tbody>
{beneficiaries.map((b, i) => (
<Table.Tr key={i}>
<Table.Td>
<Group gap='sm'>
<Image
// src={getBankLogo(b.bankName) ??logo}
src={getBankLogo(b.bankName)}
alt={b.bankName}
width={20}
height={15}
/>
{b.bankName}
</Group>
</Table.Td>
<Table.Td style={{ textAlign: "right" }}>{b.accountNo}</Table.Td>
<Table.Td>{b.name}</Table.Td>
<Table.Td>{b.accountType}</Table.Td>
<Table.Td style={{ textAlign: "center" }}>{b.ifscCode}</Table.Td>
{/* <Table.Td style={{ textAlign: "center" }}><IconTrash color="red" /></Table.Td> */}
<Table.Td style={{ textAlign: "center" }}>
<IconTrash
color="red"
style={{ cursor: "pointer" }}
onClick={() => openDeleteModal(b.accountNo)}
/>
</Table.Td>
</Table.Tr>
))}
</Table.Tbody>
</Table>
</ScrollArea>
<Modal
opened={opened}
onClose={() => {
setOpened(false);
setOtpStep(false);
setOtp("");
}}
title="Delete Beneficiary"
centered
>
{!otpStep ? (
<>
<Text mb="md">
Are you sure you want to delete this beneficiary?
</Text>
<Group p="right">
<Button variant="default" onClick={() => setOpened(false)}>
Cancel
</Button>
<Button color="red" onClick={handleModalConfirm}>
Confirm
</Button>
</Group>
</>
) : (
<>
<Text mb="sm">Enter OTP sent to your registered number:</Text>
<TextInput
value={otp}
onChange={(e) => setOtp(e.currentTarget.value)}
placeholder="Enter OTP"
/>
<Group justify="space-between" mt="xs">
{/* Resend OTP Timer or Icon */}
{timerActive ? (
<Text size="xs" c="dimmed" style={{ minWidth: "180px" }}>
Resend OTP will be enabled in{" "}
{String(Math.floor(countdown / 60)).padStart(2, "0")}:
{String(countdown % 60).padStart(2, "0")}
</Text>
) : (
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleSendOtp}
/>
)}
</Group>
<Group p="right" mt="md">
<Button variant="default" onClick={() => setOpened(false)}>
Cancel
</Button>
<Button color="green" onClick={handleVerifyOtpAndDelete}>
Verify & Delete
</Button>
</Group>
</>
)}
</Modal>
</>
)}
</Paper >
);

58
src/app/(main)/settings/change_login_password/page.tsx
View File

@@ -6,6 +6,7 @@ import { notifications } from "@mantine/notifications";
import { IconLock, IconRefresh } from "@tabler/icons-react";
import { generateCaptcha } from "@/app/captcha";
import { useRouter } from "next/navigation";
import { sendOtp, verifyOtp } from "@/app/_util/otp";
export default function ChangePassword() {
const router = useRouter();
@@ -22,14 +23,53 @@ export default function ChangePassword() {
const [step, setStep] = useState<"form" | "otp" | "final">("form");
const [passwordHistory] = useState(["Pass@1234", "OldPass@123", "MyPass#2023"]);
const icon = <IconLock size={18} stroke={1.5} />;
const [showOtpField, setShowOtpField] = useState(false);
// const handleGenerateOtp = async () => {
// const value = "123456"; // Or generate a random OTP
// setGeneratedOtp(value);
// 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: 'CHANGE_LPWORD' });
setShowOtpField(true);
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;
}
}
const handleGenerateOtp = async () => {
const value = "123456"; // Or generate a random OTP
setGeneratedOtp(value);
setCountdown(180);
setTimerActive(true);
return value;
};
useEffect(() => {
regenerateCaptcha();
@@ -100,7 +140,7 @@ export default function ChangePassword() {
}
// Passed → move to OTP
await handleGenerateOtp();
await handleSendOtp();
setStep("otp");
notifications.show({
title: "OTP Sent",
@@ -310,7 +350,7 @@ export default function ChangePassword() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}

57
src/app/(main)/settings/change_txn_password/page.tsx
View File

@@ -6,6 +6,7 @@ import { notifications } from "@mantine/notifications";
import { IconLock, IconRefresh } from "@tabler/icons-react";
import { generateCaptcha } from "@/app/captcha";
import { useRouter } from "next/navigation";
import { sendOtp, verifyOtp } from "@/app/_util/otp";
export default function ChangePassword() {
const router = useRouter();
@@ -21,14 +22,52 @@ export default function ChangePassword() {
const [otpValidated, setOtpValidated] = useState(false);
const [step, setStep] = useState<"form" | "otp" | "final">("form");
const icon = <IconLock size={18} stroke={1.5} />;
const [showOtpField, setShowOtpField] = useState(false);
// const handleGenerateOtp = async () => {
// const value = "123456"; // Or generate a random OTP
// setGeneratedOtp(value);
// 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: 'CHANGE_TPWORD' });
setShowOtpField(true);
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;
}
}
const handleGenerateOtp = async () => {
const value = "123456"; // Or generate a random OTP
setGeneratedOtp(value);
setCountdown(180);
setTimerActive(true);
return value;
};
useEffect(() => {
regenerateCaptcha();
@@ -100,7 +139,7 @@ export default function ChangePassword() {
}
// Passed → move to OTP
await handleGenerateOtp();
await handleSendOtp();
setStep("otp");
notifications.show({
title: "OTP Sent",
@@ -309,7 +348,7 @@ export default function ChangePassword() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}

55
src/app/(main)/settings/set_txn_password/page.tsx
View File

@@ -14,6 +14,7 @@ import { notifications } from "@mantine/notifications";
import { IconLock, IconRefresh } from "@tabler/icons-react";
import { generateCaptcha } from "@/app/captcha";
import { useRouter } from "next/navigation";
import { sendOtp, verifyOtp } from "@/app/_util/otp";
export default function ChangePassword() {
const [newPassword, setNewPassword] = useState("");
@@ -29,14 +30,50 @@ export default function ChangePassword() {
const router = useRouter();
const icon = <IconLock size={18} stroke={1.5} />;
const [showOtpField, setShowOtpField] = useState(false);
const handleGenerateOtp = async () => {
const value = "123456"; // Or generate a random OTP
setGeneratedOtp(value);
setCountdown(180);
setTimerActive(true);
return value;
};
// const handleGenerateOtp = async () => {
// const value = "123456"; // Or generate a random OTP
// setGeneratedOtp(value);
// 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: 'SET_TPWORD' });
setShowOtpField(true);
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;
}
}
const regenerateCaptcha = async () => {
const newCaptcha = await generateCaptcha();
@@ -111,7 +148,7 @@ export default function ChangePassword() {
return;
}
// Passed → move to OTP step
await handleGenerateOtp();
await handleSendOtp();
setStep("otp");
notifications.show({
title: "OTP Sent",
@@ -310,7 +347,7 @@ export default function ChangePassword() {
<IconRefresh
size={22}
style={{ cursor: "pointer", color: "blue", marginBottom: "6px" }}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
/>
)
)}

66
src/app/SetPassword/page.tsx
View File

@@ -10,6 +10,8 @@ import changePwdImage from '@/app/image/set_log_pass.jpg';
import { IconLock, IconLogout, IconRefresh } from '@tabler/icons-react';
import { generateCaptcha } from '@/app/captcha';
import { generateOTP } from "../OTPGenerator";
import { sendOtp, verifyOtp } from "../_util/otp";
//const [showOtpField, setShowOtpField] = useState(false);
export default function SetLoginPwd() {
const router = useRouter();
@@ -24,15 +26,57 @@ export default function SetLoginPwd() {
const [timerActive, setTimerActive] = useState(false);
const icon = <IconLock size={18} stroke={1.5} />;
const [generateOtp, setGenerateOtp] = useState("");
const [showOtpField, setShowOtpField] = useState(false);
async function handleGenerateOtp() {
// const value = await generateOTP(6);
const value = "123456";
setGenerateOtp(value);
setCountdown(60);
setTimerActive(true);
// return value;
// async function handleGenerateOtp() {
// // const value = await generateOTP(6);
// const value = "123456";
// setGenerateOtp(value);
// setCountdown(60);
// 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: 'CHANGE_LPWORD' });
setShowOtpField(true);
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 handleLogout(e: React.FormEvent) {
e.preventDefault();
localStorage.removeItem("access_token");
@@ -104,7 +148,7 @@ export default function SetLoginPwd() {
}
if (!captchaValidate) {
setCaptchaValidate(true);
handleGenerateOtp();
handleSendOtp();
return;
}
if (!otp) {
@@ -157,10 +201,10 @@ export default function SetLoginPwd() {
router.push("/login");
}
}
useEffect(() => {
useEffect(() => {
regenerateCaptcha();
}, []);
useEffect(() => {
let interval: number | undefined;
if (timerActive && countdown > 0) {
@@ -296,7 +340,7 @@ export default function SetLoginPwd() {
<Button
variant="subtle"
px={8}
onClick={handleGenerateOtp}
onClick={handleSendOtp}
leftSection={<IconRefresh size={16} />}
>
Resend

4
src/app/_util/otp.ts
View File

@@ -15,9 +15,9 @@ interface SendOtpPayload {
username?:string
}
function getStoredMobileNumber(): string | null {
function getStoredMobileNumber(): string | null {
// const mobileNumber = localStorage.getItem('remitter_mobile_no');
const mobileNumber= "7890544527";
const mobileNumber = "6297421727";
if (!mobileNumber) {
notifications.show({
title: 'Missing Mobile Number',

1
src/app/login/page.tsx
View File

@@ -13,6 +13,7 @@ import dynamic from 'next/dynamic';
import { generateCaptcha } from '@/app/captcha';
import { IconRefresh, IconShieldLockFilled } from "@tabler/icons-react";
import dayjs from "dayjs";
import { IconTrash } from "@tabler/icons-react";
export default function Login() {