Add actionsBlacklist and actionsWhitelist config options

[evgenykochetkov]

I think it is much more convenient to set these options in window.devToolsExtension() config.

[zalmoxisus]

Hey @evgenykochetkov,

Thanks for the contribution! I like the implementation and agree about the convenience of setting it directly in the code for each project individually. The problem here is that every time we have something changed in the settings, we inject new window.devToolsOptions to apply the changes without reloading the page (that's why we expose this object globally). So, we probably should use a local object (let's say localFilter) for this case not to have it overwritten. And then implement filtering like this:

  function isFiltered(action) {
    if (!localFilter && !window.devToolsOptions.filter) return false;
    const { whitelist, blacklist } = localFilter || window.devToolsOptions;
    return (
      whitelist && !action.type.match(whitelist) ||
      blacklist && action.type.match(blacklist)
    );
  }

  function addFilter(state) {
    if (localFilter || window.devToolsOptions.filter) {
      const { whitelist, blacklist } = localFilter || window.devToolsOptions;
      if (whitelist) state.whitelist = [whitelist];
      else if (blacklist) state.blacklist = [blacklist];
    }
  }

[evgenykochetkov]

Thanks for the explanation! I corrected the implementation.

P.S:
This line is beautiful😍 const { whitelist, blacklist } = localFilter || window.devToolsOptions;

[zalmoxisus]

Thanks a lot for the fixes!

Yes, boolean operators are awesome along with ES6. :-)
Also, for example, instead of

const actionsArrToReg = (arr) => arr ? arr.join('|') : null;

it could be

const actionsArrToReg = (arr) => arr && arr.join('|');

It's not better or worse, just different styles, though we could not use the function at all in this case.