From 59a253af37dcfec7284d963f8122ccc2bd25191c Mon Sep 17 00:00:00 2001
From: Travis Ralston <travpc@gmail.com>
Date: Fri, 29 Sep 2017 10:53:44 -0600
Subject: [PATCH] Don't show the unpin button if the user can't unpin the
 message.

Signed-off-by: Travis Ralston <travpc@gmail.com>
---
 src/components/views/rooms/PinnedEventsPanel.js      | 12 ++++++++++--
 .../vector-web/views/rooms/_PinnedEventsPanel.scss   |  3 ++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/views/rooms/PinnedEventsPanel.js b/src/components/views/rooms/PinnedEventsPanel.js
index 53bf3db650..8f898b11eb 100644
--- a/src/components/views/rooms/PinnedEventsPanel.js
+++ b/src/components/views/rooms/PinnedEventsPanel.js
@@ -55,6 +55,9 @@ const PinnedEventTile = React.createClass({
             } else if (this.props.onUnpinned) this.props.onUnpinned();
         }
     },
+    _canUnpin: function() {
+        return this.props.mxRoom.currentState.mayClientSendStateEvent('m.room.pinned_events', MatrixClientPeg.get());
+    },
     render: function() {
         const MessageEvent = sdk.getComponent("views.messages.MessageEvent");
         const MemberAvatar = sdk.getComponent("views.avatars.MemberAvatar");
@@ -62,14 +65,19 @@ const PinnedEventTile = React.createClass({
         const sender = this.props.mxRoom.getMember(this.props.mxEvent.getSender());
         const avatarSize = 40;
 
+        let unpinButton = null;
+        if (this._canUnpin()) {
+            unpinButton = <img src="img/cancel-red.svg" className="mx_PinnedEventTile_unpinButton" width="8" height="8"
+                               onClick={this.onUnpinClicked} alt={_t('Unpin Message')} title={_t('Unpin Message')} />;
+        }
+
         return (
             <div className="mx_PinnedEventTile">
                 <div className="mx_PinnedEventTile_actions">
                     <AccessibleButton className="mx_PinnedEventTile_gotoButton mx_textButton" onClick={this.onTileClicked}>
                         Jump to message
                     </AccessibleButton>
-                    <img src="img/cancel-red.svg" className="mx_PinnedEventTile_unpinButton" width="8" height="8"
-                         onClick={this.onUnpinClicked} alt={_t('Unpin Message')} title={_t('Unpin Message')} />
+                    { unpinButton }
                 </div>
 
                 <MemberAvatar member={sender} width={avatarSize} height={avatarSize} />
diff --git a/src/skins/vector/css/vector-web/views/rooms/_PinnedEventsPanel.scss b/src/skins/vector/css/vector-web/views/rooms/_PinnedEventsPanel.scss
index a2041cfe44..44297cfae7 100644
--- a/src/skins/vector/css/vector-web/views/rooms/_PinnedEventsPanel.scss
+++ b/src/skins/vector/css/vector-web/views/rooms/_PinnedEventsPanel.scss
@@ -20,7 +20,8 @@ limitations under the License.
 
 .mx_PinnedEventsPanel_body {
     max-height: 300px;
-    overflow-y: scroll;
+    overflow-y: auto;
+    padding-bottom: 15px;
 }
 
 .mx_PinnedEventsPanel_header {