Okey I need to make countdown here in this component. Then check for every first thursday every month and make it count till next one every month. Lets say today is 6.6.2024. thursday 20:00 or 8pm it should start counting again till 4.7.2024. 20:00 or 8pm so on and it should have latest date shown that it counted to.

Problem is it says 8 hours on page refres more but It is not moving with interval idk why

const router = useRouter();
  const [countdown, setCountdown] = useState<string>("");

  useEffect(() => {
    const interval = setInterval(updateCountdown, 1000);
    return () => clearInterval(interval);
  }, []);

  const getNextFirstThursday = (): Date => {
    let date = new Date();
    date.setDate(1);
    while (date.getDay() !== 4) {
      date.setDate(date.getDate() + 1);
    }

    // Check if current date has already passed the target Thursday
    if (date < new Date() && date.getHours() < 20) {
      date.setMonth(date.getMonth() + 1);
    }

    date.setHours(20); // Set the target time to 8 PM

    return date;
  };

  const updateCountdown = () => {
    let nextThursday = getNextFirstThursday();

    let now = new Date();
    let difference = nextThursday.getTime() - now.getTime();

    // Check if the countdown has reached zero or negative value
    if (difference <= 0) {
      // If so, calculate the countdown for the next month
      nextThursday.setMonth(nextThursday.getMonth() + 1);
      nextThursday.setHours(20); // Set the target time to 8 PM for the next month
      difference = nextThursday.getTime() - now.getTime();
    }

    let days = Math.floor(difference / (1000 * 60 * 60 * 24));
    let hours = Math.floor(
      (difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
    );
    let minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
    let seconds = Math.floor((difference % (1000 * 60)) / 1000);

    setCountdown(
      `Countdown: ${days}d ${hours}h ${minutes}m ${seconds}s`
    );
  };