Update EventTile to use WithMatrixClient instead of MatrixClientPeg

src/components/views/rooms/EventTile.js

@@ -21,8 +21,8 @@ var classNames = require("classnames");
 var Modal = require('../../../Modal');
 
 var sdk = require('../../../index');
-var MatrixClientPeg = require('../../../MatrixClientPeg')
 var TextForEvent = require('../../../TextForEvent');
+import WithMatrixClient from '../../../wrappers/WithMatrixClient';
 
 var ContextualMenu = require('../../structures/ContextualMenu');
 var dispatcher = require("../../../dispatcher");
@@ -63,22 +63,13 @@ var MAX_READ_AVATARS = 5;
 // |    '--------------------------------------'              |
 // '----------------------------------------------------------'
 
-module.exports = React.createClass({
+module.exports = WithMatrixClient(React.createClass({
     displayName: 'EventTile',
 
-    statics: {
-        haveTileForEvent: function(e) {
-            if (e.isRedacted()) return false;
-            if (eventTileTypes[e.getType()] == undefined) return false;
-            if (eventTileTypes[e.getType()] == 'messages.TextualEvent') {
-                return TextForEvent.textForEvent(e) !== '';
-            } else {
-                return true;
-            }
-        }
-    },
-
     propTypes: {
+        /* MatrixClient instance for sender verification etc */
+        matrixClient: React.PropTypes.object.isRequired,
+
         /* the MatrixEvent to show */
         mxEvent: React.PropTypes.object.isRequired,
 
@@ -153,7 +144,7 @@ module.exports = React.createClass({
 
     componentDidMount: function() {
         this._suppressReadReceiptAnimation = false;
-        MatrixClientPeg.get().on("deviceVerificationChanged",
+        this.props.matrixClient.on("deviceVerificationChanged",
                                  this.onDeviceVerificationChanged);
     },
 
@@ -176,11 +167,9 @@ module.exports = React.createClass({
     },
 
     componentWillUnmount: function() {
-        var client = MatrixClientPeg.get();
+        var client = this.props.matrixClient;
-        if (client) {
+        client.removeListener("deviceVerificationChanged",
-            client.removeListener("deviceVerificationChanged",
+                              this.onDeviceVerificationChanged);
-                                  this.onDeviceVerificationChanged);
-        }
     },
 
     onDeviceVerificationChanged: function(userId, device) {
@@ -193,7 +182,7 @@ module.exports = React.createClass({
         var verified = null;
 
         if (mxEvent.isEncrypted()) {
-            verified = MatrixClientPeg.get().isEventSenderVerified(mxEvent);
+            verified = this.props.matrixClient.isEventSenderVerified(mxEvent);
         }
 
         this.setState({
@@ -246,11 +235,11 @@ module.exports = React.createClass({
     },
 
     shouldHighlight: function() {
-        var actions = MatrixClientPeg.get().getPushActionsForEvent(this.props.mxEvent);
+        var actions = this.props.matrixClient.getPushActionsForEvent(this.props.mxEvent);
         if (!actions || !actions.tweaks) { return false; }
 
         // don't show self-highlights from another of our clients
-        if (this.props.mxEvent.getSender() === MatrixClientPeg.get().credentials.userId)
+        if (this.props.mxEvent.getSender() === this.props.matrixClient.credentials.userId)
         {
             return false;
         }
@@ -387,7 +376,7 @@ module.exports = React.createClass({
             throw new Error("Event type not supported");
         }
 
-        var e2eEnabled = MatrixClientPeg.get().isRoomEncrypted(this.props.mxEvent.getRoomId());
+        var e2eEnabled = this.props.matrixClient.isRoomEncrypted(this.props.mxEvent.getRoomId());
         var isSending = (['sending', 'queued', 'encrypting'].indexOf(this.props.eventSendStatus) !== -1);
 
         var classes = classNames({
@@ -481,7 +470,7 @@ module.exports = React.createClass({
         }
 
         if (this.props.tileShape === "notif") {
-            var room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId());
+            var room = this.props.matrixClient.getRoom(this.props.mxEvent.getRoomId());
 
             return (
                 <div className={classes}>
@@ -554,4 +543,14 @@ module.exports = React.createClass({
             );
         }
     },
-});
+}));
+
+module.exports.haveTileForEvent = function(e) {
+    if (e.isRedacted()) return false;
+    if (eventTileTypes[e.getType()] == undefined) return false;
+    if (eventTileTypes[e.getType()] == 'messages.TextualEvent') {
+        return TextForEvent.textForEvent(e) !== '';
+    } else {
+        return true;
+    }
+};