Allow renaming useEffect to useWhatChanged, and adding 3rd arg for dependencies label

I was editing my stackoverflow answer pointing to this project, and realized there could be a much better api when you are not using the babel plugin

My idea is to allow developers to change this code:

useEffect(() => {
  console.log(bar)
}, [bar]);

to this:

useWhatChanged(() => {
  console.log(bar)
}, [bar], 'bar');

Please ignore this comment/imagine I removed it in an edit/deleted it:

When I was using useWhatChanged, I noticed once I remove the “bad” deps from my useEffect hook, things were still re-rendering, until I removed them from useWhatChanged

[devinrhode2]

Actually, this idea could be implemented in user-land, outside your package source, like so:

import {useEffect} from 'react';
import { useWhatChanged as core_useWhatChanged } from '@simbathesailor/use-what-changed';

const useWhatChanged = (effectCallback, deps, depLabels) => {
  useEffect(effectCallback, deps);
  core_useWhatChanged(deps, depLabels);
};

// inside react component:
useWhatChanged(() => {
  console.log(bar)
}, [bar], 'bar');

[simbathesailor]

I have added the support to enable/disable logging via one time call or based on NODE_ENV key now. Although I have supported this configuration, I must recommend to use https://github.com/simbathesailor/babel-plugin-use-what-changed for better dev experience. Closing the ticket for now.