From 671ea780b37c6d797397fe296405fd1d6cf23356 Mon Sep 17 00:00:00 2001 From: "tomosa.sarkar" Date: Mon, 25 Aug 2025 14:21:40 +0530 Subject: [PATCH] refactor: Update source code with the NPCI and CBS API --- .../add_beneficiary/addBeneficiaryOthers.tsx | 183 +++++++++++------- .../funds_transfer/add_beneficiary/page.tsx | 10 +- src/app/(main)/funds_transfer/page.tsx | 1 - .../funds_transfer/send_beneficiary/page.tsx | 108 ++++++----- .../sendBeneficiaryOthers.tsx | 69 +++++-- .../funds_transfer/view_beneficiary/page.tsx | 112 ++++++++++- src/app/(main)/home/page.tsx | 2 +- src/app/(main)/layout.tsx | 11 ++ src/app/image/bank_logo/BOI.jpg | Bin 0 -> 3542 bytes src/app/image/bank_logo/axis.jpg | Bin 0 -> 3635 bytes src/app/image/bank_logo/bank.jpg | Bin 0 -> 4568 bytes src/app/image/bank_logo/hdfc.jpg | Bin 0 -> 3840 bytes src/app/image/bank_logo/icici.jpg | Bin 0 -> 5477 bytes src/app/image/bank_logo/pnb.jpg | Bin 0 -> 2989 bytes src/app/image/bank_logo/sbi.jpg | Bin 0 -> 3705 bytes src/app/login/page.tsx | 69 ++++--- 16 files changed, 392 insertions(+), 173 deletions(-) create mode 100644 src/app/image/bank_logo/BOI.jpg create mode 100644 src/app/image/bank_logo/axis.jpg create mode 100644 src/app/image/bank_logo/bank.jpg create mode 100644 src/app/image/bank_logo/hdfc.jpg create mode 100644 src/app/image/bank_logo/icici.jpg create mode 100644 src/app/image/bank_logo/pnb.jpg create mode 100644 src/app/image/bank_logo/sbi.jpg diff --git a/src/app/(main)/funds_transfer/add_beneficiary/addBeneficiaryOthers.tsx b/src/app/(main)/funds_transfer/add_beneficiary/addBeneficiaryOthers.tsx index c349233..408f42a 100644 --- a/src/app/(main)/funds_transfer/add_beneficiary/addBeneficiaryOthers.tsx +++ b/src/app/(main)/funds_transfer/add_beneficiary/addBeneficiaryOthers.tsx @@ -1,34 +1,19 @@ "use client"; - import React, { useEffect, useState } from 'react'; -import { TextInput, Button, Grid, Text, PasswordInput } from '@mantine/core'; +import { TextInput, Button, Grid, Text, PasswordInput,Loader,Group, Select, Stack } from '@mantine/core'; import { notifications } from '@mantine/notifications'; import { useRouter } from "next/navigation"; -const MockOthersAccountValidation = - [ - { - 'stBenAccountNo': '50077736834', - 'stBenName': 'Ram Patnayak', - }, - { - 'stBenAccountNo': '50088836834', - 'stBenName': 'Sumit Ghosh', - }, - { - 'stBenAccountNo': '21112076570', - 'stBenName': 'Mr Sumit Ghosh', - }, - ] - export default function AddBeneficiaryOthers() { const router = useRouter(); const [authorized, setAuthorized] = useState(null); + const [loading, setLoading] = useState(false); const [bankName, setBankName] = useState(''); const [ifsccode, setIfsccode] = useState(''); const [branchName, setBranchName] = useState(''); const [accountNo, setAccountNo] = useState(''); const [confirmAccountNo, setConfirmAccountNo] = useState(''); + const [beneficiaryType, setBeneficiaryType] = useState(null); const [nickName, setNickName] = useState(''); const [beneficiaryName, setBeneficiaryName] = useState(null); const [otp, setOtp] = useState(''); @@ -38,7 +23,6 @@ export default function AddBeneficiaryOthers() { const [validationStatus, setValidationStatus] = useState<'success' | 'error' | null>(null); const [isVisibilityLocked, setIsVisibilityLocked] = useState(false); const [showPayeeAcc, setShowPayeeAcc] = useState(true); - const getFullMaskedAccount = (acc: string) => { return "X".repeat(acc.length); }; useEffect(() => { @@ -99,7 +83,7 @@ export default function AddBeneficiaryOthers() { }; const validateAndSendOtp = async () => { - if (!bankName || !ifsccode || !branchName || !accountNo || !confirmAccountNo) { + if (!bankName || !ifsccode || !branchName || !accountNo || !confirmAccountNo || !beneficiaryType) { notifications.show({ withBorder: true, color: "red", @@ -147,13 +131,9 @@ export default function AddBeneficiaryOthers() { } // Validation for now try { - // const matched = MockOthersAccountValidation.find( - // (entry) => entry.stBenAccountNo === accountNo - // ); - + setLoading(true); const token = localStorage.getItem("access_token"); - const response = await fetch( - `http://localhost:8080/api/beneficiary/validate/outside-bank?accountNo=${accountNo}&ifscCode=${ifsccode}&remitterName=""`, + const response = await fetch(`/api/beneficiary/validate/outside-bank?accountNo=${accountNo}&ifscCode=${ifsccode}&remitterName=""`, { method: "GET", headers: { @@ -163,7 +143,6 @@ export default function AddBeneficiaryOthers() { } ); const data = await response.json(); - if (response.ok && data?.name) { setBeneficiaryName(data.name); setValidationStatus("success"); @@ -189,9 +168,23 @@ export default function AddBeneficiaryOthers() { setBeneficiaryName("Something went wrong"); setValidationStatus("error"); } + finally { + setLoading(false); + } }; const verifyOtp = () => { + if (!otp) { + notifications.show({ + withBorder: true, + color: "Red", + title: "Null Field", + message: "Please Enter Valid OTP", + autoClose: 5000, + }); + return; + } + if (otp === generatedOtp) { setOtpVerified(true); notifications.show({ @@ -211,20 +204,70 @@ export default function AddBeneficiaryOthers() { }); } }; - const AddBen = () => { - notifications.show({ - withBorder: true, - color: "green", - title: "Beneficiary Added", - message: "Beneficiary added successfully.", - autoClose: 5000, - }); + const AddBen = async () => { + try { + const token = localStorage.getItem("access_token"); + const response = await fetch(`/api/beneficiary`, { + method: "POST", + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${token}`, + }, + body: JSON.stringify({ + accountNo: accountNo, + ifscCode: ifsccode, + accountType: beneficiaryType, + name: beneficiaryName + + }), + } + ); + const data = await response.json(); + if (response.ok) { + notifications.show({ + withBorder: true, + color: "green", + title: "Added", + message: "Beneficiary Added successfully", + autoClose: 5000, + }); + return; + } + else{ + notifications.show({ + withBorder: true, + color: "Red", + title: "Error", + message: data?.error, + autoClose: 5000, + }); + return; + } + } + catch { + notifications.show({ + title: "Error", + message: "Something went wrong", + color: "red", + }); + } + finally{ + setBankName(''); + setBranchName(''); + setIfsccode(''); + setAccountNo(''); + setConfirmAccountNo(''); + setBeneficiaryName(''); + setNickName(''); + setBeneficiaryType(null); + setIsVisibilityLocked(false); + setOtpSent(false); + } }; if (!authorized) return null; return ( - - + - { let val = e.currentTarget.value.replace(/[^A-Za-z ]/g, ""); setBankName(val.slice(0, 100)); }} - required + withAsterisk /> - - setShowPayeeAcc(true)} readOnly={isVisibilityLocked} maxLength={17} - // disabled={isVisibilityLocked} - required + withAsterisk /> - e.preventDefault()} - onPaste={(e) => e.preventDefault()} - onCut={(e) => e.preventDefault()} + withAsterisk + // onCopy={(e) => e.preventDefault()} + // onPaste={(e) => e.preventDefault()} + // onCut={(e) => e.preventDefault()} /> {validationStatus === "error" && ( @@ -311,16 +347,17 @@ export default function AddBeneficiaryOthers() { )} - - setNickName(e.currentTarget.value)} + { )} - ) : ( + ) : ( */} - )} + {/* )} */} ); }; diff --git a/src/app/(main)/funds_transfer/page.tsx b/src/app/(main)/funds_transfer/page.tsx index 2244c02..8305ecb 100644 --- a/src/app/(main)/funds_transfer/page.tsx +++ b/src/app/(main)/funds_transfer/page.tsx @@ -473,7 +473,6 @@ export default function QuickPay() { /> )} -