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

src/app/ChangePassword/page.tsx

@@ -19,6 +19,7 @@ import logo from "@/app/image/logo1.jpg";
 import changePwdImage from "@/app/image/change_password.jpg"; // reuse background illustration
 import { generateCaptcha } from "@/app/captcha";
 import { IconLock, IconRefresh } from "@tabler/icons-react";
+import { sendOtp, verifyOtp } from "../_util/otp";
 
 export default function ChangePassword() {
     const router = useRouter();
@@ -38,13 +39,49 @@ export default function ChangePassword() {
     const icon = <IconLock size={18} stroke={1.5} />;
 
     // OTP generation
-    const handleGenerateOtp = async () => {
-        const value = "123456"; // replace with backend OTP if available
-        setGeneratedOtp(value);
-        setCountdown(180);
-        setTimerActive(true);
-        return value;
-    };
+    // const handleGenerateOtp = async () => {
+    //     const value = "123456"; // replace with backend OTP if available
+    //     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' });
+            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;
+        }
+    }
+
+
 
     useEffect(() => {
         regenerateCaptcha();
@@ -120,7 +157,7 @@ export default function ChangePassword() {
                 return;
             }
 
-            await handleGenerateOtp();
+            await handleSendOtp();
             setStep("otp");
             notifications.show({
                 title: "OTP Sent",
@@ -130,11 +167,13 @@ export default function ChangePassword() {
             return;
         }
 
+        // Step 2 → validate OTP
         if (step === "otp") {
-            if (otp !== generatedOtp) {
+            const verified = await handleVerifyOtp();
+            if (!verified) {
                 notifications.show({
                     title: "Invalid OTP",
-                    message: "Please enter the correct OTP.",
+                    message: "The OTP entered does not match",
                     color: "red",
                 });
                 return;
@@ -363,7 +402,7 @@ export default function ChangePassword() {
                                                 <Button
                                                     variant="subtle"
                                                     px={8}
-                                                    onClick={handleGenerateOtp}
+                                                    onClick={handleSendOtp}
                                                     leftSection={<IconRefresh size={16} />}
                                                 >
                                                     Resend