App.js
ChatInputSans.js
ChatInputavec.js

//fichier App.js
import React, {Component,  createRef } from 'react';
import ChatInputAvec from './ChatInputAvec';
import ChatInputSans from './ChatInputSans';
import '../styles/ChatApp.css';
import JSEMOJI from 'emoji-js';

//emoji set up
let jsemoji = new JSEMOJI();
// set the style to emojione (default - apple)
jsemoji.img_set = 'emojione';
// set the storage location for all emojis
jsemoji.img_sets.emojione.path = 'https://cdn.jsdelivr.net/emojione/assets/3.0/png/32/';


class ChatApp extends Component {
    constructor(props) {
        super(props);
        this.webcam = createRef();
        this.state = {
          
            emojiShown: false,
          
        this.toogleEmojiState = this.toogleEmojiState.bind(this);
      
    }

     
    handleEmojiClick = (n, e) => {
        let emoji = jsemoji.replace_colons(`:${e.name}:`);
        this.setState({
            chatInput: this.state.chatInput + emoji
        });
    };
 
    toogleEmojiState = () => {
        this.setState({
            emojiShown: !this.state.emojiShown
        });
    }
            // form
    render() {
                const {messages, isLoading  } = this.state;
                        <h3>React Chat App
                        </h3>
                          
                            <Messages messages={messages}/>
                            <ChatInputAvec
                                chatInput = {this.state.chatInput
                                  submitHandler={this.submitHandler}
                                toogleEmojiState={this.toogleEmojiState}
                                
                            />
                    }
                      
                    }
            
            
                      <h3>React Chat App
                      </h3>
                     <UserList users={this.props.users}/>
                     <Messages messages={messages}/>
                 <ChatInputSans chatInput = {this.state.chatInput}
                                toogleEmojiState={this.toogleEmojiState}
                                
          
                }

            }

ChatApp.defaultProps = {