index.js

import React from 'react'
import RTM from 'satori-rtm-sdk'

class Index extends React.Component {
  state = {}

  componentDidMount () {
    const rtm = new RTM('YOU_ENDPOINT', 'YOUR_APPKEY')
    const channel = rtm.subscribe('YOUR_CHANNEL', RTM.SubscriptionMode.SIMPLE)

    channel.on('rtm/subscription/data', pdu => {
      const messages = pdu.body.messages
      this.updateUI(messages)
    })

    rtm.on('data', pdu => {
      if (pdu.action.endsWith('/error')) {
        rtm.restart()
      }
    })

    rtm.start()

    this.setState({rtm, channel})
  }

  componentWillUnmount () {
    this.state.rtm.stop()
  }

  updateUI = messages => {
    if (messages && messages.length > 0) {
      const lastMessage = messages[messages.length - 1]

      this.setState(lastMessage)
    }
  }

  render () {
    const { talk } = this.state
    return (
      <div>{talk || 'Hello'}</div>
    )
  }
}

export default Index