feat:user migration

src/app/(main)/layout.tsx

@@ -249,7 +249,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
                                     <Popover
                                         opened={opened}
                                         onChange={close}
-                                        position="bottom-end"   // 👈 Logout button ke niche right align
+                                        position="bottom-end"   
                                         withArrow
                                         shadow="md"
                                     >

src/app/login/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 import React, { useState, useEffect, memo, useRef } from "react";
-import { Text, Button, TextInput, PasswordInput, Title, Card, Group, Flex, Box, Image, Anchor, Tooltip } from "@mantine/core";
+import { Text, Button, TextInput, PasswordInput, Title, Card, Group, Flex, Box, Image, Anchor, Tooltip, Modal } from "@mantine/core";
 import { notifications } from "@mantine/notifications";
 import { Providers } from "@/app/providers";
 import { useRouter } from "next/navigation";
@@ -20,6 +20,11 @@ export default function Login() {
     const [isLogging, setIsLogging] = useState(false);
     const ClientCarousel = dynamic(() => import('./clientCarousel'), { ssr: false });
     const headerRef = useRef<HTMLHeadingElement>(null);
+    const [opened, setOpened] = useState(false);
+    const [otpStep, setOtpStep] = useState(false);
+    const [otp, setOtp] = useState("");
+    const [isOtpSending, setIsOtpSending] = useState(false);
+    const [isOtpVerifying, setIsOtpVerifying] = useState(false);
 
     useEffect(() => {
         const loadCaptcha = async () => {
@@ -97,7 +102,13 @@ export default function Login() {
             });
             const data = await response.json();
             console.log(data);
+            if (data.error === "MIGRATED_USER_HAS_NO_PASSWORD") {
+                //console.log("Migration issue detected → opening modal");
+                setOpened(true);
+                return;
+            }
             if (!response.ok) {
+                //console.log("hiiiii");
                 notifications.show({
                     withBorder: true,
                     color: "red",
@@ -109,6 +120,7 @@ export default function Login() {
                 localStorage.clear();
                 sessionStorage.clear();
                 return;
+
             }
             setIsLogging(true);
             if (response.ok) {
@@ -163,6 +175,100 @@ export default function Login() {
 
     return (
         <Providers>
+            <Modal
+                opened={opened}
+                onClose={() => {
+                    setOpened(false);
+                    setOtpStep(false);
+                    setOtp("");
+                }}
+                title="User Migration Notice"
+                centered
+            >
+                {!otpStep ? (
+                    // STEP 1: Migration Notice
+                    <>
+                        <Text>
+                            Your account is being migrated to the new system.
+                            You need to set a new password to continue login.
+                        </Text>
+
+                        <Group mt="md" justify="flex-end">
+                            <Button
+                                variant="outline"
+                                onClick={() => setOpened(false)}
+                            >
+                                Cancel
+                            </Button>
+
+                            {/* ✅ Instead of calling API, just open OTP screen */}
+                            <Button
+                                onClick={() => {
+                                    setOtpStep(true); // directly show OTP screen
+                                }}
+                            >
+                                OK
+                            </Button>
+                        </Group>
+                    </>
+                ) : (
+                    // STEP 2: OTP Verification (Frontend-only)
+                    <>
+                        <Text mb="sm">
+                            Enter the OTP (for demo, you can accept any value).
+                        </Text>
+
+                        <TextInput
+                            label="OTP"
+                            placeholder="Enter OTP"
+                            value={otp}
+                            onChange={(e) => setOtp(e.currentTarget.value)}
+                        />
+
+                        <Group mt="md" justify="flex-end">
+                            <Button
+                                variant="outline"
+                                onClick={() => {
+                                    setOtp("");
+                                    setOtpStep(false); // go back to migration notice
+                                }}
+                            >
+                                Back
+                            </Button>
+
+                            <Button
+                                onClick={() => {
+                                    if (!otp) {
+                                        notifications.show({
+                                            color: "red",
+                                            title: "Invalid Input",
+                                            message: "Please enter OTP before verifying",
+                                        });
+                                        return;
+                                    }
+
+                                    // ✅ Simulate OTP success
+                                    localStorage.setItem("token", "dummy-token");
+
+                                    notifications.show({
+                                        color: "green",
+                                        title: "OTP Verified",
+                                        message: "Redirecting to set password page...",
+                                    });
+
+                                    setOpened(false);
+                                    router.push("/SetPassword"); // go to set password
+                                }}
+                            >
+                                Verify OTP
+                            </Button>
+                        </Group>
+                    </>
+                )}
+            </Modal>
+
+
+            {/*  */}
             <div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "auto", paddingTop: "5%" }}>
                 {/* Header */}
                 <Box