Files
waste-go/web/src/pages/Chat.tsx
Fredrik Johansson 32a6f46481 feat: responsive mobile layout with slide-over sidebar
On screens ≤600px the sidebar collapses off-screen. A hamburger button
in the message header opens it as a slide-over drawer with a dim
overlay; tapping a room/network or the ✕ button closes it. Desktop
layout is unchanged.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-06-29 18:53:18 +02:00

18 lines
660 B
TypeScript

import { useState } from 'react'
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()
const [sidebarOpen, setSidebarOpen] = useState(false)
return (
<div className={`chat-layout${activeFilePeer ? ' has-file-browser' : ''}${sidebarOpen ? ' sidebar-open' : ''}`}>
<Sidebar onClose={() => setSidebarOpen(false)} />
<MessagePane onMenuClick={() => setSidebarOpen(v => !v)} />
{activeFilePeer && <FileBrowser />}
</div>
)
}