Fix channel selection when switching teams (#167)

* Fix channel selection when switching teams

* Making the listview channels to already have if its current

app/components/channel_drawer/channel_drawer.js

@@ -3,7 +3,7 @@
 
 import React from 'react';
 import {Platform, BackAndroid} from 'react-native';
-import PureRenderMixin from 'react-addons-pure-render-mixin';
+import deepEqual from 'deep-equal';
 
 import Drawer from 'react-native-drawer';
 import ChannelList from './channel_list';
@@ -27,7 +27,6 @@ export default class ChannelDrawer extends React.Component {
     constructor(props) {
         super(props);
 
-        this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
         this.handleBackButton = this.handleBackButton.bind(this);
     }
 
@@ -42,6 +41,9 @@ export default class ChannelDrawer extends React.Component {
             BackAndroid.removeEventListener('hardwareBackPress', this.handleBackButton);
         }
     }
+    shouldComponentUpdate(nextProps) {
+        return !deepEqual(this.props, nextProps, {strict: true});
+    }
 
     componentWillReceiveProps(nextProps) {
         if (!this.props.isOpen && nextProps.isOpen) {

app/components/channel_drawer/channel_list.js

@@ -9,6 +9,7 @@ import LineDivider from 'app/components/line_divider';
 import ChannelItem from './channel_item';
 import FormattedText from 'app/components/formatted_text';
 import UnreadIndicator from './unread_indicator';
+import deepEqual from 'deep-equal';
 
 const Styles = StyleSheet.create({
     container: {
@@ -72,6 +73,10 @@ export default class ChannelList extends React.Component {
         };
     }
 
+    shouldComponentUpdate(nextProps, nextState) {
+        return !deepEqual(this.props, nextProps, {strict: true}) || !deepEqual(this.state, nextState, {strict: true});
+    }
+
     componentWillReceiveProps(nextProps) {
         this.setState({
             dataSource: this.state.dataSource.cloneWithRows(this.buildData(nextProps))
@@ -181,7 +186,7 @@ export default class ChannelList extends React.Component {
                 hasUnread={unread}
                 mentions={mentions}
                 onSelectChannel={this.onSelectChannel}
-                isActive={channel.id === this.props.currentChannel.id}
+                isActive={channel.isCurrent}
                 theme={this.props.theme}
             />
         );

package.json

@@ -3,6 +3,7 @@
   "version": "0.0.1",
   "private": true,
   "dependencies": {
+    "deep-equal": "1.0.1",
     "intl": "1.2.5",
     "isomorphic-fetch": "2.2.1",
     "react": "15.4.1",

service/reducers/entities/teams.js

@@ -75,16 +75,20 @@ function membersInTeam(state = {}, action) {
     }
     case TeamsTypes.RECEIVED_MEMBERS_IN_TEAM: {
         const data = action.data;
-        const teamId = data[0].team_id;
-        const members = new Set(state[teamId]);
-        for (const member of data) {
-            members.add(member.user_id);
+        if (data.length) {
+            const teamId = data[0].team_id;
+            const members = new Set(state[teamId]);
+            for (const member of data) {
+                members.add(member.user_id);
+            }
+
+            return {
+                ...state,
+                [teamId]: members
+            };
         }
 
-        return {
-            ...state,
-            [teamId]: members
-        };
+        return state;
     }
     case TeamsTypes.REMOVE_MEMBER_FROM_TEAM: {
         const data = action.data;

service/selectors/entities/channels.js

@@ -38,11 +38,18 @@ export const getChannelsOnCurrentTeam = createSelector(
 );
 
 export const getChannelsByCategory = createSelector(
+    getCurrentChannelId,
     getChannelsOnCurrentTeam,
     (state) => state.entities.users,
     (state) => state.entities.preferences.myPreferences,
     (state) => state.entities.teams,
-    (channels, usersState, myPreferences, teamsState) => {
-        return buildDisplayableChannelList(usersState, teamsState, channels, myPreferences);
+    (currentChannelId, channels, usersState, myPreferences, teamsState) => {
+        const allChannels = channels.map((c) => {
+            const channel = {...c};
+            channel.isCurrent = c.id === currentChannelId;
+            return channel;
+        });
+
+        return buildDisplayableChannelList(usersState, teamsState, allChannels, myPreferences);
     }
 );

service/utils/channel_utils.js

@@ -147,7 +147,7 @@ function completeDirectChannelInfo(usersState, myPreferences, channel) {
         return channel;
     }
 
-    const dmChannelClone = JSON.parse(JSON.stringify(channel));
+    const dmChannelClone = {...channel};
     const teammateId = getUserIdFromChannelName(usersState.currentId, channel);
 
     return Object.assign(dmChannelClone, {