Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-09-08 04:05:54 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

More bracket lines alignment when bracket compactified

Browse Source 
Example scenario where old solution failed:
32 teams & 2 rounds of WB collapsed
This commit is contained in:
Kalle
2026-03-29 15:37:22 +03:00
parent f571ebacb9
commit 4867858cff
1 changed files with 25 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
app/features/tournament-bracket/components/Bracket/Elimination.tsx
View File

@@ -20,29 +20,38 @@ const MATCH_SPACING = MATCH_HEIGHT + GAP;
export function EliminationBracketSide(props: EliminationBracketSideProps) {
const rounds = getRounds({ ...props, bracketData: props.bracket.data });
const firstRoundMatches = props.bracket.data.match.filter(
(match) => match.round_id === rounds[0]?.id,
);
const firstRoundHasOngoing = firstRoundMatches.some(
(match) =>
match.opponent1 &&
match.opponent2 &&
match.opponent1.result !== "win" &&
match.opponent2.result !== "win",
);
const firstRoundHidden =
!props.isExpanded && rounds.length > 2 && !firstRoundHasOngoing;
const hiddenRoundIds = new Set(
rounds
.filter((round, roundIdx) => {
if (props.isExpanded) return false;
if (roundIdx >= rounds.length - 2) return false;
const firstVisibleRoundId = firstRoundHidden ? rounds[1]?.id : rounds[0]?.id;
const roundMatches = props.bracket.data.match.filter(
(match) => match.round_id === round.id,
);
return !roundMatches.some(
(match) =>
match.opponent1 &&
match.opponent2 &&
match.opponent1.result !== "win" &&
match.opponent2.result !== "win",
);
})
.map((round) => round.id),
);
const firstVisibleRound = rounds.find(
(round) => !hiddenRoundIds.has(round.id),
);
const firstVisibleRoundMatchCount = props.bracket.data.match.filter(
(match) => match.round_id === firstVisibleRoundId,
(match) => match.round_id === firstVisibleRound?.id,
).length;
let atLeastOneColumnHidden = false;
return (
<div
className={styles.elimContainer}
style={{ "--round-count": rounds.length }}
style={{ "--round-count": rounds.length - hiddenRoundIds.size }}
>
{rounds.flatMap((round, roundIdx) => {
const bestOf = round.maps?.count;
@@ -67,12 +76,7 @@ export function EliminationBracketSide(props: EliminationBracketSideProps) {
match.opponent2.result !== "win",
);
if (
!props.isExpanded &&
// always show at least 2 rounds per side
roundIdx < rounds.length - 2 &&
!someMatchOngoing
) {
if (hiddenRoundIds.has(round.id)) {
atLeastOneColumnHidden = true;
return null;
}