diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index 432b7a5..86566e2 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -9,7 +9,7 @@ import Themes from './pages/Settings/Themes' import PlayLayout from './pages/Play/Layout' import PlayFriend from './pages/Play/PlayFriend' import Play from './pages/Play/Play' -import AuthenticationPage, { loginAction, signupAction } from './pages/Authentication/Authentication' +import AuthenticationPage from './pages/Authentication/Authentication' import ChallengeFriend, { playFriendAction } from './pages/Play/ChallengeFriend' import ChessGame from './pages/Chess/ChessGame' import Profile, { action as profileAction } from './pages/Settings/Profile' @@ -52,9 +52,9 @@ const router = createBrowserRouter([{ ] }, { - path: '/login', element: , action: loginAction, loader: () => { if (getAuthToken()) return redirect('/home'); else return null; } + path: '/login', element: , loader: () => { if (getAuthToken()) return redirect('/home'); else return null; } }, { - path: '/signup', element: , action: signupAction, loader: () => { if (getAuthToken()) return redirect('/signup'); else return null; } + path: '/signup', element: , loader: () => { if (getAuthToken()) return redirect('/signup'); else return null; } }, { path: '/logout', loader: () => { getAuthToken() || redirect('/home') } }]); diff --git a/frontend/src/components/Cell.jsx b/frontend/src/components/Cell.jsx index 40c5ebd..2034cae 100644 --- a/frontend/src/components/Cell.jsx +++ b/frontend/src/components/Cell.jsx @@ -1,5 +1,6 @@ import React, { useContext } from 'react' +import PropTypes from 'prop-types'; import { socket } from '../socket'; import { Box, Flex } from '@mantine/core'; import { useDroppable } from '@dnd-kit/core' @@ -10,7 +11,6 @@ import { ChessGameContext } from '../context/chess-game-context'; import { SOCKET_EVENTS } from '../constants'; const { CHESS_MOVE } = SOCKET_EVENTS - const Cell = ({ cell }) => { let roomID = localStorage.getItem('roomID'); let { square, type } = cell; @@ -57,5 +57,13 @@ const Mark = () => { ) } +Cell.propTypes = { + cell: PropTypes.shape({ + square: PropTypes.string.isRequired, + type: PropTypes.oneOf(['p', 'r', 'n', 'b', 'q', 'k']), + color: PropTypes.oneOf(['w', 'b']) + }) +} + export default Cell \ No newline at end of file diff --git a/frontend/src/components/MainLoader.jsx b/frontend/src/components/MainLoader.jsx index 8964501..90608ba 100644 --- a/frontend/src/components/MainLoader.jsx +++ b/frontend/src/components/MainLoader.jsx @@ -2,6 +2,7 @@ import React from 'react' import { createPortal } from 'react-dom' import { Loader, Title } from '@mantine/core' +import PropTypes from 'prop-types'; import loaderImage from '../assets/images/chess_board_loader.png' @@ -27,4 +28,9 @@ const MainLoader = ({ errorMessage }) => { ) } +MainLoader.propTypes = { + errorMessage: PropTypes.string +} + + export default MainLoader \ No newline at end of file diff --git a/frontend/src/components/NavbarLinks.jsx b/frontend/src/components/NavbarLinks.jsx index a75b283..d2825c6 100644 --- a/frontend/src/components/NavbarLinks.jsx +++ b/frontend/src/components/NavbarLinks.jsx @@ -1,6 +1,7 @@ import React, { useState } from 'react' import { Link } from 'react-router-dom' +import PropTypes from 'prop-types'; import { NavLink, Text, ThemeIcon } from '@mantine/core' import { GearIcon, HomeIcon, PlayIcon } from '@radix-ui/react-icons' @@ -13,7 +14,6 @@ const NavbarLinks = () => { } const NavbarLink = ({ label, icon, to, index, active, setActive }) => { - return ( ({ @@ -46,6 +46,15 @@ const NavbarLink = ({ label, icon, to, index, active, setActive }) => { ) } +NavbarLink.propTypes = { + label: PropTypes.string, + icon: PropTypes.func, + to: PropTypes.string, + index: PropTypes.number, + active: PropTypes.number, + setActive: PropTypes.func +} + const linksList = [ { label: 'Home', icon: , to: "/home" }, { label: 'Play Chess', icon: , to: "/play" }, diff --git a/frontend/src/components/Piece.jsx b/frontend/src/components/Piece.jsx index b4f478d..db5e079 100644 --- a/frontend/src/components/Piece.jsx +++ b/frontend/src/components/Piece.jsx @@ -2,8 +2,9 @@ import { Image, createStyles } from '@mantine/core'; import React, { useContext, useEffect } from 'react'; import { useDraggable } from '@dnd-kit/core' import { ChessGameContext } from '../context/chess-game-context'; +import PropTypes from 'prop-types'; -const useStyles = createStyles((theme) => ({ +const useStyles = createStyles(() => ({ 'chess-piece': { outlineStyle: 'none', boxShadow: 'none', @@ -79,4 +80,12 @@ const Piece = ({ cell }) => { } } +Piece.propTypes = { + cell: PropTypes.shape({ + square: PropTypes.string.isRequired, + type: PropTypes.oneOf(['p', 'r', 'n', 'b', 'q', 'k']), + color: PropTypes.oneOf(['w', 'b']) + }) +} + export default Piece \ No newline at end of file diff --git a/frontend/src/pages/Authentication/Authentication.jsx b/frontend/src/pages/Authentication/Authentication.jsx index 1b282a9..66c80d1 100644 --- a/frontend/src/pages/Authentication/Authentication.jsx +++ b/frontend/src/pages/Authentication/Authentication.jsx @@ -1,6 +1,7 @@ import React, { useContext, useState } from 'react'; -import { redirect, useNavigate } from 'react-router-dom'; +import { useNavigate } from 'react-router-dom'; +import PropTypes from 'prop-types'; import { Button, Card, Container, Text, TextInput, Title } from '@mantine/core'; import { useForm } from 'react-hook-form' import { ZodError, z } from 'zod'; @@ -54,6 +55,10 @@ const AuthenticationPage = (props) => { ); }; +AuthenticationPage.propTypes = { + isLogin: PropTypes.bool +} + const LoginForm = () => { const { setIsLoggedIn } = useContext(UserDataContext) const { register, handleSubmit, setError, formState: { errors } } = useForm(); diff --git a/frontend/src/pages/Chess/ChessBoard.jsx b/frontend/src/pages/Chess/ChessBoard.jsx index 326367a..efeb604 100644 --- a/frontend/src/pages/Chess/ChessBoard.jsx +++ b/frontend/src/pages/Chess/ChessBoard.jsx @@ -37,7 +37,7 @@ const useStyles = createStyles((theme) => ({ const ChessBoard = () => { const { classes } = useStyles(); - const { getChessBoard, handleOpponentMove, handleDrop, hasGameEnded, gameEndedReason } = useContext(ChessGameContext) + const { getChessBoard, handleOpponentMove, handleDrop } = useContext(ChessGameContext) const roomID = localStorage.getItem('roomID'); const chessBoard = getChessBoard(); const myColor = localStorage.getItem('myColor') diff --git a/frontend/src/pages/Chess/Timer.jsx b/frontend/src/pages/Chess/Timer.jsx index 97781fa..db5bac5 100644 --- a/frontend/src/pages/Chess/Timer.jsx +++ b/frontend/src/pages/Chess/Timer.jsx @@ -1,5 +1,6 @@ import React from 'react' +import PropTypes from 'prop-types'; import { Box } from '@mantine/core'; import useCountDown from '../../hooks/useCountDown' @@ -15,4 +16,8 @@ const Timer = ({ on }) => { ) } +Timer.propTypes = { + on: PropTypes.bool +} + export default Timer \ No newline at end of file diff --git a/frontend/src/pages/Play/Play.jsx b/frontend/src/pages/Play/Play.jsx index f67114b..0e7ba29 100644 --- a/frontend/src/pages/Play/Play.jsx +++ b/frontend/src/pages/Play/Play.jsx @@ -1,6 +1,7 @@ import React from 'react' import { Link } from 'react-router-dom' +import PropTypes from 'prop-types'; import { Card, Flex, Image, NavLink, Title } from '@mantine/core' const Play = () => { @@ -35,6 +36,13 @@ const CardItem = ({ label, description, src, to }) => { ) } +CardItem.propTypes = { + label: PropTypes.string, + description: PropTypes.string, + src: PropTypes.string, + to: PropTypes.string +} + const dataList = [ { label: 'Play Online', description: 'Play vs a person of similar skill', src: 'https://www.chess.com/bundles/web/images/color-icons/blitz.a0e36339.svg', to: "/play/online" }, { label: 'Computer', description: 'Challenge a bot from easy to master', src: 'https://www.chess.com/bundles/web/images/color-icons/computer.2318c3b4.svg', to: "/play/computer" },