Error: React Hook "useEffect" is called conditionally...

Error: React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render. react-hooks/rules-of-hooks

useEffect"가 조건부로 호출됩니다? 나는 그렇게 작성한 적이 없는데 왜일까?

기존 useEffect를 사용한걸 보면 조건부를 사용하지 않았다 근데 왜 에러가 날까?

  useEffect(() => {
    setSearchBoolean(false)
  },[])

react-query로 사용했을때 위에 return문을 작성해줘서 에러가 났었던 것이다
hook 위에 조건으로 먼저 return을 되면안된다.

  const { data, error, isLoading } = useQuery<PostType[]>({
    queryFn: () => Posts(search),
    queryKey: ["search"],
    enabled: !!searchBoolean,
    onSuccess: (data) => {
      setSearchData(data)
      setSearchBoolean(false)
    }
  })
  if (error) return <div>error</div>

  useEffect(() => {
    setSearchBoolean(false)
  },[])

결론 ✔
리액트 hook은 최상위에서만 호출해야 한다.