Using equality comparison in selectors

[rschyboll]

Using equality comparison in selectors

[mariusandra]

Hey, version 2.5.11 is out with this feature.

Now you can do:

import deepEqual from 'fast-deep-equal'

const logic = kea({
  selectors: {
    widgetKeys: [
      (selectors) => [selectors.widgets],
      (widgets) => {
        return Object.keys(widgets);
      },
      null, // PropTypes
      deepEqual
    ],
  },

The third element, PropTypes, is a legacy feature from the olden days, whose removal would be a breaking change. I'll do it in version 3.0, which is actually just around the corner...

[mariusandra]

and sorry for the wait 😅

[rschyboll]

Awesome!! Thank you for backporting that feature, but i do have some suggestions, maybe for the 3.0 version in the future 😅

In my use case, with the new feature, i need to create two selectors, one that creates the new array, and a second one, that checks it's equality. I was wondering, if there is not a better solution for this.
When creating selectors in reselect, it is possible to define a separate method for comparing the result value of that selector, maybe it would be possible to have this too in Kea? Maybe allowing the third parameter in the selector definition to be an object with optional fields, similar to reselect? Something like this:

{
  equalityCheck: (a, b) => a === b,
  resultEqualityCheck: shallowEqual
}

Also the current syntax is a bit confusing, when having multiple input parameters to the selector, as one comparison function has to check all of those values, but it seems that could be a limitation of how reselect handles things.

To be honest, I don't fully understand how Kea does work underneath, but it seems to me that having an object with some optional configuration options for a selector would make things easier for adding more options in the future.

Saying all that, looking forward for the 3.0 release 😅

[mariusandra]

Oh, I didn't know of this new reselect 4.1 feature.

I just released 2.6, and changed the last array element to just directly takes reselect's memoizeOptions. You can do this now:

const logic = kea({
    selectors: {
        widgetKeys: [
            (selectors) => [selectors.widgets],
            (widgets) => Object.keys(widgets),
            null, // PropTypes, will be removed in Kea 3.0
            { resultEqualityCheck: deepEqual },
        ],
    },
})