improvements

src/features/tournaments/components/started-tournament/index.tsx

@@ -4,11 +4,12 @@ import { useAuth } from "@/contexts/auth-context";
 import { Box, Divider, Stack, Text, Card, Center } from "@mantine/core";
 import { Carousel } from "@mantine/carousel";
 import ListLink from "@/components/list-link";
-import { TreeStructureIcon, UsersIcon, ClockIcon } from "@phosphor-icons/react";
+import { TreeStructureIcon, UsersIcon, ClockIcon, TrophyIcon } from "@phosphor-icons/react";
 import TeamListButton from "../upcoming-tournament/team-list-button";
 import RulesListButton from "../upcoming-tournament/rules-list-button";
 import MatchCard from "@/features/matches/components/match-card";
 import Header from "./header";
+import { Podium } from "../podium";
 
 const StartedTournament: React.FC<{ tournament: Tournament }> = ({
   tournament,
@@ -22,6 +23,20 @@ const StartedTournament: React.FC<{ tournament: Tournament }> = ({
     [tournament.matches]
   );
 
+  const isTournamentOver = useMemo(() => {
+    const matches = tournament.matches || [];
+    if (matches.length === 0) return false;
+
+    const nonByeMatches = matches.filter((match) => !(match.status === 'tbd' && match.bye === true));
+    if (nonByeMatches.length === 0) return false;
+
+    const finalsMatch = nonByeMatches.reduce((highest, current) =>
+      (!highest || current.lid > highest.lid) ? current : highest
+    );
+
+    return finalsMatch?.status === 'ended';
+  }, [tournament.matches]);
+
   return (
     <Stack gap="lg">
       <Header tournament={tournament} />
@@ -42,6 +57,10 @@ const StartedTournament: React.FC<{ tournament: Tournament }> = ({
             ))}
           </Carousel>
         </Box>
+      ) : isTournamentOver ? (
+          <Box px="lg" w="100%">
+            <Podium tournament={tournament} />
+          </Box>
       ) : (
         <Card withBorder radius="lg" p="xl" mx="md">
           <Center>