import { useEffect } from 'react'
import { useNavigate } from 'react-router-dom'
import { RoleSelector } from './RoleSelector'
import { useClassroomLogic } from '@/utils/hooks/useClassroomLogic'
import { useStoreState } from '@/store/store'
import { ROUTES_ENUM } from '@/routes/route.constant'
import { Room } from './Room'

export function Dashboard() {
  const {
    appState,
    currentClass,
    handleRoleSelect,
    handleJoinClass,
    handleLeaveClass,
    handleCreateClass,
    handleEditClass,
    handleDeleteClass,
  } = useClassroomLogic()
  const navigate = useNavigate()
  const { user } = useStoreState((state) => state.auth)

  useEffect(() => {
    if (appState === 'dashboard') {
      navigate(ROUTES_ENUM.protected.admin.classroom.classes, { replace: true })
    }
  }, [appState, navigate])

  if (appState === 'role-selection') {
    return <RoleSelector onRoleSelect={handleRoleSelect} />
  } else if (appState === 'dashboard') {
    // Yönlendirme yapılacağı için burada içerik render etmiyoruz
    return null
  } else if (appState === 'classroom' && currentClass) {
    return <Room classSession={currentClass} onLeaveClass={handleLeaveClass} />
  }
  return null
}