feat: Win detection

src/components/Board.tsx

@@ -1,5 +1,5 @@
 import { FC, Fragment, useCallback, useEffect, useMemo, useState } from 'react';
-import { encodeFEN, eq, GameState } from '../utils/board';
+import { encodeFEN, eq, GameState, isChecked } from '../utils/board';
 import {
     filterMoves,
     generateLegalMoves,
@@ -91,10 +91,6 @@ const Board: FC<Props> = (props) => {
 
     const [promotionMove, setPromotionMove] = useState<Move | null>(null);
 
-    useEffect(() => {
-        console.log(currentState);
-    }, [currentState]);
-
     const performMove = useCallback(
         (move: Move) => {
             const { board, enPassantTarget, sideToMove, castling } = makeMove(
@@ -115,6 +111,14 @@ const Board: FC<Props> = (props) => {
         [currentState, setBoard, setSideToMove]
     );
 
+    const gameResult = useMemo(() => {
+        if (validMoves.length === 0) {
+            const checked = isChecked(currentState)
+            return checked[sideToMove] ? 'checkmate' : 'stalemate';
+        }
+        return false;
+    }, [validMoves, currentState, sideToMove]);
+
     return (
         <>
             <button onClick={() => setSideToMove(otherSide(sideToMove))}>
@@ -184,6 +188,11 @@ const Board: FC<Props> = (props) => {
                 <Files />
             </div>
 
+            {gameResult && <div>
+                {gameResult === 'checkmate' && <h1>Checkmate! Winner: {otherSide(sideToMove)}!</h1>}
+                {gameResult === 'stalemate' && <h1>Stalemate! There are no legal moves {sideToMove} can make :/</h1>}
+            </div>}
+
             {promotionMove && (
                 <div>
                     <div>