Room Sidebar Polish

The newly-built RoomSidebar receives its first round of UX fixes — portal rendering, responsive modal sizing, and stale state cleanup for fast room switches.

The newly-built RoomSidebar received its first round of UX fixes after being put through real usage by the team.

Portal Rendering

Portal rendering was corrected so the sidebar doesn't clip behind page-level containers. The previous implementation was placing the sidebar in the normal DOM flow, causing z-index conflicts and visual clipping on certain layouts.

Responsive Modal Sizing

Modal sizing was made responsive — widths constrained with min() expressions so they don't overflow on small screens. Previously, invite and settings modals would bleed off-screen on narrower viewports.

ChatContainer State Cleanup

Stale activeRoomId references causing missed history fetches on rapid room switches were resolved. When a user switched rooms quickly, the old room ID was still set during the async history fetch, resulting in the wrong history being displayed.

Why it matters

The sidebar was functional but felt rough in real usage. These fixes made it safe to share with early testers without causing confusion or presenting obvious layout bugs on first impression.