fix card status, add white card to display

the-orange-alliance · Sep 25, 2024 · eaa7174 · eaa7174
1 parent 094259c
commit eaa7174
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/...pps/audience-display/displays/seasons/fgc_default/assets/penalty-white-card.png b/...pps/audience-display/displays/seasons/fgc_default/assets/penalty-white-card.png
diff --git a/front-end/src/apps/audience-display/displays/seasons/fgc_default/components/card-status.tsx b/front-end/src/apps/audience-display/displays/seasons/fgc_default/components/card-status.tsx
@@ -1,7 +1,9 @@
 import { FC, useMemo } from 'react';
 import YELLOW_CARD from '../assets/penalty-yellow-card.png';
 import RED_CARD from '../assets/penalty-red-card.png';
+import WHITE_CARD from '../assets/penalty-white-card.png';
 import styled from '@emotion/styled';
+import { FeedingTheFuture } from '@toa-lib/models';
 
 const Image = styled.img`
   max-height: 100%;
@@ -11,12 +13,12 @@ const Image = styled.img`
 export const CardStatus: FC<{ cardStatus: number }> = ({ cardStatus }) => {
   const img = useMemo(() => {
     switch (cardStatus) {
-      case 0:
-        return '';
-      case 1:
+      case FeedingTheFuture.CardStatus.YELLOW_CARD:
         return YELLOW_CARD;
-      case 2:
+      case FeedingTheFuture.CardStatus.RED_CARD:
         return RED_CARD;
+      case FeedingTheFuture.CardStatus.WHITE_CARD:
+        return WHITE_CARD;
       default:
         return '';
     }

diff --git a/front-end/src/apps/audience-display/displays/seasons/fgc_default/match-play.tsx b/front-end/src/apps/audience-display/displays/seasons/fgc_default/match-play.tsx
@@ -79,7 +79,7 @@ const ScoreContainer = styled.div((props: { alliance: Alliance }) => ({
   lineHeight: '5vh'
 }));
 
-export const MatchPlay: FC<DisplayProps> = ({ match }) => {
+export const MatchPlay: FC<DisplayProps> = ({ match, teams }) => {
   return (
     <BGImage>
       <Container spacing={5}>
@@ -93,13 +93,15 @@ export const MatchPlay: FC<DisplayProps> = ({ match }) => {
           <AlliancePlay
             alliance='red'
             participants={match.participants ?? []}
+            teams={teams}
             fullHeight
           />
           <ScoreContainer alliance='red'>{match.redScore}</ScoreContainer>
           <ScoreContainer alliance='blue'>{match.blueScore}</ScoreContainer>
           <AlliancePlay
             alliance='blue'
             participants={match.participants ?? []}
+            teams={teams}
             invert
             fullHeight
           />