48 lines
1.2 KiB
TypeScript
48 lines
1.2 KiB
TypeScript
import { Flex, Text } from '@mantine/core';
|
|
import React from 'react';
|
|
import { MatchCard } from './match-card';
|
|
import { Match } from '../types';
|
|
|
|
interface BracketRoundProps {
|
|
matches: Match[];
|
|
roundIndex: number;
|
|
getParentMatchOrder: (parentLid: number) => number | string;
|
|
onAnnounce?: (teamOne: any, teamTwo: any) => void;
|
|
}
|
|
|
|
export const BracketRound: React.FC<BracketRoundProps> = ({
|
|
matches,
|
|
roundIndex,
|
|
getParentMatchOrder,
|
|
onAnnounce,
|
|
}) => {
|
|
const isBye = (type: string) => type?.toLowerCase() === 'bye';
|
|
|
|
return (
|
|
<Flex direction="column" key={roundIndex} gap={24} justify="space-around">
|
|
{matches.map((match, matchIndex) => {
|
|
if (!match) return null;
|
|
if (isBye(match.type)) return <></>; // for spacing
|
|
|
|
return (
|
|
<Flex
|
|
direction="row"
|
|
key={matchIndex}
|
|
align="center"
|
|
justify="end"
|
|
gap={8}
|
|
>
|
|
<Text c="dimmed" fw="bolder">
|
|
{match.order}
|
|
</Text>
|
|
<MatchCard
|
|
match={match}
|
|
getParentMatchOrder={getParentMatchOrder}
|
|
onAnnounce={onAnnounce}
|
|
/>
|
|
</Flex>
|
|
);
|
|
})}
|
|
</Flex>
|
|
);
|
|
}; |