diff --git a/app/components/DashboardTile.js b/app/components/DashboardTile.js
index da4e78f..3136824 100644
--- a/app/components/DashboardTile.js
+++ b/app/components/DashboardTile.js
@@ -4,19 +4,6 @@ import styles from '@/app/styles/DashboardTile.module.css'
 
 import { useData } from '@/app/DataProvider'
 
-// Calculate winner of match
-const calculateWinner = (player1, player2) => {
-  const player1Total = player1.reduce(
-    (total, current) => (!isNaN(current.score) ? total + current.score : total),
-    0
-  )
-  const player2Total = player2.reduce(
-    (total, current) => (!isNaN(current.score) ? total + current.score : total),
-    0
-  )
-  return player1Total > player2Total
-}
-
 const DashboardTile = ({
   clientTeam,
   opponentTeam,
@@ -35,96 +22,100 @@ const DashboardTile = ({
 
   const isOpaque = (player1Scores, player2Scores) => {
     return player1Scores.map((score, index) => {
-      const player1Score = !isNaN(score.score) ? score.score : 0;
-      const player2Score = !isNaN(player2Scores[index]?.score) ? player2Scores[index].score : 0;
-      return player1Score > player2Score;
-    });
-  };
+      const player1Score = !isNaN(score.score) ? score.score : 0
+      const player2Score = !isNaN(player2Scores[index]?.score)
+        ? player2Scores[index].score
+        : 0
+      return player1Score > player2Score
+    })
+  }
 
   // Calculate opacity map before rendering
-  const player1Opacity = isOpaque(player1FinalScores, player2FinalScores);
+  const player1Opacity = isOpaque(player1FinalScores, player2FinalScores)
 
   useEffect(() => {
     setClientLogo(logos[clientTeam])
     setOpponentLogo(logos[opponentTeam])
   }, [clientTeam, opponentTeam, logos])
 
- // Render function for scores
- const renderScore = (score, index, isPlayer1, tieScores) => {
-  const opacity = isPlayer1 ? 
-    (player1Opacity[index] ? '100%' : '40%') : 
-    (!player1Opacity[index] ? '100%' : '40%');
+  // Render function for scores
+  const renderScore = (score, index, isPlayer1, tieScores) => {
+    const opacity = isPlayer1
+      ? player1Opacity[index]
+        ? '100%'
+        : '40%'
+      : !player1Opacity[index]
+        ? '100%'
+        : '40%'
 
-  return (
-    !isNaN(score.score) && (
-      <div 
-        key={index} 
-        style={{ 
-          position: 'relative', 
-          opacity 
-        }}
-      >
-        {score.score}
-        {tieScores[index] && (
-          <sup
-            style={{
-              position: 'absolute',
-              fontSize: '0.6em',
-              top: '-0.3em',
-              left: '0.9em',
-              letterSpacing: '1vw'
-            }}
-          >
-            {tieScores[index]}
-          </sup>
-        )}
-      </div>
-    )
-  );
-};
-
-return loading ? (
-  <p>Loading ...</p>
-) : (
-  <div className={styles.dashTilesContainer}>
-    <div className={styles.matchInfoContainer}>
-      <div className={styles.containerHeader}>
-        <div className={styles.containerTitle}>Final Score</div>
-        {isTagged && <div className={styles.taggedBadge}>Tagged</div>}
-      </div>
-      
-      {/* Player 1 */}
-      <div className={styles.playerInfo}>
-        <div className={styles.playerSchoolImgcontainerhome}>
-          <img src={clientLogo} alt={`${clientTeam} logo`} />
-        </div>
-        <div className={styles.playerInfoName}>
-          {player1Name} {isUnfinished && '(UF)'}
-        </div>
-        <div className={styles.playerInfoScore}>
-          {player1FinalScores.map((score, index) => 
-            renderScore(score, index, true, player1TieScores)
+    return (
+      !isNaN(score.score) && (
+        <div
+          key={index}
+          style={{
+            position: 'relative',
+            opacity
+          }}
+        >
+          {score.score}
+          {tieScores[index] && (
+            <sup
+              style={{
+                position: 'absolute',
+                fontSize: '0.6em',
+                top: '-0.3em',
+                left: '0.9em',
+                letterSpacing: '1vw'
+              }}
+            >
+              {tieScores[index]}
+            </sup>
           )}
         </div>
-      </div>
+      )
+    )
+  }
 
-      {/* Player 2 */}
-      <div className={styles.playerInfo}>
-        <div className={styles.playerSchoolImgcontainer}>
-          <img src={opponentLogo} alt={`${opponentTeam} logo`} />
+  return loading ? (
+    <p>Loading ...</p>
+  ) : (
+    <div className={styles.dashTilesContainer}>
+      <div className={styles.matchInfoContainer}>
+        <div className={styles.containerHeader}>
+          <div className={styles.containerTitle}>Final Score</div>
+          {isTagged && <div className={styles.taggedBadge}>Tagged</div>}
         </div>
-        <div className={styles.playerInfoName}>
-          {player2Name}
+
+        {/* Player 1 */}
+        <div className={styles.playerInfo}>
+          <div className={styles.playerSchoolImgcontainerhome}>
+            <img src={clientLogo} alt={`${clientTeam} logo`} />
+          </div>
+          <div className={styles.playerInfoName}>
+            {player1Name} {isUnfinished && '(UF)'}
+          </div>
+          <div className={styles.playerInfoScore}>
+            {player1FinalScores.map((score, index) =>
+              renderScore(score, index, true, player1TieScores)
+            )}
+          </div>
         </div>
-        <div className={styles.playerInfoScore}>
-          {player2FinalScores.map((score, index) => 
-            renderScore(score, index, false, player2TieScores)
-          )}
+
+        {/* Player 2 */}
+        <div className={styles.playerInfo}>
+          <div className={styles.playerSchoolImgcontainer}>
+            <img src={opponentLogo} alt={`${opponentTeam} logo`} />
+          </div>
+          <div className={styles.playerInfoName}>{player2Name}</div>
+          <div className={styles.playerInfoScore}>
+            {player2FinalScores.map((score, index) =>
+              renderScore(score, index, false, player2TieScores)
+            )}
+          </div>
         </div>
       </div>
     </div>
-  </div>
-);
-};
+  )
+}
 
-export default DashboardTile;
\ No newline at end of file
+export default DashboardTile
diff --git a/app/components/MatchTiles.js b/app/components/MatchTiles.js
index 53d77c0..3854f88 100644
--- a/app/components/MatchTiles.js
+++ b/app/components/MatchTiles.js
@@ -3,27 +3,16 @@ import React, { useEffect, useState } from 'react'
 import styles from '@/app/styles/MatchTiles.module.css'
 import getTeams from '@/app/services/getTeams.js'
 
-// Calculate winner of match
-const calculateWinner = (player1, player2) => {
-  const player1Total = player1.reduce(
-    (total, current) => (!isNaN(current.score) ? total + current.score : total),
-    0
-  )
-  const player2Total = player2.reduce(
-    (total, current) => (!isNaN(current.score) ? total + current.score : total),
-    0
-  )
-  return player1Total > player2Total
-}
-
 // Calculate opacity for individual scores
 const isOpaque = (player1Scores, player2Scores) => {
   return player1Scores.map((score, index) => {
-    const player1Score = !isNaN(score.score) ? score.score : 0;
-    const player2Score = !isNaN(player2Scores[index]?.score) ? player2Scores[index].score : 0;
-    return player1Score > player2Score;
-  });
-};
+    const player1Score = !isNaN(score.score) ? score.score : 0
+    const player2Score = !isNaN(player2Scores[index]?.score)
+      ? player2Scores[index].score
+      : 0
+    return player1Score > player2Score
+  })
+}
 
 const MatchTiles = ({
   // matchName,
@@ -44,8 +33,8 @@ const MatchTiles = ({
   const [clientLogo, setClientLogo] = useState('')
   const [opponentLogo, setOpponentLogo] = useState('')
 
-  // to calculate the opcaity 
-  const player1Opacity = isOpaque(player1FinalScores, player2FinalScores);
+  // to calculate the opcaity
+  const player1Opacity = isOpaque(player1FinalScores, player2FinalScores)
 
   useEffect(() => {
     const fetchLogos = async () => {
@@ -69,35 +58,41 @@ const MatchTiles = ({
 
   // Render function for scores
   const renderScore = (score, index, isPlayer1, tieScores) => {
-    const opacity = isPlayer1 ? 
-      (player1Opacity[index] ? '100%' : '40%') : 
-      (!player1Opacity[index] ? '100%' : '40%');
+    const opacity = isPlayer1
+      ? player1Opacity[index]
+        ? '100%'
+        : '40%'
+      : !player1Opacity[index]
+        ? '100%'
+        : '40%'
 
-    return !isNaN(score.score) && (
-      <div 
-        key={index} 
-        style={{ 
-          position: 'relative',
-          opacity 
-        }}
-      >
-        {score.score}
-        {tieScores[index] && (
-          <sup
-            style={{
-              position: 'absolute',
-              fontSize: '0.6em',
-              top: '-0.3em',
-              left: '0.9em',
-              letterSpacing: '1vw'
-            }}
-          >
-            {tieScores[index]}
-          </sup>
-        )}
-      </div>
-    );
-  };
+    return (
+      !isNaN(score.score) && (
+        <div
+          key={index}
+          style={{
+            position: 'relative',
+            opacity
+          }}
+        >
+          {score.score}
+          {tieScores[index] && (
+            <sup
+              style={{
+                position: 'absolute',
+                fontSize: '0.6em',
+                top: '-0.3em',
+                left: '0.9em',
+                letterSpacing: '1vw'
+              }}
+            >
+              {tieScores[index]}
+            </sup>
+          )}
+        </div>
+      )
+    )
+  }
 
   return (
     <div className={styles.matchTilesContainer}>
@@ -117,7 +112,7 @@ const MatchTiles = ({
             {player1Name} {isUnfinished && '(UF)'}
           </div>
           <div className={styles.playerInfoScore}>
-            {player1FinalScores.map((score, index) => 
+            {player1FinalScores.map((score, index) =>
               renderScore(score, index, true, player1TieScores)
             )}
           </div>
@@ -127,20 +122,15 @@ const MatchTiles = ({
           <div className={styles.playerSchoolImgcontainer}>
             <img src={opponentLogo} alt={`${opponentTeam} logo`} />
           </div>
-          <div className={styles.playerInfoName}>
-            {player2Name}
-          </div>
+          <div className={styles.playerInfoName}>{player2Name}</div>
           <div className={styles.playerInfoScore}>
-            {player2FinalScores.map((score, index) => 
+            {player2FinalScores.map((score, index) =>
               renderScore(score, index, false, player2TieScores)
             )}
           </div>
         </div>
       </div>
 
-
-
-
       {/* Match Location */}
       {displaySections.info && (
         <div className={styles.matchInfoContainer}>
diff --git a/app/components/ScoreBoard.js b/app/components/ScoreBoard.js
index f31ece2..876505f 100644
--- a/app/components/ScoreBoard.js
+++ b/app/components/ScoreBoard.js
@@ -1,5 +1,5 @@
-import React, { useState, useEffect } from 'react';
-import styles from '../styles/Scoreboard.module.css';
+import React, { useState, useEffect } from 'react'
+import styles from '../styles/Scoreboard.module.css'
 
 const ScoreBoard = ({
   playData,
@@ -20,42 +20,43 @@ const ScoreBoard = ({
     player2TiebreakScore = 0,
     serverName = '',
     pointScore = true
-  } = playData || {};
+  } = playData || {}
 
-  const [localPlayData, setLocalPlayData] = useState(playData);
+  const [localPlayData, setLocalPlayData] = useState(playData)
 
   useEffect(() => {
     if (playData) {
       const timeout = setTimeout(() => {
-        setLocalPlayData(playData);
-      }, 500);
-      return () => clearTimeout(timeout);
+        setLocalPlayData(playData)
+      }, 500)
+      return () => clearTimeout(timeout)
     }
-  }, [playData]);
+  }, [playData])
 
   // Get the server name safely
-  const currentServerName = localPlayData?.serverName || serverName;
+  const currentServerName = localPlayData?.serverName || serverName
 
   return (
     <div className={styles.scoreboard}>
       <table>
         <thead>
           <tr>
-            <th className={styles.live}>
-              Live Score {isUnfinished && '(UF)'}
-            </th>
+            <th className={styles.live}>Live Score {isUnfinished && '(UF)'}</th>
           </tr>
         </thead>
         <tbody>
           <tr>
             <td className={styles.highlight}>{player1Name}</td>
             {player1FinalScores.map((score, index) =>
-              localPlayData && !isNaN(score.score) && index + 1 < localPlayData.setNum ? (
-                <td 
-                  key={index} 
-                  style={{ 
-                    position: 'relative', 
-                    opacity: score.score > player2FinalScores[index].score ? 1 : 0.4
+              localPlayData &&
+              !isNaN(score.score) &&
+              index + 1 < localPlayData.setNum ? (
+                <td
+                  key={index}
+                  style={{
+                    position: 'relative',
+                    opacity:
+                      score.score > player2FinalScores[index].score ? 1 : 0.4
                   }}
                 >
                   {player1TieScores[index] ? (
@@ -67,7 +68,7 @@ const ScoreBoard = ({
                           fontSize: '0.6em',
                           top: '0.1em',
                           right: '0em',
-                          letterSpacing: '1px',
+                          letterSpacing: '1px'
                         }}
                       >
                         {player1TieScores[index]}
@@ -79,23 +80,28 @@ const ScoreBoard = ({
                 </td>
               ) : null
             )}
-            
+
             <td style={{ opacity: 0.4 }}>{player1GameScore}</td>
 
             <td className={styles.pointScore}>
               {pointScore ? player1PointScore : player1TiebreakScore}
-              {currentServerName && player1Name === currentServerName && <span> &bull;</span>}
+              {currentServerName && player1Name === currentServerName && (
+                <span> &bull;</span>
+              )}
             </td>
           </tr>
           <tr>
             <td className={styles.highlight}>{player2Name}</td>
             {player2FinalScores.map((score, index) =>
-              localPlayData && !isNaN(score.score) && index + 1 < localPlayData.setNum ? (
-                <td 
-                  key={index} 
-                  style={{ 
-                    position: 'relative', 
-                    opacity: score.score > player1FinalScores[index].score ? 1 : 0.4
+              localPlayData &&
+              !isNaN(score.score) &&
+              index + 1 < localPlayData.setNum ? (
+                <td
+                  key={index}
+                  style={{
+                    position: 'relative',
+                    opacity:
+                      score.score > player1FinalScores[index].score ? 1 : 0.4
                   }}
                 >
                   {player2TieScores[index] ? (
@@ -123,13 +129,15 @@ const ScoreBoard = ({
 
             <td className={styles.pointScore}>
               {pointScore ? player2PointScore : player2TiebreakScore}
-              {currentServerName && player2Name === currentServerName && <span> &bull;</span>}
+              {currentServerName && player2Name === currentServerName && (
+                <span> &bull;</span>
+              )}
             </td>
           </tr>
         </tbody>
       </table>
     </div>
-  );
-};
+  )
+}
 
-export default ScoreBoard;
\ No newline at end of file
+export default ScoreBoard