Redux selector examples

messenger-inbox-handler.js

import Page from 'components/messenger-inbox-page';

import {
  selectRoutedSupplierThread,
  selectRoutedSupplierThreadMessages
} from 'services/messenger-service';

const selector = createSelector([
  selectRoutedSupplierThread,
  selectRoutedSupplierThreadMessages
], (
  thread,
  messages
) => ({
  thread,
  messages
}));

export default connect(selector)(Page);

messenger-service.js

function reduceMessenger(state, action) {
  // ... reduce state
}

/** Select messenger state from our global state tree */
export function selectMessengerState(state) {
  return state.messenger;
}

/** Select the thread between routed supplier (:supplierId) and authed team */
export const selectRoutedSupplierThread = createSelector(
  [selectParams, selectAuthTeamId, selectDenormaliser, selectMessengerState],
  ({supplierId}, teamId, denormalise, messenger) =>
    denormalise(messenger.threads.get(makeThreadKey(supplierId, teamId)))
);

/** Select the thread messages between routed supplier (:supplierId) and authed team */
export const selectRoutedSupplierThreadMessages = createSelector(
  [selectRoutedSupplierThread, selectDenormaliser, selectMessengerState],
  (thread, denormalise, messenger) =>
    (thread && denormalise(messenger.threadMessages.get(thread.id))) || new List()
);

Hi @chrisui! Thank you for posting this. I am very curious about your denormalise function - could you share code/logic/thinking in there?