import { Sidebar } from '../components/Sidebar'
import { MessagePane } from '../components/MessagePane'
import { FileBrowser } from '../components/FileBrowser'
import { useWaste } from '../store'

export function Chat() {
  const { activeFilePeer } = useWaste()
  return (
    <div className={`chat-layout${activeFilePeer ? ' has-file-browser' : ''}`}>
      <Sidebar />
      <MessagePane />
      {activeFilePeer && <FileBrowser />}
    </div>
  )
}