Chats: memoize sorted chat IDs list

app/soapbox/features/chats/components/chat_list.js

@@ -5,6 +5,14 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import { injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import Chat from './chat';
+import { createSelector } from 'reselect';
+
+const getSortedChatIds = chats => (
+  chats
+    .toList()
+    .sort(chatDateComparator)
+    .map(chat => chat.get('id'))
+);
 
 const chatDateComparator = (chatA, chatB) => {
   // Sort most recently updated chats at the top
@@ -17,18 +25,20 @@ const chatDateComparator = (chatA, chatB) => {
   return 0;
 };
 
-const mapStateToProps = state => {
+const makeMapStateToProps = () => {
-  const chatIds = state.get('chats')
+  const sortedChatIdsSelector = createSelector(
-    .toList()
+    [getSortedChatIds],
-    .sort(chatDateComparator)
+    chats => chats,
-    .map(chat => chat.get('id'));
+  );
 
-  return {
+  const mapStateToProps = state => ({
-    chatIds,
+    chatIds: sortedChatIdsSelector(state.get('chats')),
-  };
+  });
+
+  return mapStateToProps;
 };
 
-export default @connect(mapStateToProps)
+export default @connect(makeMapStateToProps)
 @injectIntl
 class ChatList extends ImmutablePureComponent {