diff --git a/.eslintcache b/.eslintcache
index f9e16ae..66dfc4f 100644
--- a/.eslintcache
+++ b/.eslintcache
@@ -1 +1 @@
-[{"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\index.js":"1","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\App.jsx":"2","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\reportWebVitals.js":"3","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\Home.jsx":"4","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\login.jsx":"5","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\signup.jsx":"6","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\friends-liste.jsx":"7","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\chat.jsx":"8","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\statistique.jsx":"9","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\withAuth.jsx":"10","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-gauche.jsx":"11","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\application2.jsx":"12","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\paramètre.jsx":"13","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\friend_nom.jsx":"14","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-amis-gauche.jsx":"15"},{"size":598,"mtime":1614542028508,"results":"16","hashOfConfig":"17"},{"size":1381,"mtime":1617810232026,"results":"18","hashOfConfig":"17"},{"size":375,"mtime":1614542028510,"results":"19","hashOfConfig":"17"},{"size":19028,"mtime":1618475155691,"results":"20","hashOfConfig":"17"},{"size":3455,"mtime":1618218825128,"results":"21","hashOfConfig":"17"},{"size":3463,"mtime":1618218954697,"results":"22","hashOfConfig":"17"},{"size":4050,"mtime":1618389184021,"results":"23","hashOfConfig":"17"},{"size":6965,"mtime":1618348544905,"results":"24","hashOfConfig":"17"},{"size":2499,"mtime":1618158877091,"results":"25","hashOfConfig":"17"},{"size":1566,"mtime":1614542028512,"results":"26","hashOfConfig":"17"},{"size":2446,"mtime":1618388706171,"results":"27","hashOfConfig":"17"},{"size":2972,"mtime":1618348532812,"results":"28","hashOfConfig":"17"},{"size":2548,"mtime":1618348280640,"results":"29","hashOfConfig":"17"},{"size":1818,"mtime":1617387126759,"results":"30","hashOfConfig":"17"},{"size":1508,"mtime":1617811135954,"results":"31","hashOfConfig":"17"},{"filePath":"32","messages":"33","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},"1txmw58",{"filePath":"35","messages":"36","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"37","usedDeprecatedRules":"34"},{"filePath":"38","messages":"39","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"40","messages":"41","errorCount":0,"warningCount":25,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"42","messages":"43","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"44","usedDeprecatedRules":"34"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"47","usedDeprecatedRules":"34"},{"filePath":"48","messages":"49","errorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":"50","usedDeprecatedRules":"34"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":9,"fixableErrorCount":0,"fixableWarningCount":0,"source":"53","usedDeprecatedRules":"34"},{"filePath":"54","messages":"55","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"56","usedDeprecatedRules":"34"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"61","usedDeprecatedRules":"34"},{"filePath":"62","messages":"63","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"64","usedDeprecatedRules":"34"},{"filePath":"65","messages":"66","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"67","usedDeprecatedRules":"34"},{"filePath":"68","messages":"69","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"70","usedDeprecatedRules":"34"},{"filePath":"71","messages":"72","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\index.js",[],["73","74"],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\App.jsx",["75","76","77"],"import React, { Component } from 'react';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport Home from './Home.jsx';\r\nimport Login from './login.jsx';\r\nimport Signup from './signup.jsx'\r\nimport rockets from './components/statistique.jsx'\r\nimport Friendsliste from './friends-liste.jsx'\r\nimport Application2 from './application2'\r\nimport withAuth from './withAuth'\r\nimport Chat from './components/chat.jsx'\r\nimport Parametre from './components/paramètre'\r\nimport './style/app.css'\r\n\r\nclass App extends Component {\r\n  // différente route renvoyant un composant react\r\n  render() {\r\n    return (\r\n    <BrowserRouter>\r\n      <div>\r\n        <Switch>\r\n            <Route path=\"/\" exact component={Home}/>\r\n            <Route path=\"/signup\" component={Signup} />\r\n            <Route path=\"/login\" component={Login} />\r\n            {/*withAuth permet de renvoyer le composant \"Application\" si la vérification des cookies est validé par le server*/}\r\n            <Route path=\"/app/friendlist\" component={withAuth(Friendsliste)} />\r\n            <Route path=\"/app2/:id\" component={withAuth(Application2)}/>\r\n            <Route path=\"/app/parametre\" component={withAuth(Parametre)}/>\r\n            <Route path=\"/app/statistique\" component={withAuth(rockets)}/>\r\n        </Switch>\r\n      </div>\r\n    </BrowserRouter>\r\n    );\r\n  }\r\n}\r\n\r\nexport default App;","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\reportWebVitals.js",[],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\Home.jsx",["78","79","80","81","82","83","84","85","86","87","88","89","90","91","92","93","94","95","96","97","98","99","100","101","102"],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\login.jsx",["103","104","105","106","107"],"import React, { Component } from 'react';\r\nimport axios from 'axios';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport './style/login.css';\r\nimport './style/login-responsive.css';\r\n\r\nexport default class login extends Component {\r\n      // création des states suivant\r\n    constructor(props) {\r\n      super(props)\r\n      this.state = {\r\n        email : '',\r\n        mdp: '',\r\n        message:''\r\n      };\r\n    }\r\n    // ajout des changement lorsque le texte de l'input change\r\n    handleInputChange = (event) => {\r\n      const { value, name } = event.target;\r\n      this.setState({\r\n        [name]: value\r\n      });\r\n    }\r\n  \r\n    // lorsque le formulaire est submit, envoyer la requête POST suivante, qui envois les données\r\n    onSubmit = (event) => {\r\n      event.preventDefault();\r\n      console.log(\"state login : \",this.state)\r\n      fetch('http://localhost:4000/authentification/signin', {\r\n        method: 'POST',\r\n        // credentials : include permet d'intégrer les cookie avec la requête\r\n        credentials: 'include', \r\n        body: JSON.stringify({\r\n          email:this.state.email,\r\n          mdp:this.state.mdp\r\n        }),\r\n        headers: {\r\n          'Content-Type': 'application/json'\r\n        }\r\n      })\r\n      .then(res => {\r\n        if (res.status === 200) {\r\n          // s'il y a aucune erreur, renvoyer vers l'acceuil\r\n          this.props.history.push('/app/friendlist');\r\n        }if (res.status === 401){\r\n          // si erreur code est 401, renvoyer ce message\r\n          this.setState({ message:'Mot de passee incorrecte'});\r\n        } \r\n        else {\r\n          // sinon, renvoyer ce message\r\n          this.setState({message:'Mot de passe ou email incorrecte'});\r\n        }\r\n      })\r\n    }\r\n  \r\n    render() {\r\n      return (\r\n        <div className=\"body-login\">\r\n          <div className=\"box-centre-login\">\r\n            <div className=\"box-gauche-login\">\r\n              <p className=\"Hey-login\">Hey</p>\r\n              <p className=\"Texte-gauche-login\">Si tu n’as pas encore de compte crée en un !</p>\r\n              <Link className=\"boutton-singin-login\" to=\"/signup\"> SING UP</Link>\r\n            </div>\r\n            <div className=\"box-droite-login\">\r\n            <form onSubmit={this.onSubmit}>\r\n                      <h1 className=\"texte-login-boxdroite-login\">Login</h1>   \r\n                      <input className=\"email-login\"\r\n                        type=\"email\"\r\n                        name=\"email\"\r\n                        placeholder=\"E-mail\"\r\n                        value={this.state.email}\r\n                        onChange={this.handleInputChange}\r\n                        required\r\n                      />\r\n                      <br></br>\r\n                      <input className=\"password-login\"\r\n                        type=\"password\"\r\n                        name=\"mdp\"\r\n                        placeholder=\"Password\"\r\n                        value={this.state.mdp}\r\n                        onChange={this.handleInputChange}\r\n                        required\r\n                      />\r\n                      <br></br>\r\n                      <input className=\"bouton-login-droite-login\" type=\"submit\" value=\"Login\"/>\r\n                    </form>\r\n                    <p className=\"incorecte-mdp-login\">{this.state.message}</p>\r\n                    </div>\r\n                    </div>       \r\n            </div>\r\n        \r\n      );\r\n\r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\signup.jsx",["108","109","110","111","112"],"import React, { Component } from 'react';\r\nimport axios from 'axios';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport './style/singup.css';\r\nimport './style/singup-responsive.css';\r\n\r\nexport default class signup extends Component {\r\n    // création des states suivant\r\n    constructor(props) {\r\n      super(props)\r\n      this.state = {\r\n        email : '',\r\n        mdp: '',\r\n        pseudo:'',\r\n        message:''\r\n      };\r\n    }\r\n    // ajout des changement lorsque le texte de l'input change\r\n    handleInputChange = (event) => {\r\n      const { value, name } = event.target;\r\n      this.setState({\r\n        [name]: value\r\n      });\r\n    }\r\n    // quand bouton submit pressé, envoyé une requête POST au serveur pour insérer le nouvel utilisateur dans la base de donnée\r\n    onSubmit = (event) => {\r\n      event.preventDefault();\r\n      console.log(\"state signup : \",this.state);\r\n\r\n      fetch('http://localhost:4000/authentification/signup', {\r\n        method: 'POST',\r\n        // credentials : include permet d'intégrer les cookie avec la requête\r\n        credentials: 'include',\r\n        body: JSON.stringify({\r\n          pseudo:this.state.pseudo,\r\n          email:this.state.email,\r\n          mdp:this.state.mdp\r\n        }),\r\n        headers: {\r\n          'Content-Type': 'application/json'\r\n        }\r\n      })\r\n      .then((value) => {\r\n        if (value.status === 200) {\r\n          // s'il y a eu aucune erreur redirigé à l'acceuil\r\n          this.props.history.push('/app/friendlist');\r\n          console.log(\"info envoyé\");\r\n        } else {\r\n          // s'il y a eu une erreur, renvoyer le message suivant\r\n          this.setState({message:'Pseudo ou email déjà utilisé'});\r\n        }\r\n      })\r\n\r\n    }\r\n  \r\n    render() {\r\n      return (\r\n      <div className=\"body-singup\">\r\n        <div className=\"box-centre-singup\">\r\n          <div className=\"box-gauche-singup\">\r\n          <form onSubmit={this.onSubmit}>\r\n          <h1 className=\"texte-Create-Account-boxgauche-singup\">Create Account</h1>\r\n          <input className=\"pseudo-singup\" \r\n            type=\"text\"\r\n            name=\"pseudo\"\r\n            placeholder=\"Pseudo\"\r\n            value={this.state.pseudo}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"email-singup\"\r\n            type=\"email\"\r\n            name=\"email\"\r\n            placeholder=\"E-mail\"\r\n            value={this.state.email}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"password-singup\"\r\n            type=\"password\"\r\n            name=\"mdp\"\r\n            placeholder=\"Password\"\r\n            value={this.state.mdp}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"bouton-singup-gauche-singup\" type=\"submit\" value=\"SING UP\"/>\r\n        </form>\r\n        <p className=\"email-deja-utiliser-singup\">{this.state.message}</p>\r\n        </div>\r\n        <div className=\"box-droite-singup\">\r\n          <p className=\"Welcome-back-singup\">Welcome back </p>\r\n          <p className=\"Texte-gauche-singup\">Si tu as déjà un compte, il te suffit de te connecter ! </p>\r\n          <Link className=\"boutton-singin-singup\" id=\"link6\"  to=\"/login\">SIGN IN</Link>\r\n        </div>\r\n        </div>\r\n        </div>\r\n      );\r\n\r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\friends-liste.jsx",["113","114","115","116","117","118","119"],"import React, { Component } from 'react';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport Chat from './components/chat';\r\nimport { withRouter } from \"react-router-dom\";\r\nimport Barregauche from './barre-gauche.jsx';\r\nimport StatWithFriend from './components/statistique'\r\nimport './style/friend-liste.css';\r\nimport './style/friend-liste-responsive.css';\r\n\r\n\r\nexport default class friendsliste extends Component {\r\n    \r\n      // création du State \"friend\"\r\n      constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n          friend : '',\r\n          message : '',\r\n          amislist: [{_id:0, _pseudo:\"\"}],\r\n          firstFriend:\"\",\r\n          room:''\r\n        };\r\n      }\r\n    \r\n      // ajout des changement lorsque le texte de l'input change\r\n      handleInputChange = (event) => {\r\n        const { value, name } = event.target;\r\n        this.setState({\r\n          [name]: value\r\n        });\r\n      }\r\n\r\n      // fonction permettant de faire une requête POST au serveur et d'envoyer les données\r\n    onSubmit = (event) => {\r\n        event.preventDefault();\r\n        console.log(\"state envois demande amis : \",this.state)\r\n        // requête POST\r\n        fetch('http://localhost:4000/app/newfriend', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            new_friend: this.state.friend\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json'\r\n          }\r\n        })\r\n        // renvois message de réussite ou non\r\n        .then(res => {\r\n          if (res.status === 200) {\r\n            this.setState({message: \"\"})\r\n          } else if(res.status === 400){\r\n            this.setState({message : \"l'utilisateur rechercher n'existe pas\"})\r\n          } else if(res.status === 402){\r\n            this.setState({message: \" vous avez déja cette utilisateur en amis\"})\r\n          } else{\r\n              console.log(\"erreur\")\r\n          }\r\n        })\r\n      }\r\n      componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          console.log(response)\r\n          this.setState({amislist:response.data})\r\n          this.setState({firstFriend:response.firstFriend})\r\n          console.log(\"state\", this.state.amislist)\r\n        })\r\n      }\r\n\r\n    render() {\r\n      const {message} = this.state\r\n      const {amislist} = this.state\r\n      console.log(\"here\",amislist)\r\n      return (\r\n        <div className=\"corps-friends-liste\">\r\n          <div> \r\n            <Barregauche firstFriend={this.state.firstFriend}/>\r\n            <div className=\"add-friends\">\r\n              <form class=\"ajouter-amis-friens-liste\" onSubmit={this.onSubmit}>\r\n                  <input \r\n                  className=\"ajouter-amis-friens-liste-p1\"\r\n                  name=\"friend\"\r\n                  type=\"text\" \r\n                  placeholder=\"pseudo\"\r\n                  value={this.state.friend}\r\n                  onChange={this.handleInputChange}\r\n                  required\r\n                  />\r\n                  <input className=\"ajouter-amis-friens-liste-p2\" type=\"submit\" value=\"+\"/>\r\n                  <p className=\"message-erreur-ajt-amis\">{message}</p>\r\n              </form>\r\n            </div>\r\n          <div className=\"friend-list\">\r\n            {amislist.map((amis)=>(\r\n              <Link to={\"/app2/\"+amis.id} >\r\n                  <div className=\"friend\" name={amis.pseudo}>\r\n                      <p>{amis.pseudo}</p>\r\n                  </div>\r\n              </Link>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </div>\r\n      ); \r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\chat.jsx",["120","121","122","123","124","125","126","127","128"],"import React, { Component } from 'react';\r\n\r\nimport { io } from \"socket.io-client\"; \r\nimport { withRouter } from \"react-router-dom\";\r\nimport FriendNom from './friend_nom'\r\nimport trash from '../image/delete.png'\r\n\r\n\r\nconst socket = io('http://localhost:4000');\r\nexport default class Chat extends Component {\r\n  // création du state \"message\"\r\n    constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n          message : '',\r\n          friendid:'',\r\n          groupetext:[{_id:0, text:\"\", author:\"\"}],\r\n          room:'',\r\n          user_nom:'',\r\n          change:false\r\n        };\r\n      }\r\n      // ajout des changement lorsque le texte de l'input change\r\n      handleInputChange = (event) => {\r\n        const { value, name } = event.target;\r\n        this.setState({\r\n          [name]: value\r\n        });\r\n      }\r\n      componentDidMount(){\r\n        this.setState({friendid:this.props.valeur})\r\n        this.setState({user_nom:this.props.nom})\r\n        fetch('http://localhost:4000/app/getgroupechatlist', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            friendID: this.props.valeur\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          this.setState({groupetext:response[0].message})\r\n          //console.log(response[0].message)\r\n          this.setState({room:response[0]._id})\r\n          //console.log(this.state.room)\r\n          socket.emit('joinRoom', this.state.room)\r\n        })\r\n      }\r\n\r\n      componentDidUpdate(){\r\n        if(this.state.friendid !== this.props.valeur){\r\n          this.setState({friendid:this.props.valeur})\r\n          fetch('http://localhost:4000/app/getgroupechatlist', {\r\n            method: 'POST',\r\n            credentials: 'include', \r\n            body: JSON.stringify({\r\n              friendID: this.props.valeur\r\n            }),\r\n            headers: {\r\n              'Content-Type': 'application/json',\r\n              'Accept': 'application/json'\r\n            }\r\n          })\r\n          .then(response => response.json())\r\n          .then(response => {\r\n            this.setState({groupetext:response[0].message})\r\n            //console.log(response[0].message)\r\n            this.setState({room:response[0]._id})\r\n            //console.log(this.state.room) \r\n            socket.emit('leave')\r\n            socket.emit('joinRoom', this.state.room)\r\n          })\r\n        }\r\n      }\r\n\r\n      componentDidMount(){\r\n        socket.on('message', message =>{\r\n          console.log(message)\r\n          let {groupetext} = this.state\r\n          groupetext.push(message)\r\n          //console.log(groupetext)\r\n          this.setState({change:true})\r\n          console.log(groupetext)\r\n        })\r\n        socket.on('messageDelete',value =>{\r\n          console.log('le message suprimé : ',value)\r\n          let {groupetext} = this.state\r\n          const index = groupetext.findIndex(mess => mess._id === value)\r\n          if(index != -1){\r\n            groupetext.splice(index,1)\r\n            this.setState({change:true})\r\n          }\r\n        })\r\n        socket.on('info', message =>{\r\n          console.log(message)\r\n        })\r\n      }\r\n      onSubmit = () => {\r\n        if(this.state.message != ''){\r\n          socket.emit(\"sendmessage\", {\r\n            message:this.state.message,\r\n            author:this.props.nom,\r\n            room:this.state.room\r\n          })\r\n          this.setState({message:''})\r\n        }\r\n      }\r\n      deleteMessage = (event) =>{\r\n        const { value } = event.target;\r\n        socket.emit('getMessageToDelete',{\r\n          value: value,\r\n          room: this.state.room\r\n        })\r\n\r\n      }\r\n    render() {\r\n      const BLOCK = {diplay: 'block'}\r\n      const NONE= {diplay: 'none'}\r\n      if(this.state.change === true){\r\n        this.setState({change:false})\r\n        return(\r\n          <div>\r\n            <div className=\"barre-du-haut-amis\">\r\n          <FriendNom id={this.props.valeur}/>\r\n          </div>\r\n          <div className=\"colone-droite\">\r\n          <div className=\"chat\">\r\n            <div className=\"chat\">\r\n              {this.state.groupetext.map((mess)=>(\r\n                <div className=\"message-envoye\">\r\n                  <p className=\"author\">{mess.author}</p>\r\n                  <p className=\"textemessageP\">{mess.text}</p>\r\n                  { this.props.nom == mess.author ? <button value={mess._id} onClick={this.deleteMessage}> <img src={trash} /> </button> : console.log('')}\r\n                </div>\r\n              ))}\r\n            </div>\r\n            </div>\r\n            <div className=\"message\">\r\n                <div className=\"forme-message\">\r\n                    <input \r\n                    class=\"entrer-votre-message\"\r\n                    name=\"message\"\r\n                    type=\"text\" \r\n                    placeholder=\"type your mssage\"\r\n                    value={this.state.message}\r\n                    onChange={this.handleInputChange}\r\n                    required\r\n                    />\r\n                    <input class=\"entrer-votre-message\" type=\"submit\" value=\"Submit\" onClick={this.onSubmit}/>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        </div>\r\n        )\r\n      } else{\r\n      return (\r\n        <div>\r\n        <div className=\"barre-du-haut-amis\">\r\n          <FriendNom id={this.props.valeur}/>\r\n          </div>\r\n        <div className=\"colone-droite\">\r\n          <div className=\"chat\">\r\n            <div className=\"chat\">\r\n              {this.state.groupetext.map((mess)=>(\r\n                <div className=\"message-envoye\">\r\n                  \r\n                  <p className=\"author\">{mess.author}</p>\r\n                  <p className=\"textemessageP\">{mess.text}</p>\r\n                  { this.props.nom == mess.author ? <button value={mess._id} className=\"boutton-suprimer-un-message\" onClick={this.deleteMessage}> X </button> : console.log('')}\r\n                </div>\r\n              ))}\r\n            </div>\r\n            </div>\r\n            <div className=\"message\">\r\n                <div className=\"forme-message\">\r\n                  <div className=\"autour-entrer-message\">\r\n                    <input \r\n                    className=\"type-your-message\"\r\n                    name=\"message\"\r\n                    type=\"text\" \r\n                    placeholder=\"type your message...\"\r\n                    value={this.state.message}\r\n                    onChange={this.handleInputChange}\r\n                    required\r\n                    />\r\n                    <input className=\"submit\" type=\"submit\" value=\"Submit\" onClick={this.onSubmit}/>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        </div>\r\n      ); \r\n      }\r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\statistique.jsx",["129"],"import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport Barregauche from '../barre-gauche.jsx';\r\nimport rockets from '../image/rockets.png'\r\nimport '../style/stastistique.css';\r\n\r\nexport default class StatWithFriend extends Component {\r\n\r\n  constructor(props) {\r\n    super(props)\r\n    this.state = {\r\n      statistique_amis: [{}], \r\n      amislist: [{}],\r\n      FirstFriend:\"\"\r\n    };\r\n  }\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/statByUser', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => { \r\n          this.setState({statistique_amis:response})\r\n          console.log(\"statistique : \",this.state.statistique_amis)\r\n        })\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          console.log(response)\r\n          this.setState({amislist:response.data})\r\n          this.setState({FirstFriend:response.firstFriend})\r\n        })\r\n      }\r\n\r\n\r\n\r\n    render(){\r\n      const {statistique_amis} = this.state\r\n        return(\r\n          <div>\r\n            <Barregauche firstFriend={this.state.FirstFriend}/>\r\n            <div className=\"statistique-body\">\r\n              <div className=\"barre-du-haut-stat\">\r\n                <p className=\"texte-barre-du-haut-stat\">Nombre de message échanger :                   Ichat rockets <img  className=\"logo-rockets-calssement-stat-haut\"src={rockets} alt=\"amis\"/></p>\r\n              </div>\r\n              <div className=\"classement-stat\">\r\n                {statistique_amis.map((amis)=>(\r\n                  <div className=\"casse-classement-stat\">\r\n                    <p>{amis.friend_name} : {amis.nbr_message} <img  className=\"logo-rockets-calssement-stat\"src={rockets} alt=\"amis\"/> </p>\r\n                  </div>\r\n                ))}\r\n              </div>\r\n              </div>\r\n            </div>\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\withAuth.jsx",[],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-gauche.jsx",["130"]," import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport './style/barre-gauche.css';\r\nimport profil from './image/img-profil.jpg'\r\nimport envelope from './image/envelope.png'\r\nimport users from './image/user.png'\r\nimport rouage from './image/settings.png'\r\nimport logout from './image/logout.png'\r\nimport rockets from './image/rockets.png'\r\nimport './style/barre-gauche-responsive.css';\r\n\r\nexport default class barregauche extends Component {\r\n\r\n    constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n            firstFriend:\"\"\r\n        };\r\n      }\r\n\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          this.setState({firstFriend:response.firstFriend})\r\n        })\r\n    }\r\n\r\n\r\n    \r\n     render(){\r\n        return(\r\n            <div>\r\n                <div className=\"nav-barre-gauche\">\r\n                    <div className=\"profil-users\">\r\n                        <img className=\"profil\"  src={profil} alt=\"photo de profil\"/>\r\n                    </div>\r\n                    <div className=\"bouton-part \">\r\n                        <Link to={'/app2/'+this.state.firstFriend}>\r\n                            <img  className=\"logo-message\" src={envelope} alt=\"message\"/>\r\n                        </Link>\r\n                        <Link to='/app/friendlist'>\r\n                            <img  className=\"logo-users\"src={users} alt=\"amis\"/>\r\n                        </Link>\r\n                        <Link to='/app/statistique'>\r\n                            <img  className=\"logo-rockets\"src={rockets} alt=\"statistique\"/>\r\n                        </Link>\r\n                        <Link to='/app/parametre'>\r\n                            <img   className=\"logo-rouage\" src={rouage} alt=\"paramétres\"/>\r\n                        </Link>\r\n                    </div>\r\n                    <div className=\"deconextion\">\r\n                        <img   className=\"logo-deconextion\" src={logout} alt=\"déconextion\"/>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n\r\n","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\application2.jsx",["131","132"],"import React, { Component } from 'react';\r\n\r\nimport Chat from './components/chat';\r\nimport { Link } from 'react-router-dom';\r\nimport './style/app.css';\r\nimport './style/app-responsive.css';\r\nimport Barregauche from './barre-gauche.jsx';\r\nimport Barreamisgauche from './barre-amis-gauche';\r\n\r\n\r\nexport default class Application2 extends Component {\r\n    \r\n  \r\n      // création du State \"friend\"\r\n      constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n          friend : '',\r\n          message : '',\r\n          amislist: [{_id:0, _pseudo:\"\"}],\r\n          firstFriend:\"\",\r\n          user_nom : ''\r\n        };\r\n      }\r\n    \r\n      // ajout des changement lorsque le texte de l'input change\r\n      handleInputChange = (event) => {\r\n        const { value, name } = event.target;\r\n        this.setState({\r\n          [name]: value\r\n        });\r\n      }\r\n\r\n      // fonction permettant de faire une requête POST au serveur et d'envoyer les données\r\n    onSubmit = (event) => {\r\n        event.preventDefault();\r\n        console.log(\"state envois demande amis : \",this.state)\r\n        // requête POST\r\n        fetch('http://localhost:4000/app/newfriend', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            new_friend: this.state.friend\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json'\r\n          }\r\n        })\r\n        // renvois message de réussite ou non\r\n        .then(res => {\r\n          if (res.status === 200) {\r\n            this.setState({message: \"\"})\r\n          } else if(res.status === 400){\r\n            this.setState({message : \"l'utilisateur rechercher n'existe pas\"})\r\n          }\r\n          else{\r\n              console.log(\"erreur\")\r\n          }\r\n        })\r\n      }\r\n      componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include',\r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          //console.log(response)\r\n          this.setState({amislist:response.friends})\r\n          this.setState({user_nom:response.pseudo})\r\n          this.setState({firstFriend:response.firstFriend})\r\n          //let test = this.state.amislist\r\n\r\n        })\r\n      }\r\n\r\n    render() {\r\n      const {message} = this.state\r\n      const { id } = this.props.match.params;\r\n      return (\r\n      <div className=\"corps\"> \r\n        <div className=\"colone-gauche\">\r\n          <Barregauche firstFriend={this.state.firstFriend}/>\r\n          <Barreamisgauche/>\r\n      </div>\r\n      <Chat valeur={id} nom={this.state.user_nom}/>\r\n    </div>\r\n      ); \r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\paramètre.jsx",["133"],"import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport BarreGauche from '../barre-gauche'\r\nimport '../style/paramètre.css';\r\nimport '../style/paramètre-responsive.css';\r\n\r\nexport default class parametre extends Component {\r\n\r\n  constructor(props) {\r\n    super(props)\r\n    this.state = {\r\n        newName:\"\",\r\n        message:\"\"\r\n    };\r\n  }\r\n\r\n  handleInputChange = (event) => {\r\n    const { value, name } = event.target;\r\n    this.setState({\r\n      [name]: value\r\n    });\r\n  }\r\n    \r\n    onSubmit = (event)=>{\r\n        event.preventDefault();\r\n        console.log(this.state)\r\n        fetch('http://localhost:4000/app/changeName', {\r\n            method: 'POST',\r\n            // credentials : include permet d'intégrer les cookie avec la requête\r\n            credentials: 'include', \r\n            body: JSON.stringify({\r\n                newName:this.state.newName\r\n              }),\r\n            headers: {\r\n              'Content-Type': 'application/json',\r\n            }\r\n          })\r\n          .then(res => {\r\n            if (res.status === 200) {\r\n              // s'il y a aucune erreur, renvoyer vers l'acceuil\r\n              this.setState({message:'Le Changement de pseudo a bien été effectué'});\r\n              console.log(\"OK\")\r\n            }if (res.status === 401){\r\n              // si erreur code est 401, renvoyer ce message\r\n              this.setState({message:'Erreur'});\r\n            } \r\n          })\r\n          this.setState({newName:\"\"})\r\n    }\r\n    render(){\r\n        return(\r\n            <div>\r\n                <BarreGauche/>\r\n                <div className=\"paramètre-body\">\r\n                <div className=\"barre-du-haut-paramètre\">\r\n                  <p className=\"texte-barre-du-haut-paramètre\"> Changer ici votre mots de passe : </p>\r\n              </div>\r\n              <div >\r\n        <form className=\"changer-pseudo\" onSubmit={this.onSubmit}>\r\n                    <input className=\"entrer-nouveau-pseudo\"\r\n                      type=\"text\"\r\n                      name=\"newName\"\r\n                      placeholder=\"Entrer le nouveau pseudo voulu\"\r\n                      value={this.state.newName}\r\n                      onChange={this.handleInputChange}\r\n                      required\r\n                    />\r\n                    <input className=\"valider-nouveau-pseudo\" type=\"submit\" value=\"Valider\"/>\r\n                  </form>\r\n                  <p>{this.state.message}</p>\r\n                  </div>\r\n                  </div>\r\n            </div>\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\friend_nom.jsx",["134"],"import React, { Component } from 'react';\r\n\r\n\r\nexport default class friend_nom extends Component {\r\n    constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n            nom:'',\r\n            id:''\r\n        };\r\n      }\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/getFriendName', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            name: this.props.id\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n            this.setState({nom:response})\r\n            this.setState({id:this.props.id})\r\n        })\r\n    }\r\n    componentDidUpdate(){\r\n        if(this.state.id != this.props.id){\r\n            fetch('http://localhost:4000/app/getFriendName', {\r\n                method: 'POST',\r\n                // credentials : include permet d'intégrer les cookie avec la requête\r\n                credentials: 'include', \r\n                body: JSON.stringify({\r\n                  name: this.props.id\r\n                }),\r\n                headers: {\r\n                  'Content-Type': 'application/json',\r\n                  'Accept': 'application/json'\r\n                }\r\n              })\r\n              .then(response => response.json())\r\n              .then(response => {\r\n                  this.setState({nom:response})\r\n                  this.setState({id:this.props.id})\r\n              })\r\n        }\r\n    }\r\n    render(){\r\n        return(\r\n            <p className=\"barre-du-haut-amis-texte\">\r\n                {this.state.nom}\r\n            </p>\r\n\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-amis-gauche.jsx",[],{"ruleId":"135","replacedBy":"136"},{"ruleId":"137","replacedBy":"138"},{"ruleId":"139","severity":1,"message":"140","line":2,"column":32,"nodeType":"141","messageId":"142","endLine":2,"endColumn":38},{"ruleId":"139","severity":1,"message":"143","line":2,"column":40,"nodeType":"141","messageId":"142","endLine":2,"endColumn":44},{"ruleId":"139","severity":1,"message":"144","line":10,"column":8,"nodeType":"141","messageId":"142","endLine":10,"endColumn":12},{"ruleId":"139","severity":1,"message":"145","line":15,"column":10,"nodeType":"141","messageId":"142","endLine":15,"endColumn":23},{"ruleId":"139","severity":1,"message":"146","line":15,"column":25,"nodeType":"141","messageId":"142","endLine":15,"endColumn":30},{"ruleId":"139","severity":1,"message":"140","line":15,"column":32,"nodeType":"141","messageId":"142","endLine":15,"endColumn":38},{"ruleId":"139","severity":1,"message":"147","line":15,"column":46,"nodeType":"141","messageId":"142","endLine":15,"endColumn":52},{"ruleId":"148","severity":1,"message":"149","line":30,"column":17,"nodeType":"150","endLine":30,"endColumn":32},{"ruleId":"148","severity":1,"message":"149","line":31,"column":17,"nodeType":"150","endLine":31,"endColumn":32},{"ruleId":"148","severity":1,"message":"149","line":32,"column":17,"nodeType":"150","endLine":32,"endColumn":32},{"ruleId":"148","severity":1,"message":"149","line":43,"column":17,"nodeType":"150","endLine":43,"endColumn":49},{"ruleId":"151","severity":1,"message":"152","line":67,"column":17,"nodeType":"150","endLine":67,"endColumn":91},{"ruleId":"151","severity":1,"message":"152","line":96,"column":17,"nodeType":"150","endLine":96,"endColumn":94},{"ruleId":"151","severity":1,"message":"152","line":108,"column":17,"nodeType":"150","endLine":108,"endColumn":86},{"ruleId":"151","severity":1,"message":"152","line":112,"column":29,"nodeType":"150","endLine":112,"endColumn":108},{"ruleId":"151","severity":1,"message":"152","line":117,"column":29,"nodeType":"150","endLine":117,"endColumn":92},{"ruleId":"151","severity":1,"message":"152","line":122,"column":29,"nodeType":"150","endLine":122,"endColumn":106},{"ruleId":"151","severity":1,"message":"152","line":127,"column":29,"nodeType":"150","endLine":127,"endColumn":92},{"ruleId":"151","severity":1,"message":"152","line":132,"column":29,"nodeType":"150","endLine":132,"endColumn":98},{"ruleId":"151","severity":1,"message":"152","line":137,"column":29,"nodeType":"150","endLine":137,"endColumn":92},{"ruleId":"151","severity":1,"message":"152","line":143,"column":29,"nodeType":"150","endLine":143,"endColumn":100},{"ruleId":"151","severity":1,"message":"152","line":148,"column":29,"nodeType":"150","endLine":148,"endColumn":92},{"ruleId":"153","severity":1,"message":"154","line":164,"column":9,"nodeType":"150","endLine":164,"endColumn":108},{"ruleId":"151","severity":1,"message":"152","line":185,"column":21,"nodeType":"150","endLine":185,"endColumn":91},{"ruleId":"151","severity":1,"message":"152","line":190,"column":21,"nodeType":"150","endLine":190,"endColumn":93},{"ruleId":"151","severity":1,"message":"152","line":194,"column":21,"nodeType":"150","endLine":194,"endColumn":101},{"ruleId":"151","severity":1,"message":"152","line":204,"column":17,"nodeType":"150","endLine":204,"endColumn":91},{"ruleId":"151","severity":1,"message":"152","line":332,"column":17,"nodeType":"150","endLine":332,"endColumn":96},{"ruleId":"139","severity":1,"message":"155","line":2,"column":8,"nodeType":"141","messageId":"142","endLine":2,"endColumn":13},{"ruleId":"139","severity":1,"message":"145","line":3,"column":10,"nodeType":"141","messageId":"142","endLine":3,"endColumn":23},{"ruleId":"139","severity":1,"message":"146","line":3,"column":25,"nodeType":"141","messageId":"142","endLine":3,"endColumn":30},{"ruleId":"139","severity":1,"message":"140","line":3,"column":32,"nodeType":"141","messageId":"142","endLine":3,"endColumn":38},{"ruleId":"139","severity":1,"message":"147","line":3,"column":46,"nodeType":"141","messageId":"142","endLine":3,"endColumn":52},{"ruleId":"139","severity":1,"message":"155","line":2,"column":8,"nodeType":"141","messageId":"142","endLine":2,"endColumn":13},{"ruleId":"139","severity":1,"message":"145","line":3,"column":10,"nodeType":"141","messageId":"142","endLine":3,"endColumn":23},{"ruleId":"139","severity":1,"message":"146","line":3,"column":25,"nodeType":"141","messageId":"142","endLine":3,"endColumn":30},{"ruleId":"139","severity":1,"message":"140","line":3,"column":32,"nodeType":"141","messageId":"142","endLine":3,"endColumn":38},{"ruleId":"139","severity":1,"message":"147","line":3,"column":46,"nodeType":"141","messageId":"142","endLine":3,"endColumn":52},{"ruleId":"139","severity":1,"message":"145","line":2,"column":10,"nodeType":"141","messageId":"142","endLine":2,"endColumn":23},{"ruleId":"139","severity":1,"message":"146","line":2,"column":25,"nodeType":"141","messageId":"142","endLine":2,"endColumn":30},{"ruleId":"139","severity":1,"message":"140","line":2,"column":32,"nodeType":"141","messageId":"142","endLine":2,"endColumn":38},{"ruleId":"139","severity":1,"message":"147","line":2,"column":46,"nodeType":"141","messageId":"142","endLine":2,"endColumn":52},{"ruleId":"139","severity":1,"message":"144","line":3,"column":8,"nodeType":"141","messageId":"142","endLine":3,"endColumn":12},{"ruleId":"139","severity":1,"message":"156","line":4,"column":10,"nodeType":"141","messageId":"142","endLine":4,"endColumn":20},{"ruleId":"139","severity":1,"message":"157","line":6,"column":8,"nodeType":"141","messageId":"142","endLine":6,"endColumn":22},{"ruleId":"139","severity":1,"message":"156","line":4,"column":10,"nodeType":"141","messageId":"142","endLine":4,"endColumn":20},{"ruleId":"158","severity":1,"message":"159","line":81,"column":7,"nodeType":"160","messageId":"161","endLine":102,"endColumn":8},{"ruleId":"162","severity":1,"message":"163","line":94,"column":20,"nodeType":"164","messageId":"161","endLine":94,"endColumn":22},{"ruleId":"162","severity":1,"message":"163","line":104,"column":31,"nodeType":"164","messageId":"161","endLine":104,"endColumn":33},{"ruleId":"139","severity":1,"message":"165","line":122,"column":13,"nodeType":"141","messageId":"142","endLine":122,"endColumn":18},{"ruleId":"139","severity":1,"message":"166","line":123,"column":13,"nodeType":"141","messageId":"142","endLine":123,"endColumn":17},{"ruleId":"162","severity":1,"message":"167","line":138,"column":36,"nodeType":"164","messageId":"161","endLine":138,"endColumn":38},{"ruleId":"168","severity":1,"message":"169","line":138,"column":108,"nodeType":"150","endLine":138,"endColumn":127},{"ruleId":"162","severity":1,"message":"167","line":174,"column":36,"nodeType":"164","messageId":"161","endLine":174,"endColumn":38},{"ruleId":"139","severity":1,"message":"143","line":2,"column":10,"nodeType":"141","messageId":"142","endLine":2,"endColumn":14},{"ruleId":"151","severity":1,"message":"152","line":44,"column":25,"nodeType":"150","endLine":44,"endColumn":86},{"ruleId":"139","severity":1,"message":"143","line":4,"column":10,"nodeType":"141","messageId":"142","endLine":4,"endColumn":14},{"ruleId":"139","severity":1,"message":"170","line":84,"column":14,"nodeType":"141","messageId":"142","endLine":84,"endColumn":21},{"ruleId":"139","severity":1,"message":"143","line":2,"column":10,"nodeType":"141","messageId":"142","endLine":2,"endColumn":14},{"ruleId":"162","severity":1,"message":"163","line":32,"column":26,"nodeType":"164","messageId":"161","endLine":32,"endColumn":28},"no-native-reassign",["171"],"no-negated-in-lhs",["172"],"no-unused-vars","'Router' is defined but never used.","Identifier","unusedVar","'Link' is defined but never used.","'Chat' is defined but never used.","'BrowserRouter' is defined but never used.","'Route' is defined but never used.","'Switch' is defined but never used.","jsx-a11y/anchor-is-valid","The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md","JSXOpeningElement","jsx-a11y/img-redundant-alt","Redundant alt attribute. Screen-readers already announce `img` tags as an image. You don’t need to use the words `image`, `photo,` or `picture` (or any specified custom words) in the alt prop.","jsx-a11y/iframe-has-title","<iframe> elements must have a unique title property.","'axios' is defined but never used.","'withRouter' is defined but never used.","'StatWithFriend' is defined but never used.","no-dupe-class-members","Duplicate name 'componentDidMount'.","MethodDefinition","unexpected","eqeqeq","Expected '!==' and instead saw '!='.","BinaryExpression","'BLOCK' is assigned a value but never used.","'NONE' is assigned a value but never used.","Expected '===' and instead saw '=='.","jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","'message' is assigned a value but never used.","no-global-assign","no-unsafe-negation"]
\ No newline at end of file
+[{"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\index.js":"1","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\App.jsx":"2","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\reportWebVitals.js":"3","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\Home.jsx":"4","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\login.jsx":"5","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\signup.jsx":"6","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\friends-liste.jsx":"7","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\chat.jsx":"8","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\statistique.jsx":"9","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\withAuth.jsx":"10","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-gauche.jsx":"11","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\application2.jsx":"12","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\paramètre.jsx":"13","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\friend_nom.jsx":"14","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-amis-gauche.jsx":"15"},{"size":598,"mtime":1614542028508,"results":"16","hashOfConfig":"17"},{"size":1381,"mtime":1617810232026,"results":"18","hashOfConfig":"17"},{"size":375,"mtime":1614542028510,"results":"19","hashOfConfig":"17"},{"size":19028,"mtime":1618475155691,"results":"20","hashOfConfig":"17"},{"size":3455,"mtime":1618218825128,"results":"21","hashOfConfig":"17"},{"size":3463,"mtime":1618218954697,"results":"22","hashOfConfig":"17"},{"size":4257,"mtime":1618475610440,"results":"23","hashOfConfig":"17"},{"size":6987,"mtime":1618476424229,"results":"24","hashOfConfig":"17"},{"size":2499,"mtime":1618158877091,"results":"25","hashOfConfig":"17"},{"size":1566,"mtime":1614542028512,"results":"26","hashOfConfig":"17"},{"size":2534,"mtime":1618476263295,"results":"27","hashOfConfig":"17"},{"size":2972,"mtime":1618348532812,"results":"28","hashOfConfig":"17"},{"size":2669,"mtime":1618475610481,"results":"29","hashOfConfig":"17"},{"size":1818,"mtime":1617387126759,"results":"30","hashOfConfig":"17"},{"size":1508,"mtime":1617811135954,"results":"31","hashOfConfig":"17"},{"filePath":"32","messages":"33","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},"1txmw58",{"filePath":"35","messages":"36","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"37","usedDeprecatedRules":"34"},{"filePath":"38","messages":"39","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"40","messages":"41","errorCount":0,"warningCount":25,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"42","messages":"43","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"44","usedDeprecatedRules":"34"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"47","usedDeprecatedRules":"34"},{"filePath":"48","messages":"49","errorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":"50","usedDeprecatedRules":"34"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":8,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"53","messages":"54","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"55","usedDeprecatedRules":"34"},{"filePath":"56","messages":"57","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"60","usedDeprecatedRules":"34"},{"filePath":"61","messages":"62","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"63","usedDeprecatedRules":"34"},{"filePath":"64","messages":"65","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"66","usedDeprecatedRules":"34"},{"filePath":"67","messages":"68","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"69","usedDeprecatedRules":"34"},{"filePath":"70","messages":"71","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\index.js",[],["72","73"],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\App.jsx",["74","75","76"],"import React, { Component } from 'react';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport Home from './Home.jsx';\r\nimport Login from './login.jsx';\r\nimport Signup from './signup.jsx'\r\nimport rockets from './components/statistique.jsx'\r\nimport Friendsliste from './friends-liste.jsx'\r\nimport Application2 from './application2'\r\nimport withAuth from './withAuth'\r\nimport Chat from './components/chat.jsx'\r\nimport Parametre from './components/paramètre'\r\nimport './style/app.css'\r\n\r\nclass App extends Component {\r\n  // différente route renvoyant un composant react\r\n  render() {\r\n    return (\r\n    <BrowserRouter>\r\n      <div>\r\n        <Switch>\r\n            <Route path=\"/\" exact component={Home}/>\r\n            <Route path=\"/signup\" component={Signup} />\r\n            <Route path=\"/login\" component={Login} />\r\n            {/*withAuth permet de renvoyer le composant \"Application\" si la vérification des cookies est validé par le server*/}\r\n            <Route path=\"/app/friendlist\" component={withAuth(Friendsliste)} />\r\n            <Route path=\"/app2/:id\" component={withAuth(Application2)}/>\r\n            <Route path=\"/app/parametre\" component={withAuth(Parametre)}/>\r\n            <Route path=\"/app/statistique\" component={withAuth(rockets)}/>\r\n        </Switch>\r\n      </div>\r\n    </BrowserRouter>\r\n    );\r\n  }\r\n}\r\n\r\nexport default App;","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\reportWebVitals.js",[],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\Home.jsx",["77","78","79","80","81","82","83","84","85","86","87","88","89","90","91","92","93","94","95","96","97","98","99","100","101"],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\login.jsx",["102","103","104","105","106"],"import React, { Component } from 'react';\r\nimport axios from 'axios';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport './style/login.css';\r\nimport './style/login-responsive.css';\r\n\r\nexport default class login extends Component {\r\n      // création des states suivant\r\n    constructor(props) {\r\n      super(props)\r\n      this.state = {\r\n        email : '',\r\n        mdp: '',\r\n        message:''\r\n      };\r\n    }\r\n    // ajout des changement lorsque le texte de l'input change\r\n    handleInputChange = (event) => {\r\n      const { value, name } = event.target;\r\n      this.setState({\r\n        [name]: value\r\n      });\r\n    }\r\n  \r\n    // lorsque le formulaire est submit, envoyer la requête POST suivante, qui envois les données\r\n    onSubmit = (event) => {\r\n      event.preventDefault();\r\n      console.log(\"state login : \",this.state)\r\n      fetch('http://localhost:4000/authentification/signin', {\r\n        method: 'POST',\r\n        // credentials : include permet d'intégrer les cookie avec la requête\r\n        credentials: 'include', \r\n        body: JSON.stringify({\r\n          email:this.state.email,\r\n          mdp:this.state.mdp\r\n        }),\r\n        headers: {\r\n          'Content-Type': 'application/json'\r\n        }\r\n      })\r\n      .then(res => {\r\n        if (res.status === 200) {\r\n          // s'il y a aucune erreur, renvoyer vers l'acceuil\r\n          this.props.history.push('/app/friendlist');\r\n        }if (res.status === 401){\r\n          // si erreur code est 401, renvoyer ce message\r\n          this.setState({ message:'Mot de passee incorrecte'});\r\n        } \r\n        else {\r\n          // sinon, renvoyer ce message\r\n          this.setState({message:'Mot de passe ou email incorrecte'});\r\n        }\r\n      })\r\n    }\r\n  \r\n    render() {\r\n      return (\r\n        <div className=\"body-login\">\r\n          <div className=\"box-centre-login\">\r\n            <div className=\"box-gauche-login\">\r\n              <p className=\"Hey-login\">Hey</p>\r\n              <p className=\"Texte-gauche-login\">Si tu n’as pas encore de compte crée en un !</p>\r\n              <Link className=\"boutton-singin-login\" to=\"/signup\"> SING UP</Link>\r\n            </div>\r\n            <div className=\"box-droite-login\">\r\n            <form onSubmit={this.onSubmit}>\r\n                      <h1 className=\"texte-login-boxdroite-login\">Login</h1>   \r\n                      <input className=\"email-login\"\r\n                        type=\"email\"\r\n                        name=\"email\"\r\n                        placeholder=\"E-mail\"\r\n                        value={this.state.email}\r\n                        onChange={this.handleInputChange}\r\n                        required\r\n                      />\r\n                      <br></br>\r\n                      <input className=\"password-login\"\r\n                        type=\"password\"\r\n                        name=\"mdp\"\r\n                        placeholder=\"Password\"\r\n                        value={this.state.mdp}\r\n                        onChange={this.handleInputChange}\r\n                        required\r\n                      />\r\n                      <br></br>\r\n                      <input className=\"bouton-login-droite-login\" type=\"submit\" value=\"Login\"/>\r\n                    </form>\r\n                    <p className=\"incorecte-mdp-login\">{this.state.message}</p>\r\n                    </div>\r\n                    </div>       \r\n            </div>\r\n        \r\n      );\r\n\r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\signup.jsx",["107","108","109","110","111"],"import React, { Component } from 'react';\r\nimport axios from 'axios';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport './style/singup.css';\r\nimport './style/singup-responsive.css';\r\n\r\nexport default class signup extends Component {\r\n    // création des states suivant\r\n    constructor(props) {\r\n      super(props)\r\n      this.state = {\r\n        email : '',\r\n        mdp: '',\r\n        pseudo:'',\r\n        message:''\r\n      };\r\n    }\r\n    // ajout des changement lorsque le texte de l'input change\r\n    handleInputChange = (event) => {\r\n      const { value, name } = event.target;\r\n      this.setState({\r\n        [name]: value\r\n      });\r\n    }\r\n    // quand bouton submit pressé, envoyé une requête POST au serveur pour insérer le nouvel utilisateur dans la base de donnée\r\n    onSubmit = (event) => {\r\n      event.preventDefault();\r\n      console.log(\"state signup : \",this.state);\r\n\r\n      fetch('http://localhost:4000/authentification/signup', {\r\n        method: 'POST',\r\n        // credentials : include permet d'intégrer les cookie avec la requête\r\n        credentials: 'include',\r\n        body: JSON.stringify({\r\n          pseudo:this.state.pseudo,\r\n          email:this.state.email,\r\n          mdp:this.state.mdp\r\n        }),\r\n        headers: {\r\n          'Content-Type': 'application/json'\r\n        }\r\n      })\r\n      .then((value) => {\r\n        if (value.status === 200) {\r\n          // s'il y a eu aucune erreur redirigé à l'acceuil\r\n          this.props.history.push('/app/friendlist');\r\n          console.log(\"info envoyé\");\r\n        } else {\r\n          // s'il y a eu une erreur, renvoyer le message suivant\r\n          this.setState({message:'Pseudo ou email déjà utilisé'});\r\n        }\r\n      })\r\n\r\n    }\r\n  \r\n    render() {\r\n      return (\r\n      <div className=\"body-singup\">\r\n        <div className=\"box-centre-singup\">\r\n          <div className=\"box-gauche-singup\">\r\n          <form onSubmit={this.onSubmit}>\r\n          <h1 className=\"texte-Create-Account-boxgauche-singup\">Create Account</h1>\r\n          <input className=\"pseudo-singup\" \r\n            type=\"text\"\r\n            name=\"pseudo\"\r\n            placeholder=\"Pseudo\"\r\n            value={this.state.pseudo}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"email-singup\"\r\n            type=\"email\"\r\n            name=\"email\"\r\n            placeholder=\"E-mail\"\r\n            value={this.state.email}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"password-singup\"\r\n            type=\"password\"\r\n            name=\"mdp\"\r\n            placeholder=\"Password\"\r\n            value={this.state.mdp}\r\n            onChange={this.handleInputChange}\r\n            required\r\n          />\r\n          <br></br>\r\n          <input className=\"bouton-singup-gauche-singup\" type=\"submit\" value=\"SING UP\"/>\r\n        </form>\r\n        <p className=\"email-deja-utiliser-singup\">{this.state.message}</p>\r\n        </div>\r\n        <div className=\"box-droite-singup\">\r\n          <p className=\"Welcome-back-singup\">Welcome back </p>\r\n          <p className=\"Texte-gauche-singup\">Si tu as déjà un compte, il te suffit de te connecter ! </p>\r\n          <Link className=\"boutton-singin-singup\" id=\"link6\"  to=\"/login\">SIGN IN</Link>\r\n        </div>\r\n        </div>\r\n        </div>\r\n      );\r\n\r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\friends-liste.jsx",["112","113","114","115","116","117","118"],"import React, { Component } from 'react';\r\nimport { BrowserRouter, Route, Router, Link, Switch } from \"react-router-dom\"\r\nimport Chat from './components/chat';\r\nimport { withRouter } from \"react-router-dom\";\r\nimport Barregauche from './barre-gauche.jsx';\r\nimport StatWithFriend from './components/statistique'\r\nimport './style/friend-liste.css';\r\nimport './style/friend-liste-responsive.css';\r\n\r\n\r\nexport default class friendsliste extends Component {\r\n    \r\n      // création du State \"friend\"\r\n      constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n          friend : '',\r\n          message : '',\r\n          amislist: [{_id:0, _pseudo:\"\"}],\r\n          firstFriend:\"\",\r\n          room:''\r\n        };\r\n      }\r\n    \r\n      // ajout des changement lorsque le texte de l'input change\r\n      handleInputChange = (event) => {\r\n        const { value, name } = event.target;\r\n        this.setState({\r\n          [name]: value\r\n        });\r\n      }\r\n\r\n      // fonction permettant de faire une requête POST au serveur et d'envoyer les données\r\n    onSubmit = (event) => {\r\n        event.preventDefault();\r\n        console.log(\"state envois demande amis : \",this.state)\r\n        // requête POST\r\n        fetch('http://localhost:4000/app/newfriend', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            new_friend: this.state.friend\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json'\r\n          }\r\n        })\r\n        // renvois message de réussite ou non\r\n        .then(res => {\r\n          if (res.status === 200) {\r\n            this.setState({message: \"\"})\r\n          } else if(res.status === 400){\r\n            this.setState({message : \"l'utilisateur rechercher n'existe pas\"})\r\n          } else if(res.status === 402){\r\n            this.setState({message: \" vous avez déja cette utilisateur en amis\"})\r\n          } else{\r\n              console.log(\"erreur\")\r\n          }\r\n        })\r\n      }\r\n      componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          console.log(response)\r\n          this.setState({amislist:response.data})\r\n          this.setState({firstFriend:response.firstFriend})\r\n          console.log(\"state\", this.state.amislist)\r\n        })\r\n      }\r\n\r\n    render() {\r\n      const {message} = this.state\r\n      const {amislist} = this.state\r\n      console.log(\"here\",amislist)\r\n      return (\r\n        <div className=\"corps-friends-liste\">\r\n          <div> \r\n            <Barregauche firstFriend={this.state.firstFriend}/>\r\n            <div className=\"add-friends\">\r\n              <form class=\"ajouter-amis-friens-liste\" onSubmit={this.onSubmit}>\r\n                  <input \r\n                  className=\"ajouter-amis-friens-liste-p1\"\r\n                  name=\"friend\"\r\n                  type=\"text\" \r\n                  placeholder=\"pseudo\"\r\n                  value={this.state.friend}\r\n                  onChange={this.handleInputChange}\r\n                  required\r\n                  />\r\n                  <input className=\"ajouter-amis-friens-liste-p2\" type=\"submit\" value=\"+\"/>\r\n                  <p className=\"message-erreur-ajt-amis\">{message}</p>\r\n              </form>\r\n            </div>\r\n          <div className=\"friend-list\">\r\n            {amislist.map((amis)=>(\r\n              <Link to={\"/app2/\"+amis.id} >\r\n                  <div className=\"friend\" name={amis.pseudo}>\r\n                      <p>{amis.pseudo}</p>\r\n                  </div>\r\n              </Link>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </div>\r\n      ); \r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\chat.jsx",["119","120","121","122","123","124","125","126"],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\statistique.jsx",["127"],"import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport Barregauche from '../barre-gauche.jsx';\r\nimport rockets from '../image/rockets.png'\r\nimport '../style/stastistique.css';\r\n\r\nexport default class StatWithFriend extends Component {\r\n\r\n  constructor(props) {\r\n    super(props)\r\n    this.state = {\r\n      statistique_amis: [{}], \r\n      amislist: [{}],\r\n      FirstFriend:\"\"\r\n    };\r\n  }\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/statByUser', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => { \r\n          this.setState({statistique_amis:response})\r\n          console.log(\"statistique : \",this.state.statistique_amis)\r\n        })\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          console.log(response)\r\n          this.setState({amislist:response.data})\r\n          this.setState({FirstFriend:response.firstFriend})\r\n        })\r\n      }\r\n\r\n\r\n\r\n    render(){\r\n      const {statistique_amis} = this.state\r\n        return(\r\n          <div>\r\n            <Barregauche firstFriend={this.state.FirstFriend}/>\r\n            <div className=\"statistique-body\">\r\n              <div className=\"barre-du-haut-stat\">\r\n                <p className=\"texte-barre-du-haut-stat\">Nombre de message échanger :                   Ichat rockets <img  className=\"logo-rockets-calssement-stat-haut\"src={rockets} alt=\"amis\"/></p>\r\n              </div>\r\n              <div className=\"classement-stat\">\r\n                {statistique_amis.map((amis)=>(\r\n                  <div className=\"casse-classement-stat\">\r\n                    <p>{amis.friend_name} : {amis.nbr_message} <img  className=\"logo-rockets-calssement-stat\"src={rockets} alt=\"amis\"/> </p>\r\n                  </div>\r\n                ))}\r\n              </div>\r\n              </div>\r\n            </div>\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\withAuth.jsx",[],"D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-gauche.jsx",["128"]," import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport './style/barre-gauche.css';\r\nimport profil from './image/img-profil.jpg'\r\nimport envelope from './image/envelope.png'\r\nimport users from './image/user.png'\r\nimport rouage from './image/settings.png'\r\nimport logout from './image/logout.png'\r\nimport rockets from './image/rockets.png'\r\nimport './style/barre-gauche-responsive.css';\r\n\r\nexport default class barregauche extends Component {\r\n\r\n    constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n            firstFriend:\"\"\r\n        };\r\n      }\r\n\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          this.setState({firstFriend:response.firstFriend})\r\n        })\r\n    }\r\n\r\n\r\n    \r\n     render(){\r\n        return(\r\n            <div>\r\n                <div className=\"nav-barre-gauche\">\r\n                    <div className=\"profil-users\">\r\n                        <img className=\"profil\"  src={profil} alt=\"photo de profil\"/>\r\n                    </div>\r\n                    <div className=\"bouton-part \">\r\n                        <Link to={'/app2/'+this.state.firstFriend}>\r\n                            <img  className=\"logo-message\" src={envelope} alt=\"message\"/>\r\n                        </Link>\r\n                        <Link to='/app/friendlist'>\r\n                            <img  className=\"logo-users\"src={users} alt=\"amis\"/>\r\n                        </Link>\r\n                        <Link to='/app/statistique'>\r\n                            <img  className=\"logo-rockets\"src={rockets} alt=\"statistique\"/>\r\n                        </Link>\r\n                        <Link to='/app/parametre'>\r\n                            <img   className=\"logo-rouage\" src={rouage} alt=\"paramétres\"/>\r\n                        </Link>\r\n                    </div>\r\n                    <div className=\"deconextion\">\r\n                        <img   className=\"logo-deconextion\" src={logout} alt=\"déconextion\"/>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n\r\n","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\application2.jsx",["129","130"],"import React, { Component } from 'react';\r\n\r\nimport Chat from './components/chat';\r\nimport { Link } from 'react-router-dom';\r\nimport './style/app.css';\r\nimport './style/app-responsive.css';\r\nimport Barregauche from './barre-gauche.jsx';\r\nimport Barreamisgauche from './barre-amis-gauche';\r\n\r\n\r\nexport default class Application2 extends Component {\r\n    \r\n  \r\n      // création du State \"friend\"\r\n      constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n          friend : '',\r\n          message : '',\r\n          amislist: [{_id:0, _pseudo:\"\"}],\r\n          firstFriend:\"\",\r\n          user_nom : ''\r\n        };\r\n      }\r\n    \r\n      // ajout des changement lorsque le texte de l'input change\r\n      handleInputChange = (event) => {\r\n        const { value, name } = event.target;\r\n        this.setState({\r\n          [name]: value\r\n        });\r\n      }\r\n\r\n      // fonction permettant de faire une requête POST au serveur et d'envoyer les données\r\n    onSubmit = (event) => {\r\n        event.preventDefault();\r\n        console.log(\"state envois demande amis : \",this.state)\r\n        // requête POST\r\n        fetch('http://localhost:4000/app/newfriend', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            new_friend: this.state.friend\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json'\r\n          }\r\n        })\r\n        // renvois message de réussite ou non\r\n        .then(res => {\r\n          if (res.status === 200) {\r\n            this.setState({message: \"\"})\r\n          } else if(res.status === 400){\r\n            this.setState({message : \"l'utilisateur rechercher n'existe pas\"})\r\n          }\r\n          else{\r\n              console.log(\"erreur\")\r\n          }\r\n        })\r\n      }\r\n      componentDidMount(){\r\n        fetch('http://localhost:4000/app/friendlist', {\r\n          method: 'GET',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include',\r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n          //console.log(response)\r\n          this.setState({amislist:response.friends})\r\n          this.setState({user_nom:response.pseudo})\r\n          this.setState({firstFriend:response.firstFriend})\r\n          //let test = this.state.amislist\r\n\r\n        })\r\n      }\r\n\r\n    render() {\r\n      const {message} = this.state\r\n      const { id } = this.props.match.params;\r\n      return (\r\n      <div className=\"corps\"> \r\n        <div className=\"colone-gauche\">\r\n          <Barregauche firstFriend={this.state.firstFriend}/>\r\n          <Barreamisgauche/>\r\n      </div>\r\n      <Chat valeur={id} nom={this.state.user_nom}/>\r\n    </div>\r\n      ); \r\n    }\r\n  }","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\paramètre.jsx",["131"],"import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport BarreGauche from '../barre-gauche'\r\nimport '../style/paramètre.css';\r\nimport '../style/paramètre-responsive.css';\r\n\r\nexport default class parametre extends Component {\r\n\r\n  constructor(props) {\r\n    super(props)\r\n    this.state = {\r\n        newName:\"\",\r\n        message:\"\"\r\n    };\r\n  }\r\n\r\n  handleInputChange = (event) => {\r\n    const { value, name } = event.target;\r\n    this.setState({\r\n      [name]: value\r\n    });\r\n  }\r\n    \r\n    onSubmit = (event)=>{\r\n        event.preventDefault();\r\n        console.log(this.state)\r\n        fetch('http://localhost:4000/app/changeName', {\r\n            method: 'POST',\r\n            // credentials : include permet d'intégrer les cookie avec la requête\r\n            credentials: 'include', \r\n            body: JSON.stringify({\r\n                newName:this.state.newName\r\n              }),\r\n            headers: {\r\n              'Content-Type': 'application/json',\r\n            }\r\n          })\r\n          .then(res => {\r\n            if (res.status === 200) {\r\n              // s'il y a aucune erreur, renvoyer vers l'acceuil\r\n              this.setState({message:'Le Changement de pseudo a bien été effectué'});\r\n              console.log(\"OK\")\r\n            }if (res.status === 401){\r\n              // si erreur code est 401, renvoyer ce message\r\n              this.setState({message:'Erreur'});\r\n            } \r\n          })\r\n          this.setState({newName:\"\"})\r\n    }\r\n    render(){\r\n        return(\r\n            <div>\r\n                <BarreGauche/>\r\n                <div className=\"paramètre-body\">\r\n                <div className=\"barre-du-haut-paramètre\">\r\n                  <p className=\"texte-barre-du-haut-paramètre\"> Changer ici votre mots de passe : </p>\r\n              </div>\r\n              <div >\r\n        <form className=\"changer-pseudo\" onSubmit={this.onSubmit}>\r\n                    <input className=\"entrer-nouveau-pseudo\"\r\n                      type=\"text\"\r\n                      name=\"newName\"\r\n                      placeholder=\"Entrer le nouveau pseudo voulu\"\r\n                      value={this.state.newName}\r\n                      onChange={this.handleInputChange}\r\n                      required\r\n                    />\r\n                    <input className=\"valider-nouveau-pseudo\" type=\"submit\" value=\"Valider\"/>\r\n                  </form>\r\n                  <p>{this.state.message}</p>\r\n                  </div>\r\n                  </div>\r\n            </div>\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\components\\friend_nom.jsx",["132"],"import React, { Component } from 'react';\r\n\r\n\r\nexport default class friend_nom extends Component {\r\n    constructor(props) {\r\n        super(props)\r\n        this.state = {\r\n            nom:'',\r\n            id:''\r\n        };\r\n      }\r\n    componentDidMount(){\r\n        fetch('http://localhost:4000/app/getFriendName', {\r\n          method: 'POST',\r\n          // credentials : include permet d'intégrer les cookie avec la requête\r\n          credentials: 'include', \r\n          body: JSON.stringify({\r\n            name: this.props.id\r\n          }),\r\n          headers: {\r\n            'Content-Type': 'application/json',\r\n            'Accept': 'application/json'\r\n          }\r\n        })\r\n        .then(response => response.json())\r\n        .then(response => {\r\n            this.setState({nom:response})\r\n            this.setState({id:this.props.id})\r\n        })\r\n    }\r\n    componentDidUpdate(){\r\n        if(this.state.id != this.props.id){\r\n            fetch('http://localhost:4000/app/getFriendName', {\r\n                method: 'POST',\r\n                // credentials : include permet d'intégrer les cookie avec la requête\r\n                credentials: 'include', \r\n                body: JSON.stringify({\r\n                  name: this.props.id\r\n                }),\r\n                headers: {\r\n                  'Content-Type': 'application/json',\r\n                  'Accept': 'application/json'\r\n                }\r\n              })\r\n              .then(response => response.json())\r\n              .then(response => {\r\n                  this.setState({nom:response})\r\n                  this.setState({id:this.props.id})\r\n              })\r\n        }\r\n    }\r\n    render(){\r\n        return(\r\n            <p className=\"barre-du-haut-amis-texte\">\r\n                {this.state.nom}\r\n            </p>\r\n\r\n        );\r\n    }\r\n}","D:\\matth\\programation\\my-app\\NSI-Projet\\src\\barre-amis-gauche.jsx",[],{"ruleId":"133","replacedBy":"134"},{"ruleId":"135","replacedBy":"136"},{"ruleId":"137","severity":1,"message":"138","line":2,"column":32,"nodeType":"139","messageId":"140","endLine":2,"endColumn":38},{"ruleId":"137","severity":1,"message":"141","line":2,"column":40,"nodeType":"139","messageId":"140","endLine":2,"endColumn":44},{"ruleId":"137","severity":1,"message":"142","line":10,"column":8,"nodeType":"139","messageId":"140","endLine":10,"endColumn":12},{"ruleId":"137","severity":1,"message":"143","line":15,"column":10,"nodeType":"139","messageId":"140","endLine":15,"endColumn":23},{"ruleId":"137","severity":1,"message":"144","line":15,"column":25,"nodeType":"139","messageId":"140","endLine":15,"endColumn":30},{"ruleId":"137","severity":1,"message":"138","line":15,"column":32,"nodeType":"139","messageId":"140","endLine":15,"endColumn":38},{"ruleId":"137","severity":1,"message":"145","line":15,"column":46,"nodeType":"139","messageId":"140","endLine":15,"endColumn":52},{"ruleId":"146","severity":1,"message":"147","line":30,"column":17,"nodeType":"148","endLine":30,"endColumn":32},{"ruleId":"146","severity":1,"message":"147","line":31,"column":17,"nodeType":"148","endLine":31,"endColumn":32},{"ruleId":"146","severity":1,"message":"147","line":32,"column":17,"nodeType":"148","endLine":32,"endColumn":32},{"ruleId":"146","severity":1,"message":"147","line":43,"column":17,"nodeType":"148","endLine":43,"endColumn":49},{"ruleId":"149","severity":1,"message":"150","line":67,"column":17,"nodeType":"148","endLine":67,"endColumn":91},{"ruleId":"149","severity":1,"message":"150","line":96,"column":17,"nodeType":"148","endLine":96,"endColumn":94},{"ruleId":"149","severity":1,"message":"150","line":108,"column":17,"nodeType":"148","endLine":108,"endColumn":86},{"ruleId":"149","severity":1,"message":"150","line":112,"column":29,"nodeType":"148","endLine":112,"endColumn":108},{"ruleId":"149","severity":1,"message":"150","line":117,"column":29,"nodeType":"148","endLine":117,"endColumn":92},{"ruleId":"149","severity":1,"message":"150","line":122,"column":29,"nodeType":"148","endLine":122,"endColumn":106},{"ruleId":"149","severity":1,"message":"150","line":127,"column":29,"nodeType":"148","endLine":127,"endColumn":92},{"ruleId":"149","severity":1,"message":"150","line":132,"column":29,"nodeType":"148","endLine":132,"endColumn":98},{"ruleId":"149","severity":1,"message":"150","line":137,"column":29,"nodeType":"148","endLine":137,"endColumn":92},{"ruleId":"149","severity":1,"message":"150","line":143,"column":29,"nodeType":"148","endLine":143,"endColumn":100},{"ruleId":"149","severity":1,"message":"150","line":148,"column":29,"nodeType":"148","endLine":148,"endColumn":92},{"ruleId":"151","severity":1,"message":"152","line":164,"column":9,"nodeType":"148","endLine":164,"endColumn":108},{"ruleId":"149","severity":1,"message":"150","line":185,"column":21,"nodeType":"148","endLine":185,"endColumn":91},{"ruleId":"149","severity":1,"message":"150","line":190,"column":21,"nodeType":"148","endLine":190,"endColumn":93},{"ruleId":"149","severity":1,"message":"150","line":194,"column":21,"nodeType":"148","endLine":194,"endColumn":101},{"ruleId":"149","severity":1,"message":"150","line":204,"column":17,"nodeType":"148","endLine":204,"endColumn":91},{"ruleId":"149","severity":1,"message":"150","line":332,"column":17,"nodeType":"148","endLine":332,"endColumn":96},{"ruleId":"137","severity":1,"message":"153","line":2,"column":8,"nodeType":"139","messageId":"140","endLine":2,"endColumn":13},{"ruleId":"137","severity":1,"message":"143","line":3,"column":10,"nodeType":"139","messageId":"140","endLine":3,"endColumn":23},{"ruleId":"137","severity":1,"message":"144","line":3,"column":25,"nodeType":"139","messageId":"140","endLine":3,"endColumn":30},{"ruleId":"137","severity":1,"message":"138","line":3,"column":32,"nodeType":"139","messageId":"140","endLine":3,"endColumn":38},{"ruleId":"137","severity":1,"message":"145","line":3,"column":46,"nodeType":"139","messageId":"140","endLine":3,"endColumn":52},{"ruleId":"137","severity":1,"message":"153","line":2,"column":8,"nodeType":"139","messageId":"140","endLine":2,"endColumn":13},{"ruleId":"137","severity":1,"message":"143","line":3,"column":10,"nodeType":"139","messageId":"140","endLine":3,"endColumn":23},{"ruleId":"137","severity":1,"message":"144","line":3,"column":25,"nodeType":"139","messageId":"140","endLine":3,"endColumn":30},{"ruleId":"137","severity":1,"message":"138","line":3,"column":32,"nodeType":"139","messageId":"140","endLine":3,"endColumn":38},{"ruleId":"137","severity":1,"message":"145","line":3,"column":46,"nodeType":"139","messageId":"140","endLine":3,"endColumn":52},{"ruleId":"137","severity":1,"message":"143","line":2,"column":10,"nodeType":"139","messageId":"140","endLine":2,"endColumn":23},{"ruleId":"137","severity":1,"message":"144","line":2,"column":25,"nodeType":"139","messageId":"140","endLine":2,"endColumn":30},{"ruleId":"137","severity":1,"message":"138","line":2,"column":32,"nodeType":"139","messageId":"140","endLine":2,"endColumn":38},{"ruleId":"137","severity":1,"message":"145","line":2,"column":46,"nodeType":"139","messageId":"140","endLine":2,"endColumn":52},{"ruleId":"137","severity":1,"message":"142","line":3,"column":8,"nodeType":"139","messageId":"140","endLine":3,"endColumn":12},{"ruleId":"137","severity":1,"message":"154","line":4,"column":10,"nodeType":"139","messageId":"140","endLine":4,"endColumn":20},{"ruleId":"137","severity":1,"message":"155","line":6,"column":8,"nodeType":"139","messageId":"140","endLine":6,"endColumn":22},{"ruleId":"137","severity":1,"message":"154","line":3,"column":10,"nodeType":"139","messageId":"140","endLine":3,"endColumn":20},{"ruleId":"156","severity":1,"message":"157","line":86,"column":7,"nodeType":"158","messageId":"159","endLine":107,"endColumn":8},{"ruleId":"160","severity":1,"message":"161","line":99,"column":20,"nodeType":"162","messageId":"159","endLine":99,"endColumn":22},{"ruleId":"160","severity":1,"message":"161","line":109,"column":31,"nodeType":"162","messageId":"159","endLine":109,"endColumn":33},{"ruleId":"137","severity":1,"message":"163","line":127,"column":13,"nodeType":"139","messageId":"140","endLine":127,"endColumn":18},{"ruleId":"137","severity":1,"message":"164","line":128,"column":13,"nodeType":"139","messageId":"140","endLine":128,"endColumn":17},{"ruleId":"160","severity":1,"message":"165","line":142,"column":36,"nodeType":"162","messageId":"159","endLine":142,"endColumn":38},{"ruleId":"160","severity":1,"message":"165","line":178,"column":36,"nodeType":"162","messageId":"159","endLine":178,"endColumn":38},{"ruleId":"137","severity":1,"message":"141","line":2,"column":10,"nodeType":"139","messageId":"140","endLine":2,"endColumn":14},{"ruleId":"149","severity":1,"message":"150","line":44,"column":25,"nodeType":"148","endLine":44,"endColumn":86},{"ruleId":"137","severity":1,"message":"141","line":4,"column":10,"nodeType":"139","messageId":"140","endLine":4,"endColumn":14},{"ruleId":"137","severity":1,"message":"166","line":84,"column":14,"nodeType":"139","messageId":"140","endLine":84,"endColumn":21},{"ruleId":"137","severity":1,"message":"141","line":2,"column":10,"nodeType":"139","messageId":"140","endLine":2,"endColumn":14},{"ruleId":"160","severity":1,"message":"161","line":32,"column":26,"nodeType":"162","messageId":"159","endLine":32,"endColumn":28},"no-native-reassign",["167"],"no-negated-in-lhs",["168"],"no-unused-vars","'Router' is defined but never used.","Identifier","unusedVar","'Link' is defined but never used.","'Chat' is defined but never used.","'BrowserRouter' is defined but never used.","'Route' is defined but never used.","'Switch' is defined but never used.","jsx-a11y/anchor-is-valid","The href attribute is required for an anchor to be keyboard accessible. Provide a valid, navigable address as the href value. If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md","JSXOpeningElement","jsx-a11y/img-redundant-alt","Redundant alt attribute. Screen-readers already announce `img` tags as an image. You don’t need to use the words `image`, `photo,` or `picture` (or any specified custom words) in the alt prop.","jsx-a11y/iframe-has-title","<iframe> elements must have a unique title property.","'axios' is defined but never used.","'withRouter' is defined but never used.","'StatWithFriend' is defined but never used.","no-dupe-class-members","Duplicate name 'componentDidMount'.","MethodDefinition","unexpected","eqeqeq","Expected '!==' and instead saw '!='.","BinaryExpression","'BLOCK' is assigned a value but never used.","'NONE' is assigned a value but never used.","Expected '===' and instead saw '=='.","'message' is assigned a value but never used.","no-global-assign","no-unsafe-negation"]
\ No newline at end of file
diff --git a/app.js b/app.js
index e364c66..2da02f2 100644
--- a/app.js
+++ b/app.js
@@ -103,7 +103,7 @@ app.use('/app/changeName', authController.withAuth, (req, res, next) => {
             try {
                 let doc = await User.findOneAndUpdate({ _id: decoded.userId }, { pseudo: req.body.newName });
                 console.log(doc.pseudo)
-                res.status(200)
+                res.status(200).send({ message: 'OK' })
             } catch (err) {
                 res.status(401).json({ err })
             }
@@ -248,7 +248,6 @@ app.post('/app/newfriend', authController.withAuth, (req, res, next) => {
         req.cookies.token;
 
     User.findOne({ pseudo: req.body.new_friend }, function(err, docs) {
-
         if (err) {
             console.log(err)
         } else if (docs == null) {
@@ -260,7 +259,7 @@ app.post('/app/newfriend', authController.withAuth, (req, res, next) => {
                 if (err) {
                     res.status(401).send({ error: "invalide token" });
                 } else {
-                    User.findOne({ _id: decoded.userId, "friends._pseudo": req.body.new_friend }, function(err, docs) {
+                    User.findOne({ _id: decoded.userId, "friends._id": friendID }, function(err, docs) {
                         if (err) {
                             console.log(err)
                         } else if (docs == null) {
@@ -307,10 +306,6 @@ app.post('/app/newfriend', authController.withAuth, (req, res, next) => {
                                         membres: [
                                             { _id: friendID },
                                             { _id: userID }
-                                        ],
-                                        message: [
-                                            { text: "wesh", author: "david" },
-                                            { text: "wesh david", author: "thierry" }
                                         ]
                                     })
                                     groupe.save()
diff --git a/controllers/user.js b/controllers/user.js
index 4edfe43..7e1bcd2 100644
--- a/controllers/user.js
+++ b/controllers/user.js
@@ -1,4 +1,5 @@
 const User = require('../models/user');
+const Groupe = require('../models/groupe')
 const bcrypt = require('bcrypt');
 const jwt = require('jsonwebtoken');
 
@@ -15,22 +16,47 @@ exports.signup = (req, res, next) => {
             pseudo: pseudo,
             email: email,
             mdp: hash,
-            //test
-            /*friends: [{
-                user_id: "test",
-                _pseudo: "test"
-            }]*/
+            friends: {
+                _id: "6076e163d47a913b0c2b0b0f",
+                _pseudo: "Equipe iChat"
+            }
         });
+
         user.save()
             // crétion de la session qui exprire dans 1h
             .then(() => {
                 const token = jwt.sign({ userId: user._id }, secret, {
                     expiresIn: '1h'
                 });
-                return res.cookie('token', token, { httpOnly: true }).status(200).json({ message: 'utilisateur créer' });
+                User.updateOne({ _id: "6076e163d47a913b0c2b0b0f" }, {
+                    $push: {
+                        friends: {
+                            _id: user._id,
+                            _pseudo: req.body.pseudo
+                        }
+                    }
+                }, function(err, docs) {
+                    if (err) {
+                        console.log(err)
+                    } else {
+                        const groupe = new Groupe({
+                            membres: [
+                                { _id: user._id },
+                                { _id: "6076e163d47a913b0c2b0b0f" }
+                            ],
+                            message: [
+                                { text: "Bienvenue dans iChat, vous pouvez désormais ajoutez des amis dans la section dédiée et vous partagez vos plus belles histoires !", author: "Equipe iChat" }
+                            ]
+                        })
+                        groupe.save()
+                        return res.cookie('token', token, { httpOnly: true }).status(200).json({ message: 'utilisateur créer' });
+                    }
+                })
+
             })
             // renvois éventuelles érreurs
             .catch(error => res.status(400).json({ message: "Nom du'ilisateur ou mot de passe ou Pseudo déjà utilisé" }));
+
     });
 }
 
diff --git a/package-lock.json b/package-lock.json
index 51a7a7c..9dc476b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1158,6 +1158,64 @@
       "resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-10.1.0.tgz",
       "integrity": "sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg=="
     },
+    "@emotion/cache": {
+      "version": "10.0.29",
+      "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-10.0.29.tgz",
+      "integrity": "sha512-fU2VtSVlHiF27empSbxi1O2JFdNWZO+2NFHfwO0pxgTep6Xa3uGb+3pVKfLww2l/IBGLNEZl5Xf/++A4wAYDYQ==",
+      "requires": {
+        "@emotion/sheet": "0.9.4",
+        "@emotion/stylis": "0.8.5",
+        "@emotion/utils": "0.11.3",
+        "@emotion/weak-memoize": "0.2.5"
+      }
+    },
+    "@emotion/hash": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
+      "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
+    },
+    "@emotion/memoize": {
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
+      "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
+    },
+    "@emotion/serialize": {
+      "version": "0.11.16",
+      "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.11.16.tgz",
+      "integrity": "sha512-G3J4o8by0VRrO+PFeSc3js2myYNOXVJ3Ya+RGVxnshRYgsvErfAOglKAiy1Eo1vhzxqtUvjCyS5gtewzkmvSSg==",
+      "requires": {
+        "@emotion/hash": "0.8.0",
+        "@emotion/memoize": "0.7.4",
+        "@emotion/unitless": "0.7.5",
+        "@emotion/utils": "0.11.3",
+        "csstype": "^2.5.7"
+      }
+    },
+    "@emotion/sheet": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.4.tgz",
+      "integrity": "sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA=="
+    },
+    "@emotion/stylis": {
+      "version": "0.8.5",
+      "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz",
+      "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ=="
+    },
+    "@emotion/unitless": {
+      "version": "0.7.5",
+      "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
+      "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
+    },
+    "@emotion/utils": {
+      "version": "0.11.3",
+      "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz",
+      "integrity": "sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw=="
+    },
+    "@emotion/weak-memoize": {
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
+      "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
+    },
     "@eslint/eslintrc": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.2.2.tgz",
@@ -2267,6 +2325,15 @@
         "@types/node": "*"
       }
     },
+    "@types/hoist-non-react-statics": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+      "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+      "requires": {
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0"
+      }
+    },
     "@types/html-minifier-terser": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz",
@@ -2346,11 +2413,33 @@
       "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.1.5.tgz",
       "integrity": "sha512-UEyp8LwZ4Dg30kVU2Q3amHHyTn1jEdhCIE59ANed76GaT1Vp76DD3ZWSAxgCrw6wJ0TqeoBpqmfUHiUDPs//HQ=="
     },
+    "@types/prop-types": {
+      "version": "15.7.3",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
+      "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
+    },
     "@types/q": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz",
       "integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug=="
     },
+    "@types/react": {
+      "version": "17.0.3",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.3.tgz",
+      "integrity": "sha512-wYOUxIgs2HZZ0ACNiIayItyluADNbONl7kt8lkLjVK8IitMH5QMyAh75Fwhmo37r1m7L2JaFj03sIfxBVDvRAg==",
+      "requires": {
+        "@types/prop-types": "*",
+        "@types/scheduler": "*",
+        "csstype": "^3.0.2"
+      },
+      "dependencies": {
+        "csstype": {
+          "version": "3.0.7",
+          "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.7.tgz",
+          "integrity": "sha512-KxnUB0ZMlnUWCsx2Z8MUsr6qV6ja1w9ArPErJaJaF8a5SOWoHLIszeCTKGRGRgtLgYrs1E8CHkNSP1VZTTPc9g=="
+        }
+      }
+    },
     "@types/resolve": {
       "version": "0.0.8",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -2359,6 +2448,11 @@
         "@types/node": "*"
       }
     },
+    "@types/scheduler": {
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.1.tgz",
+      "integrity": "sha512-EaCxbanVeyxDRTQBkdLb3Bvl/HK7PBK6UJjsSixB0iHKoWxE5uu2Q/DgtpOhPIojN0Zl1whvOd7PoHs2P0s5eA=="
+    },
     "@types/source-list-map": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
@@ -4262,6 +4356,11 @@
         }
       }
     },
+    "classnames": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
+    },
     "clean-css": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz",
@@ -4727,6 +4826,17 @@
         }
       }
     },
+    "create-emotion": {
+      "version": "10.0.27",
+      "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.27.tgz",
+      "integrity": "sha512-fIK73w82HPPn/RsAij7+Zt8eCE8SptcJ3WoRMfxMtjteYxud8GDTKKld7MYwAX2TVhrw29uR1N/bVGxeStHILg==",
+      "requires": {
+        "@emotion/cache": "^10.0.27",
+        "@emotion/serialize": "^0.11.15",
+        "@emotion/sheet": "0.9.4",
+        "@emotion/utils": "0.11.3"
+      }
+    },
     "create-hash": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
@@ -5095,6 +5205,11 @@
         }
       }
     },
+    "csstype": {
+      "version": "2.6.16",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.16.tgz",
+      "integrity": "sha512-61FBWoDHp/gRtsoDkq/B1nWrCUG/ok1E3tUrcNbZjsE9Cxd9yzUirjS3+nAATB8U4cTtaQmAHbNndoFz5L6C9Q=="
+    },
     "cyclist": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@@ -10434,6 +10549,11 @@
         "lodash._reinterpolate": "^3.0.0"
       }
     },
+    "lodash.throttle": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
+      "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
+    },
     "lodash.uniq": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@@ -10530,6 +10650,11 @@
         "object-visit": "^1.0.0"
       }
     },
+    "math-random": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/math-random/-/math-random-2.0.1.tgz",
+      "integrity": "sha512-oIEbWiVDxDpl5tIF4S6zYS9JExhh3bun3uLb3YAinHPTlRtW4g1S66LtJrJ4Npq8dgIa8CLK5iPVah5n4n0s2w=="
+    },
     "md5.js": {
       "version": "1.3.5",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -13349,6 +13474,16 @@
         "whatwg-fetch": "^3.4.1"
       }
     },
+    "react-cookie": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-4.0.3.tgz",
+      "integrity": "sha512-cmi6IpdVgTSvjqssqIEvo779Gfqc4uPGHRrKMEdHcqkmGtPmxolGfsyKj95bhdLEKqMdbX8MLBCwezlnhkHK0g==",
+      "requires": {
+        "@types/hoist-non-react-statics": "^3.0.1",
+        "hoist-non-react-statics": "^3.0.0",
+        "universal-cookie": "^4.0.0"
+      }
+    },
     "react-dev-utils": {
       "version": "11.0.1",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.1.tgz",
@@ -13571,6 +13706,32 @@
         "workbox-webpack-plugin": "5.1.4"
       }
     },
+    "react-scroll": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/react-scroll/-/react-scroll-1.8.2.tgz",
+      "integrity": "sha512-f2ZEG5fsPbPTySI9ekcFpETCcNlqbmwbQj9hhzYK8tkgv+PA8APatSt66o/q0KSkDZxyT98ONTtXp9x0lyowEw==",
+      "requires": {
+        "lodash.throttle": "^4.1.1",
+        "prop-types": "^15.7.2"
+      }
+    },
+    "react-scroll-to-bottom": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/react-scroll-to-bottom/-/react-scroll-to-bottom-4.1.0.tgz",
+      "integrity": "sha512-atWRfdhLFCG2dK4kAsCDCYvl327DDEi5BMO0kIU4D12u2o2UX+GmlKO8m7sPW86Vb3MlqL3+Gawv/79VQ90tXQ==",
+      "requires": {
+        "classnames": "2.2.6",
+        "create-emotion": "10.0.27",
+        "math-random": "2.0.1",
+        "prop-types": "15.7.2",
+        "simple-update-in": "2.2.0"
+      }
+    },
+    "react-scrollable-feed": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/react-scrollable-feed/-/react-scrollable-feed-1.3.0.tgz",
+      "integrity": "sha512-ZoaWcrYlzNoGHNuYy//Wkz9jtFiy+pb8VvHzRVmthktU4cJAN4//aYzEIATyT+amAROL8qpZnoWUZJypDtmvfg=="
+    },
     "read-pkg": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -14750,6 +14911,11 @@
         }
       }
     },
+    "simple-update-in": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/simple-update-in/-/simple-update-in-2.2.0.tgz",
+      "integrity": "sha512-FrW41lLiOs82jKxwq39UrE1HDAHOvirKWk4Nv8tqnFFFknVbTxcHZzDS4vt02qqdU/5+KNsQHWzhKHznDBmrww=="
+    },
     "sisteransi": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
@@ -16082,6 +16248,22 @@
         "crypto-random-string": "^1.0.0"
       }
     },
+    "universal-cookie": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
+      "integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
+      "requires": {
+        "@types/cookie": "^0.3.3",
+        "cookie": "^0.4.0"
+      },
+      "dependencies": {
+        "@types/cookie": {
+          "version": "0.3.3",
+          "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
+          "integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
+        }
+      }
+    },
     "universalify": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-1.0.0.tgz",
diff --git a/package.json b/package.json
index fe76738..40d3665 100644
--- a/package.json
+++ b/package.json
@@ -18,9 +18,13 @@
         "mongoose-unique-validator": "^2.0.3",
         "nodemon": "^2.0.6",
         "react": "^17.0.1",
+        "react-cookie": "^4.0.3",
         "react-dom": "^17.0.1",
         "react-router-dom": "^5.2.0",
         "react-scripts": "4.0.1",
+        "react-scroll": "^1.8.2",
+        "react-scroll-to-bottom": "^4.1.0",
+        "react-scrollable-feed": "^1.3.0",
         "socket.io": "^3.1.2",
         "socket.io-client": "^3.1.2",
         "web-vitals": "^0.2.4"
diff --git a/src/barre-gauche.jsx b/src/barre-gauche.jsx
index 8139770..44d4ff9 100644
--- a/src/barre-gauche.jsx
+++ b/src/barre-gauche.jsx
@@ -1,4 +1,4 @@
- import React, { Component } from 'react';
+import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
 import './style/barre-gauche.css';
 import profil from './image/img-profil.jpg'
@@ -17,7 +17,6 @@ export default class barregauche extends Component {
             firstFriend:""
         };
       }
-
     componentDidMount(){
         fetch('http://localhost:4000/app/friendlist', {
           method: 'GET',
@@ -34,8 +33,6 @@ export default class barregauche extends Component {
         })
     }
 
-
-    
      render(){
         return(
             <div>
@@ -57,9 +54,11 @@ export default class barregauche extends Component {
                             <img   className="logo-rouage" src={rouage} alt="paramétres"/>
                         </Link>
                     </div>
-                    <div className="deconextion">
-                        <img   className="logo-deconextion" src={logout} alt="déconextion"/>
-                    </div>
+                    <Link to='/'>
+                        <div className="deconextion">
+                            <img  onClick={this.OnSubmit} className="logo-deconextion" src={logout} alt="déconextion"/>
+                        </div>
+                    </Link>
                 </div>
             </div>
         );
diff --git a/src/components/chat.jsx b/src/components/chat.jsx
index a7d8e18..de837fa 100644
--- a/src/components/chat.jsx
+++ b/src/components/chat.jsx
@@ -1,9 +1,8 @@
 import React, { Component } from 'react';
-
 import { io } from "socket.io-client"; 
 import { withRouter } from "react-router-dom";
 import FriendNom from './friend_nom'
-import trash from '../image/delete.png'
+
 
 
 const socket = io('http://localhost:4000');
@@ -20,6 +19,12 @@ export default class Chat extends Component {
           change:false
         };
       }
+      
+
+      /*scrollToBottom =()=> {
+        scroll.scrollToBottom();
+      }*/
+
       // ajout des changement lorsque le texte de l'input change
       handleInputChange = (event) => {
         const { value, name } = event.target;
@@ -129,13 +134,12 @@ export default class Chat extends Component {
           <FriendNom id={this.props.valeur}/>
           </div>
           <div className="colone-droite">
-          <div className="chat">
             <div className="chat">
               {this.state.groupetext.map((mess)=>(
                 <div className="message-envoye">
                   <p className="author">{mess.author}</p>
                   <p className="textemessageP">{mess.text}</p>
-                  { this.props.nom == mess.author ? <button value={mess._id} onClick={this.deleteMessage}> <img src={trash} /> </button> : console.log('')}
+                  { this.props.nom == mess.author ? <button value={mess._id} className="boutton-suprimer-un-message" onClick={this.deleteMessage}> X </button> : console.log('')}
                 </div>
               ))}
             </div>
@@ -154,8 +158,8 @@ export default class Chat extends Component {
                     <input class="entrer-votre-message" type="submit" value="Submit" onClick={this.onSubmit}/>
                 </div>
             </div>
-        </div>
-        </div>
+          </div>
+
         )
       } else{
       return (
@@ -175,7 +179,7 @@ export default class Chat extends Component {
                 </div>
               ))}
             </div>
-            </div>
+          </div>
             <div className="message">
                 <div className="forme-message">
                   <div className="autour-entrer-message">
diff --git "a/src/components/param\303\250tre.jsx" "b/src/components/param\303\250tre.jsx"
index 7b64898..702f4b8 100644
--- "a/src/components/param\303\250tre.jsx"
+++ "b/src/components/param\303\250tre.jsx"
@@ -20,33 +20,36 @@ export default class parametre extends Component {
       [name]: value
     });
   }
-    
-    onSubmit = (event)=>{
-        event.preventDefault();
-        console.log(this.state)
-        fetch('http://localhost:4000/app/changeName', {
-            method: 'POST',
-            // credentials : include permet d'intégrer les cookie avec la requête
-            credentials: 'include', 
-            body: JSON.stringify({
-                newName:this.state.newName
-              }),
-            headers: {
+  sleep = (milliseconds) => {
+    return new Promise(resolve => setTimeout(resolve, milliseconds))
+  }
+  onSubmit = async (event)=>{
+      event.preventDefault();
+      console.log(this.state)
+      const test = await fetch('http://localhost:4000/app/changeName', {
+          method: 'POST',
+          // credentials : include permet d'intégrer les cookie avec la requête
+          credentials: 'include', 
+          body: JSON.stringify({
+               newName:this.state.newName
+            }),
+          headers: {
               'Content-Type': 'application/json',
-            }
-          })
-          .then(res => {
-            if (res.status === 200) {
-              // s'il y a aucune erreur, renvoyer vers l'acceuil
-              this.setState({message:'Le Changement de pseudo a bien été effectué'});
-              console.log("OK")
-            }if (res.status === 401){
-              // si erreur code est 401, renvoyer ce message
-              this.setState({message:'Erreur'});
-            } 
-          })
-          this.setState({newName:""})
-    }
+          }
+         })
+         .then(res => {
+           if (res.status === 200) {
+             // s'il y a aucune erreur, renvoyer vers l'acceuil
+            this.setState({message:'Le Changement de pseudo a bien été effectué'});
+          }if (res.status === 401){
+            // si erreur code est 401, renvoyer ce message
+             this.setState({message:'Erreur'});
+           } 
+         })
+         this.setState({newName:""})
+        await this.sleep(3000)
+        this.setState({message:""});
+}
     render(){
         return(
             <div>
diff --git a/src/friends-liste.jsx b/src/friends-liste.jsx
index 77e4692..3087aee 100644
--- a/src/friends-liste.jsx
+++ b/src/friends-liste.jsx
@@ -29,9 +29,11 @@ export default class friendsliste extends Component {
           [name]: value
         });
       }
-
+      sleep = (milliseconds) => {
+        return new Promise(resolve => setTimeout(resolve, milliseconds))
+      }
       // fonction permettant de faire une requête POST au serveur et d'envoyer les données
-    onSubmit = (event) => {
+    onSubmit = async (event) => {
         event.preventDefault();
         console.log("state envois demande amis : ",this.state)
         // requête POST
@@ -49,7 +51,7 @@ export default class friendsliste extends Component {
         // renvois message de réussite ou non
         .then(res => {
           if (res.status === 200) {
-            this.setState({message: ""})
+            this.setState({message: "ajout effectué"})
           } else if(res.status === 400){
             this.setState({message : "l'utilisateur rechercher n'existe pas"})
           } else if(res.status === 402){
@@ -58,6 +60,8 @@ export default class friendsliste extends Component {
               console.log("erreur")
           }
         })
+        await this.sleep(3000)
+        this.setState({message:""});
       }
       componentDidMount(){
         fetch('http://localhost:4000/app/friendlist', {
diff --git a/src/style/Home.css b/src/style/Home.css
index 3b090ea..f3d3f77 100644
--- a/src/style/Home.css
+++ b/src/style/Home.css
@@ -807,5 +807,4 @@ footer {
     width: 10%;
     position: absolute;
     margin-top: -3.5%;
-}
-
+}
\ No newline at end of file
diff --git a/src/style/app-responsive.css b/src/style/app-responsive.css
index 515f301..e25b60e 100644
--- a/src/style/app-responsive.css
+++ b/src/style/app-responsive.css
@@ -66,7 +66,7 @@
         bottom: 0%;
         align-items: center;
         justify-content: center;
-        margin-left: %;
+        margin-left: 0%;
         background-color: #3D3D49;
         border-radius: 23px;
         
diff --git a/src/style/barre-gauche.css b/src/style/barre-gauche.css
index c8ff59c..7a96a0d 100644
--- a/src/style/barre-gauche.css
+++ b/src/style/barre-gauche.css
@@ -39,7 +39,7 @@ html {
 
 .logo-message,
 .logo-users,
-.logo-rouage{
+.logo-rouage {
     width: 45%;
     display: flex;
     align-items: center;
@@ -48,7 +48,7 @@ html {
     background-color: transparent;
 }
 
-.logo-rockets{
+.logo-rockets {
     width: 60%;
     display: flex;
     align-items: center;
@@ -67,7 +67,7 @@ html {
 .logo-rouage:active,
 .logo-deconextion:active,
 .logo-rockets:active,
-.logo-rockets:hover{
+.logo-rockets:hover {
     background-color: gray;
     transition-duration: 0.25s;
 }
diff --git a/src/style/stastistique.css b/src/style/stastistique.css
index e0c95b9..4952237 100644
--- a/src/style/stastistique.css
+++ b/src/style/stastistique.css
@@ -9,13 +9,11 @@
 }
 
 .classement-stat{
-    display: flex;
-    
+    display: flex;   
     align-items: center;
     flex-direction: column;
     width: 90%;
-    height: 60%;
-    
+    height: 60%;  
     overflow-y: scroll;
 }
 
@@ -58,7 +56,7 @@
 }
 
 .logo-rockets-calssement-stat{
-    width: 17%;
+    width: 9%;
 }
 
 .logo-rockets-calssement-stat-haut{