de-lint RoomHeader, Avatar, SdkConfig, SlashCommands

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

.eslintignore.errorfiles

@@ -9,7 +9,6 @@ src/autocomplete/DuckDuckGoProvider.js
 src/autocomplete/EmojiProvider.js
 src/autocomplete/RoomProvider.js
 src/autocomplete/UserProvider.js
-src/Avatar.js
 src/BasePlatform.js
 src/CallHandler.js
 src/component-index.js
@@ -96,7 +95,6 @@ src/components/views/rooms/MessageComposerInput.js
 src/components/views/rooms/MessageComposerInputOld.js
 src/components/views/rooms/PresenceLabel.js
 src/components/views/rooms/ReadReceiptMarker.js
-src/components/views/rooms/RoomHeader.js
 src/components/views/rooms/RoomList.js
 src/components/views/rooms/RoomNameEditor.js
 src/components/views/rooms/RoomPreviewBar.js
@@ -148,9 +146,7 @@ src/RoomNotifs.js
 src/Rooms.js
 src/ScalarAuthClient.js
 src/ScalarMessaging.js
-src/SdkConfig.js
 src/Skinner.js
-src/SlashCommands.js
 src/stores/LifecycleStore.js
 src/TabComplete.js
 src/TabCompleteEntries.js

src/Avatar.js

@@ -15,18 +15,18 @@ limitations under the License.
 */
 
 'use strict';
-var ContentRepo = require("matrix-js-sdk").ContentRepo;
+import {ContentRepo} from 'matrix-js-sdk';
-var MatrixClientPeg = require('./MatrixClientPeg');
+import MatrixClientPeg from './MatrixClientPeg';
 
 module.exports = {
     avatarUrlForMember: function(member, width, height, resizeMethod) {
-        var url = member.getAvatarUrl(
+        let url = member.getAvatarUrl(
             MatrixClientPeg.get().getHomeserverUrl(),
             Math.floor(width * window.devicePixelRatio),
             Math.floor(height * window.devicePixelRatio),
             resizeMethod,
             false,
-            false
+            false,
         );
         if (!url) {
             // member can be null here currently since on invites, the JS SDK
@@ -38,11 +38,11 @@ module.exports = {
     },
 
     avatarUrlForUser: function(user, width, height, resizeMethod) {
-        var url = ContentRepo.getHttpUriForMxc(
+        const url = ContentRepo.getHttpUriForMxc(
             MatrixClientPeg.get().getHomeserverUrl(), user.avatarUrl,
             Math.floor(width * window.devicePixelRatio),
             Math.floor(height * window.devicePixelRatio),
-            resizeMethod
+            resizeMethod,
         );
         if (!url || url.length === 0) {
             return null;
@@ -51,11 +51,11 @@ module.exports = {
     },
 
     defaultAvatarUrlForString: function(s) {
-        var images = ['76cfa6', '50e2c2', 'f4c371'];
+        const images = ['76cfa6', '50e2c2', 'f4c371'];
-        var total = 0;
+        let total = 0;
-        for (var i = 0; i < s.length; ++i) {
+        for (let i = 0; i < s.length; ++i) {
             total += s.charCodeAt(i);
         }
         return 'img/' + images[total % images.length] + '.png';
-    }
+    },
 };

src/SdkConfig.js

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-var DEFAULTS = {
+const DEFAULTS = {
     // URL to a page we show in an iframe to configure integrations
     integrations_ui_url: "https://scalar.vector.im/",
     // Base URL to the REST interface of the integrations server
@@ -30,8 +30,8 @@ class SdkConfig {
     }
 
     static put(cfg) {
-        var defaultKeys = Object.keys(DEFAULTS);
+        const defaultKeys = Object.keys(DEFAULTS);
-        for (var i = 0; i < defaultKeys.length; ++i) {
+        for (let i = 0; i < defaultKeys.length; ++i) {
             if (cfg[defaultKeys[i]] === undefined) {
                 cfg[defaultKeys[i]] = DEFAULTS[defaultKeys[i]];
             }

src/SlashCommands.js

@@ -344,8 +344,7 @@ const commands = {
                         _t('WARNING: KEY VERIFICATION FAILED! The signing key for %(userId)s and device' +
                            ' %(deviceId)s is "%(fprint)s" which does not match the provided key' +
                            ' "%(fingerprint)s". This could mean your communications are being intercepted!',
-                            {deviceId: deviceId, fprint: fprint, userId: userId, fingerprint: fingerprint})
+                            {deviceId: deviceId, fprint: fprint, userId: userId, fingerprint: fingerprint}));
-                    );
                 }
             }
         }

src/components/views/rooms/RoomHeader.js

@@ -16,18 +16,18 @@ limitations under the License.
 
 'use strict';
 
-var React = require('react');
+import React from 'react';
-var classNames = require('classnames');
+import classNames from 'classnames';
-var sdk = require('../../../index');
+import sdk from '../../../index';
 import { _t } from '../../../languageHandler';
-var MatrixClientPeg = require('../../../MatrixClientPeg');
+import MatrixClientPeg from '../../../MatrixClientPeg';
-var Modal = require("../../../Modal");
+import Modal from "../../../Modal";
-var dis = require("../../../dispatcher");
+import dis from "../../../dispatcher";
-var rate_limited_func = require('../../../ratelimitedfunc');
+import RateLimitedFunc from '../../../ratelimitedfunc';
 
-var linkify = require('linkifyjs');
+import * as linkify from 'linkifyjs';
-var linkifyElement = require('linkifyjs/element');
+import linkifyElement from 'linkifyjs/element';
-var linkifyMatrix = require('../../../linkify-matrix');
+import linkifyMatrix from '../../../linkify-matrix';
 import AccessibleButton from '../elements/AccessibleButton';
 import {CancelButton} from './SimpleRoomHeader';
 
@@ -58,7 +58,7 @@ module.exports = React.createClass({
     },
 
     componentDidMount: function() {
-        var cli = MatrixClientPeg.get();
+        const cli = MatrixClientPeg.get();
         cli.on("RoomState.events", this._onRoomStateEvents);
 
         // When a room name occurs, RoomState.events is fired *before*
@@ -79,14 +79,14 @@ module.exports = React.createClass({
         if (this.props.room) {
             this.props.room.removeListener("Room.name", this._onRoomNameChange);
         }
-        var cli = MatrixClientPeg.get();
+        const cli = MatrixClientPeg.get();
         if (cli) {
             cli.removeListener("RoomState.events", this._onRoomStateEvents);
         }
     },
 
     _onRoomStateEvents: function(event, state) {
-        if (!this.props.room || event.getRoomId() != this.props.room.roomId) {
+        if (!this.props.room || event.getRoomId() !== this.props.room.roomId) {
             return;
         }
 
@@ -94,7 +94,8 @@ module.exports = React.createClass({
         this._rateLimitedUpdate();
     },
 
-    _rateLimitedUpdate: new rate_limited_func(function() {
+    _rateLimitedUpdate: new RateLimitedFunc(function() {
+        /* eslint-disable babel/no-invalid-this */
         this.forceUpdate();
     }, 500),
 
@@ -109,15 +110,14 @@ module.exports = React.createClass({
     },
 
     onAvatarSelected: function(ev) {
-        var self = this;
+        const changeAvatar = this.refs.changeAvatar;
-        var changeAvatar = this.refs.changeAvatar;
         if (!changeAvatar) {
             console.error("No ChangeAvatar found to upload image to!");
             return;
         }
         changeAvatar.onFileSelected(ev).catch(function(err) {
-            var errMsg = (typeof err === "string") ? err : (err.error || "");
+            const errMsg = (typeof err === "string") ? err : (err.error || "");
-            var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
+            const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
             console.error("Failed to set avatar: " + errMsg);
             Modal.createDialog(ErrorDialog, {
                 title: _t("Error"),
@@ -133,10 +133,10 @@ module.exports = React.createClass({
     /**
      * After editing the settings, get the new name for the room
      *
-     * Returns undefined if we didn't let the user edit the room name
+     * @return {?string} newName or undefined if we didn't let the user edit the room name
      */
     getEditedName: function() {
-        var newName;
+        let newName;
         if (this.refs.nameEditor) {
             newName = this.refs.nameEditor.getRoomName();
         }
@@ -146,10 +146,10 @@ module.exports = React.createClass({
     /**
      * After editing the settings, get the new topic for the room
      *
-     * Returns undefined if we didn't let the user edit the room topic
+     * @return {?string} newTopic or undefined if we didn't let the user edit the room topic
      */
     getEditedTopic: function() {
-        var newTopic;
+        let newTopic;
         if (this.refs.topicEditor) {
             newTopic = this.refs.topicEditor.getTopic();
         }
@@ -157,38 +157,31 @@ module.exports = React.createClass({
     },
 
     render: function() {
-        var RoomAvatar = sdk.getComponent("avatars.RoomAvatar");
+        const RoomAvatar = sdk.getComponent("avatars.RoomAvatar");
-        var ChangeAvatar = sdk.getComponent("settings.ChangeAvatar");
+        const ChangeAvatar = sdk.getComponent("settings.ChangeAvatar");
-        var TintableSvg = sdk.getComponent("elements.TintableSvg");
+        const TintableSvg = sdk.getComponent("elements.TintableSvg");
         const EmojiText = sdk.getComponent('elements.EmojiText');
 
-        var header;
+        let name = null;
-        var name = null;
+        let searchStatus = null;
-        var searchStatus = null;
+        let topicElement = null;
-        var topic_el = null;
+        let cancelButton = null;
-        var cancel_button = null;
+        let spinner = null;
-        var spinner = null;
+        let saveButton = null;
-        var save_button = null;
+        let settingsButton = null;
-        var settings_button = null;
+
+        let canSetRoomName;
+        let canSetRoomAvatar;
+        let canSetRoomTopic;
         if (this.props.editing) {
-
             // calculate permissions.  XXX: this should be done on mount or something
-            var user_id = MatrixClientPeg.get().credentials.userId;
+            const userId = MatrixClientPeg.get().credentials.userId;
 
-            var can_set_room_name = this.props.room.currentState.maySendStateEvent(
+            canSetRoomName = this.props.room.currentState.maySendStateEvent('m.room.name', userId);
-                'm.room.name', user_id
+            canSetRoomAvatar = this.props.room.currentState.maySendStateEvent('m.room.avatar', userId);
-            );
+            canSetRoomTopic = this.props.room.currentState.maySendStateEvent('m.room.topic', userId);
-            var can_set_room_avatar = this.props.room.currentState.maySendStateEvent(
-                'm.room.avatar', user_id
-            );
-            var can_set_room_topic = this.props.room.currentState.maySendStateEvent(
-                'm.room.topic', user_id
-            );
-            var can_set_room_name = this.props.room.currentState.maySendStateEvent(
-                'm.room.name', user_id
-            );
 
-            save_button = (
+            saveButton = (
                 <AccessibleButton className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>
                     {_t("Save")}
                 </AccessibleButton>
@@ -196,39 +189,41 @@ module.exports = React.createClass({
         }
 
         if (this.props.onCancelClick) {
-            cancel_button = <CancelButton onClick={this.props.onCancelClick}/>;
+            cancelButton = <CancelButton onClick={this.props.onCancelClick}/>;
         }
 
         if (this.props.saving) {
-            var Spinner = sdk.getComponent("elements.Spinner");
+            const Spinner = sdk.getComponent("elements.Spinner");
             spinner = <div className="mx_RoomHeader_spinner"><Spinner/></div>;
         }
 
-        if (can_set_room_name) {
+        if (canSetRoomName) {
-            var RoomNameEditor = sdk.getComponent("rooms.RoomNameEditor");
+            const RoomNameEditor = sdk.getComponent("rooms.RoomNameEditor");
             name = <RoomNameEditor ref="nameEditor" room={this.props.room} />;
-        }
+        } else {
-        else {
-            var searchStatus;
             // don't display the search count until the search completes and
             // gives us a valid (possibly zero) searchCount.
-            if (this.props.searchInfo && this.props.searchInfo.searchCount !== undefined && this.props.searchInfo.searchCount !== null) {
+            if (this.props.searchInfo &&
-                searchStatus = <div className="mx_RoomHeader_searchStatus">&nbsp;{ _t("(~%(count)s results)", { count: this.props.searchInfo.searchCount }) }</div>;
+                this.props.searchInfo.searchCount !== undefined &&
+                this.props.searchInfo.searchCount !== null) {
+                searchStatus = <div className="mx_RoomHeader_searchStatus">&nbsp;
+                    { _t("(~%(count)s results)", { count: this.props.searchInfo.searchCount }) }
+                </div>;
             }
 
             // XXX: this is a bit inefficient - we could just compare room.name for 'Empty room'...
-            var settingsHint = false;
+            let settingsHint = false;
-            var members = this.props.room ? this.props.room.getJoinedMembers() : undefined;
+            const members = this.props.room ? this.props.room.getJoinedMembers() : undefined;
             if (members) {
                 if (members.length === 1 && members[0].userId === MatrixClientPeg.get().credentials.userId) {
-                    var name = this.props.room.currentState.getStateEvents('m.room.name', '');
+                    name = this.props.room.currentState.getStateEvents('m.room.name', '');
                     if (!name || !name.getContent().name) {
                         settingsHint = true;
                     }
                 }
             }
 
-            var roomName = _t("Join Room");
+            let roomName = _t("Join Room");
             if (this.props.oobData && this.props.oobData.name) {
                 roomName = this.props.oobData.name;
             } else if (this.props.room) {
@@ -243,24 +238,25 @@ module.exports = React.createClass({
                 </div>;
         }
 
-        if (can_set_room_topic) {
+        if (canSetRoomTopic) {
-            var RoomTopicEditor = sdk.getComponent("rooms.RoomTopicEditor");
+            const RoomTopicEditor = sdk.getComponent("rooms.RoomTopicEditor");
-            topic_el = <RoomTopicEditor ref="topicEditor" room={this.props.room} />;
+            topicElement = <RoomTopicEditor ref="topicEditor" room={this.props.room} />;
         } else {
-            var topic;
+            let topic;
             if (this.props.room) {
-                var ev = this.props.room.currentState.getStateEvents('m.room.topic', '');
+                const ev = this.props.room.currentState.getStateEvents('m.room.topic', '');
                 if (ev) {
                     topic = ev.getContent().topic;
                 }
             }
             if (topic) {
-                topic_el = <div className="mx_RoomHeader_topic" ref="topic" title={ topic } dir="auto">{ topic }</div>;
+                topicElement =
+                    <div className="mx_RoomHeader_topic" ref="topic" title={ topic } dir="auto">{ topic }</div>;
             }
         }
 
-        var roomAvatar = null;
+        let roomAvatar = null;
-        if (can_set_room_avatar) {
+        if (canSetRoomAvatar) {
             roomAvatar = (
                 <div className="mx_RoomHeader_avatarPicker">
                     <div onClick={ this.onAvatarPickerClick }>
@@ -276,8 +272,7 @@ module.exports = React.createClass({
                     </div>
                 </div>
             );
-        }
+        } else if (this.props.room || (this.props.oobData && this.props.oobData.name)) {
-        else if (this.props.room || (this.props.oobData && this.props.oobData.name)) {
             roomAvatar = (
                 <div onClick={this.props.onSettingsClick}>
                     <RoomAvatar room={this.props.room} width={48} height={48} oobData={this.props.oobData} />
@@ -285,9 +280,8 @@ module.exports = React.createClass({
             );
         }
 
-        var settings_button;
         if (this.props.onSettingsClick) {
-            settings_button =
+            settingsButton =
                 <AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onSettingsClick} title={_t("Settings")}>
                     <TintableSvg src="img/icons-settings-room.svg" width="16" height="16"/>
                 </AccessibleButton>;
@@ -301,42 +295,43 @@ module.exports = React.createClass({
 //                </div>;
 //        }
 
-        var forget_button;
+        let forgetButton;
         if (this.props.onForgetClick) {
-            forget_button =
+            forgetButton =
                 <AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onForgetClick} title={ _t("Forget room") }>
                     <TintableSvg src="img/leave.svg" width="26" height="20"/>
                 </AccessibleButton>;
         }
 
-        let search_button;
+        let searchButton;
         if (this.props.onSearchClick && this.props.inRoom) {
-            search_button =
+            searchButton =
                 <AccessibleButton className="mx_RoomHeader_button" onClick={this.props.onSearchClick} title={ _t("Search") }>
                     <TintableSvg src="img/icons-search.svg" width="35" height="35"/>
                 </AccessibleButton>;
         }
 
-        var rightPanel_buttons;
+        let rightPanelButtons;
         if (this.props.collapsedRhs) {
-            rightPanel_buttons =
+            rightPanelButtons =
                 <AccessibleButton className="mx_RoomHeader_button" onClick={this.onShowRhsClick} title={ _t('Show panel') }>
                     <TintableSvg src="img/maximise.svg" width="10" height="16"/>
                 </AccessibleButton>;
         }
 
-        var right_row;
+        let rightRow;
         if (!this.props.editing) {
-            right_row =
+            rightRow =
                 <div className="mx_RoomHeader_rightRow">
-                    { settings_button }
+                    { settingsButton }
-                    { forget_button }
+                    { forgetButton }
-                    { search_button }
+                    { searchButton }
-                    { rightPanel_buttons }
+                    { rightPanelButtons }
                 </div>;
         }
 
-        header =
+        return (
+            <div className={ "mx_RoomHeader " + (this.props.editing ? "mx_RoomHeader_editing" : "") }>
                 <div className="mx_RoomHeader_wrapper">
                     <div className="mx_RoomHeader_leftRow">
                         <div className="mx_RoomHeader_avatar">
@@ -344,18 +339,14 @@ module.exports = React.createClass({
                         </div>
                         <div className="mx_RoomHeader_info">
                             { name }
-                        { topic_el }
+                            { topicElement }
                         </div>
                     </div>
                     {spinner}
-                {save_button}
+                    {saveButton}
-                {cancel_button}
+                    {cancelButton}
-                {right_row}
+                    {rightRow}
-            </div>;
+                </div>
-
-        return (
-            <div className={ "mx_RoomHeader " + (this.props.editing ? "mx_RoomHeader_editing" : "") }>
-                { header }
             </div>
         );
     },