From dc38d4546521b1982be8ebc4b0b46994751b6c6c Mon Sep 17 00:00:00 2001
From: enahum <nahumhbl@gmail.com>
Date: Mon, 3 Apr 2017 16:32:36 -0300
Subject: [PATCH] PLT-6110 tap on the user name selects the row for add &
 manage members (#450)

---
 app/components/custom_list/member_list_row.js | 104 +++++++++---------
 .../channel_add_members.js                    |   3 +-
 app/scenes/channel_members/channel_members.js |   2 +-
 3 files changed, 56 insertions(+), 53 deletions(-)

diff --git a/app/components/custom_list/member_list_row.js b/app/components/custom_list/member_list_row.js
index 7470fab8a..5426c6920 100644
--- a/app/components/custom_list/member_list_row.js
+++ b/app/components/custom_list/member_list_row.js
@@ -13,57 +13,6 @@ import Icon from 'react-native-vector-icons/FontAwesome';
 import ProfilePicture from 'app/components/profile_picture';
 import {makeStyleSheetFromTheme, changeOpacity} from 'app/utils/theme';
 
-const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
-    return StyleSheet.create({
-        container: {
-            flexDirection: 'row',
-            height: 65,
-            paddingHorizontal: 15,
-            alignItems: 'center',
-            backgroundColor: theme.centerChannelBg
-        },
-        displayName: {
-            fontSize: 16,
-            color: theme.centerChannelColor
-        },
-        icon: {
-            fontSize: 20,
-            color: theme.centerChannelColor
-        },
-        textContainer: {
-            flexDirection: 'row',
-            marginLeft: 5
-        },
-        username: {
-            marginLeft: 5,
-            fontSize: 16,
-            color: changeOpacity(theme.centerChannelColor, 0.5)
-        },
-        selector: {
-            height: 28,
-            width: 28,
-            borderRadius: 14,
-            borderWidth: 1,
-            borderColor: '#888',
-            alignItems: 'center',
-            justifyContent: 'center'
-        },
-        selectorContainer: {
-            height: 50,
-            paddingRight: 15,
-            alignItems: 'center',
-            justifyContent: 'center'
-        },
-        selectorDisabled: {
-            backgroundColor: '#888'
-        },
-        selectorFilled: {
-            backgroundColor: '#378FD2',
-            borderWidth: 0
-        }
-    });
-});
-
 function createTouchableComponent(children, action) {
     return (
         <TouchableOpacity onPress={action}>
@@ -118,6 +67,8 @@ function MemberListRow(props) {
 
     if (typeof onPress === 'function') {
         return createTouchableComponent(RowComponent, () => onPress(id));
+    } else if (typeof props.onRowSelect === 'function') {
+        return createTouchableComponent(RowComponent, props.onRowSelect);
     }
 
     return RowComponent;
@@ -136,4 +87,55 @@ MemberListRow.propTypes = {
     disableSelect: PropTypes.bool
 };
 
+const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
+    return StyleSheet.create({
+        container: {
+            flexDirection: 'row',
+            height: 65,
+            paddingHorizontal: 15,
+            alignItems: 'center',
+            backgroundColor: theme.centerChannelBg
+        },
+        displayName: {
+            fontSize: 16,
+            color: theme.centerChannelColor
+        },
+        icon: {
+            fontSize: 20,
+            color: theme.centerChannelColor
+        },
+        textContainer: {
+            flexDirection: 'row',
+            marginLeft: 5
+        },
+        username: {
+            marginLeft: 5,
+            fontSize: 16,
+            color: changeOpacity(theme.centerChannelColor, 0.5)
+        },
+        selector: {
+            height: 28,
+            width: 28,
+            borderRadius: 14,
+            borderWidth: 1,
+            borderColor: '#888',
+            alignItems: 'center',
+            justifyContent: 'center'
+        },
+        selectorContainer: {
+            height: 50,
+            paddingRight: 15,
+            alignItems: 'center',
+            justifyContent: 'center'
+        },
+        selectorDisabled: {
+            backgroundColor: '#888'
+        },
+        selectorFilled: {
+            backgroundColor: '#378FD2',
+            borderWidth: 0
+        }
+    });
+});
+
 export default MemberListRow;
diff --git a/app/scenes/channel_add_members/channel_add_members.js b/app/scenes/channel_add_members/channel_add_members.js
index f9f16e3ad..3f988007b 100644
--- a/app/scenes/channel_add_members/channel_add_members.js
+++ b/app/scenes/channel_add_members/channel_add_members.js
@@ -152,7 +152,8 @@ class ChannelAddMembers extends PureComponent {
 
     handleRowSelect = (id) => {
         const selectedMembers = Object.assign({}, this.state.selectedMembers, {[id]: !this.state.selectedMembers[id]});
-        if (Object.keys(selectedMembers).length) {
+
+        if (Object.values(selectedMembers).filter((selected) => selected).length) {
             this.emitCanAddMembers(true);
         } else {
             this.emitCanAddMembers(false);
diff --git a/app/scenes/channel_members/channel_members.js b/app/scenes/channel_members/channel_members.js
index a8115f965..86542b018 100644
--- a/app/scenes/channel_members/channel_members.js
+++ b/app/scenes/channel_members/channel_members.js
@@ -176,7 +176,7 @@ class ChannelMembers extends PureComponent {
 
     handleRowSelect = (id) => {
         const selectedMembers = Object.assign({}, this.state.selectedMembers, {[id]: !this.state.selectedMembers[id]});
-        if (Object.keys(selectedMembers).length) {
+        if (Object.values(selectedMembers).filter((selected) => selected).length) {
             this.emitCanRemoveMembers(true);
         } else {
             this.emitCanRemoveMembers(false);