import { useChatStore } from '@/features/chat/stores/useChatStore'
import { ChatMessage } from '@/features/chat/components/ChatMessage'
import { UserButton } from '@/features/chat/components/UserButton'
import { MobileStepBar } from '@/features/chat/components/MobileStepBar'

export function ChatSection() {
  const { userButtonConfig } = useChatStore()
  return (
    <div className="flex flex-1 flex-col w-full h-full min-h-0 bg-surface">
      <MobileStepBar />
      <ChatMessage />
      {/* 하단 액션 덱 */}
      <div className="shrink-0 border-t border-border bg-white shadow-[0_-4px_20px_rgba(0,0,0,0.03)]">
        <UserButton {...userButtonConfig} />
      </div>
    </div>
  )
}