Browse Source

Cleaning up RoundTimer a little

Kirk Trombley 5 năm trước cách đây
mục cha
commit
df5635c33f

+ 5 - 10
client/src/components/screens/GamePanel/GuessPane/RoundTimer.jsx

@@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react';
 import { dispatch, useRoundSeconds } from '../../../../domain/gameStore';
 import styles from './GuessPane.module.css';
 
-const useRoundTimer = (onTimeout) => {
+export default ({ onTimeout }) => {
   const remaining = useRoundSeconds();
   useEffect(
     () => {
@@ -26,15 +26,10 @@ const useRoundTimer = (onTimeout) => {
     },
     [ onTimeout, remaining, called ]
   );
-  return remaining;
-};
 
-export default ({ onTimeout }) => {
-  const remaining = useRoundTimer(onTimeout);
-  const out = remaining <= 0;
-  return (
-    <span className={`${styles.timer} ${out ? styles['timer--timeout'] : ''}`}>
-      {out ? "Time's up!" : `Time: ${ms(remaining * 1000)}`}
-    </span>
+  return remaining > 0 ? (
+    <span className={styles.timer}>Time: {ms(remaining * 1000)}</span>
+  ) : (
+    <span className={`${styles.timer} ${styles['timer--timeout']}`}>Time's up!</span>
   );
 };