Reselect Map Change Memoize

A simple memoize function for reselect-map which performs a callback every time the result changes. This is to reselect-map the same as reselect-change-memoize is for reselect.

This is alpha software, use at your own risk.

1import { createSelectorWithChangeCallback } from 'reselect-map-change-memoize';
2
3  // eslint-disable-next-line no-unused-vars
4  function myCallback(lastArgs, lastResult, newArgs, newResult) {
5    // Your code
6  }
7
8  const selector = createArraySelectorWithChangeCallback(
9    myCallback,
10    (state) => state.arrayState,
11    (state) => state.id,
12    (arrayState, id) => { // eslint-disable-line arrow-body-style
13      return {arrayState, id};
14    }
15  );
16
17  selector({arrayState: [1, 2, 3], initial: 'state'});

Alternatively, using the basic logging create selector

1import { createSelector } from 'reselect-change-memoize'
2import { createArraySelector } from 'reselect-map-change-memoize';
3
4  const selector1 = createArraySelector(
5    'An awesome array selector',
6    (state) => state.arrayState,
7    (state) => state.id,
8    (arrayItem, id) => {
9      return {arrayItem, id};
10    }
11  );
12  const selector2 = createSelector(
13    'A second awesome selector which uses the first awesome selector',
14    selector1,
15    (selector1Array) => {
16      return {selector2: selector1Array};
17    }
18  );
19  // The name doesn't not have to be provided
20  const selector3 = createArraySelector(
21    selector1,
22    (selector1Item) => {
23      return {selector2ArrayItem: selector1Item};
24    }
25  );
26
27  const state = {arrayState: [1, 2, 3], id: 'id'};
28  selector2(state);
29  selector1(state);
30  selector3(state);

produces

- An awesome array selector
	lastArgs: {}
	lastResult: {}
	newArgs: [ [ 1, 2, 3 ], 'id' ]
	newResult: [ { arrayItem: 1, id: 'id' }, { arrayItem: 2, id: 'id' }, { arrayItem: 3, id: 'id' } ]
- A second awesome selector which uses the first awesome selector
	lastArgs: {}
	lastResult: {}
	newArgs: [ [ { arrayItem: 1, id: 'id' },
    { arrayItem: 2, id: 'id' },
    { arrayItem: 3, id: 'id' } ] ]
	newResult: { selector2:
        [ { arrayItem: 1, id: 'id' }, { arrayItem: 2, id: 'id' }, { arrayItem: 3, id: 'id' } ]
   }
- unknown
	lastArgs: {}
	lastResult: {}
	newArgs: [ [ { arrayItem: 1, id: 'id' },
    { arrayItem: 2, id: 'id' },
    { arrayItem: 3, id: 'id' } ] ]
	newResult: [ { selector2ArrayItem: { arrayItem: 1, id: 'id' } }, { selector2ArrayItem: { arrayItem: 2, id: 'id' } }, { selector2ArrayItem: { arrayItem: 3, id: 'id' } } ]