Skip to content

Document recommend selectors for getting ordered lists

@tim suggested that we should amend the documented selectors so that we have a clearly recommended approach for returning records in a given sort order.

The reducers cater for maintaining a display order by providing a reducer to store an ordered list of record ids (I.e., ordered API response) so that we can easily retrieve the actual record from the byId store. The byId reducer stores records keyed by ID, and the ids reducer preserves the intended (default??) display order.

A few things to consider as part of the discussion;

  1. The ids list may not be the full set of records stored in byIds. (e.g., you might have a featured article, and a list of articles in a given category)
  2. You might have multiple ids lists for different display purposes for a single byIds set of records. (E.g., a list of articles in a given category, vs a list of recommended articles / articles tagged x)
  3. Sometimes you'll want to use the sort order as returned from an API response
  4. Sometimes you'll want to sort on the client side for performance reasons (I.e., you've already got a complete list, and another server round trip is undesirable)

The question is: How should the documentation recommend we implement selectors for the above use cases.

Current version of selectors documentation doesn't cover this important use-case at all, and looks like this;

export const getArticles = (state) => Object.values(state.byId)
export const getArticleIds = (state) => state.ids
export const getArticlesById = (state) => state.byId
export const getArticleById = (state, id) => state.byId[id]
export const getArticleLoading = (state) => state.loading
export const getArticleError = (state) => state.error

I'd suggest we add in a selector to illustrate how you'd return an ordered list from a selector, rather than having that ordering logic in a component (Following good software design principals, it makes more sense to have it in a selector: Since it's the selectors responsibility to understand the redux store structure, it makes sense for the component to avoid concerning itself with that — see separation of concerns). E.g.,

export const getArticlesOrdered = (state) => state.ids.map(id => state.byId[id])

I'm looking for suggestions on what we should recommend / present in the documentation (and elsewhere). The above is one (probably not very good) suggestion.

Edited by Sam Sehnert