diff --git a/front/views/Settings.tsx b/front/views/Settings.tsx
index f9b2c20..4e69af2 100644
--- a/front/views/Settings.tsx
+++ b/front/views/Settings.tsx
@@ -2,10 +2,14 @@ import "../style/settings/settings.css"
 import 'bootstrap/dist/css/bootstrap.min.css';
 import { MainTitle, SecondTitle } from "./component/Title"
 import {Header} from './template/Header'
-import { useState, ChangeEvent } from "react"
+import { useState, ChangeEvent, useRef } from "react"
 import { User } from "./model/User" 
 import Button from 'react-bootstrap/Button';
-import Form from 'react-bootstrap/Form';
+import Form from 'react-bootstrap/Form';    
+import Image from 'react-bootstrap/Image';
+import { updateSourceFile } from "typescript";
+import { fetchAPI } from "../Fetcher";
+
 
 export default function Settings({user} : {user : User}){
     return (
@@ -31,12 +35,12 @@ function AccountSettings({user} : {user : User}){
     return (
         <div id="account">
             <SecondTitle title="Compte personnel" id={null}/>
-            <ContentAccountSettings user={user}/>
+            <ProfilSettings user={user} />
         </div>
     );
 }
 
-function ContentAccountSettings({user} : {user : User}) {
+function ProfilSettings({user} : {user : User}) {
     // Utilisez useState pour gérer l'état du champ de saisie
     // const [username, setUsername] = useState({user.username});
 
@@ -55,28 +59,42 @@ function ContentAccountSettings({user} : {user : User}) {
     //     </form>
     // );
 
+    const nameRef = useRef<HTMLInputElement>(null);
+    const emailRef = useRef<HTMLInputElement>(null);
+
+
+    const size = "171x180";
+    const profilePicture = user.profilePicture + "/" + size;
     return (
-        <div id="account-infos">
-            <Form>
-                <Form.Group className="mb-3" controlId="formUsername">
-                    <Form.Label className="content">Nom d'utilisateur</Form.Label>
-                    <Form.Control size="sm" defaultValue={user.name}/>
-                </Form.Group>
-                <Form.Group className="mb-3" controlId="formEmail">
-                    <Form.Label className="content">Adresse mail</Form.Label>
-                    <Form.Control size="sm" defaultValue={user.email} type="email" placeholder="Password" />
-                </Form.Group>
-                <Button variant="outline-primary" type="submit">Mettre à jour</Button>
-            </Form>
+        <div id="account">
+            <div id="profil-picture">
+                <Image src={profilePicture}roundedCircle />
+                <Button variant="outline-primary">Changer photo de profil</Button>
+            </div>
+            <div id="account-infos">
+                <Form>
+                    <Form.Group className="mb-3" controlId="formUsername">
+                        <Form.Label className="content">Nom d'utilisateur</Form.Label>
+                        <Form.Control ref={nameRef} size="sm" defaultValue={user.name}/>
+                    </Form.Group>
+                    <Form.Group className="mb-3" controlId="formEmail">
+                        <Form.Label className="content">Adresse mail</Form.Label>
+                        <Form.Control ref={emailRef} id="control" size="sm" defaultValue={user.email} type="email" placeholder="Password" />
+                    </Form.Group>
+                    <Button variant="outline-primary" type="button" onClick={() => updateAccountInfos(nameRef.current!.value, emailRef.current!.value)}>Mettre à jour</Button>
+                </Form>
+            </div>
         </div>
-        
     );
 }
 
-function setVariable({varia} : {varia : any}){
 
+function updateAccountInfos(name : string, email : string) {
+    fetchAPI("account/update/profile", {
+        name : name,
+        email : email
+    });
 }
-
 // function InputSettings(){
 //     return(
 //         <div className="input-settings">
diff --git a/public/api/index.php b/public/api/index.php
index 0331ca8..1b43a3a 100644
--- a/public/api/index.php
+++ b/public/api/index.php
@@ -37,7 +37,7 @@ function getRoutes(): AltoRouter {
     $router->map("POST", "/auth", Action::noAuth(fn() => getAuthController()->authorize()));
     $router->map("POST", "/tactic/[i:id]/edit/name", Action::auth(fn(int $id, Account $acc) => getTacticController()->updateName($id, $acc)));
     $router->map("POST", "/tactic/[i:id]/save", Action::auth(fn(int $id, Account $acc) => getTacticController()->saveContent($id, $acc)));
-    $router->map("POST", "/update/profil", Action::auth(fn(Account $acc) => getAPIUserController()->updateProfil($acc)));
+    $router->map("POST", "/account/update/profile", Action::auth(fn(Account $acc) => getAPIUserController()->updateProfile($acc)));
 
     return $router;
 }
diff --git a/public/index.php b/public/index.php
index beae9b7..5d24e48 100644
--- a/public/index.php
+++ b/public/index.php
@@ -85,7 +85,7 @@ function getRoutes(): AltoRouter {
     $ar->map("GET", "/home", Action::auth(fn(SessionHandle $s) => getUserController()->home($s)));
     $ar->map("GET", "/settings", Action::auth(fn(SessionHandle $s) => getUserController()->settings($s)));
     $ar->map("GET", "/disconnect", Action::auth(fn(MutableSessionHandle $s) => getUserController()->disconnect($s)));
-    
+
     //tactic-related
     $ar->map("GET", "/tactic/[i:id]/view", Action::auth(fn(int $id, SessionHandle $s) => getVisualizerController()->openVisualizer($id, $s)));
     $ar->map("GET", "/tactic/[i:id]/edit", Action::auth(fn(int $id, SessionHandle $s) => getEditorController()->openEditor($id, $s)));
diff --git a/src/Api/Controller/APIUserController.php b/src/Api/Controller/APIUserController.php
index a117122..5bf66f1 100644
--- a/src/Api/Controller/APIUserController.php
+++ b/src/Api/Controller/APIUserController.php
@@ -30,13 +30,13 @@ class APIUserController {
      * @param Account $account
      * @return HttpResponse
      */
-    public function updateProfil(Account $account): HttpResponse {
+    public function updateProfile(Account $account): HttpResponse {
         return Control::runChecked([
-            "username" => [Validators::name()],
+            "name" => [Validators::name()],
             "email" => [Validators::email()]
         ], function (HttpRequest $request) use ($account) {
 
-            $failures = $this->model->updateProfil($request["username"], $request["email"], $account->getUser()->getId());
+            $failures = $this->model->updateProfile($request["name"], $request["email"], $account->getUser()->getId());
 
             if (!empty($failures)) {
                 //TODO find a system to handle Unauthorized error codes more easily from failures.
@@ -45,5 +45,8 @@ class APIUserController {
 
             return HttpResponse::fromCode(HttpCodes::OK);
         });
+
+        // error_log("Test");
+        // return new HttpResponse(HttpCodes::OK, []);
     }
 }
diff --git a/src/Core/Gateway/AccountGateway.php b/src/Core/Gateway/AccountGateway.php
index 02350b1..8d0b944 100644
--- a/src/Core/Gateway/AccountGateway.php
+++ b/src/Core/Gateway/AccountGateway.php
@@ -82,9 +82,16 @@ class AccountGateway {
         return new Account($acc["token"], new User($acc["email"], $acc["username"], $acc["id"], $acc["profilePicture"]));
     }
 
-    public void updateProfil() {
-        
+    public function updateProfile(string $name, string $email, int $id) : void {
+        $this->con->exec("
+            UPDATE Account 
+            SET email = :email AND username = :username
+            WHERE id = :id
+        ", [
+            ':username' => [$name, PDO::PARAM_STR],
+            ':email' => [$email, PDO::PARAM_STR],
+            ':id' => [$id, PDO::PARAM_INT]
+        ]);
     }
 
-
 }
diff --git a/src/Core/Model/AuthModel.php b/src/Core/Model/AuthModel.php
index 103d4e4..169b292 100644
--- a/src/Core/Model/AuthModel.php
+++ b/src/Core/Model/AuthModel.php
@@ -51,8 +51,12 @@ class AuthModel {
         return new Account($token, new User($email, $username, $accountId, self::DEFAULT_PROFILE_PICTURE));
     }
 
-    public function updateProfil(string $username, string $mail, Account $account) {
-        $gateway-> 
+    public function updateProfile(string $name, string $email, int $id) : array  {
+        if(!empty($this->gateway->getAccountFromMail($email))) {
+            return [ValidationFail::unauthorized("Mail already exist")];
+        }
+        $this->gateway->updateProfile($name, $email, $id);
+        return [];
     }
 
     /**
@@ -78,9 +82,4 @@ class AuthModel {
         }
         return $this->gateway->getAccountFromMail($email);
     }
-
-    public function changeUsername(int $id, string $newUsername) {
-        $this->gateway->changeUsername($id, $newUsername);
-    }
-
 }