It would be really nice if the tree view browser did alphabetical stable sorting and showed entries in an orderly fashion

[leidegre]

We have lots of UUIDs and props in our store finding things is sometimes really painful, for this a search function would be wonderful, however, simply using a stable sort order to display things would be really helpful.

Using Immutable.js and while switching to OrderedMap would probably work I think showing the keys in the store as sorted, regardless, is a really nice improvement.

[odiseo42]

this would be very much appreciated 😎

[hugotox]

+1

[feifanzhou]

This would be life-changing for me

[justinhp]

Yes, this would be amazing especially with complex apps

[1Jesper1]

This would be a nice option.

[ayansome1]

Any updates on whether this feature is coming up?

[zalmoxisus]

react-json-tree has sortObjectKeys parameter implemented. If someone can implement it in redux-devtools-inspector that would be a great contribution.

[0xdevalias]

Coming up on the 1 year anniversary of this issue, and was wondering what the blocker is. Is it just that we need to implement a small PR that calls sortObjectKeys? Or is it something deeper and more tricky/annoying?

---

Edit:

I can see some comments by @zalmoxisus on https://github.com/alexkuz/redux-devtools-inspector/pull/80#issuecomment-449487903 that sound sort of relevant?

https://github.com/zalmoxisus/redux-devtools-extension/issues/635#issuecomment-459054148 seems to say it's on the roadmap for a 3.0 release

[RobertHeim]

We use this until v3 is out.

This implementation only sorts the reducers in development environment and does not require to change any of the actual business code and is easy to remove once v3 is out:

import { combineReducers as combineReducersRedux } from 'redux';

// sorting of reducer keys can be removed once react-dev-tools v3 is released
const combineReducers = process.env.NODE_ENV !== 'development'
  ? combineReducersRedux
  : reducers => combineReducersRedux(Object.keys(reducers)
    .sort()
    .reduce((a, c) => {
      a[c] = reducers[c]; // eslint-disable-line
      return a;
    }, {}));

[hamhamhammy]

+1 for this feature, vue-devtools does it automatically for vuex. It is badly needed when the state is large.