react-query, retetchOnWindowFocus

react-query 비동기 함수가 돌아가고 있을 때 다른 브라우저 창을 갔다가 돌아오면 focus가 다시 되니까 리액트 쿼리가 retetchOnWindowFocus의 기본 값으로  messageList를 다시 불러와, 

메시지 답변이 왔음에도 불구하고 메시지를 run 시키는 함수는 계속 돌아가고 있어 isAnswerLoading이 false가 아닌 true로 되어지는 문제 발생. 

 

	useEffect(() => {
		if (!runId || !threadId) return;

		const checkRunStatus = async () => {
			const runStatus = await refetchRetrieveRun();

			if (runStatus?.data?.status === 'completed') {
				setIsAnswerLoading(false);
				setQuery('');
				refetchMessageList();
			}
		};

		const interval = setInterval(checkRunStatus, 500);

		return () => clearInterval(interval);
	}, [retrieveRun?.status, refetchRetrieveRun, runId, setIsAnswerLoading, threadId, refetchMessageList]);

 

 

useGetMessageList로 들어가

 

const useGetMessageList = ({ thread_id }: ReqGetMessageList) => {
	return useQuery({
		queryKey: [MESSAGE_LIST_KEY.lists(), thread_id],
		queryFn: () => getMessageList({ thread_id }),
		select: data => data.slice().reverse(),
		enabled: !!thread_id,
		refetchOnWindowFocus: false,
	});
};

 

refetchOnWindowFocus: false로 실행하니 문제 해결!!!!

다른 창을 갔다와도 실행 중인 비동기 함수가 이어서  잘 실행이 된다.