"use client"

import { useEffect } from "react"
import { useRouter, useSearchParams } from "next/navigation"

export default function DevLoginPage() {
  const router = useRouter()
  const searchParams = useSearchParams()
  const role = searchParams.get("role")

  useEffect(() => {
    if (!role || !["admin", "instructor", "student"].includes(role)) {
      router.push("/auth/login")
      return
    }

    // Create login info with specific IDs based on role
    let loginInfo: Record<string, any> = {
      logged_in_status: true,
      role: role,
      loggedin_at: new Date().toISOString(),
    }

    // Add role-specific properties
    if (role === "admin") {
      loginInfo = {
        ...loginInfo,
        email: "admin@worldmind.com",
        user_id: 1,
      }
    } else if (role === "student") {
      loginInfo = {
        ...loginInfo,
        email: "john.doe@example.com",
        user_id: 2,
        student_id: 1,
      }
    } else if (role === "instructor") {
      loginInfo = {
        ...loginInfo,
        email: "instructor@worldmind.com",
        user_id: 3,
      }
    }

    // Store in localStorage
    localStorage.setItem("login_info", JSON.stringify(loginInfo))
    console.log("Login info set:", loginInfo)

    // Redirect based on role
    if (role === "admin") {
      router.push("/admin/dashboard")
    } else if (role === "instructor") {
      router.push("/instructor/dashboard")
    } else {
      router.push("/student/student")
    }
  }, [role, router])

  return (
    <div className="min-h-screen flex items-center justify-center">
      <div className="text-center">
        <h1 className="text-2xl font-bold mb-4">Logging in as {role}...</h1>
        <p>You will be redirected shortly.</p>
      </div>
    </div>
  )
}