import { useEffect } from 'react'
import { useNavigate } from 'react-router-dom'
import { useClassroomLogic } from '@/utils/hooks/useClassroomLogic'
import { ROUTES_ENUM } from '@/routes/route.constant'
import { Container } from '@/components/shared'
import { RoleSelector } from '@/components/classroom/RoleSelector'
import RoomDetail from './RoomDetail'

const Dashboard: React.FC = () => {
  const { roleState, currentClass, handleRoleSelect, handleLeaveClass } = useClassroomLogic()
  const navigate = useNavigate()

  // Eğer dashboard seçildiyse otomatik yönlendirme yap
  useEffect(() => {
    if (roleState === 'dashboard') {
      navigate(ROUTES_ENUM.protected.admin.classroom.classes, { replace: true })
    }
  }, [roleState, navigate])

  return (
    <Container>
      {roleState === 'role-selection' && <RoleSelector onRoleSelect={handleRoleSelect} />}

      {roleState === 'classroom' && currentClass && <RoomDetail />}
    </Container>
  )
}

export default Dashboard