Do not show deactivated users when adding members (#2613)

app/screens/channel_add_members/channel_add_members.js

@@ -36,7 +36,7 @@ export default class ChannelAddMembers extends PureComponent {
         currentChannelId: PropTypes.string.isRequired,
         currentTeamId: PropTypes.string.isRequired,
         currentUserId: PropTypes.string.isRequired,
-        membersNotInChannel: PropTypes.array.isRequired,
+        profilesNotInChannel: PropTypes.array.isRequired,
         navigator: PropTypes.object,
         theme: PropTypes.object.isRequired,
     };
@@ -55,7 +55,6 @@ export default class ChannelAddMembers extends PureComponent {
         this.state = {
             adding: false,
             loading: false,
-            profiles: [],
             searchResults: [],
             selectedIds: {},
             term: '',
@@ -120,7 +119,7 @@ export default class ChannelAddMembers extends PureComponent {
                     currentChannelId,
                     this.page + 1,
                     General.PROFILE_CHUNK_SIZE
-                ).then(this.loadedProfiles);
+                ).then(this.onProfilesLoaded);
             });
         }
     }, 100);
@@ -172,14 +171,15 @@ export default class ChannelAddMembers extends PureComponent {
         this.setState({selectedIds: newSelected});
     };
 
-    loadedProfiles = ({data}) => {
-        const {profiles} = this.state;
+    onProfilesLoaded = ({data}) => {
         if (data && !data.length) {
             this.next = false;
         }
 
         this.page += 1;
-        this.setState({loading: false, profiles: [...profiles, ...data]});
+        this.setState({
+            loading: false,
+        });
     };
 
     onNavigatorEvent = (event) => {
@@ -271,11 +271,10 @@ export default class ChannelAddMembers extends PureComponent {
 
     render() {
         const {formatMessage} = this.context.intl;
-        const {currentUserId, theme} = this.props;
+        const {currentUserId, profilesNotInChannel, theme} = this.props;
         const {
             adding,
             loading,
-            profiles,
             searchResults,
             selectedIds,
             term,
@@ -321,7 +320,7 @@ export default class ChannelAddMembers extends PureComponent {
             data = [...exactMatches, ...results];
             listType = FLATLIST;
         } else {
-            data = createProfilesSections(profiles);
+            data = createProfilesSections(profilesNotInChannel.filter((user) => user.delete_at === 0));
             listType = SECTIONLIST;
         }
 

app/screens/channel_add_members/channel_add_members.test.js

@@ -0,0 +1,78 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+
+import {Preferences} from 'mattermost-redux/constants';
+
+import {shallowWithIntl} from 'test/intl-test-helper';
+
+import ChannelAddMembers from './channel_add_members';
+
+describe('ChannelAddMembers', () => {
+    const baseProps = {
+        actions: {
+            getTeamStats: jest.fn(),
+            getProfilesNotInChannel: jest.fn().mockResolvedValue({}),
+            handleAddChannelMembers: jest.fn().mockResolvedValue({}),
+            searchProfiles: jest.fn().mockResolvedValue({data: []}),
+        },
+        currentChannelId: 'current_channel_id',
+        currentTeamId: 'current_team_id',
+        currentUserId: 'current_user_id',
+        profilesNotInChannel: [],
+        navigator: {
+            pop: jest.fn(),
+            setButtons: jest.fn(),
+            setOnNavigatorEvent: jest.fn(),
+        },
+        theme: Preferences.THEMES.default,
+    };
+
+    test('should render without error and call functions on mount', () => {
+        shallowWithIntl(<ChannelAddMembers {...baseProps}/>);
+
+        expect(baseProps.actions.getTeamStats).toBeCalledTimes(1);
+        expect(baseProps.actions.getTeamStats).toBeCalledWith(baseProps.currentTeamId);
+
+        const button = {disabled: true, id: 'add-members', title: 'Add', showAsAction: 'always'};
+        expect(baseProps.navigator.setButtons).toBeCalledTimes(2);
+        expect(baseProps.navigator.setButtons.mock.calls[0][0]).toEqual({rightButtons: [button]});
+        expect(baseProps.navigator.setButtons.mock.calls[1][0]).toEqual({rightButtons: [button]});
+
+        expect(baseProps.navigator.setOnNavigatorEvent).toBeCalledTimes(1);
+    });
+
+    test('should match state on clearSearch', () => {
+        const wrapper = shallowWithIntl(<ChannelAddMembers {...baseProps}/>);
+
+        wrapper.setState({term: 'user', searchResults: [{id: '1', username: 'user-1'}]});
+
+        wrapper.instance().clearSearch();
+        wrapper.setState({term: '', searchResults: []});
+    });
+
+    test('should call props.navigator on close', () => {
+        const wrapper = shallowWithIntl(<ChannelAddMembers {...baseProps}/>);
+
+        wrapper.instance().close();
+        expect(baseProps.navigator.pop).toBeCalledTimes(1);
+        expect(baseProps.navigator.pop).toBeCalledWith({animated: true});
+    });
+
+    test('should match state on onProfilesLoaded', () => {
+        const wrapper = shallowWithIntl(<ChannelAddMembers {...baseProps}/>);
+        const instance = wrapper.instance();
+
+        instance.onProfilesLoaded({data: []});
+        expect(instance.page).toBe(0);
+        expect(instance.next).toBe(false);
+
+        instance.next = true;
+        wrapper.setState({loading: true});
+        instance.onProfilesLoaded({data: [{id: 'user_id_1', username: 'username_1'}]});
+        expect(instance.next).toBe(true);
+        expect(instance.page).toBe(1);
+        expect(wrapper.state('loading')).toBe(false);
+    });
+});

app/screens/channel_add_members/index.js

@@ -20,7 +20,7 @@ function mapStateToProps(state) {
         currentChannelId: getCurrentChannelId(state),
         currentTeamId: getCurrentTeamId(state),
         currentUserId: getCurrentUserId(state),
-        membersNotInChannel: getProfilesNotInCurrentChannel(state),
+        profilesNotInChannel: getProfilesNotInCurrentChannel(state),
         theme: getTheme(state),
     };
 }