From 2294acfdac712d0aa45dc47b968cd5745b79b4e1 Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Mon, 9 Sep 2024 17:10:51 +0300
Subject: [PATCH] Make tournament result match squares links

---
 app/features/tournament/core/Standings.ts     |  3 ++-
 .../tournament/routes/to.$id.results.tsx      | 25 +++++++++++++++----
 app/features/tournament/tournament.css        |  1 +
 3 files changed, 23 insertions(+), 6 deletions(-)

diff --git a/app/features/tournament/core/Standings.ts b/app/features/tournament/core/Standings.ts
index 19378ce27..e092fddf3 100644
--- a/app/features/tournament/core/Standings.ts
+++ b/app/features/tournament/core/Standings.ts
@@ -52,7 +52,8 @@ export function matchesPlayed({
 			(match) =>
 				match.opponent1 &&
 				match.opponent2 &&
-				(match.opponent1?.id === teamId || match.opponent2?.id === teamId),
+				(match.opponent1?.id === teamId || match.opponent2?.id === teamId) &&
+				(match.opponent1.result === "win" || match.opponent2?.result === "win"),
 		),
 	);
 
diff --git a/app/features/tournament/routes/to.$id.results.tsx b/app/features/tournament/routes/to.$id.results.tsx
index 99ce68bb7..726f3879d 100644
--- a/app/features/tournament/routes/to.$id.results.tsx
+++ b/app/features/tournament/routes/to.$id.results.tsx
@@ -5,7 +5,11 @@ import { Flag } from "~/components/Flag";
 import { InfoPopover } from "~/components/InfoPopover";
 import { Placement } from "~/components/Placement";
 import { Table } from "~/components/Table";
-import { SPR_INFO_URL, tournamentTeamPage } from "~/utils/urls";
+import {
+	SPR_INFO_URL,
+	tournamentMatchPage,
+	tournamentTeamPage,
+} from "~/utils/urls";
 import * as Standings from "../core/Standings";
 import { useTournament } from "./to.$id";
 
@@ -141,7 +145,11 @@ function MatchHistoryRow({ teamId }: { teamId: number }) {
 		<div className="stack horizontal xs">
 			{teamMatches.map((match) => {
 				return (
-					<MatchResultSquare result={match.result} key={match.id}>
+					<MatchResultSquare
+						key={match.id}
+						result={match.result}
+						matchId={match.id}
+					>
 						{match.vsSeed}
 					</MatchResultSquare>
 				);
@@ -152,16 +160,23 @@ function MatchHistoryRow({ teamId }: { teamId: number }) {
 
 function MatchResultSquare({
 	result,
+	matchId,
 	children,
-}: { result: "win" | "loss"; children: React.ReactNode }) {
+}: { result: "win" | "loss"; matchId: number; children: React.ReactNode }) {
+	const tournament = useTournament();
+
 	return (
-		<div
+		<Link
+			to={tournamentMatchPage({
+				matchId,
+				tournamentId: tournament.ctx.id,
+			})}
 			className={clsx("tournament__standings__match-result-square", {
 				"tournament__standings__match-result-square--win": result === "win",
 				"tournament__standings__match-result-square--loss": result === "loss",
 			})}
 		>
 			{children}
-		</div>
+		</Link>
 	);
 }
diff --git a/app/features/tournament/tournament.css b/app/features/tournament/tournament.css
index 73a5aa49d..97573df8f 100644
--- a/app/features/tournament/tournament.css
+++ b/app/features/tournament/tournament.css
@@ -614,6 +614,7 @@
 	font-weight: var(--semi-bold);
 	border: 3px solid var(--theme);
 	border-radius: var(--rounded-sm);
+	color: var(--text);
 }
 
 .tournament__standings__match-result-square--win {