From ecd6bc4e6da9793ec5fcf06ac53e41981a64426f Mon Sep 17 00:00:00 2001
From: Evan Platzer <evan.platzer@gmail.com>
Date: Fri, 12 Jul 2024 13:43:04 -0400
Subject: [PATCH] Fix SVG Height to max of column heights.

Currently, the height of the SVG is set based on the height of the first column. This works when the first round of the bracket is completely full. However, if the bracket is sparse (i.e. bye rounds are not shown), then it's possible for the first column to have fewer matches (and therefore be shorter) than later columns.

To fix this, I have updated the calls to `calculateSVGDimensions`. Before, the numOfRows param was always set to the length of columns[0]. Now, it is set to the maximum length of all columns.
---
 src/bracket-double/double-elim-bracket.tsx | 6 +++---
 src/bracket-single/single-elim-bracket.tsx | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/bracket-double/double-elim-bracket.tsx b/src/bracket-double/double-elim-bracket.tsx
index 5724b19..1723603 100644
--- a/src/bracket-double/double-elim-bracket.tsx
+++ b/src/bracket-double/double-elim-bracket.tsx
@@ -127,7 +127,7 @@ const DoubleEliminationBracket = ({
   const totalNumOfRounds =
     lowerColumns.length + 1 + (hasMultipleFinals && finalsArray.length - 1);
   const upperBracketDimensions = calculateSVGDimensions(
-    upperColumns[0].length,
+    Math.max(...upperColumns.map(column => column.length)),
     upperColumns.length,
     rowHeight,
     columnWidth,
@@ -136,7 +136,7 @@ const DoubleEliminationBracket = ({
     currentRound
   );
   const lowerBracketDimensions = calculateSVGDimensions(
-    lowerColumns[0].length,
+    Math.max(...lowerColumns.map(column => column.length)),
     lowerColumns.length,
     rowHeight,
     columnWidth,
@@ -145,7 +145,7 @@ const DoubleEliminationBracket = ({
     currentRound
   );
   const fullBracketDimensions = calculateSVGDimensions(
-    lowerColumns[0].length,
+    Math.max(...lowerColumns.map(column => column.length).concat(upperColumns.map(rows => rows.length))),
     totalNumOfRounds,
     rowHeight,
     columnWidth,
diff --git a/src/bracket-single/single-elim-bracket.tsx b/src/bracket-single/single-elim-bracket.tsx
index 8779dc8..ecb39dd 100644
--- a/src/bracket-single/single-elim-bracket.tsx
+++ b/src/bracket-single/single-elim-bracket.tsx
@@ -75,7 +75,7 @@ const SingleEliminationBracket = ({
   // ]
 
   const { gameWidth, gameHeight, startPosition } = calculateSVGDimensions(
-    columns[0].length,
+    Math.max(...columns.map(column => column.length)),
     columns.length,
     rowHeight,
     columnWidth,