diff --git a/app/screens/channel_members/__snapshots__/channel_members.test.js.snap b/app/screens/channel_members/__snapshots__/channel_members.test.js.snap
new file mode 100644
index 000000000..638fd1a58
--- /dev/null
+++ b/app/screens/channel_members/__snapshots__/channel_members.test.js.snap
@@ -0,0 +1,85 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ChannelMembers should match snapshot 1`] = `
+
+
+
+
+
+
+
+`;
diff --git a/app/screens/channel_members/channel_members.js b/app/screens/channel_members/channel_members.js
index 1eb4fc40d..d3149d13c 100644
--- a/app/screens/channel_members/channel_members.js
+++ b/app/screens/channel_members/channel_members.js
@@ -225,20 +225,34 @@ export default class ChannelMembers extends PureComponent {
});
};
- renderItem = (props) => {
- // The list will re-render when the selection changes because it's passed into the list as extraData
- const selected = this.state.selectedIds[props.id];
- const enabled = props.id !== this.props.currentUserId;
-
+ renderItem = (props, selectProps) => {
return (
);
+ }
+
+ renderSelectableItem = (props) => {
+ // The list will re-render when the selection changes because selectedIds is passed into the list as extraData
+ const selectProps = {
+ selectable: true,
+ selected: this.state.selectedIds[props.id],
+ enabled: props.id !== this.props.currentUserId,
+ };
+
+ this.renderItem(props, selectProps);
+ }
+
+ renderUnselectableItem = (props) => {
+ const selectProps = {
+ selectable: false,
+ enabled: false,
+ };
+
+ this.renderItem(props, selectProps);
};
renderLoading = () => {
@@ -292,7 +306,7 @@ export default class ChannelMembers extends PureComponent {
render() {
const {formatMessage} = this.context.intl;
- const {theme} = this.props;
+ const {theme, canManageUsers} = this.props;
const {
removing,
loading,
@@ -374,7 +388,7 @@ export default class ChannelMembers extends PureComponent {
noResults={this.renderNoResults()}
onLoadMore={this.getProfiles}
onRowPress={this.handleSelectProfile}
- renderItem={this.renderItem}
+ renderItem={canManageUsers ? this.renderSelectableItem : this.renderUnselectableItem}
theme={theme}
/>
diff --git a/app/screens/channel_members/channel_members.test.js b/app/screens/channel_members/channel_members.test.js
new file mode 100644
index 000000000..16da3a7d5
--- /dev/null
+++ b/app/screens/channel_members/channel_members.test.js
@@ -0,0 +1,60 @@
+// 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/preferences';
+
+import {shallowWithIntl} from 'test/intl-test-helper';
+
+import CustomList from 'app/components/custom_list';
+import ChannelMembers from './channel_members';
+
+describe('ChannelMembers', () => {
+ const navigator = {
+ setOnNavigatorEvent: jest.fn(),
+ setButtons: jest.fn(),
+ };
+
+ const baseProps = {
+ theme: Preferences.THEMES.default,
+ currentUserId: 'current-user-id',
+ currentChannelId: 'current-channel-id',
+ canManageUsers: false,
+ actions: {
+ getProfilesInChannel: jest.fn().mockImplementation(() => Promise.resolve()),
+ handleRemoveChannelMembers: jest.fn(),
+ searchProfiles: jest.fn(),
+ },
+ navigator,
+ };
+
+ test('should match snapshot', () => {
+ const wrapper = shallowWithIntl(
+ ,
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+
+ test('should use renderUnselectableItem when canManagerUsers is false', () => {
+ const props = {...baseProps, canManageUsers: false};
+
+ const wrapper = shallowWithIntl(
+ ,
+ );
+
+ const renderItem = wrapper.find(CustomList).props().renderItem;
+ expect(renderItem).toEqual(wrapper.instance().renderUnselectableItem);
+ });
+
+ test('should use renderSelectableItem when canManagerUsers is true', () => {
+ const props = {...baseProps, canManageUsers: true};
+
+ const wrapper = shallowWithIntl(
+ ,
+ );
+
+ const renderItem = wrapper.find(CustomList).props().renderItem;
+ expect(renderItem).toEqual(wrapper.instance().renderSelectableItem);
+ });
+});
\ No newline at end of file