diff --git a/frontend/src/hooks/useServerTime.tsx b/frontend/src/hooks/useServerTime.tsx index 752577a91cd192aac61b73d5809b57873f329c42..4d9e4a2f6c0532185933ee98d8291496ee12bb26 100644 --- a/frontend/src/hooks/useServerTime.tsx +++ b/frontend/src/hooks/useServerTime.tsx @@ -9,7 +9,7 @@ const Context = React.createContext(Object.seal({ setOffset: () => { export const ServerTimeProvider = (props: React.PropsWithChildren<{}>) => { const [offset, setOffset] = React.useState(0); - const value = React.useMemo(() => Object.seal({ setOffset, now: () => Date.now() + offset }), [offset, setOffset]); + const value = React.useMemo(() => Object.seal({ setOffset, now: () => Date.now() + offset }), [offset]); return {props.children}; }; diff --git a/frontend/src/pages/gameView.tsx b/frontend/src/pages/gameView.tsx index 92a095253db621858e5111d94eb3bbdc41d3ac2a..2b12a118921fb12d3e8a9522f1458488e591a993 100644 --- a/frontend/src/pages/gameView.tsx +++ b/frontend/src/pages/gameView.tsx @@ -84,6 +84,7 @@ const CenterText = ({ winner, timer, turn }: State) => { const classes = useCenterStyles(); const [countdown, setCountdown] = React.useState(); const { now } = useServerTime(); + const deadline = timer?.turnEnd; React.useEffect(() => { const updateCountdown = () => { @@ -92,14 +93,13 @@ const CenterText = ({ winner, timer, turn }: State) => { return; } - if (!isDefined(timer)) { + if (deadline === undefined) { if (countdown !== undefined) { setCountdown(undefined); } return; } - const deadline = timer.turnEnd; const diff = deadline.getTime() - now(); const between = Math.floor(diff / 1000); @@ -120,7 +120,7 @@ const CenterText = ({ winner, timer, turn }: State) => { }, 200); return () => window.clearInterval(interval); - }, [countdown, setCountdown, winner, timer, now]); + }, [countdown, winner, deadline, now]); const centerText = React.useMemo(() => { const text = isDefined(winner) ? `${teamSpecs[winner].name} wins!` : `${teamSpecs[turn].name}'s turn`;