Docs
🪄 ⏐ Examples
Console

Console

The console is the default view type for Reachat. It is a full-screen view that allows you to chat with your bot in a console-like interface. Below is a bare-bones example of a console chat. Its worth noting that If the console doesn't have enough space to render fully it will fall back to the companion view.

Today
Session 1

Below is the code for the above example.

<Chat
  sessions={[
    {
      id: '1',
      title: 'Session 1',
      createdAt: new Date(),
      updatedAt: new Date(),
      conversations: [
        {
          id: '1',
          question: 'What is React?',
          response: 'React is a JavaScript library for building user interfaces.',
          createdAt: new Date(),
          updatedAt: new Date()
        },
        {
          id: '2',
          question: 'What is JSX?',
          response: 'JSX is a syntax extension for JavaScript.',
          createdAt: new Date(),
          updatedAt: new Date()
        }
      ]
    }
  ]}
  viewType="console"
  onDeleteSession={() => alert("delete!")}
  >
  <SessionsList>
    <NewSessionButton />
    <SessionGroup />
  </SessionsList>
  <SessionMessagePanel>
    <SessionMessagesHeader />
    <SessionMessages />
    <ChatInput />
  </SessionMessagePanel>
  </Chat>

For more information on how to set up a console chat, please refer to the getting started documentation. For more examples of how to use Reachat, please refer to the storybook demos (opens in a new tab).

Getting StartedCompanion