Feat: show result

src/data/SpeedFlowchart.tsx

@@ -5,6 +5,7 @@ import {
 import {
   Participant,
   participantFromApiParticipant,
+  Result,
 } from '../models/Participant';
 
 export interface SpeedRoundParticipant {
@@ -13,9 +14,14 @@ export interface SpeedRoundParticipant {
   hasWon: boolean;
 }
 
+export interface SpeedLane {
+  result?: Result;
+  participant: Participant;
+}
+
 export interface SpeedRoundPair {
-  laneA?: Participant;
-  laneB?: Participant;
+  laneA?: SpeedLane;
+  laneB?: SpeedLane;
   winner?: 'A' | 'B';
 }
 
@@ -65,14 +71,18 @@ function getRoundRank(name: string): number {
  */
 function computeWinnerOfPair(pair: SpeedRoundPair, roundIndex: number) {
   if (
-    pair.laneA?.results[roundIndex]?.rank === undefined ||
-    pair.laneB?.results[roundIndex]?.rank === undefined
+    pair.laneA?.participant.results[roundIndex]?.rank === undefined ||
+    pair.laneB?.participant.results[roundIndex]?.rank === undefined
   )
     return;
 
+  pair.laneA.result = pair.laneA.participant.results[roundIndex];
+  pair.laneB.result = pair.laneB.participant.results[roundIndex];
+
   if (pair.winner === undefined) {
     pair.winner =
-      pair.laneA.results[roundIndex].rank > pair.laneB.results[roundIndex].rank
+      pair.laneA.participant.results[roundIndex].rank >
+      pair.laneB.participant.results[roundIndex].rank
         ? 'B'
         : 'A';
   }
@@ -89,7 +99,9 @@ function getWinnerOfPair(
   roundNumber: number,
 ): Participant | undefined {
   computeWinnerOfPair(pair, roundNumber);
-  return pair.winner === 'A' ? pair.laneA : pair.laneB;
+  return pair.winner === 'A'
+    ? pair.laneA?.participant
+    : pair.laneB?.participant;
 }
 
 /**
@@ -103,7 +115,9 @@ function getLooserOfPair(
   roundNumber: number,
 ): Participant | undefined {
   computeWinnerOfPair(pair, roundNumber);
-  return pair.winner === 'A' ? pair.laneB : pair.laneA;
+  return pair.winner === 'A'
+    ? pair.laneB?.participant
+    : pair.laneA?.participant;
 }
 
 /**
@@ -126,15 +140,28 @@ function computeRoundFromPreviousRound(
   const nextRoundPairs = new Array(previousRound.pairs.length / 2)
     .fill(0)
     .map((_, i) => {
-      return {
-        laneA: getAdvancingParticipant(
+      const laneAParticipant = getAdvancingParticipant(
         previousRound.pairs[i * 2],
         previousRound.roundIndex,
-        ),
-        laneB: getAdvancingParticipant(
+      );
+      const laneBParticipant = getAdvancingParticipant(
         previousRound.pairs[i * 2 + 1],
         previousRound.roundIndex,
-        ),
+      );
+
+      return {
+        laneA:
+          laneAParticipant === undefined
+            ? undefined
+            : {
+                participant: laneAParticipant,
+              },
+        laneB:
+          laneBParticipant === undefined
+            ? undefined
+            : {
+                participant: laneBParticipant,
+              },
       };
     });
 
@@ -191,8 +218,8 @@ export function convertResultsToSpeedFlowchartResult(
 
   const firstRoundPairs = ranksOfLaneAInOrder.map(rank => {
     return {
-      laneA: convertedParticipants[rank - 1],
-      laneB: getOpponent(rank - 1),
+      laneA: { participant: convertedParticipants[rank - 1] },
+      laneB: { participant: getOpponent(rank - 1) },
     };
   });
 

src/pages/SpeedFlowchartPage.tsx

@@ -51,14 +51,18 @@ export default function SpeedFlowchartPage() {
                           fontWeight: pair.winner === 'A' ? 'bold' : 'plain',
                         }}
                       >
-                        A: {pair.laneA?.firstName} {pair.laneA?.lastName}
+                        A: {pair.laneA?.participant.firstName}{' '}
+                        {pair.laneA?.participant.lastName}:{' '}
+                        {pair.laneA?.result?.result}
                       </Typography>
                       <Typography
                         sx={{
                           fontWeight: pair.winner === 'B' ? 'bold' : 'plain',
                         }}
                       >
-                        B: {pair.laneB?.firstName} {pair.laneB?.lastName}
+                        B: {pair.laneB?.participant.firstName}{' '}
+                        {pair.laneB?.participant.lastName}:{' '}
+                        {pair.laneB?.result?.result}
                       </Typography>
                     </CardContent>
                   </Card>