{"version":"1.0","type":"rich","title":"react chat component","description":"A React chat component displays real-time messages in a room-based interface, with a room list and active message thread. It connects to a Phoenix channel via a WebSocket, listening for `message_new` and `user_joined` events to append incoming text to the message array. The `onClickRoom` handler switches channels and clears messages, while `onSubmitMessage` pushes new text through the channel. The code uses React state and lifecycle methods, along with the Phoenix socket API for channel join, receive, and push operations.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-1c9000b8fd533297fd2e?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}