import React from 'react';
import {
  Text,
  TextInput,
  View,
} from 'react-native';

class PizzaTranslator extends React.Component {
  constructor(props) {
    super(props);
    this.state = { text: '' };
  }
  render() {
    return (
      <View style={{ padding: 10, paddingTop: 20 }}>
        <TextInput
          onChangeText={text => this.setState({ text }) }
          placeholder="Type here to translate!"
          style={{ height: 40 }}
        />
        <Text style={{ padding: 10, fontSize: 42 }}>
          {this.state.text.split(' ').map(word => word && '🍕').join(' ')}
        </Text>
      </View>
    );
  }
}

export default PizzaTranslator;