verdnatura-chat/app/containers/Typing.js

37 lines
863 B
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import { StyleSheet, Text } from 'react-native';
import { connect } from 'react-redux';
const styles = StyleSheet.create({
typing: {
transform: [{ scaleY: -1 }],
fontWeight: 'bold',
paddingHorizontal: 15,
height: 25
}
});
@connect(state => ({
username: state.login.user && state.login.user.username,
usersTyping: state.room.usersTyping
}))
export default class Typing extends React.PureComponent {
get usersTyping() {
const users = this.props.usersTyping.filter(_username => this.props.username !== _username);
return users.length ? `${ users.join(' ,') } ${ users.length > 1 ? 'are' : 'is' } typing` : '';
}
render() {
return (<Text style={styles.typing}>{this.usersTyping}</Text>);
}
}
Typing.propTypes = {
username: PropTypes.string,
usersTyping: PropTypes.array
};