diff --git a/src/browser/graphics/components/nameplate/sync-display.tsx b/src/browser/graphics/components/nameplate/sync-display.tsx index 9d1301d8..c698aee4 100644 --- a/src/browser/graphics/components/nameplate/sync-display.tsx +++ b/src/browser/graphics/components/nameplate/sync-display.tsx @@ -1,6 +1,7 @@ import gsap from "gsap"; import {ReactNode, createContext, useEffect, useState} from "react"; import {useReplicant} from "../../../use-replicant"; +import {Commentator} from "../../../../nodecg/replicants"; type DisplayLabel = "name" | "twitter" | "twitch" | "nico"; @@ -10,33 +11,16 @@ export const SyncDisplayProvider = ({children}: {children: ReactNode}) => { const [display, setDisplay] = useState("name"); const currentRun = useReplicant("current-run"); - - const participantSocials = [ - ...(currentRun?.runners.map((runner) => - [ - runner.twitter ? "twitter" : null, - runner.twitch ? "twitch" : null, - runner.nico ? "nico" : null, - ].filter((v): v is DisplayLabel => v !== null), - ) ?? []), - ...(currentRun?.commentators.map((commentator) => - [ - commentator?.twitter ? "twitter" : null, - commentator?.twitch ? "twitch" : null, - commentator?.nico ? "nico" : null, - ].filter((v): v is DisplayLabel => v !== null), + const participants = [ + ...(currentRun?.runners ?? []), + ...(currentRun?.commentators.filter( + (c): c is NonNullable => c !== null, ) ?? []), ]; - const displayTwitter = participantSocials.some((socials) => - socials.includes("twitter"), - ); - const displayTwitch = participantSocials.some((socials) => - socials.includes("twitch"), - ); - const displayNico = participantSocials.some((socials) => - socials.includes("nico"), - ); + const displayTwitter = participants.some((p) => Boolean(p.twitter)); + const displayTwitch = participants.some((p) => Boolean(p.twitch)); + const displayNico = participants.some((p) => Boolean(p.nico)); useEffect(() => { const tl = gsap.timeline({repeat: -1});