import {
  Chat,
  ChatHeader,
  ConversationList,
  MessageInput,
  MessageList,
} from '@tencentcloud/chat-uikit-react';

function App() {
  return (
    <UIKitProvider>
      <div style={{ display: 'flex', height: '100vh' }}>
        <ConversationList style={{ minWidth: '30%' }} />
        <Chat>
          <ChatHeader />
          // Enable read receipt
          <MessageList enableReadReceipt={true} />
          <MessageInput />
        </Chat>
      </div>
    </UIKitProvider>
  );
}

export default App;