diff --git a/package-lock.json b/package-lock.json
index 672efc6..a99c342 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19,6 +19,7 @@
         "@testing-library/jest-dom": "^5.16.5",
         "@testing-library/react": "^13.4.0",
         "@testing-library/user-event": "^13.5.0",
+        "addeventlistener": "^2.0.0",
         "axios": "^1.1.3",
         "chart": "^0.1.2",
         "chart.js": "^3.9.1",
@@ -5156,6 +5157,14 @@
         "node": ">=0.4.0"
       }
     },
+    "node_modules/addeventlistener": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/addeventlistener/-/addeventlistener-2.0.0.tgz",
+      "integrity": "sha512-kUFKM5RAAGzcI4FGK5wsmR/K1+RotvLpwDLqBUtVR147u0y1JNyLxVIjrCODPydFbJA/kk/cTWvjL4PVpdA5WA==",
+      "dependencies": {
+        "event-listener-with-options": "^1.0.3"
+      }
+    },
     "node_modules/address": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/address/-/address-1.2.1.tgz",
@@ -8216,6 +8225,11 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/event-listener-with-options": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/event-listener-with-options/-/event-listener-with-options-1.1.0.tgz",
+      "integrity": "sha512-5CBIXSXRgo3Sf5/jW4BujZgDLkLvg93Vx3JefQs0UKOQoyKnp1pg6VoKYm4eQxi6KW3B3ghvN+gWSvIGT5tXbg=="
+    },
     "node_modules/eventemitter3": {
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
@@ -21447,6 +21461,14 @@
       "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
       "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA=="
     },
+    "addeventlistener": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/addeventlistener/-/addeventlistener-2.0.0.tgz",
+      "integrity": "sha512-kUFKM5RAAGzcI4FGK5wsmR/K1+RotvLpwDLqBUtVR147u0y1JNyLxVIjrCODPydFbJA/kk/cTWvjL4PVpdA5WA==",
+      "requires": {
+        "event-listener-with-options": "^1.0.3"
+      }
+    },
     "address": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/address/-/address-1.2.1.tgz",
@@ -23670,6 +23692,11 @@
       "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
       "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg=="
     },
+    "event-listener-with-options": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/event-listener-with-options/-/event-listener-with-options-1.1.0.tgz",
+      "integrity": "sha512-5CBIXSXRgo3Sf5/jW4BujZgDLkLvg93Vx3JefQs0UKOQoyKnp1pg6VoKYm4eQxi6KW3B3ghvN+gWSvIGT5tXbg=="
+    },
     "eventemitter3": {
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
diff --git a/package.json b/package.json
index 0471fc4..f2c4b16 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
+    "addeventlistener": "^2.0.0",
     "axios": "^1.1.3",
     "chart": "^0.1.2",
     "chart.js": "^3.9.1",
diff --git a/src/pages/Compte.js b/src/pages/Compte.js
index 9fc235d..efc74ad 100644
--- a/src/pages/Compte.js
+++ b/src/pages/Compte.js
@@ -1,3 +1,5 @@
+import { Component } from '@fullcalendar/core';
+import { render } from '@testing-library/react';
 import { click } from '@testing-library/user-event/dist/click';
 import React from 'react';
 import NavigationDashboard from '../components/NavigationDashboard';
@@ -9,29 +11,29 @@ const Compte = () => {
         <body>
 
             <link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
-            
+
             <div className="page_compte">
                 {/* Create an account page */}
                 <div className="haut_de_page">
                     <h2 className="titre">Mon Compte</h2>
                     <div className="rechLogo">
                         <div className="input_box">
-                            <input type="search" placeholder="Rechercher..."/>
+                            <input type="search" placeholder="Rechercher..." />
                             <span className="search">
                                 <i class="uil uil-search search-icon"></i>
                             </span>
                         </div>
-                        <img className="logo" srcSet="./LogoApp.svg"/>
+                        <img className="logo" srcSet="./LogoApp.svg" />
                     </div>
                 </div>
                 <div className="bas_de_page">
-                    <NavigationDashboard />                      
+                    <NavigationDashboard />
                     <div className="Compte">
                         <div className="name_picture">
                             <div className="picture">
                                 <div id="display_image"></div>
                                 <div className='bouton_submit'>
-                                    <input type="file" name="fileUpload" id="fileUpload"/>
+                                    <input type="file" name="fileUpload" id="fileUpload" accept="image/*"/>
                                 </div>
                             </div>
                             <div className="name">
@@ -46,30 +48,30 @@ const Compte = () => {
                         </div>
                         <div className="infoPerso">
                             <p className="description">Informations personnel</p>
-                            <div className="parti_mail">   
+                            <div className="parti_mail">
                                 <p className="def">Mail :</p>
                                 <p className="mail">coucou@gmail.com</p>
                             </div>
-                            <div className="parti_pays">                                
+                            <div className="parti_pays">
                                 <p className="def">Pays ou Région :</p>
                                 <p className="pays_region">France</p>
                             </div>
-                            <div className="parti_tel">                       
+                            <div className="parti_tel">
                                 <p className="def">Tel :</p>
                                 <p className="tel">0745632114</p>
                             </div>
                         </div>
                         <div className="infoEntreprise">
                             <p className="description">Informations entreprise</p>
-                            <div className="parti_name">   
+                            <div className="parti_name">
                                 <p className="def">Nom de l'entreprise</p>
                                 <p className="name">entreprise name</p>
                             </div>
-                            <div className="parti_secteurAct">                                
+                            <div className="parti_secteurAct">
                                 <p className="def">Secteur d'activité :</p>
                                 <p className="secteurAct">Coiffure</p>
                             </div>
-                            <div className="parti_nbClient">                       
+                            <div className="parti_nbClient">
                                 <p className="def">Nombre clients :</p>
                                 <p className="nbClient">200</p>
                             </div>
@@ -79,30 +81,8 @@ const Compte = () => {
             </div>
         </body>
     );
-};
-
-let fileUpload = document.getElementById("fileUpload");
-let display_image = document.getElementById("display_image");
 
-//preview();
-
-function preview(){
-    display_image.innerHTML = "";
+};
 
-    for(fileUpload of fileUpload.files){
-        let reader = new FileReader();
-        let figure = document.createElement("figure");
-        let figCap = document.createElement("figcaption");
-        figCap.innerText = fileUpload.name;
-        figure.appendChild(figCap);
-        reader.onload=()=>{
-            let img = document.createElement("img");
-            img.setAttribute("src", reader.result);
-            figure.insertBefore(img,figCap);
-        }
-        display_image.appendChild(figure);
-        reader.readAsDataURL(fileUpload);
-    }
-}
 
 export default Compte;
\ No newline at end of file
