add moves can be viewed using left, right keys

backend/.gitignore

@@ -1,3 +1,4 @@
 node_modules
 _test_
 .env
+engine/stockfish

backend/package-lock.json

@@ -76,12 +76,6 @@
         "@types/node": "*"
       }
     },
-    "node_modules/@types/estree": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.2.tgz",
-      "integrity": "sha512-VeiPZ9MMwXjO32/Xu7+OwflfmeoRwkE/qzndw42gGtgJwZopBnzy2gD//NN1+go1mADzkDcqf/KnFRSjTJ8xJA==",
-      "peer": true
-    },
     "node_modules/@types/node": {
       "version": "20.2.5",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-20.2.5.tgz",
@@ -113,18 +107,6 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/acorn": {
-      "version": "7.4.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
-      "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
-      "peer": true,
-      "bin": {
-        "acorn": "bin/acorn"
-      },
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
     "node_modules/ansi-styles": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@@ -1119,20 +1101,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/rollup": {
-      "version": "1.32.1",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-1.32.1.tgz",
-      "integrity": "sha512-/2HA0Ec70TvQnXdzynFffkjA6XN+1e2pEv/uKS5Ulca40g2L7KuOE3riasHoNVHOsFD5KKZgDsMk1CP3Tw9s+A==",
-      "peer": true,
-      "dependencies": {
-        "@types/estree": "*",
-        "@types/node": "*",
-        "acorn": "^7.1.0"
-      },
-      "bin": {
-        "rollup": "dist/bin/rollup"
-      }
-    },
     "node_modules/rollup-plugin-terser": {
       "version": "5.1.3",
       "resolved": "https://registry.npmjs.org/rollup-plugin-terser/-/rollup-plugin-terser-5.1.3.tgz",

frontend/src/components/GameHistory.jsx

@@ -1,9 +1,9 @@
-import React, { useContext } from 'react'
+import React, { useContext, useEffect } from 'react';
 
 import { Button, Flex, ScrollArea, Tooltip, createStyles } from '@mantine/core';
-import { IconChevronLeft, IconChevronRight } from '@tabler/icons-react'
+import { IconChevronLeft, IconChevronRight } from '@tabler/icons-react';
 
-import { ChessGameContext } from '../context/chess-game-context'
+import { ChessGameContext } from '../context/chess-game-context';
 
 const useStyles = createStyles(() => {
     return {
@@ -23,12 +23,32 @@ const useStyles = createStyles(() => {
                 backgroundColor: '#555555',
             }
         }
-    }
-})
+    };
+});
 
 const GameHistory = () => {
     let { classes } = useStyles();
-    const { gameHistory, jumpTo, goBack, goAhead } = useContext(ChessGameContext)
+    const { gameHistory, jumpTo, goBack, goAhead } = useContext(ChessGameContext);
+
+    // event listeners for keyboard keys
+    useEffect(() => {
+        const handleKeyDown = (event) => {
+            if (event.key === 'ArrowLeft') {
+                // console.log('left arrow clicked')
+                goBack();
+            } else if (event.key === 'ArrowRight') {
+                // console.log('right arrow clicked')
+                goAhead();
+            }
+        };
+
+        window.addEventListener('keydown', handleKeyDown);
+
+        // event listener will cleanup when the component unmounts
+        return () => {
+            window.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [goBack, goAhead]);
 
     let gameHistoryJSX = [];
     for (let i = 0; i < gameHistory.length;) {
@@ -71,7 +91,7 @@ const GameHistory = () => {
                 </Tooltip>
             </Flex>
         </div>
-    )
-}
+    );
+};
 
-export default GameHistory
+export default GameHistory;

frontend/src/pages/Authentication/Authentication.jsx

@@ -8,7 +8,7 @@ import { ZodError, z } from 'zod';
 
 import { UserDataContext } from '../../context/user-data-context';
 
-let host = import.meta.env.VITE_BACKEND_HOST;
+let host = 'http://localhost:8080';
 
 const loginSchema = z.object({
     username: z.string().min(5, { message: 'Username should not be less than 5 characters' }).max(15, { message: 'Username should not be more than 15 characters' }),