Files
flxn-app/src/features/bracket/components/bracket-view.tsx
2025-08-23 15:25:28 -05:00

46 lines
1.1 KiB
TypeScript

import { Flex } from '@mantine/core';
import React from 'react';
import { BracketMaps } from '../utils/bracket-maps';
import { BracketRound } from './bracket-round';
import { Match } from '../types';
interface BracketViewProps {
bracket: Match[][];
bracketMaps: BracketMaps;
onAnnounce?: (teamOne: any, teamTwo: any) => void;
}
const BracketView: React.FC<BracketViewProps> = ({
bracket,
bracketMaps,
onAnnounce,
}) => {
const getParentMatchOrder = (parentLid: number): number | string => {
const parentMatch = bracketMaps.matchByLid.get(parentLid);
if (
parentMatch &&
parentMatch.order !== null &&
parentMatch.order !== undefined
) {
return parentMatch.order;
}
return `Match ${parentLid}`;
};
return (
<Flex direction="row" gap={24} justify="left" pos="relative" p="xl">
{bracket.map((round, roundIndex) => (
<BracketRound
key={roundIndex}
matches={round}
roundIndex={roundIndex}
getParentMatchOrder={getParentMatchOrder}
onAnnounce={onAnnounce}
/>
))}
</Flex>
);
};
export default BracketView;