"use client"

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

function AuthPageInner() {
  const router = useRouter()
  const searchParams = useSearchParams()

  useEffect(() => {
    const mode = searchParams.get('mode')
    if (mode === 'signup') {
      router.replace('/signup')
    } else if (mode === 'signin') {
      router.replace('/signin')
    } else {
      router.replace('/signin')
    }
  }, [router, searchParams])

  return (
    <div className="min-h-screen bg-black text-white flex items-center justify-center">
      <div className="text-center">
        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-orange-500 mx-auto mb-4"></div>
        <p className="text-white/60">Redirecting...</p>
      </div>
    </div>
  )
}

export default function AuthPageRoute() {
  return (
    <Suspense fallback={null}>
      <AuthPageInner />
    </Suspense>
  )
}