Hide audience displays after match

the-orange-alliance · Sep 25, 2024 · 9006e5d · 9006e5d
1 parent eaa7174
commit 9006e5d
Showing 1 changed file with 26 additions and 6 deletions.
diff --git a/front-end/src/apps/audience-display/displays/ad-default.tsx b/front-end/src/apps/audience-display/displays/ad-default.tsx
@@ -1,9 +1,18 @@
 import { FC } from 'react';
 import { DisplayModeProps } from 'src/apps/audience-display/displays';
 import { useRecoilValue } from 'recoil';
-import { matchOccurringAtom, matchOccurringRanksAtom } from 'src/stores/recoil';
+import {
+  matchOccurringAtom,
+  matchOccurringRanksAtom,
+  matchStateAtom
+} from 'src/stores/recoil';
 import { useEvent } from 'src/api/use-event-data';
-import { AudienceScreens, Displays, LayoutMode } from '@toa-lib/models';
+import {
+  AudienceScreens,
+  Displays,
+  LayoutMode,
+  MatchState
+} from '@toa-lib/models';
 import { getDisplays } from './displays';
 import {
   FadeInOut,
@@ -20,6 +29,7 @@ import { useTeamsForEvent } from 'src/api/use-team-data';
 export const AudDisplayDefault: FC<DisplayModeProps> = ({ id }) => {
   const match = useRecoilValue(matchOccurringAtom);
   const ranks = useRecoilValue(matchOccurringRanksAtom);
+  const matchState = useRecoilValue(matchStateAtom);
   const [searchParams] = useSearchParams();
 
   const { data: teams } = useTeamsForEvent(match?.eventKey);
@@ -92,16 +102,23 @@ export const AudDisplayDefault: FC<DisplayModeProps> = ({ id }) => {
         );
     }
   }
+  const afterMatch = matchState > MatchState.MATCH_IN_PROGRESS;
+
+  const showPreviewFull =
+    layout[0] === LayoutMode.FULL || layout[1] === LayoutMode.FULL;
 
   return (
     <>
       {/* Displays.BLANK (show nothing) */}
       {id === Displays.BLANK && <></>}
 
       {/* Displays.MATCH_PREVIEW */}
-      {layout[0] === LayoutMode.FULL && (
+      {showPreviewFull && (
         <AbsolouteLocator top={0} left={0}>
-          <FadeInOut in={id === Displays.MATCH_PREVIEW} duration={0.5}>
+          <FadeInOut
+            in={id === Displays.MATCH_PREVIEW || afterMatch}
+            duration={0.5}
+          >
             <displays.matchPreview
               event={event}
               match={match}
@@ -131,7 +148,10 @@ export const AudDisplayDefault: FC<DisplayModeProps> = ({ id }) => {
       {/* Displays.MATCH_START */}
       {layout[1] === LayoutMode.FULL && (
         <AbsolouteLocator top={0} left={0}>
-          <FadeInOut in={id === Displays.MATCH_START} duration={0.5}>
+          <FadeInOut
+            in={id === Displays.MATCH_START && !afterMatch}
+            duration={0.5}
+          >
             <displays.matchPlay
               event={event}
               match={match}
@@ -144,7 +164,7 @@ export const AudDisplayDefault: FC<DisplayModeProps> = ({ id }) => {
       {layout[1] === LayoutMode.STREAM && (
         <AbsolouteLocator bottom={0} left={0}>
           <SlideInBottom
-            in={id === Displays.MATCH_START}
+            in={id === Displays.MATCH_START && !afterMatch}
             duration={1.25}
             inDelay={0.75}
           >