'use client'

// React Imports
import { useEffect } from 'react'

// Next Imports
import { useRouter } from 'next/navigation'

// Type Imports
import type { ChildrenType } from '@core/types'

// Config Imports
import themeConfig from '@configs/themeConfig'

// Context Imports
import { useAuth } from '@/contexts/authContext'

const GuestOnlyRoute = ({ children }: ChildrenType) => {
  const { isAuthenticated, isLoading } = useAuth()
  const router = useRouter()

  useEffect(() => {
    if (!isLoading && isAuthenticated) {
      router.push(themeConfig.homePageUrl)
    }
  }, [isAuthenticated, isLoading, router])

  if (isLoading) {
    // Show loading state while checking authentication
    return null // or a loading spinner
  }

  if (isAuthenticated) {
    return null // Will redirect
  }

  return <>{children}</>
}

export default GuestOnlyRoute
