diff --git a/README.md b/README.md
index 7ab3905e020cdd5faa01bc6f7e9d5f5fbd07dd7e..6be0232a3f8b924143ae4d7b56a5d0aef8aae9c7 100644
--- a/README.md
+++ b/README.md
@@ -52,7 +52,6 @@ Navigate to [http://localhost:3000](http://localhost:3000)
 - Accéder à d'autre infos telle que l'API des cours sur demande à la DISI pour intégrer ça aux prédictions (ex: cours en promo complète juste implique plus d'attente)
 
 ## Coté dev
-- Améliorer l'interface utilisateur avec le timer
 - Protéger l'interface OpenAPI et mettre en place une interface admin pour les news et potentiellement modération (avec authentification)
 - Permettre de définir les masques proprement et de manière à pouvoir généraliser à d'autre RU
 - Accorder la charte graphique si le service est intégré à d'autres appli (bordeau/blanc service de CS, charte graphique de VR)
diff --git a/backend/db/crud.py b/backend/db/crud.py
index 97bb6554bbbfb624594714c0031660ef43d36f5f..df872ffc41042fd3a602dcdb7dcd8fccb57b2130 100644
--- a/backend/db/crud.py
+++ b/backend/db/crud.py
@@ -490,7 +490,6 @@ def update_collaborative_record(user: schemas.User, db: Session):
     if last_record.date >= datetime.combine(date, time_slot.open_time) and not last_record.waiting_time:
         last_record.waiting_time = current_date - \
             pytz.timezone("Europe/Paris").localize(last_record.date)
-        print(last_record.waiting_time)
         db.add(last_record)
         db.commit()
         db.refresh(last_record)
@@ -499,6 +498,12 @@ def update_collaborative_record(user: schemas.User, db: Session):
     raise HTTPException(status_code=406, detail="Client already registered")
 
 
+def cancel_collaborative_record(user_id: int, db: Session):
+    db.query(models.CollaborativeRecords).filter(models.CollaborativeRecords.user_id == user_id).delete()
+    db.commit()
+    return
+
+
 def delete_collaborative_record(id: int, db: Session):
     if id == 0:
         db.query(models.CollaborativeRecords).delete()
diff --git a/backend/db/models.py b/backend/db/models.py
index 753b570c1249ebe2aa7655c13c0e38ebfb500655..c80580bdfbec9ff61ad427397134f7463cdc0e09 100644
--- a/backend/db/models.py
+++ b/backend/db/models.py
@@ -12,7 +12,7 @@ class CollaborativeRecords(Base):
     __tablename__ = "collection"
 
     id = Column(Integer, primary_key=True, index=True)
-    user_id = Column(Integer, ForeignKey("users.id"))
+    user_id = Column(Integer, ForeignKey("users.id", ondelete='SET NULL'))
     place = Column(String(30))
     date = Column(DateTime)
     waiting_time = Column(Interval)
diff --git a/backend/db/schemas.py b/backend/db/schemas.py
index 0777b3a630414a37958b339dcdd32d94f9738226..325d2071b40bdcb8c3061058154b8d9ab1c8a74c 100644
--- a/backend/db/schemas.py
+++ b/backend/db/schemas.py
@@ -33,7 +33,7 @@ class RecordRead(BaseModel):
 
 class CollaborativeRecords(BaseModel):
     """CollaborativeRecords schema"""
-    user_id: int = Field(..., title="Id of the user timed")
+    user_id: Optional[int] = Field(default=None, title="Id of the user timed")
     place: str = Field(..., title="Name of the RU corresponding the given record")
     date: datetime = Field(..., title="Date of the record")
     waiting_time: Optional[timedelta] = Field(default=None, title="Caculated waiting time for timed person")
diff --git a/backend/routers/records.py b/backend/routers/records.py
index f6f603ac15e7bf7a8b87f5f4ee881f27edafc86f..04e4444b446a51a7b491fbd803a5b91c8385e819 100644
--- a/backend/routers/records.py
+++ b/backend/routers/records.py
@@ -54,6 +54,16 @@ async def end_new_record(response: Response, connect_id: str = Cookie(...), db:
     return db_record
 
 
+@router.post("/collection/cancel", response_model=None, tags=["data collection"])
+async def cancel_new_record(response: Response, connect_id: str = Cookie(...), db: Session = Depends(get_db)):
+    user = crud.get_user(connect_id, db)
+    db_record = crud.cancel_collaborative_record(user.id, db)
+    if not user.username:
+        crud.delete_user(user.cookie, db)
+        response.delete_cookie(key="connect_id")
+    return db_record
+
+
 @router.delete('/collection', response_model=None, tags=["data collection"])
 async def delete_record(id: int, db: Session = Depends(get_db)):
     return crud.delete_collaborative_record(id, db)
diff --git a/frontend/src/styles/restaurant.css b/frontend/src/styles/restaurant.css
index 639835729cd42edf8daed25f00d902c2948d236b..45fe9e89524ecd4a49310a82210501e428f180bb 100644
--- a/frontend/src/styles/restaurant.css
+++ b/frontend/src/styles/restaurant.css
@@ -12,43 +12,19 @@
     overflow: hidden;
 }
 
-#restaurant-start-button {
-    width: fit-content;
-    border: none;
-    border-radius: 5px;
-    padding: 0.1rem;
-    padding-left: 0.3rem;
-    padding-right: 0.3rem;
-    margin-top: 2rem;
-}
-
-.restaurant-button-disabled {
-    background-color: rgb(66, 75, 83);
-    color: #b9b9b9;
-}
-
-.restaurant-button-active {
+.restaurant-button {
     background-color: rgb(33, 37, 41);
     color: white;
-}
-
-.restaurant-button-active:hover {
-    box-shadow: 0px 0px 5px white;
-}
-
-#restaurant-end-button {
-    width: fit-content;
-    background-color: #83000d;
-    color: white;
+    width: 7rem;
     border: none;
     border-radius: 5px;
-    padding: 0.1rem;
+    padding: 0.2rem;
     padding-left: 0.3rem;
     padding-right: 0.3rem;
     margin-top: 2rem;
 }
 
-#restaurant-end-button:hover {
+.restaurant-button:hover {
     box-shadow: 0px 0px 5px rgb(33, 37, 41);
 }
 
diff --git a/frontend/src/views/Restaurant.js b/frontend/src/views/Restaurant.js
index f4113205874ed501e30af255efe95cdf3a7a884a..fa5701876ad200f5998d841408938c5bfabc996a 100644
--- a/frontend/src/views/Restaurant.js
+++ b/frontend/src/views/Restaurant.js
@@ -12,7 +12,7 @@ import "../styles/restaurant.css";
 
 export default function RestaurantPage({ selection, lastMessage }) {
   // const [started, setStarted] = useState(false);
-  // const [disabled, setDisabled] = useState(false);
+  // const [timed, setTimed] = useState(false);
 
   // const Start = () => {
   //   instance
@@ -21,7 +21,7 @@ export default function RestaurantPage({ selection, lastMessage }) {
   //       setStarted(true);
   //     })
   //     .catch((e) => {
-  //       setDisabled(true);
+  //       setTimed(true);
   //       alert(
   //         "Il semblerait que tu aies déjà renseigné un temps d'attente sur ce créneau. Merci de ta participation, n'hésite pas à te chronométrer de nouveau la prochaine fois !",
   //       );
@@ -34,10 +34,10 @@ export default function RestaurantPage({ selection, lastMessage }) {
   //     .post("collection/stop")
   //     .then(() => {
   //       setStarted(false);
-  //       setDisabled(true);
+  //       setTimed(true);
   //     })
   //     .catch((e) => {
-  //       setDisabled(true);
+  //       setTimed(true);
   //       alert(
   //         "Il semblerait que tu aies déjà renseigné un temps d'attente sur ce créneau. Merci de ta participation, n'hésite pas à te chronométrer de nouveau la prochaine fois !",
   //       );
@@ -45,6 +45,20 @@ export default function RestaurantPage({ selection, lastMessage }) {
   //     });
   // };
 
+  // const Cancel = () => {
+  //   instance
+  //     .post("collection/cancel")
+  //     .then(() => {
+  //       setStarted(false);
+  //       setTimed(false);
+  //     })
+  //     .catch((e) => {
+  //       setStarted(false);
+  //       setTimed(false);
+  //       console.log(e);
+  //     });
+  // };
+
   return (
     <>
       {selection && (
@@ -52,18 +66,26 @@ export default function RestaurantPage({ selection, lastMessage }) {
           <Comments place={selection.name} lastMessage={lastMessage} infos />
           <div className="restaurant-container" id="restaurant-main-page">
             <WaitingTime place={selection.name} lastMessage={lastMessage} />
-            <Graph place={selection.name} type="current" lastMessage={lastMessage} />
-            {/* <button
-              id={`restaurant-${started ? "end" : "start"}-button`}
-              onClick={started ? End : Start}
-              className={disabled ? "restaurant-button-disabled" : "restaurant-button-active"}
-              disabled={disabled}
-            >
-              {started ? "Fini !!" : "Départ !!"}
-            </button> */}
+            <Graph place={selection.name} lastMessage={lastMessage} />
+            {/* <div style={{ fontSize: "1.2rem", paddingLeft: "10%", paddingRight: "10%" }}>
+              {timed
+                ? "Merci de ta participation, n'hésite pas à te chronométrer de nouveau la prochaine fois !"
+                : "Aide nous à récupérer des données en te chronométrant dans la queue du self !"}
+            </div>
+            {!timed && (
+              <>
+                <button onClick={started ? End : Start} className="restaurant-button">
+                  {started ? "Fini !" : "Démarrer !"}
+                </button>
+                {started && (
+                  <button onClick={Cancel} className="restaurant-button">
+                    Annuler
+                  </button>
+                )}
+              </>
+            )} */}
           </div>
           <Comments place={selection.name} lastMessage={lastMessage} />
-          {/*<Graph place={selection.name} type="avg" />*/}
         </div>
       )}
     </>