diff --git a/src/pages/ReservationsList/ReservationList.jsx b/src/pages/ReservationsList/ReservationList.jsx
index 3f9ced4..65307ad 100644
--- a/src/pages/ReservationsList/ReservationList.jsx
+++ b/src/pages/ReservationsList/ReservationList.jsx
@@ -3,6 +3,7 @@ import { useNavigate } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 import Sidebar from '../../components/Sidebar/Sidebar';
 import getUserReservations from '../../redux/requests/getUserReservations';
+import { deleteReservation } from '../../redux/slices/reservationSlice';
 
 const ReservationList = () => {
   const navigate = useNavigate();
@@ -77,7 +78,7 @@ const ReservationList = () => {
                             {reservation.tesla_model.deposit}
                           </p>
                         </div>
-                        <button type="button" className="btn btn-danger btn-text mt-2">
+                        <button type="button" className="btn btn-danger btn-text mt-2" onClick={() => dispatch(deleteReservation(reservation.id))}>
                           Delete
                         </button>
                       </li>
diff --git a/src/redux/slices/reservationSlice.js b/src/redux/slices/reservationSlice.js
index dcfa402..3b988e6 100644
--- a/src/redux/slices/reservationSlice.js
+++ b/src/redux/slices/reservationSlice.js
@@ -47,12 +47,13 @@ const reservationSlice = createSlice({
         state.loading = true;
         state.error = null;
       })
-      .addCase(deleteReservation.fulfilled, (state, action) => {
-        state.loading = false;
-        state.reservations = state.reservations.filter(
-          (reservation) => reservation.reservation.id !== action.payload,
-        );
-      })
+      .addCase(deleteReservation.fulfilled, (state, action) => ({
+        ...state,
+        loading: false,
+        reservations: state.reservations.filter(
+          (reservation) => reservation.id !== action.payload,
+        ),
+      }))
       .addCase(deleteReservation.rejected, (state, action) => {
         state.loading = false;
         state.error = action.error.message;