Context: The header area of the web UI is getting quite crowded. We should be more intentional about how we allocate space for features there.
There are at least three not-entirely independent (and incompletely covered!) state variables that this seems to be communicating.
We could probably make some UX changes that address the underlying user needs here without requiring any header space.
Some ideas: When the session is in the disconnected state, disable all the UI controls that won't work without a connected session (chat text area and submit button, cancel/stop buttons etc). Do some kind of lightbox overlay while it tries to reconnect.