From 7484cc3f70ecb1067b78d8dc5374760c0ee4ff65 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 2 Feb 2017 18:29:33 +0000
Subject: [PATCH 1/3] Make default avatars clickable

BaseAvatar can be passed an onClick which is called when it's, er,
clicked, except when it was the default avatar in which case it
merrily ignored it. Make it not ignore it.
---
 src/components/views/avatars/BaseAvatar.js | 38 +++++++++++++++-------
 1 file changed, 27 insertions(+), 11 deletions(-)

diff --git a/src/components/views/avatars/BaseAvatar.js b/src/components/views/avatars/BaseAvatar.js
index 5862a9d4f10..456539b3749 100644
--- a/src/components/views/avatars/BaseAvatar.js
+++ b/src/components/views/avatars/BaseAvatar.js
@@ -145,17 +145,33 @@ module.exports = React.createClass({
 
         if (imageUrl === this.state.defaultImageUrl) {
             const initialLetter = this._getInitialLetter(name);
-            return (
-                <span className="mx_BaseAvatar" {...otherProps}>
-                    <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
-                            style={{ fontSize: (width * 0.65) + "px",
-                                    width: width + "px",
-                                    lineHeight: height + "px" }}>{initialLetter}</EmojiText>
-                    <img className="mx_BaseAvatar_image" src={imageUrl}
-                        alt="" title={title} onError={this.onError}
-                        width={width} height={height} />
-                </span>
-            );
+            if (onClick != null) {
+                return (
+                    <AccessibleButton element='span' className="mx_BaseAvatar"
+                        onClick={onClick} {...otherProps}
+                    >
+                        <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
+                                style={{ fontSize: (width * 0.65) + "px",
+                                        width: width + "px",
+                                        lineHeight: height + "px" }}>{initialLetter}</EmojiText>
+                        <img className="mx_BaseAvatar_image" src={imageUrl}
+                            alt="" title={title} onError={this.onError}
+                            width={width} height={height} />
+                    </AccessibleButton>
+                );
+            } else {
+                return (
+                    <span className="mx_BaseAvatar" {...otherProps}>
+                        <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
+                                style={{ fontSize: (width * 0.65) + "px",
+                                        width: width + "px",
+                                        lineHeight: height + "px" }}>{initialLetter}</EmojiText>
+                        <img className="mx_BaseAvatar_image" src={imageUrl}
+                            alt="" title={title} onError={this.onError}
+                            width={width} height={height} />
+                    </span>
+                );
+            }
         }
         if (onClick != null) {
             return (

From 10edab06a613bc564ae634bc9e179fa7a5c02738 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 2 Feb 2017 18:41:50 +0000
Subject: [PATCH 2/3] Don't c+p the complex markup

---
 src/components/views/avatars/BaseAvatar.js | 28 +++++++++++-----------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/components/views/avatars/BaseAvatar.js b/src/components/views/avatars/BaseAvatar.js
index 456539b3749..70c0ed3eaef 100644
--- a/src/components/views/avatars/BaseAvatar.js
+++ b/src/components/views/avatars/BaseAvatar.js
@@ -145,30 +145,30 @@ module.exports = React.createClass({
 
         if (imageUrl === this.state.defaultImageUrl) {
             const initialLetter = this._getInitialLetter(name);
+            const textNode = <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
+                style={{ fontSize: (width * 0.65) + "px",
+                width: width + "px",
+                lineHeight: height + "px" }}
+            >
+                {initialLetter}
+            </EmojiText>;
+            const imgNode = <img className="mx_BaseAvatar_image" src={imageUrl}
+                    alt="" title={title} onError={this.onError}
+                    width={width} height={height} />;
             if (onClick != null) {
                 return (
                     <AccessibleButton element='span' className="mx_BaseAvatar"
                         onClick={onClick} {...otherProps}
                     >
-                        <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
-                                style={{ fontSize: (width * 0.65) + "px",
-                                        width: width + "px",
-                                        lineHeight: height + "px" }}>{initialLetter}</EmojiText>
-                        <img className="mx_BaseAvatar_image" src={imageUrl}
-                            alt="" title={title} onError={this.onError}
-                            width={width} height={height} />
+                        {textNode}
+                        {imgNode}
                     </AccessibleButton>
                 );
             } else {
                 return (
                     <span className="mx_BaseAvatar" {...otherProps}>
-                        <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
-                                style={{ fontSize: (width * 0.65) + "px",
-                                        width: width + "px",
-                                        lineHeight: height + "px" }}>{initialLetter}</EmojiText>
-                        <img className="mx_BaseAvatar_image" src={imageUrl}
-                            alt="" title={title} onError={this.onError}
-                            width={width} height={height} />
+                        {textNode}
+                        {imgNode}
                     </span>
                 );
             }

From e7a32faf648fe6f6d0231a8159d2cdcc87cb1f13 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 2 Feb 2017 18:47:24 +0000
Subject: [PATCH 3/3] Wrap multiline JSX in parens

---
 src/components/views/avatars/BaseAvatar.js | 22 +++++++++++++---------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/views/avatars/BaseAvatar.js b/src/components/views/avatars/BaseAvatar.js
index 70c0ed3eaef..65730be40b4 100644
--- a/src/components/views/avatars/BaseAvatar.js
+++ b/src/components/views/avatars/BaseAvatar.js
@@ -145,16 +145,20 @@ module.exports = React.createClass({
 
         if (imageUrl === this.state.defaultImageUrl) {
             const initialLetter = this._getInitialLetter(name);
-            const textNode = <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
-                style={{ fontSize: (width * 0.65) + "px",
-                width: width + "px",
-                lineHeight: height + "px" }}
-            >
-                {initialLetter}
-            </EmojiText>;
-            const imgNode = <img className="mx_BaseAvatar_image" src={imageUrl}
+            const textNode = (
+                <EmojiText className="mx_BaseAvatar_initial" aria-hidden="true"
+                    style={{ fontSize: (width * 0.65) + "px",
+                    width: width + "px",
+                    lineHeight: height + "px" }}
+                >
+                    {initialLetter}
+                </EmojiText>
+            );
+            const imgNode = (
+                <img className="mx_BaseAvatar_image" src={imageUrl}
                     alt="" title={title} onError={this.onError}
-                    width={width} height={height} />;
+                    width={width} height={height} />
+            );
             if (onClick != null) {
                 return (
                     <AccessibleButton element='span' className="mx_BaseAvatar"