useEffect dependency array issues

useEffect(() => {
refreshCart();
}, []);
useEffect-issue.js
const refreshCart = () =>
api.getCart().then(cart => setState(cart));
refreshCart.js
const refreshCart = useCallback(
() => api.getCart().then(cart => setState(cart)),
[],
);
refreshCart-useCallback.js
const refreshCartRef = useRef(null);
if (!refreshCartRef.current) {
refreshCartRef.current = () =>
api.getCart().then(cart => setState(cart));
}
useEffect(() => refreshCartRef.current(), []);
refreshCartRef.js
useEffect(() => {
refreshCart();
// refreshCart is recreated fresh, but we only want to
// do this on initial render, so we're going to provide
// an empty array here so it only runs once.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
refreshCart-eslint-disable.js