diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml index 2dc2da6..edf1c09 100644 --- a/.github/workflows/frontend-ci.yml +++ b/.github/workflows/frontend-ci.yml @@ -17,4 +17,4 @@ jobs: - name: Install dependencies uses: actions/checkout@v4 - run: npm install - # - run: npm run lint + - run: npm run lint diff --git a/Frontend/src/pages/vote.js b/Frontend/src/pages/vote.js index 858d8d8..0502782 100644 --- a/Frontend/src/pages/vote.js +++ b/Frontend/src/pages/vote.js @@ -1,9 +1,9 @@ // src/pages/vote.js -import React, { useEffect, useState } from 'react'; -import Image from 'next/image'; +import React, { useEffect, useState } from "react"; +import Image from "next/image"; import { isAuthenticated } from "./auth"; -import axios from 'axios'; -import styles from './vote.module.css'; +import axios from "axios"; +import styles from "./vote.module.css"; const backendUrl = "http://localhost:5000"; // Assuming your backend runs on port 5000 @@ -38,6 +38,7 @@ export default function Vote() { useEffect(() => { fetchTwoDistinctImages(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const fetchRandomImage = async () => { @@ -63,20 +64,18 @@ export default function Vote() { const handleImageClick = async (id) => { setSelectedImage(id); - + const winner = images.find((image) => image._id.$oid === id); + const loser = images.find((image) => image._id.$oid !== id); - const winner = images.find(image => image._id.$oid === id); - const loser = images.find(image => image._id.$oid !== id); - const newEloWinner = calculateNewElo(winner.elo, loser.elo, true); const newEloLoser = calculateNewElo(loser.elo, winner.elo, false); - + await updateElo(winner._id.$oid, newEloWinner, loser._id.$oid, newEloLoser); - + setTimeout(() => { fetchTwoDistinctImages(); setSelectedImage(null); - }, 400); + }, 400); }; const updateElo = async (winnerId, newEloWinner, loserId, newEloLoser) => { @@ -85,13 +84,13 @@ export default function Vote() { imageIdOne: winnerId, newEloOne: newEloWinner, imageIdTwo: loserId, - newEloTwo: newEloLoser + newEloTwo: newEloLoser, }); } catch (error) { console.error("Error updating ELO", error); } }; - + return (
@@ -102,17 +101,17 @@ export default function Vote() { selectedImage === null ? styles.default : selectedImage === image._id.$oid - ? styles.winning - : styles.losing + ? styles.winning + : styles.losing } border border-5 border-black opacity-50 hover:scale-105 transform transition duration-50 ease-in-out`} onClick={() => handleImageClick(image._id.$oid)} > Votable Image
))} @@ -121,14 +120,11 @@ export default function Vote() { ); } - - - export async function getServerSideProps(context) { const { req } = context; const token = req.cookies["token"]; - if (!await isAuthenticated(token)) { + if (!(await isAuthenticated(token))) { // If the user is not authenticated, redirect them to the login page return { redirect: { @@ -143,4 +139,3 @@ export async function getServerSideProps(context) { props: {}, // Will be passed to the page component as props }; } -