Chat Interface - Copy this React, Tailwind Component to your project

Create an online code generation interface with two distinct sections. The first section is a narrow vertical panel on the left side that displays a list of all online users, with each user represented by a small avatar and their username, allowing for scrolling if needed. The second section, occupying the majority of the screen, is a larger chat box area where users can communicate in real time. The chat interface should include an input field at the bottom for typing messages, with the conversation displayed above, showing messages aligned to the left for other users and to the right for the current user, including the sender's name and timestamp