Here is my setup:
// store/actions/user.js
export const discoverFollowingStatus = followsId => {
return (dispatch, getState) => {
const userId = getState().user.user.id;
findFollowingFromTo(userId, followsId).then(following => {
dispatch({
type: UPDATE_FOLLOWING_STATUS,
payload: {
followsId,
following: following !== null,
},
});
});
};
};
// component.js
import {
discoverFollowingStatus,
} from '../store/actions/user';
...
useEffect(() => {
discoverFollowingStatus(followedUserId);
console.log(discoverFollowingStatus);
}, [followedUserId, discoverFollowingStatus]);
The console is printing lots of functions that aren't grouping together:
The big problem is that the screen is constantly re-rendering because the useEffect is triggering. Why would that imported constant change and trigger it?