Merge pull request #123 from Treevyy/frontend/fixes

Frontend/fixes

Author: OutsideofemiT

client/src/components/LeaderBoard.tsx

@@ -1,8 +1,11 @@
 import "../styles/leaderboard.css";
-import { useBodyClass } from '../utils/useBodyClass';
+// import { useBodyClass } from '../utils/useBodyClass';
 import { useQuery } from "@apollo/client";
 import { GET_USERS } from "@/graphql/queries";
 import { useNavigate } from "react-router-dom";
+import { useEffect } from 'react';
+
+
 
 
 function LeaderBoard() {
@@ -12,14 +15,20 @@ function LeaderBoard() {
 
   const allUsers = data?.getAllUsers || [];
 
-  useBodyClass('background-image');
+  useEffect(() => {
+    document.body.classList.add('gameover-background');
+    return () => {
+      document.body.classList.remove('gameover-background');
+    };
+  }, []);
 
   if (loading) return <p>Loading...</p>;
 
   const sortedUsers = [...allUsers].sort((a, b) => b.correctAnswers - a.correctAnswers);
 
   console.log(allUsers);
 
+
   return (
     <div className="leaderboard-page">
       <div className="leaderboard-container">

client/src/components/screens/GameMap.tsx

@@ -70,6 +70,7 @@ const GameMap: React.FC = () => {
       id: '4',
       xPercent: 70,
       yPercent: 45,
+
       image: '../../../public/assets/minions/pie-thon.png',
       name: 'Pie-Thon',
       questionId: 'q4',

client/src/components/screens/GameOver.tsx

@@ -8,6 +8,14 @@ const GameOverPage = ({
 }) => {
   const navigate = useNavigate();
 
+  useEffect(() => {
+    document.body.classList.add('gameover-background');
+
+    return () => {
+      document.body.classList.remove('gameover-background');
+    };
+  }, []);
+
   useEffect(() => {
     const music = new Audio('/game_over.mp3');
     const roar = new Audio('/godzilla.roar.mp3');

client/src/components/screens/Victory.tsx

@@ -9,6 +9,8 @@ export default function VictoryPage({
 }) {
   const navigate = useNavigate();
 
+
+
   useEffect(() => {
     const victoryMusic = new Audio('/totalwin1.mp3');
     victoryMusic.volume = 0.5;
@@ -17,6 +19,12 @@ export default function VictoryPage({
     });
   }, []);
 
+  useEffect(() => {
+    document.body.classList.add('gameover-background');
+    return () => {
+      document.body.classList.remove('gameover-background');
+    };
+  }, []);
   const handlePlayAgain = () => {
     navigate('/map');
   };