VideoSDK api don't use updated state

Question

I'm using React + ASP.NET application and using VideoSDK API for video-meeting.

const meetingAPI = useMeeting({
onMeetingJoined: () => {
      meetinAPI.muteMic();
      meetinAPI.disableWebcam();
      if (isCreator) {
        let intervalId = setInterval(async () => {
          console.log(
            "minutes",
            minutes +
              gameHash.ActivePlayers.length
          );
          if (
            minutes + gameHash.ActivePlayers.length >= asset.VideoTime - 10 * ActivePlayers.length
          ) {
            setVideoMinutesRunoutModalOpen(true);
          }
        }, 1000 * 60);
        setTimerId(intervalId);
      }
      setIsMeetingJoined(true);
    },
})

isCreator and gameHash is component state. When it changed, I expect value in onMeetingJoined change too. But it's always the initial value. How can I solve this?

I've tried to use useCallback or useMemo. But it's not working.

Answer 1

I've experienced same issue before. And their support team was so helpful. You can use state ref for that.

const stateRef = useRef();
stateRef.current = {
  minutes: minutes,
  gameHash: gameHash
};

onMeetingJoined: () => {
      meetinAPI.muteMic();
      meetinAPI.disableWebcam();
      if (stateRef.current.isCreator) {
        let intervalId = setInterval(async () => {
          console.log(
            "minutes",
            stateRef.current.minutes +
              stateRef.current.gameHash.ActivePlayers.length
          );
          if (
            stateRef.current.minutes +
              stateRef.current.gameHash.ActivePlayers.length >=
            stateRef.current.asset.VideoTime -
              10 * stateRef.current.gameHash.ActivePlayers.length
          ) {
            setVideoMinutesRunoutModalOpen(true);
          }
        }, 1000 * 60);
        setTimerId(intervalId);
      }
      setIsMeetingJoined(true);
    },

As you can see, stateRef is reference for your state. onMeetingJoined is a third party callback so your state change is not reflected. And this is the solution.