pmbanugo

sendMessage(e: SendMessageEvent): void {
    const message = e.message;
    if (!this.user.name) {
        this.user.name = message.text;
        let newMessage = Object.assign({}, message);
        newMessage.text = `Welcome to the chat ${message.text}!`;
        newMessage.author = this.bot;

        this.messages = [...this.messages, newMessage];
    } else {

pmbanugo

<kendo-chat
  [messages]="messages"
  [user]="user"
  (sendMessage)="sendMessage($event)"
></kendo-chat>

pmbanugo

  private conversation: Channel;

  async initialiseChatClient(): Promise<void> {
    const response = await fetch("http://localhost:8080/v1/token", {
      method: "POST",
      mode: "cors",
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify({

pmbanugo

onNewMessage = event => {
  let message = {
    text: event.message.text,
    author: event.message.user,
    timestamp: event.message.created_at
  };

  this.messages = [...this.messages, message];
};

pmbanugo

import { Component } from "@angular/core";
import {
  Message,
  User,
  SendMessageEvent
} from "@progress/kendo-angular-conversational-ui";
import { StreamChat, Channel } from "stream-chat";

@Component({
  selector: "app-root",

pmbanugo

import React from "react";
import "./App.css";
import "@progress/kendo-theme-default/dist/all.css";
import { Chat } from "@progress/kendo-react-conversational-ui";
import { StreamChat } from "stream-chat";

class App extends React.Component {
  constructor(props) {
    super(props);
    this.user = undefined;

pmbanugo

onNewMessage = event => {
  let message = {
    text: event.message.text,
    author: event.message.user,
    timestamp: event.message.created_at
  };

  this.setState({
    messages: [...this.state.messages, message]
  });

pmbanugo

initialiseChatClient = async () => {
  const response = await fetch("http://localhost:8080/v1/token", {
    method: "POST",
    mode: "cors",
    headers: {
      "Content-Type": "application/json"
    },
    body: JSON.stringify({
      id: this.user.id,
      name: this.user.name

pmbanugo

addMessage = ({ message }) => {
  if (!this.user) {
    this.user = { name: message.text, id: Date.now().toString() };

    let newMessage = Object.assign({}, message);
    newMessage.text = `Welcome to the chat ${message.text}!`;
    newMessage.author = this.bot;

    this.setState({
      messages: [...this.state.messages, newMessage]

pmbanugo

<Chat
  user={this.user}
  messages={this.state.messages}
  onMessageSend={this.addMessage}
  placeholder={"Type here..."}
  width={400}
></Chat>