render() { const { color, message, isCurrentUser } = this.props; return ( <View key={message.id} style={styles.container}> {isCurrentUser ? <View style={styles.messageSpacer} /> : undefined } <View style={[styles.message, isCurrentUser && styles.myMessage]} > <Text style={[ styles.messageUsername, { color }, ]} >{message.from.username}</Text> <Text>{message.text}</Text> <Text style={styles.messageTime}>{moment(message.createdAt).format('h:mm A')}</Text> </View> {!isCurrentUser ? <View style={styles.messageSpacer} /> : undefined } </View> ); }
render() { const { color, message, isCurrentUser } = this.props; return ( <View key={message.id} style={styles.container}> {isCurrentUser ? <View style={styles.messageSpacer} /> : undefined } <View style={[styles.message, isCurrentUser && styles.myMessage]} > <Text style={[ styles.messageUsername, { color }, ]} >{message.from.username}</Text> <Text>{message.text}</Text> <Text style={styles.messageTime}>{moment(message.createdAt).format('h:mm A')}</Text> </View> {!isCurrentUser ? <View style={styles.messageSpacer} /> : undefined } </View> ); }