我需要帮助，试图连接我的不同组件在一个反应游戏

// Timer.js
import React, { useState, useEffect } from 'react';

function Timer({ onTimeUp }) {
  const [timeLeft, setTimeLeft] = useState(10);

  useEffect(() => {
    const timer = setTimeout(() => {
      setTimeLeft(timeLeft - 1);
      if (timeLeft === 1) onTimeUp();
    }, 1000);
    return () => clearTimeout(timer);
  }, [timeLeft, onTimeUp]);

  return <div>Time Left: {timeLeft}</div>;
}

export default Timer;

// GameBoard.js
import React, { useState } from 'react';
import Timer from './Timer';

function GameBoard() {
  const [score, setScore] = useState(0);

  const handleTimeUp = () => {
    alert('Time is up!');
    // 这里可以添加更多游戏结束后的逻辑
  };

  return (
    <div>
      <h1>Reaction Game</h1>
      <Timer onTimeUp={handleTimeUp} />
      <button onClick={() => setScore(score + 1)}>Click Me!</button>
      <div>Score: {score}</div>
    </div>
  );
}

export default GameBoard;