displaying state events

components/chat.js

@@ -37,7 +37,27 @@ let eventFunctions = {
         plain = sanitize(this.content.formatted_body, {allowedTags: []})
       }
     }
-
+    if (this.type == "m.room.member") {
+      if (this.content.membership == "invite") {
+        plain = `${this.sender} invited ${this.state_key}`
+      } else if (this.content.membership == "join") {
+        plain = `${this.state_key} joined the room`
+      } else if (this.content.membership == "leave") {
+        plain = `${this.state_key} left the room`
+      } else if (this.content.membership == "kick") {
+        plain = `${this.sender} kicked ${this.state_key}`
+      } else if (this.content.membership == "ban") {
+        plain = `${this.sender} banned ${this.state_key}`
+      }
+    }
+    if (this.type == "m.room.avatar") {
+      if (this.content.url.length > 0) {
+        plain = `${this.sender} changed the room avatar`
+      }
+    }
+    if (this.type == "m.room.name") {
+      return `${this.sender} changed the room name to ${this.content.name}`
+    }
     return plain
   }
 }

components/events/Event.js

@@ -7,6 +7,7 @@ const defaultValue = require('default-value')
 const riot = require('../../lib/riot-utils.js')
 
 const User = require('./user.js')
+const stateElement = require('./state.js')
 
 const elements = {
   "m.text": require('./text.js'),
@@ -58,6 +59,8 @@ let Event = create({
         )
       }
       element = React.createElement(defaultValue(elements[msgtype], elements["m.text"]), {formattedEvent: formattedEvent, event: event, client: this.props.client})
+    } else if (["m.room.name", "m.room.member", "m.room.avatar"].includes(event.type)) {
+      element = React.createElement(stateElement, {event: event})
     }
 
     return (

components/events/state.js

@@ -0,0 +1,19 @@
+'use strict'
+const React = require('react')
+const ReactDOM = require('react-dom')
+const create = require('create-react-class')
+
+let Event = create({
+  displayName: "genericStateEvent",
+
+  render: function() {
+    let event = this.props.event
+    return (
+      <div className="body">
+        {event.plaintext()}
+      </div>
+    )
+  }
+})
+
+module.exports = Event

components/events/text.js

@@ -40,4 +40,4 @@ let Event = create({
 })
 
 
-module.exports = Event;
+module.exports = Event