Cleaned up JSX errors

web/react/components/more_direct_channels.jsx

@@ -16,10 +16,9 @@ export default class MoreDirectChannels extends React.Component {
     }
 
     componentDidMount() {
-        var self = this;
+        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', (e) => {
-        $(React.findDOMNode(this.refs.modal)).on('show.bs.modal', function showModal(e) {
             var button = e.relatedTarget;
-            self.setState({channels: $(button).data('channels')});
+            this.setState({channels: $(button).data('channels')}); // eslint-disable-line react/no-did-mount-set-state
         });
     }
 
@@ -30,14 +29,45 @@ export default class MoreDirectChannels extends React.Component {
     }
 
     render() {
-        var self = this;
-
         var directMessageItems = this.state.channels.map((channel, index) => {
             var badge = '';
             var titleClass = '';
             var handleClick = null;
 
-            if (!channel.fake) {
+            if (channel.fake) {
+                // It's a direct message channel that doesn't exist yet so let's create it now
+                var otherUserId = utils.getUserIdFromChannelName(channel);
+
+                if (this.state.loadingDMChannel === index) {
+                    badge = (
+                        <img
+                            className='channel-loading-gif pull-right'
+                            src='/static/images/load.gif'
+                        />
+                    );
+                }
+
+                if (this.state.loadingDMChannel === -1) {
+                    handleClick = (e) => {
+                        e.preventDefault();
+                        this.setState({loadingDMChannel: index});
+                        this.handleJoinDirectChannel(channel);
+
+                        Client.createDirectChannel(channel, otherUserId,
+                            (data) => {
+                                $(React.findDOMNode(this.refs.modal)).modal('hide');
+                                this.setState({loadingDMChannel: -1});
+                                AsyncClient.getChannel(data.id);
+                                utils.switchChannel(data);
+                            },
+                            () => {
+                                this.setState({loadingDMChannel: -1});
+                                window.location.href = TeamStore.getCurrentTeamUrl() + '/channels/' + channel.name;
+                            }
+                        );
+                    };
+                }
+            } else {
                 if (channel.unread) {
                     badge = <span className='badge pull-right small'>{channel.unread}</span>;
                     titleClass = 'unread-title';
@@ -47,41 +77,8 @@ export default class MoreDirectChannels extends React.Component {
                     e.preventDefault();
                     this.handleJoinDirectChannel(channel);
                     utils.switchChannel(channel);
-                    $(React.findDOMNode(self.refs.modal)).modal('hide');
+                    $(React.findDOMNode(this.refs.modal)).modal('hide');
                 };
-            } else {
-                // It's a direct message channel that doesn't exist yet so let's create it now
-                var otherUserId = utils.getUserIdFromChannelName(channel);
-
-                if (self.state.loadingDMChannel === index) {
-                    badge = (
-                        <img
-                            className='channel-loading-gif pull-right'
-                            src='/static/images/load.gif'
-                        />
-                    );
-                }
-
-                if (self.state.loadingDMChannel === -1) {
-                    handleClick = (e) => {
-                        e.preventDefault();
-                        self.setState({loadingDMChannel: index});
-                        this.handleJoinDirectChannel(channel);
-
-                        Client.createDirectChannel(channel, otherUserId,
-                            function success(data) {
-                                $(React.findDOMNode(self.refs.modal)).modal('hide');
-                                self.setState({loadingDMChannel: -1});
-                                AsyncClient.getChannel(data.id);
-                                utils.switchChannel(data);
-                            },
-                            function error() {
-                                self.setState({loadingDMChannel: -1});
-                                window.location.href = TeamStore.getCurrentTeamUrl() + '/channels/' + channel.name;
-                            }
-                        );
-                    };
-                }
             }
 
             return (
@@ -112,10 +109,10 @@ export default class MoreDirectChannels extends React.Component {
                                 className='close'
                                 data-dismiss='modal'
                             >
-                                <span aria-hidden='true'>&times;</span>
+                                <span aria-hidden='true'>{'×'}</span>
-                                <span className='sr-only'>Close</span>
+                                <span className='sr-only'>{'Close'}</span>
                             </button>
-                            <h4 className='modal-title'>More Direct Messages</h4>
+                            <h4 className='modal-title'>{'More Direct Messages'}</h4>
                         </div>
                         <div className='modal-body'>
                             <ul className='nav nav-pills nav-stacked'>
@@ -127,7 +124,7 @@ export default class MoreDirectChannels extends React.Component {
                                 type='button'
                                 className='btn btn-default'
                                 data-dismiss='modal'
-                            >Close</button>
+                            >{'Close'}</button>
                         </div>
                     </div>
                 </div>

web/react/components/sidebar.jsx

@@ -76,19 +76,19 @@ export default class Sidebar extends React.Component {
             let forceShow = false;
             let channel = ChannelStore.getByName(channelName);
 
-            if (!channel) {
+            if (channel) {
+                const member = members[channel.id];
+                const msgCount = channel.total_msg_count - member.msg_count;
+
+                // always show a channel if either it is the current one or if it is unread, but it is not currently being left
+                forceShow = (currentId === channel.id || msgCount > 0) && !this.isLeaving.get(channel.id);
+            } else {
                 channel = {};
                 channel.fake = true;
                 channel.name = channelName;
                 channel.last_post_at = 0;
                 channel.total_msg_count = 0;
                 channel.type = 'D';
-            } else {
-                const member = members[channel.id];
-                const msgCount = channel.total_msg_count - member.msg_count;
-
-                // always show a channel if either it is the current one or if it is unread, but it is not currently being left
-                forceShow = (currentId === channel.id || msgCount > 0) && !this.isLeaving.get(channel.id);
             }
 
             channel.display_name = teammate.username;
@@ -96,10 +96,8 @@ export default class Sidebar extends React.Component {
             channel.status = UserStore.getStatus(teammate.id);
 
             if (preferences.some((preference) => (preference.alt_id === teammate.id && preference.value !== 'false'))) {
-                console.log(teammate.id + " is visible");
                 visibleDirectChannels.push(channel);
             } else if (forceShow) {
-                console.log(teammate.id + " needs to be visible");
                 // make sure that unread direct channels are visible
                 const preference = PreferenceStore.setPreferenceWithAltId(Constants.Preferences.CATEGORY_DIRECT_CHANNELS,
                     Constants.Preferences.NAME_SHOW, teammate.id, 'true');
@@ -117,9 +115,9 @@ export default class Sidebar extends React.Component {
         return {
             activeId: currentId,
             channels: ChannelStore.getAll(),
-            members: members,
+            members,
-            visibleDirectChannels: visibleDirectChannels,
+            visibleDirectChannels,
-            hiddenDirectChannels: hiddenDirectChannels
+            hiddenDirectChannels
         };
     }
 
@@ -419,10 +417,10 @@ export default class Sidebar extends React.Component {
 
         if (!channel.fake) {
             handleClick = function clickHandler(e) {
-                if (!e.target.attributes.getNamedItem('data-close')) {
+                if (e.target.attributes.getNamedItem('data-close')) {
-                    Utils.switchChannel(channel);
-                } else {
                     handleClose(channel);
+                } else {
+                    Utils.switchChannel(channel);
                 }
 
                 e.preventDefault();
@@ -435,22 +433,22 @@ export default class Sidebar extends React.Component {
                 handleClick = function clickHandler(e) {
                     e.preventDefault();
 
-                    if (!e.target.attributes.getNamedItem('data-close')) {
+                    if (e.target.attributes.getNamedItem('data-close')) {
+                        handleClose(channel);
+                    } else {
                         this.setState({loadingDMChannel: index});
 
                         Client.createDirectChannel(channel, otherUserId,
-                            function success(data) {
+                            (data) => {
                                 this.setState({loadingDMChannel: -1});
                                 AsyncClient.getChannel(data.id);
                                 Utils.switchChannel(data);
-                            }.bind(this),
+                            },
-                            function error() {
+                            () => {
                                 this.setState({loadingDMChannel: -1});
                                 window.location.href = TeamStore.getCurrentTeamUrl() + '/channels/' + channel.name;
-                            }.bind(this)
+                            }
                         );
-                    } else {
-                        handleClose(channel);
                     }
                 }.bind(this);
             }
@@ -578,7 +576,7 @@ export default class Sidebar extends React.Component {
                     <ul className='nav nav-pills nav-stacked'>
                         <li>
                             <h4>
-                                Channels
+                                {'Channels'}
                                 <a
                                     className='add-channel-btn'
                                     href='#'
@@ -597,7 +595,7 @@ export default class Sidebar extends React.Component {
                                 data-target='#more_channels'
                                 data-channeltype='O'
                             >
-                                More...
+                                {'More...'}
                             </a>
                         </li>
                     </ul>
@@ -605,7 +603,7 @@ export default class Sidebar extends React.Component {
                     <ul className='nav nav-pills nav-stacked'>
                         <li>
                             <h4>
-                                Private Groups
+                                {'Private Groups'}
                                 <a
                                     className='add-channel-btn'
                                     href='#'
@@ -618,7 +616,7 @@ export default class Sidebar extends React.Component {
                         {privateChannelItems}
                     </ul>
                     <ul className='nav nav-pills nav-stacked'>
-                        <li><h4>Direct Messages</h4></li>
+                        <li><h4>{'Direct Messages'}</h4></li>
                         {directMessageItems}
                         {directMessageMore}
                     </ul>