47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
import { Stack, Text } from "@mantine/core";
|
|
import { useMemo } from "react";
|
|
import { Match } from "../types";
|
|
import MatchCard from "./match-card";
|
|
import { Trans } from "@lingui/react/macro";
|
|
|
|
interface MatchListProps {
|
|
matches: Match[];
|
|
hideH2H?: boolean;
|
|
}
|
|
|
|
const MatchList = ({ matches, hideH2H = false }: MatchListProps) => {
|
|
const filteredMatches = useMemo(
|
|
() =>
|
|
[...(matches ?? [])]
|
|
.filter(match =>
|
|
match.home && match.away && !match.bye && match.status != "tbd"
|
|
)
|
|
.sort((a, b) => a.start_time < b.start_time ? 1 : -1),
|
|
[matches]
|
|
);
|
|
|
|
if (!filteredMatches.length) {
|
|
return undefined;
|
|
}
|
|
|
|
const isRegional = filteredMatches[0]?.tournament?.regional;
|
|
|
|
return (
|
|
<Stack p="md" gap="sm">
|
|
{isRegional && (
|
|
<Text size="xs" c="dimmed" ta="center" px="md">
|
|
<Trans>Matches for regionals are unordered</Trans>
|
|
</Text>
|
|
)}
|
|
{filteredMatches.map((match, index) => (
|
|
<div
|
|
key={`match-${match.id}-${index}`}
|
|
>
|
|
<MatchCard match={match} hideH2H={hideH2H} />
|
|
</div>
|
|
))}
|
|
</Stack>
|
|
);
|
|
};
|
|
|
|
export default MatchList; |