'use client'

import { Header } from './Header'
import { Sidebar } from './Sidebar'
import { TabBar } from './TabBar'
import { Dashboard } from '@/components/dashboard/Dashboard'
import { WorkspaceView } from '@/components/workspace/WorkspaceView'
import { ProjectsView } from '@/components/workspace/ProjectsView'
import { KanbanBoard } from '@/components/kanban/KanbanBoard'
import { CalendarView } from '@/components/dashboard/CalendarView'
import { ModalsManager } from '@/components/modals/ModalsManager'
import { ToastProvider } from '@/components/ui/Toast'
import { useAppStore } from '@/store'

export function AppShell() {
  const { activeTab } = useAppStore()

  const renderContent = () => {
    switch (activeTab) {
      case 'dashboard': return <Dashboard />
      case 'workspace': return <WorkspaceView />
      case 'projects':  return <ProjectsView />
      case 'kanban':    return <KanbanBoard />
      case 'calendar':  return <CalendarView />
      default:          return <Dashboard />
    }
  }

  return (
    <div className="flex flex-col h-screen overflow-hidden">
      <Header />
      <div className="flex flex-1 overflow-hidden">
        <Sidebar />
        <main className="flex-1 flex flex-col overflow-hidden bg-gray-50">
          <TabBar />
          <div className="flex-1 overflow-y-auto p-6 scrollbar-thin">
            {renderContent()}
          </div>
        </main>
      </div>
      <ModalsManager />
      <ToastProvider />
    </div>
  )
}