1 files changed, 56 insertions, 37 deletions
diff --git a/frontend/src/components/RankingEntry.tsx b/frontend/src/components/RankingEntry.tsx
index b899965..f28eabf 100644
--- a/frontend/src/components/RankingEntry.tsx
+++ b/frontend/src/components/RankingEntry.tsx
@@ -1,46 +1,65 @@
-import React from 'react';
+import React from "react";
 import { Link } from "react-router-dom";
-import { RankingType, SteamRanking, SteamRankingType } from '@customTypes/Ranking';
+import { RankingType, SteamRankingType } from "@customTypes/Ranking";
 enum RankingCategories {
-    rankings_overall,
+  rankings_overall,
-    rankings_multiplayer,
+  rankings_multiplayer,
-    rankings_singleplayer
+  rankings_singleplayer,
 }
 interface RankingEntryProps {
-    curRankingData: RankingType | SteamRankingType;
+  curRankingData: RankingType | SteamRankingType;
-    currentLeaderboardType: RankingCategories
+  currentLeaderboardType: RankingCategories;
-};
-const RankingEntry: React.FC<RankingEntryProps> = (prop) => {
-    if ("placement" in prop.curRankingData) {
-        return (
-            <div className='leaderboard-entry'>
-                <span>{prop.curRankingData.placement}</span>
-                <div>
-                <Link to={`/users/${prop.curRankingData.user.steam_id}`}>           
-                    <img src={prop.curRankingData.user.avatar_link}></img>
-                    <span>{prop.curRankingData.user.user_name}</span>
-                </Link>
-                </div>
-                <span>{prop.curRankingData.total_score}</span>
-            </div>
-        )
-    } else {
-        return (
-            <div className='leaderboard-entry'>
-                <span>{prop.currentLeaderboardType == RankingCategories.rankings_singleplayer ? prop.curRankingData.sp_rank : prop.currentLeaderboardType == RankingCategories.rankings_multiplayer ? prop.curRankingData.mp_rank : prop.curRankingData.overall_rank}</span>
-                <div>
-                <Link to={`/users/${prop.curRankingData.steam_id}`}>           
-                    <img src={prop.curRankingData.avatar_link}></img>
-                    <span>{prop.curRankingData.user_name}</span>
-                </Link>
-                </div>
-                <span>{prop.currentLeaderboardType == RankingCategories.rankings_singleplayer ? prop.curRankingData.sp_score : prop.currentLeaderboardType == RankingCategories.rankings_multiplayer ? prop.curRankingData.mp_score : prop.curRankingData.overall_score}</span>
-            </div>
-        )
-    }
 }
+const RankingEntry: React.FC<RankingEntryProps> = prop => {
+  if ("placement" in prop.curRankingData) {
+    return (
+      <div className="leaderboard-entry">
+        <span>{prop.curRankingData.placement}</span>
+        <div>
+          <Link to={`/users/${prop.curRankingData.user.steam_id}`}>
+            <img
+              src={prop.curRankingData.user.avatar_link}
+              alt={`${prop.curRankingData.user.user_name}'s Avatar`}
+            ></img>
+            <span>{prop.curRankingData.user.user_name}</span>
+          </Link>
+        </div>
+        <span>{prop.curRankingData.total_score}</span>
+      </div>
+    );
+  } else {
+    return (
+      <div className="leaderboard-entry">
+        <span>
+          {prop.currentLeaderboardType ===
+          RankingCategories.rankings_singleplayer
+            ? prop.curRankingData.sp_rank
+            : prop.currentLeaderboardType ===
+                RankingCategories.rankings_multiplayer
+              ? prop.curRankingData.mp_rank
+              : prop.curRankingData.overall_rank}
+        </span>
+        <div>
+          <Link to={`/users/${prop.curRankingData.steam_id}`}>
+            <img src={prop.curRankingData.avatar_link}></img>
+            <span>{prop.curRankingData.user_name}</span>
+          </Link>
+        </div>
+        <span>
+          {prop.currentLeaderboardType ===
+          RankingCategories.rankings_singleplayer
+            ? prop.curRankingData.sp_score
+            : prop.currentLeaderboardType ===
+                RankingCategories.rankings_multiplayer
+              ? prop.curRankingData.mp_score
+              : prop.curRankingData.overall_score}
+        </span>
+      </div>
+    );
+  }
+};
 export default RankingEntry;

diff --git a/frontend/src/components/RankingEntry.tsx b/frontend/src/components/RankingEntry.tsx index b899965..f28eabf 100644 --- a/frontend/src/components/RankingEntry.tsx +++ b/frontend/src/components/RankingEntry.tsx
@@ -1,46 +1,65 @@
1	import React from 'react';	1	import React from "react";
2	import { Link } from "react-router-dom";	2	import { Link } from "react-router-dom";
3	import { RankingType, SteamRanking, SteamRankingType } from '@customTypes/Ranking';	3	import { RankingType, SteamRankingType } from "@customTypes/Ranking";
4		4
5	enum RankingCategories {	5	enum RankingCategories {
6	rankings_overall,	6	rankings_overall,
7	rankings_multiplayer,	7	rankings_multiplayer,
8	rankings_singleplayer	8	rankings_singleplayer,
9	}	9	}
10		10
11	interface RankingEntryProps {	11	interface RankingEntryProps {
12	curRankingData: RankingType \| SteamRankingType;	12	curRankingData: RankingType \| SteamRankingType;
13	currentLeaderboardType: RankingCategories	13	currentLeaderboardType: RankingCategories;
14	};
15
16	const RankingEntry: React.FC<RankingEntryProps> = (prop) => {
17	if ("placement" in prop.curRankingData) {
18	return (
19	<div className='leaderboard-entry'>
20	<span>{prop.curRankingData.placement}</span>
21	<div>
22	<Link to={`/users/${prop.curRankingData.user.steam_id}`}>
23	<img src={prop.curRankingData.user.avatar_link}></img>
24	<span>{prop.curRankingData.user.user_name}</span>
25	</Link>
26	</div>
27	<span>{prop.curRankingData.total_score}</span>
28	</div>
29	)
30	} else {
31	return (
32	<div className='leaderboard-entry'>
33	<span>{prop.currentLeaderboardType == RankingCategories.rankings_singleplayer ? prop.curRankingData.sp_rank : prop.currentLeaderboardType == RankingCategories.rankings_multiplayer ? prop.curRankingData.mp_rank : prop.curRankingData.overall_rank}</span>
34	<div>
35	<Link to={`/users/${prop.curRankingData.steam_id}`}>
36	<img src={prop.curRankingData.avatar_link}></img>
37	<span>{prop.curRankingData.user_name}</span>
38	</Link>
39	</div>
40	<span>{prop.currentLeaderboardType == RankingCategories.rankings_singleplayer ? prop.curRankingData.sp_score : prop.currentLeaderboardType == RankingCategories.rankings_multiplayer ? prop.curRankingData.mp_score : prop.curRankingData.overall_score}</span>
41	</div>
42	)
43	}
44	}	14	}
45		15
		16	const RankingEntry: React.FC<RankingEntryProps> = prop => {
		17	if ("placement" in prop.curRankingData) {
		18	return (
		19	<div className="leaderboard-entry">
		20	<span>{prop.curRankingData.placement}</span>
		21	<div>
		22	<Link to={`/users/${prop.curRankingData.user.steam_id}`}>
		23	<img
		24	src={prop.curRankingData.user.avatar_link}
		25	alt={`${prop.curRankingData.user.user_name}'s Avatar`}
		26	></img>
		27	<span>{prop.curRankingData.user.user_name}</span>
		28	</Link>
		29	</div>
		30	<span>{prop.curRankingData.total_score}</span>
		31	</div>
		32	);
		33	} else {
		34	return (
		35	<div className="leaderboard-entry">
		36	<span>
		37	{prop.currentLeaderboardType ===
		38	RankingCategories.rankings_singleplayer
		39	? prop.curRankingData.sp_rank
		40	: prop.currentLeaderboardType ===
		41	RankingCategories.rankings_multiplayer
		42	? prop.curRankingData.mp_rank
		43	: prop.curRankingData.overall_rank}
		44	</span>
		45	<div>
		46	<Link to={`/users/${prop.curRankingData.steam_id}`}>
		47	<img src={prop.curRankingData.avatar_link}></img>
		48	<span>{prop.curRankingData.user_name}</span>
		49	</Link>
		50	</div>
		51	<span>
		52	{prop.currentLeaderboardType ===
		53	RankingCategories.rankings_singleplayer
		54	? prop.curRankingData.sp_score
		55	: prop.currentLeaderboardType ===
		56	RankingCategories.rankings_multiplayer
		57	? prop.curRankingData.mp_score
		58	: prop.curRankingData.overall_score}
		59	</span>
		60	</div>
		61	);
		62	}
		63	};
		64
46	export default RankingEntry;	65	export default RankingEntry;