import { createFileRoute, useRouter } from '@tanstack/react-router'
import { useEffect, useState } from 'react'
import { getAccessToken } from '../lib/auth'
import { TeacherDashboard } from '../components/teacher/TeacherDashboard'
import { Toaster } from '../components/ui/toast'

export const Route = createFileRoute('/teacher/dashboard')({
  component: TeacherDashboardPage,
})

function TeacherDashboardPage() {
  const router = useRouter()
  const [checked, setChecked] = useState(false)

  useEffect(() => {
    if (!getAccessToken()) {
      router.navigate({ to: '/login' })
      return
    }
    setChecked(true)
  }, [router])

  if (!checked) {
    return (
      <div className="flex min-h-screen items-center justify-center">
        <p className="text-sm text-gray-500">Loading…</p>
      </div>
    )
  }

  return (
    <>
      <TeacherDashboard />
      <Toaster />
    </>
  )
}