
This recursive method will keep spreading out to tiles that have no surrounding mines, as well as come to a halt for tiles that have a number already. On the other hand, if there are surrounding mines, we simply set the number of closeMines found and set the FieldType property to ‘Number’. If that adjacent square has no surrounding mines, we set its FieldType property to ‘Empty’ and invoke the very method we are in, only with the coordinates of the adjacent square (this is where the recursion happens). We only continue for unknown squares or squares that contain a flag. For each delta coordinate, we first check if the coordinate is valid.

The recursive traverseEmptyTiles method is surprisingly compact. It represents the 8 squares adjacent to the current square: public static readonly DeltaCoords: Coords = [ To this end, I added delta coordinates as a constant. when a grid boundary has been reached or when a square was found with at least one mine next to it. This method also needs to know when to stop e.g. A recursive method keeps traversing squares that have no surrounding mines at all. In particular, I want to highlight what happens when you click on a square that has no surrounding mines. The web part itself is pretty vanilla SPFx, however the game logic comes with certain challenges as you might imagine. This makes it easy on mobile to combine flagging & chording for the best high scores! By default (mine mode) a regular left click uncovers a tile, while the right click adds a flag. These modes simply swap the left / right click behavior. The game can be played in two modes: mine mode & flag mode. Just be careful not to make any mistakes when adding flags! When a tile with a number has exactly the correct number of adjacent tiles flagged, performing a click on it will uncover all unmarked tiles. It’s basically the classic Minesweeper game in SPFx built using Fluent UI icons & components.Ĭhording is present in the game as is the case in the original game.

Who doesn’t need more fun in SharePoint?! Check out this SPFx v1.10 web part I created from scratch & shared with the M365 PnP open source community.
