/** Pure component for each Network Search Item **/
import React from 'react';
import { Text, View } from 'react-native';
import { ListItem } from 'react-native-elements';
import colors from '../../config/colors.json';

class NetworkSearchItem extends React.PureComponent {
  /**
  * Action to take when a result is selected
  **/
  onResultSelect(rowData) {
    this.props.navigation.navigate('socialAddScreen', rowData);
  }

  /**
  * Render method
  **/
  render() {
    const item = this.props.item;
    const title = `@${item.tagferId}`;
    const subTitle = (
      <View>
        <Text>{item.fullName || ''}</Text>
        <Text>{item.titleAndCompany || ''}</Text>
      </View>
    );

    if (item.profileAvatarImg) {
      return (
        <ListItem
          roundAvatar
          key={item.uid}
          title={title}
          subtitle={subTitle}
          titleStyle={{ fontWeight: 'bold', marginBottom: 5, color: colors.darkGreen }}
          avatar={{ uri: item.profileAvatarImg }}
          onPress={() => this.onResultSelect(item)}
        />
      );
    }
    return (
      <ListItem
        roundAvatar
        key={item.uid}
        title={title}
        subtitle={subTitle}
        titleStyle={{ fontWeight: 'bold', marginBottom: 5, color: colors.darkGreen }}
        leftIcon={{ name: 'account-circle', size: 40, color: colors.lightGrey }}
        onPress={() => this.onResultSelect(item)}
      />
    );
  }
}

export default NetworkSearchItem;
