create base Event element

components/chat.js

@@ -7,10 +7,7 @@ const debounce = require('debounce')
 const jdenticon = require('jdenticon')
 const defaultValue = require('default-value')
 
-const elements = {
+const Event = require('./events/Event.js') 
-  "m.text": require('./events/text.js'),
-  "m.image": require('./events/image.js')
-}
 
 jdenticon.config = {
     lightness: {
@@ -131,8 +128,8 @@ let EventGroup = create({
   },
 
   render: function() {
-    let events = this.props.events.map((event, id) => {
+    let events = this.props.events.map((event, key) => {
-      return getRenderedEvent(event, id, this.props.client)
+      return <Event event={event} key={key} client={this.props.client} />
     })
     return <div className="eventGroup">
       <svg id="avatar" ref={this.avatarRef} ></svg>
@@ -144,11 +141,4 @@ let EventGroup = create({
   }
 })
 
-function getRenderedEvent(event, id, client) {
-  if (event.type == "m.room.message") {
-    let msgtype = event.content.msgtype;
-    return React.createElement(defaultValue(elements[msgtype], elements["m.text"]), {event: event, key: id, client: client})
-  }
-}
-
 module.exports = chat

components/events/Event.js

@@ -0,0 +1,37 @@
+'use strict'
+const React = require('react')
+const ReactDOM = require('react-dom')
+const create = require('create-react-class')
+const defaultValue = require('default-value')
+
+const elements = {
+  "m.text": require('./text.js'),
+  "m.image": require('./image.js')
+}
+
+let Event = create({
+  displayName: "Event",
+
+  render: function() {
+    let state = ""
+
+    if (this.props.event.local) {
+      state = " local"
+    }
+
+    return (
+      <div className={"event" + state}>
+        {getRenderedEvent(this.props.event, this.props.client)}
+      </div>
+    )
+  }
+})
+
+function getRenderedEvent(event, client) {
+  if (event.type == "m.room.message") {
+    let msgtype = event.content.msgtype;
+    return React.createElement(defaultValue(elements[msgtype], elements["m.text"]), {event: event, client: client})
+  }
+}
+
+module.exports = Event