React useEffect 무한 루프 원인이 뭔가요

React 컴포넌트에서 useEffect를 사용하는데 무한 렌더링이 발생합니다.

const [data, setData] = useState([]);
const [filter, setFilter] = useState({});

useEffect(() => {
  fetchData(filter).then(res => setData(res));
}, [filter]);

// 다른 곳에서
const handleClick = () => {
  setFilter({ category: 'all' });  // 매번 새 객체 생성
};

filter가 바뀔 때만 fetch하고 싶은데, 컴포넌트가 계속 리렌더링됩니다. 콘솔에 네트워크 요청이 끝없이 찍히고 있어요. 의존성 배열에 filter를 넣어야 하는 것 같은데, 어떻게 해야 무한 루프를 막을 수 있을까요?