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

feat : api integrated change login password and change transaction password

Browse Source
This commit is contained in:
Tomosa Sarkar
2025-09-02 16:33:08 +05:30
parent 26efdb82f2
commit 2d2d3f3e0d
9 changed files with 3325 additions and 1657 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -2,6 +2,7 @@
# dependencies
/node_modules
/package-lock.json
/.pnp
.pnp.js
.yarn/install-state.gz

4686
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

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

@@ -1,24 +1,31 @@
"use client";
import React, { useEffect, useState } from "react";
import { TextInput, PasswordInput, Button, Title, Paper, Group, Box } from "@mantine/core";
import { TextInput, PasswordInput, Button, Title, Paper, Group, Box, Text } from "@mantine/core";
import { notifications } from "@mantine/notifications";
import { IconLock } from "@tabler/icons-react";
import { generateCaptcha } from "@/app/captcha";
import { useRouter } from "next/navigation";
export default function ChangePassword() {
const router = useRouter();
const [oldPassword, setOldPassword] = useState("");
const [newPassword, setNewPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState("");
const [captcha, setCaptcha] = useState("");
const [captchaInput, setCaptchaInput] = useState("");
const [otp, setOtp] = useState("");
const [generatedOtp, setGeneratedOtp] = useState('');
const [otpValidated, setOtpValidated] = useState(false);
const [step, setStep] = useState<"form" | "otp" | "final">("form"); // ✅ steps control
const [passwordHistory] = useState(["Pass@1234", "OldPass@123", "MyPass#2023"]);
const [step, setStep] = useState<"form" | "otp" | "final">("form");
const icon = <IconLock size={18} stroke={1.5} />;
const handleGenerateOtp = async () => {
const value = "123456"; // Or generate a random OTP
setGeneratedOtp(value);
return value;
};
useEffect(() => {
regenerateCaptcha();
}, []);
@@ -33,7 +40,7 @@ export default function ChangePassword() {
return /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*])[A-Za-z\d!@#$%^&*]{8,}$/.test(password);
};
const handleSubmit = () => {
const handleSubmit = async () => {
// Step 1 → validate form
if (step === "form") {
if (!oldPassword || !newPassword || !confirmPassword || !captchaInput) {
@@ -44,36 +51,14 @@ export default function ChangePassword() {
});
return;
}
const actualOldPassword = "Pass@123";
if (oldPassword !== actualOldPassword) {
notifications.show({
title: "Old Password Incorrect",
message: "Entered old password does not match.",
color: "red",
});
return;
}
if (!validatePasswordPolicy(newPassword)) {
notifications.show({
title: "Invalid Password",
message:
"Password must be at least 8 characters and contain alphanumeric and special characters.",
message: "Password must contain at least one capital letter(A-Z), one digit(0-9), one special symbol(e.g.,@,#,$), and be 8-15 characters long.",
color: "red",
});
return;
}
if (passwordHistory.includes(newPassword)) {
notifications.show({
title: "Password Reused",
message: "New password must be different from the last 3 passwords.",
color: "red",
});
return;
}
if (newPassword !== confirmPassword) {
notifications.show({
title: "Password Mismatch",
@@ -82,7 +67,6 @@ export default function ChangePassword() {
});
return;
}
if (captchaInput !== captcha) {
notifications.show({
title: "Invalid Captcha",
@@ -93,7 +77,8 @@ export default function ChangePassword() {
return;
}
// ✅ Passed → move to OTP
// Passed → move to OTP
await handleGenerateOtp();
setStep("otp");
notifications.show({
title: "OTP Sent",
@@ -105,7 +90,7 @@ export default function ChangePassword() {
// Step 2 → validate OTP
if (step === "otp") {
if (otp !== "123456") {
if (otp !== generatedOtp) {
notifications.show({
title: "Invalid OTP",
message: "Please enter the correct OTP.",
@@ -126,12 +111,55 @@ export default function ChangePassword() {
// Step 3 → Final Change Password
if (step === "final") {
notifications.show({
title: "Password Changed",
message: "Your password has been successfully updated.",
color: "green",
});
resetForm();
const token = localStorage.getItem("access_token");
if (!token) {
router.push("/login");
return;
}
try {
const response = await fetch("/api/auth/change/login_password", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify({
OldLPsw: oldPassword,
newLPsw: newPassword,
confirmLPsw: confirmPassword
}),
});
if (response.status === 401) {
localStorage.removeItem("access_token");
router.push("/login");
return;
}
const result = await response.json();
console.log(result);
if (!response.ok) {
notifications.show({
title: "Failed",
message: result.error || "Failed to set login password",
color: "Red",
autoClose: false,
});
}
if (response.ok) {
notifications.show({
title: "Success",
message: "Login password Change successfully.",
color: "green",
});
}
resetForm();
} catch (err: any) {
notifications.show({
title: "Error",
message: err.message || "Server error, please try again later",
color: "red",
});
}
}
};
@@ -148,28 +176,29 @@ export default function ChangePassword() {
return (
<Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Title order={3} style={{color:"red"}}>More Updates comming soon .....</Title>
<Title order={3} mb="sm">
Change Login Password
</Title>
{/* Scrollable form area */}
<div style={{ overflowY: "auto", maxHeight: "280px", paddingRight: 8 }}>
<PasswordInput
label="Old Password"
placeholder="Enter old password"
value={oldPassword}
onChange={(e) => setOldPassword(e.currentTarget.value)}
withAsterisk
mb="xs"
readOnly={step !== "form"}
/>
<div style={{ overflowY: "auto", maxHeight: "280px" }}>
<Group grow>
<PasswordInput
label="Old Password"
placeholder="Enter old password"
value={oldPassword}
onChange={(e) => setOldPassword(e.currentTarget.value)}
withAsterisk
mb="xs"
readOnly={step !== "form"}
/>
<PasswordInput
label="New Password"
placeholder="Enter new password"
value={newPassword}
onChange={(e) => setNewPassword(e.currentTarget.value)}
withAsterisk
minLength={8}
maxLength={15}
mb="xs"
readOnly={step !== "form"}
/>
@@ -187,11 +216,8 @@ export default function ChangePassword() {
onPaste={(e) => e.preventDefault()}
onCut={(e) => e.preventDefault()}
/>
</Group>
{/* CAPTCHA */}
<div style={{ marginTop: 5 }}>
<label style={{ display: "block", marginBottom: 4, fontSize: "14px" }}>
@@ -246,20 +272,20 @@ export default function ChangePassword() {
readOnly={otpValidated}
/>
)}
<Group mt="md" gap="sm">
<Button onClick={handleSubmit}>
{step === "form" && "Submit"}
{step === "otp" && "Validate OTP"}
{step === "final" && "Change Password"}
</Button>
<Button variant="outline" color="gray" onClick={resetForm}>
Reset
</Button>
</Group>
</div>
{/* Buttons */}
<Group mt="md" gap="sm">
<Button onClick={handleSubmit}>
{step === "form" && "Submit"}
{step === "otp" && "Validate OTP"}
{step === "final" && "Change Password"}
</Button>
<Button variant="outline" color="gray" onClick={resetForm}>
Reset
</Button>
</Group>
<Text size="sm" c="dimmed" style={{ marginTop: "40px" }}>
Note: Your new password must be 8–15 characters long and contain at least one number and one special character.
</Text>
</Paper>
);
}

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

@@ -5,20 +5,27 @@ import { TextInput, PasswordInput, Button, Title, Paper, Group, Box } from "@man
import { notifications } from "@mantine/notifications";
import { IconLock } from "@tabler/icons-react";
import { generateCaptcha } from "@/app/captcha";
import { useRouter } from "next/navigation";
export default function ChangePassword() {
const router = useRouter();
const [oldPassword, setOldPassword] = useState("");
const [newPassword, setNewPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState("");
const [captcha, setCaptcha] = useState("");
const [captchaInput, setCaptchaInput] = useState("");
const [otp, setOtp] = useState("");
const [generatedOtp, setGeneratedOtp] = useState('');
const [otpValidated, setOtpValidated] = useState(false);
const [step, setStep] = useState<"form" | "otp" | "final">("form"); // ✅ steps control
const [passwordHistory] = useState(["Pass@1234", "OldPass@123", "MyPass#2023"]);
const [step, setStep] = useState<"form" | "otp" | "final">("form");
const icon = <IconLock size={18} stroke={1.5} />;
const handleGenerateOtp = async () => {
const value = "123456"; // Or generate a random OTP
setGeneratedOtp(value);
return value;
};
useEffect(() => {
regenerateCaptcha();
}, []);
@@ -33,7 +40,7 @@ export default function ChangePassword() {
return /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*])[A-Za-z\d!@#$%^&*]{8,}$/.test(password);
};
const handleSubmit = () => {
const handleSubmit = async () => {
// Step 1 → validate form
if (step === "form") {
if (!oldPassword || !newPassword || !confirmPassword || !captchaInput) {
@@ -44,36 +51,15 @@ export default function ChangePassword() {
});
return;
}
const actualOldPassword = "Pass@123";
if (oldPassword !== actualOldPassword) {
notifications.show({
title: "Old Password Incorrect",
message: "Entered old password does not match.",
color: "red",
});
return;
}
if (!validatePasswordPolicy(newPassword)) {
notifications.show({
title: "Invalid Password",
message:
"Password must be at least 8 characters and contain alphanumeric and special characters.",
"Your new password must be 8–15 characters long and contain at least one number and one special character.",
color: "red",
});
return;
}
if (passwordHistory.includes(newPassword)) {
notifications.show({
title: "Password Reused",
message: "New password must be different from the last 3 passwords.",
color: "red",
});
return;
}
if (newPassword !== confirmPassword) {
notifications.show({
title: "Password Mismatch",
@@ -94,6 +80,7 @@ export default function ChangePassword() {
}
// ✅ Passed → move to OTP
await handleGenerateOtp();
setStep("otp");
notifications.show({
title: "OTP Sent",
@@ -105,7 +92,7 @@ export default function ChangePassword() {
// Step 2 → validate OTP
if (step === "otp") {
if (otp !== "123456") {
if (otp !== generatedOtp) {
notifications.show({
title: "Invalid OTP",
message: "Please enter the correct OTP.",
@@ -126,12 +113,55 @@ export default function ChangePassword() {
// Step 3 → Final Change Password
if (step === "final") {
notifications.show({
title: "Password Changed",
message: "Your password has been successfully updated.",
color: "green",
});
resetForm();
const token = localStorage.getItem("access_token");
if (!token) {
router.push("/login");
return;
}
try {
const response = await fetch("/api/auth/change/transaction_password", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify({
OldTPsw: oldPassword,
newTPsw: newPassword,
confirmTPsw: confirmPassword
}),
});
if (response.status === 401) {
localStorage.removeItem("access_token");
router.push("/login");
return;
}
const result = await response.json();
console.log(result);
if (!response.ok) {
notifications.show({
title: "Failed",
message: result.error || "Failed to set transaction password",
color: "Red",
autoClose: false,
});
}
if (response.ok) {
notifications.show({
title: "Success",
message: "Transaction password change successfully.",
color: "green",
});
}
resetForm();
} catch (err: any) {
notifications.show({
title: "Error",
message: err.message || "Server error, please try again later",
color: "red",
});
}
}
};
@@ -148,7 +178,6 @@ export default function ChangePassword() {
return (
<Paper shadow="sm" radius="md" p="md" withBorder h={400}>
<Title order={3} style={{color:"red"}}>More Updates comming soon .....</Title>
<Title order={3} mb="sm">
Change Transaction Password
</Title>

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

@@ -135,7 +135,6 @@ export default function ChangePassword() {
router.push("/login");
return;
}
try {
const response = await fetch("/api/auth/transaction_password", {
method: "POST",
@@ -196,8 +195,8 @@ export default function ChangePassword() {
<div style={{ overflowY: "auto", maxHeight: "280px", paddingRight: 8 }}>
<Group grow>
<PasswordInput
label="New Password"
placeholder="Enter new password"
label="New Transaction Password"
placeholder="Enter new Transaction password"
value={newPassword}
onChange={(e) => setNewPassword(e.currentTarget.value)}
withAsterisk

23
src/app/_util/getBankLogo.ts
View File

@@ -9,15 +9,18 @@ import kccb from "@/app/image/bank_logo/kccb.jpg";
import logo from "@/app/image/bank_logo/bank.jpg";
export function getBankLogo(bankName: string): StaticImageData {
const logos: Record<string, StaticImageData> = {
"STATE BANK": sbi,
"PUNJAB NATIONAL": pnb,
"HDFC": hdfc,
"ICICI": icici,
"AXIS": axis,
"BANK OF INDIA": BOI,
"KANGRA": kccb,
};
if (!bankName) return logo;
return logos[bankName.toUpperCase()] ?? logo;
const upperName = bankName.toUpperCase();
if (upperName.startsWith("HDFC")) return hdfc;
if (upperName.startsWith("SBI") || upperName.startsWith("STATE BANK")) return sbi;
if (upperName.startsWith("ICICI")) return icici;
if (upperName.startsWith("PNB") || upperName.startsWith("PUNJAB NATIONAL")) return pnb;
if (upperName.startsWith("AXIS")) return axis;
if (upperName.startsWith("THE KANGRA CENTRAL")) return kccb;
if (upperName.startsWith("BANK OF INDIA") || upperName.startsWith("BOI")) return BOI;
return logo;
}

2
src/app/administrator/home/UserConfiguration.tsx
View File

@@ -86,8 +86,6 @@ export default function UserConfiguration() {
else {
const rightsData = {
CIF,
// internetBanking,
// mobileBanking,
};
console.log('Submitting rights:', rightsData);
notifications.show({

BIN
src/app/image/ib_front_1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 88 KiB

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

@@ -6,7 +6,7 @@ import { Providers } from "@/app/providers";
import { useRouter } from "next/navigation";
import NextImage from "next/image";
import logo from '@/app/image/logo1.jpg';
import frontPage from '@/app/image/ib_front.jpg';
import frontPage from '@/app/image/ib_front_1.jpg';
import dynamic from 'next/dynamic';
import { generateCaptcha } from '@/app/captcha';
import { IconShieldLockFilled } from "@tabler/icons-react";
@@ -95,20 +95,20 @@ export default function Login() {
password: psw,
}),
});
const data = await response.json();
console.log(data);
if (!response.ok) {
notifications.show({
withBorder: true,
color: "red",
title: "Error",
message: "Internal Server Error",
message: data?.error || "Internal Server Error",
autoClose: 5000,
});
localStorage.removeItem("access_token");
localStorage.removeItem("remitter_name");
return;
}
const data = await response.json();
console.log(data);
setIsLogging(true);
if (response.ok) {
console.log(data);