Merge branch 'develop' into matthew/warn-unknown-devices

src/components/structures/UserSettings.js

@@ -26,6 +26,7 @@ var UserSettingsStore = require('../../UserSettingsStore');
 var GeminiScrollbar = require('react-gemini-scrollbar');
 var Email = require('../../email');
 var AddThreepid = require('../../AddThreepid');
+var SdkConfig = require('../../SdkConfig');
 import AccessibleButton from '../views/elements/AccessibleButton';
 
 // if this looks like a release, use the 'version' from package.json; else use
@@ -388,6 +389,14 @@ module.exports = React.createClass({
         Modal.createDialog(DeactivateAccountDialog, {});
     },
 
+    _onBugReportClicked: function() {
+        const BugReportDialog = sdk.getComponent("dialogs.BugReportDialog");
+        if (!BugReportDialog) {
+            return;
+        }
+        Modal.createDialog(BugReportDialog, {});
+    },
+
     _onInviteStateChange: function(event, member, oldMembership) {
         if (member.userId === this._me && oldMembership === "invite") {
             this.forceUpdate();
@@ -547,6 +556,23 @@ module.exports = React.createClass({
         );
     },
 
+    _renderBugReport: function() {
+        if (!SdkConfig.get().bug_report_endpoint_url) {
+            return <div />
+        }
+        return (
+            <div>
+                <h3>Bug Report</h3>
+                <div className="mx_UserSettings_section">
+                    <p>Found a bug?</p>
+                    <button className="mx_UserSettings_button danger"
+                        onClick={this._onBugReportClicked}>Report it
+                    </button>
+                </div>
+            </div>
+        );
+    },
+
     _renderLabs: function() {
         // default to enabled if undefined
         if (this.props.enableLabs === false) return null;
@@ -800,6 +826,7 @@ module.exports = React.createClass({
                 {this._renderDevicesPanel()}
                 {this._renderCryptoInfo()}
                 {this._renderBulkOptions()}
+                {this._renderBugReport()}
 
                 <h3>Advanced</h3>
 

src/components/views/rooms/RoomHeader.js

@@ -27,6 +27,7 @@ var linkify = require('linkifyjs');
 var linkifyElement = require('linkifyjs/element');
 var linkifyMatrix = require('../../../linkify-matrix');
 import AccessibleButton from '../elements/AccessibleButton';
+import {CancelButton} from './SimpleRoomHeader';
 
 linkifyMatrix(linkify);
 
@@ -184,7 +185,7 @@ module.exports = React.createClass({
             );
 
             save_button = <AccessibleButton className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</AccessibleButton>;
-            cancel_button = <AccessibleButton className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </AccessibleButton>;
+            cancel_button = <CancelButton onClick={this.props.onCancelClick}/>;
         }
 
         if (this.props.saving) {

src/components/views/rooms/SimpleRoomHeader.js

@@ -16,16 +16,27 @@ limitations under the License.
 
 'use strict';
 
-var React = require('react');
-var sdk = require('../../../index');
-var dis = require("../../../dispatcher");
+import React from 'react';
+import dis from '../../../dispatcher';
 import AccessibleButton from '../elements/AccessibleButton';
 
+// cancel button which is shared between room header and simple room header
+export function CancelButton(props) {
+    const {onClick} = props;
+
+    return (
+        <AccessibleButton className='mx_RoomHeader_cancelButton' onClick={onClick}>
+            <img src="img/cancel.svg" className='mx_filterFlipColor'
+                width="18" height="18" alt="Cancel"/>
+        </AccessibleButton>
+    );
+}
+
 /*
  * A stripped-down room header used for things like the user settings
  * and room directory.
  */
-module.exports = React.createClass({
+export default React.createClass({
     displayName: 'SimpleRoomHeader',
 
     propTypes: {
@@ -41,15 +52,15 @@ module.exports = React.createClass({
     },
 
     render: function() {
-        var TintableSvg = sdk.getComponent("elements.TintableSvg");
-
-        var cancelButton;
+        let cancelButton;
         if (this.props.onCancelClick) {
-            cancelButton = <AccessibleButton className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </AccessibleButton>;
+            cancelButton = <CancelButton onClick={this.props.onCancelClick} />;
         }
 
-        var showRhsButton;
+        let showRhsButton;
         /* // don't bother cluttering things up with this for now.
+        const TintableSvg = sdk.getComponent("elements.TintableSvg");
+
         if (this.props.collapsedRhs) {
             showRhsButton =
                 <div className="mx_RoomHeader_button" style={{ float: 'right' }} onClick={this.onShowRhsClick} title=">">