ListItem
The list of chats relies on <ListItem />
to render each specific chat within the list. This component is a custom UI class we created to reduce the ChatList
component complexity:
/*** src/components/ListItem.js ***/ import React, { PropTypes } from 'react' import { View, Image, Text, TouchableOpacity } from 'react-native' import Icon from 'react-native-vector-icons/FontAwesome' const ListItem = (props) => { return ( <TouchableOpacity onPress={props.onPress}> <View style={{height: 60, borderColor: '#ccc', borderBottomWidth: 1, marginLeft: 10, flexDirection: 'row'}}> <View style={{padding: 15, paddingTop: 10}}> <Image source={{uri: props.image}} style={{width: 40, height: 40, borderRadius: 20, resizeMode: 'cover'}}/> </View> <View style={{padding: 15, paddingTop: 20}}> <Text style=...