import { MessageList } from './MessageList'
import { MessageInput } from './MessageInput'
import type { ChatMessage, Attachment } from '../../types/protocol'

interface ChatContainerProps {
  messages: ChatMessage[]
  isLoading: boolean
  isReadOnly?: boolean
  channelName?: string
  onSendMessage: (content: string, attachments: Attachment[]) => void
  onNavigateToSubAgent?: (taskId: string, description: string, subagentType?: string) => void
  onStop?: () => void
  showThinking?: boolean
  /** 浮动待办面板，绝对定位在消息区域上方 */
  todoPanel?: React.ReactNode
  /** 视图标识，用于保存/恢复滚动位置 */
  viewKey?: string
}

export function ChatContainer({
  messages,
  isLoading,
  isReadOnly = false,
  channelName,
  onSendMessage,
  onNavigateToSubAgent,
  onStop,
  showThinking = true,
  todoPanel,
  viewKey,
}: ChatContainerProps) {
  return (
    <div className="flex h-full flex-col relative">
      <div className="flex-1 overflow-hidden relative">
        <MessageList messages={messages} onNavigateToSubAgent={onNavigateToSubAgent} showThinking={showThinking} viewKey={viewKey} />
        {todoPanel}
      </div>
      <MessageInput
        onSend={onSendMessage}
        onStop={onStop}
        disabled={isLoading}
        isLoading={isLoading}
        isReadOnly={isReadOnly}
        channelName={channelName}
      />
    </div>
  )
}