BrianCortes

import React, { Component } from 'react';
import UserProfile from './components/UserProfile/UserProfile'
import Heart from './components/Heart/Heart'
import Comments from './components/Comments/Comments'
import './App.css';

class App extends Component {
  state = {
    LikesNumber: 0,
    ComentsNumber: 1,

BrianCortes

import React, { Component } from 'react';
import UserProfile from './components/UserProfile/UserProfile'
import Heart from './components/Heart/Heart'
import Comments from './components/Comments/Comments'
import './App.css';

BrianCortes

class App extends Component {
  state = {
    LikesNumber: 0,
    ComentsNumber: 1,
    Comments: [{
      value: 'React is Awesome !!'
    }]
  }
...

BrianCortes

  clickHeart = () => {
    const likes = this.state.LikesNumber
    this.setState({LikesNumber: likes + 1})
  }

BrianCortes

  addComment = (newValue) => {
    const comments = this.state.ComentsNumber
    const arrayComments = this.state.Comments
    const newComment = {
      value: newValue
    }
    arrayComments.push(newComment)
    this.setState({ComentsNumber: comments + 1})
    this.setState({Comments: arrayComments})
    this.setState({valueText: ''})

BrianCortes

  render() {
    return (
      <div className="Container">
        <UserProfile 
          img='https://pbs.twimg.com/profile_images/836333218924277760/iVzLr4c-.jpg'
          Name='Monoku'
          Likes={this.state.LikesNumber}
          Comments={this.state.ComentsNumber}
        />
        <Heart clickHeart={this.clickHeart}/>

BrianCortes

        <Comments 
          comments={this.state.Comments}
          addComment={this.addComment}
          changeText={this.changeText}
          valueText={this.state.valueText}
        />

BrianCortes

  changeText = (value) => {
    this.setState({valueText: value})
  }

BrianCortes

import React from 'react';
import PropTypes from 'prop-types';
import './Comments.css';

BrianCortes

const Comments = ({comments, addComment, changeText, valueText}) => {
	const handleChange = (event) => {
		changeText(event.target.value)
  }
	const handleClick = () => {
		addComment(valueText)
	}
	const CommentList = comments.map((element, index) => {
		return(
			<div className='Comments' key={index}>