diff --git a/src/components/Board.vue b/src/components/Board.vue
index 3894d2d..12266d8 100644
--- a/src/components/Board.vue
+++ b/src/components/Board.vue
@@ -34,132 +34,186 @@ export default {
       minesweeperGrid: null,
       numberOfMines: 0,
       item: null,
+      undoStack: [],
+      redoStack: [],
     };
   },
   name: "Board",
 //   props: { numberOfRows: Number, numberOfCols: Number },
-  methods: {
-    isCellRevealed(row, col) {
-      let cell;
-      if (
-        this.minesweeperGrid &&
-        this.minesweeperGrid.board &&
-        this.minesweeperGrid.board.board &&
-        this.minesweeperGrid.board.board[row] &&
-        row < this.localNumberOfRows &&
-        col < this.localNumberOfCols
-      ) {
-        cell = this.minesweeperGrid.board.board[row][col];
-        if (cell) {
-          return cell.isRevealed;
-        }
-      }
-      return false; // return false when minesweeperGrid is null or the cell doesn't exist
-    },
-    isCellFlagged(row, col) {
-      this.play = new Play();
-      this.play.doFlagged(row, col);
-      this.minesweeperGrid = JSON.parse(
-        localStorage.getItem("minesweeperGrid")
-      );
-      this.getCellSymbol(row, col);
-    },
+methods: {
+isCellRevealed(row, col) {
+let cell;
+if (
+this.minesweeperGrid &&
+this.minesweeperGrid.board &&
+this.minesweeperGrid.board.board &&
+this.minesweeperGrid.board.board[row] &&
+row < this.localNumberOfRows &&
+col < this.localNumberOfCols
+) {
+cell = this.minesweeperGrid.board.board[row][col];
+if (cell) {
+  return cell.isRevealed;
+}
+}
+return false; // return false when minesweeperGrid is null or the cell doesn't exist
+},
+isCellFlagged(row, col) {
+  this.play = new Play();
+  this.play.doFlagged(row, col);
+  this.minesweeperGrid = JSON.parse(
+    localStorage.getItem("minesweeperGrid")
+  );
+  this.getCellSymbol(row, col);
+},
 
-    cellOpener(row, col) {
-      if (
-        this.minesweeperGrid &&
-        this.minesweeperGrid.board &&
-        this.minesweeperGrid.board.board &&
-        this.minesweeperGrid.board.board[row] &&
-        this.minesweeperGrid.board.board[row][col] &&
-        !this.minesweeperGrid.board.board[row][col].isFlagged
-      ) {
-        this.play = new Play();
-        if (!this.minesweeperGrid.board.board[row][col].isMine) {
-          this.minesweeperGrid.board.numberToWin = JSON.parse(
+cellOpener(row, col) {
+if (
+this.minesweeperGrid &&
+this.minesweeperGrid.board &&
+this.minesweeperGrid.board.board &&
+this.minesweeperGrid.board.board[row] &&
+this.minesweeperGrid.board.board[row][col] &&
+!this.minesweeperGrid.board.board[row][col].isFlagged
+) {
+
+this.play = new Play();
+if (!this.minesweeperGrid.board.board[row][col].isMine) {
+  this.undoStack.push(JSON.parse(JSON.stringify(this.minesweeperGrid)));
+  this.minesweeperGrid.board.numberToWin = JSON.parse(
             localStorage.getItem("numberToWin")
           );
-          if (this.minesweeperGrid.board.numberToWin > 1) {
-            this.play.onClick(row, col);
-          } else {
-            Swal.fire({
-              title: "you win",
-              text: "Do you want to continue",
-              icon: "success",
-              showCancelButton: true,
-              confirmButtonText: "replay",
-              cancelButtonText: "Do nothing",
-            }).then((result) => {
-              if (result.isConfirmed) {
-                this.$router.push("/")
-                .then(() => window.location.reload())}
-            });
-          }
-        } else {
-          Swal.fire({
-            title: "you lose",
-            text: "Do you want to continue",
-            icon: "error",
-            showCancelButton: true,
-            confirmButtonText: "replay",
-            cancelButtonText: "Do nothing",
-          }).then((result) => {
-            if (result.isConfirmed) {
-                this.$router.push("/")
-                .then(() => window.location.reload())}
-          });
-        }
-        this.minesweeperGrid = JSON.parse(
-          localStorage.getItem("minesweeperGrid")
-        );
-        this.getCellSymbol(row, col);
+  // this.minesweeperGrid.board.numberToWin =this.$store.state.numberToWin;
+if (this.minesweeperGrid.board.numberToWin > 1) {
+  this.play.onClick(row, col);
+}else {
+Swal.fire({
+  title: "you win",
+  text: "Do you want to continue",
+  icon: "success",
+  showCancelButton: true,
+  confirmButtonText: "replay",
+  cancelButtonText: "Do nothing",
+}).then((result) => {
+  if (result.isConfirmed) {
+    this.$router.push("/")
+    .then(() => window.location.reload())}
+});
+}
+} else {
+  Swal.fire({
+    title: "you lose",
+    text: "Do you want to continue",
+    icon: "error",
+    showCancelButton: true,
+    confirmButtonText: "replay",
+    cancelButtonText: "Do nothing",
+  }).then((result) => {
+    if (result.isConfirmed) {
+        this.$router.push("/")
+        .then(() => window.location.reload())}
+  });
+}
+this.minesweeperGrid = JSON.parse(
+  localStorage.getItem("minesweeperGrid")
+);
+this.getCellSymbol(row, col);
+this.redoStack = [];
+}
+},
+saver() {
+  this.$store.dispatch("writeOnFile", {
+    name: "yazan",
+    board: this.minesweeperGrid,
+    rows: this.localNumberOfRows,
+    cols: this.localNumberOfCols,
+    mines: this.numberOfMines,
+    numberToWin: this.minesweeperGrid.board.numberToWin,
+  });
+  // console.log(this.minesweeperGrid.board.numberToWin);
+  //   console.log(this.localNumberOfRows);
+  //   console.log(this.localNumberOfCols);
+  //   console.log(this.numberOfMines);
+},
+getCellSymbol(row, col) {
+  if (
+    this.minesweeperGrid &&
+    this.minesweeperGrid.board &&
+    this.minesweeperGrid.board.board &&
+    this.minesweeperGrid.board.board[row] &&
+    row < this.localNumberOfRows &&
+    col < this.localNumberOfCols
+  ) {
+    let cell = this.minesweeperGrid.board.board[row][col];
+    if (cell) {
+      if (cell.isFlagged) {
+        return "F";
+      } else if (cell.isRevealed === true) {
+        return String(cell.nearbyMines); // Convert to string before returning
+      } else if (!cell.isRevealed) {
+        return "#";
+      }
+    }
+  }
+  return "#"; // return "#" when minesweeperGrid is null or the cell doesn't exist
+},
+undo() {
+  if (this.undoStack.length > 0) {
+    // Save the current state to the redo stack before undoing the move
+    this.redoStack.push(JSON.parse(JSON.stringify(this.minesweeperGrid)));
+
+    // Undo the move
+    this.minesweeperGrid = this.undoStack.pop();
+    localStorage.setItem(
+        "minesweeperGrid",
+        JSON.stringify(this.minesweeperGrid)
+      );
+      this.$store.state.numberToWin =this.minesweeperGrid.board.numberToWin
+      // localStorage.setItem(
+      //   "numberToWin",
+      //   JSON.stringify(this.minesweeperGrid.board.numberToWin)
+      // );
+  }
+},
+
+    redo() {
+      if (this.redoStack.length > 0) {
+        // save current state to undo stack
+        this.undoStack.push(this.minesweeperGrid);
+
+        // redo the move
+        this.minesweeperGrid = this.redoStack.pop();
+        localStorage.setItem(
+        "minesweeperGrid",
+        JSON.stringify(this.minesweeperGrid)
+      );
+      this.$store.state.numberToWin =this.minesweeperGrid.board.numberToWin
+
+      // localStorage.setItem(
+      //   "numberToWin",
+      //   JSON.stringify(this.minesweeperGrid.board.numberToWin)
+      // );
       }
     },
-    saver() {
-      this.$store.dispatch("writeOnFile", {
-        name: "yazan",
-        board: this.minesweeperGrid,
-        rows: this.localNumberOfRows,
-        cols: this.localNumberOfCols,
-        mines: this.numberOfMines,
-        numberToWin: this.minesweeperGrid.board.numberToWin,
-      });
-      // console.log(this.minesweeperGrid.board.numberToWin);
-      //   console.log(this.localNumberOfRows);
-      //   console.log(this.localNumberOfCols);
-      //   console.log(this.numberOfMines);
-    },
-    getCellSymbol(row, col) {
-      if (
-        this.minesweeperGrid &&
-        this.minesweeperGrid.board &&
-        this.minesweeperGrid.board.board &&
-        this.minesweeperGrid.board.board[row] &&
-        row < this.localNumberOfRows &&
-        col < this.localNumberOfCols
-      ) {
-        let cell = this.minesweeperGrid.board.board[row][col];
-        if (cell) {
-          if (cell.isFlagged) {
-            return "F";
-          } else if (cell.isRevealed === true) {
-            return String(cell.nearbyMines); // Convert to string before returning
-          } else if (!cell.isRevealed) {
-            return "#";
-          }
-        }
+    keydownHandler(event) {
+      if (event.ctrlKey && event.key === 'z') {
+        this.undo();
+      }
+      if (event.ctrlKey && event.key === 'y') {
+        this.redo();
       }
-      return "#"; // return "#" when minesweeperGrid is null or the cell doesn't exist
     },
-  },
-  mounted() {
-    this.$nextTick(() => {
-      this.localNumberOfRows = this.$store.state.numberOfRows;
-      this.localNumberOfCols = this.$store.state.numberOfCols;
-      this.numberOfMines = this.$store.state.numberOfMines;
-      this.localNumberOfRows = parseInt(this.localNumberOfRows);
-      this.localNumberOfCols = parseInt(this.localNumberOfCols);
-      this.numberOfMines = parseInt(this.numberOfMines);
+},
+mounted() {
+  this.$nextTick(() => {
+    
+    window.addEventListener('keydown', this.keydownHandler);
+    this.localNumberOfRows = this.$store.state.numberOfRows;
+    this.localNumberOfCols = this.$store.state.numberOfCols;
+    this.numberOfMines = this.$store.state.numberOfMines;
+    this.localNumberOfRows = parseInt(this.localNumberOfRows);
+    this.localNumberOfCols = parseInt(this.localNumberOfCols);
+    this.numberOfMines = parseInt(this.numberOfMines);
 
     //   console.log(this.localNumberOfRows,"  row");
     //   console.log(this.localNumberOfCols,"  col");
@@ -182,12 +236,15 @@ export default {
         JSON.stringify(this.minesweeperGrid)
       );
       localStorage.setItem(
-        "numberToWin",
-        JSON.stringify(this.minesweeperGrid.board.numberToWin)
+      "numberToWin",
+      JSON.stringify(this.minesweeperGrid.board.numberToWin)
       );
       return this.minesweeperGrid;
     });
   },
+  beforeDestroy() {
+    window.removeEventListener('keydown', this.keydownHandler);
+  },
 };
 </script>
 <!-- eslint-disable -->
diff --git a/src/components/Game.js b/src/components/Game.js
index 54e1e05..02ac486 100644
--- a/src/components/Game.js
+++ b/src/components/Game.js
@@ -1,4 +1,6 @@
 /*eslint-disable*/
+import { state } from "vuex";
+
 // const readline = require("readline");
 // var fs = require("fs");
 // module.exports = {
diff --git a/src/components/LoadGame.vue b/src/components/LoadGame.vue
index 13a1517..e5e5afe 100644
--- a/src/components/LoadGame.vue
+++ b/src/components/LoadGame.vue
@@ -86,14 +86,14 @@ export default {
         this.play = new Play();
         if (!this.minesweeperGrid.board.board[row][col].isMine) {
           this.minesweeperGrid.board.numberToWin = JSON.parse(
-            localStorage.getItem("numberToWin")
+          localStorage.getItem("numberToWin")
           );
           if (this.minesweeperGrid.board.numberToWin > 1) {
             this.play.onClick(row, col);
             this.minesweeperGrid.board.numberToWin--;
             localStorage.setItem(
-              "numberToWin",
-              this.minesweeperGrid.board.numberToWin
+            "numberToWin",
+            this.minesweeperGrid.board.numberToWin
             );
             this.minesweeperGrid = JSON.parse(
               localStorage.getItem("minesweeperGrid")
@@ -185,6 +185,14 @@ export default {
       this.numberToWin = parseInt(localStorage.getItem("numberToWin"));
     });
   },
+
+//   created() {
+//   window.addEventListener('keydown', this.keydownHandler);
+// },
+// beforeDestroy() {
+//   window.removeEventListener('keydown', this.keydownHandler);
+// },
+
 };
 </script>
 <!-- eslint-disable -->