From 68eb59811c2f37031f435f10b53f6168931bc1ac Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Sat, 7 Sep 2024 09:00:01 +0300
Subject: [PATCH] Before active rosters are selected just hide the winner
 selecting radio

---
 .../components/TeamRosterInputs.tsx                  | 12 +++++-------
 .../tournament-bracket/tournament-bracket.css        |  8 --------
 2 files changed, 5 insertions(+), 15 deletions(-)

diff --git a/app/features/tournament-bracket/components/TeamRosterInputs.tsx b/app/features/tournament-bracket/components/TeamRosterInputs.tsx
index e69630f10..92907aa4e 100644
--- a/app/features/tournament-bracket/components/TeamRosterInputs.tsx
+++ b/app/features/tournament-bracket/components/TeamRosterInputs.tsx
@@ -203,7 +203,7 @@ function _TeamRoster({
 						teamId={team.id}
 						onChange={() => setWinnerId?.(team.id)}
 						team={idx + 1}
-						disabled={!bothTeamsHaveActiveRosters}
+						invisible={!bothTeamsHaveActiveRosters}
 					/>
 				) : null}
 				{hasPoints ? (
@@ -291,21 +291,21 @@ function _TeamRosterHeader({
 	);
 }
 
-/** Renders radio button to select winner, or in presentational mode just display the text "Winner" */
+/** Renders radio button to select the winner, or in presentational mode just displays the text "Winner" */
 function WinnerRadio({
 	presentational,
 	teamId,
 	checked,
 	onChange,
 	team,
-	disabled,
+	invisible,
 }: {
 	presentational: boolean;
 	teamId: number;
 	checked: boolean;
 	onChange: () => void;
 	team: number;
-	disabled: boolean;
+	invisible: boolean;
 }) {
 	const id = React.useId();
 
@@ -328,8 +328,7 @@ function WinnerRadio({
 			className={clsx(
 				"tournament-bracket__during-match-actions__radio-container",
 				{
-					"tournament-bracket__during-match-actions__radio-container__disabled":
-						disabled,
+					invisible,
 				},
 			)}
 		>
@@ -338,7 +337,6 @@ function WinnerRadio({
 				id={`${teamId}-${id}`}
 				onChange={onChange}
 				checked={checked}
-				disabled={disabled}
 				data-testid={`winner-radio-${team}`}
 			/>
 			<Label className="mb-0 ml-2" htmlFor={`${teamId}-${id}`}>
diff --git a/app/features/tournament-bracket/tournament-bracket.css b/app/features/tournament-bracket/tournament-bracket.css
index 17545d7b1..d609e3792 100644
--- a/app/features/tournament-bracket/tournament-bracket.css
+++ b/app/features/tournament-bracket/tournament-bracket.css
@@ -197,14 +197,6 @@
 	font-style: italic;
 }
 
-.tournament-bracket__during-match-actions__radio-container__disabled input {
-	opacity: 0.6;
-}
-
-.tournament-bracket__during-match-actions__radio-container__disabled label {
-	color: var(--text-lighter);
-}
-
 .tournament-bracket__during-match-actions__team-players {
 	display: flex;
 	width: 15rem;