Chats: Import and normalize chats

app/soapbox/actions/chats.js

@@ -1,4 +1,5 @@
 import api from '../api';
+import { importFetchedChats } from 'soapbox/actions/importer';
 
 export const CHATS_FETCH_REQUEST = 'CHATS_FETCH_REQUEST';
 export const CHATS_FETCH_SUCCESS = 'CHATS_FETCH_SUCCESS';
@@ -8,6 +9,7 @@ export function fetchChats() {
   return (dispatch, getState) => {
     dispatch({ type: CHATS_FETCH_REQUEST });
     return api(getState).get('/api/v1/pleroma/chats').then(({ data }) => {
+      dispatch(importFetchedChats(data));
       dispatch({ type: CHATS_FETCH_SUCCESS, data });
     }).catch(error => {
       dispatch({ type: CHATS_FETCH_FAIL, error });

app/soapbox/actions/importer/index.js

@@ -1,5 +1,10 @@
 import { getSettings } from '../settings';
-import { normalizeAccount, normalizeStatus, normalizePoll } from './normalizer';
+import {
+  normalizeAccount,
+  normalizeStatus,
+  normalizePoll,
+  normalizeChat,
+} from './normalizer';
 
 export const ACCOUNT_IMPORT  = 'ACCOUNT_IMPORT';
 export const ACCOUNTS_IMPORT = 'ACCOUNTS_IMPORT';
@@ -7,6 +12,8 @@ export const STATUS_IMPORT   = 'STATUS_IMPORT';
 export const STATUSES_IMPORT = 'STATUSES_IMPORT';
 export const POLLS_IMPORT    = 'POLLS_IMPORT';
 export const ACCOUNT_FETCH_FAIL_FOR_USERNAME_LOOKUP = 'ACCOUNT_FETCH_FAIL_FOR_USERNAME_LOOKUP';
+export const CHAT_IMPORT     = 'CHAT_IMPORT';
+export const CHATS_IMPORT    = 'CHATS_IMPORT';
 
 function pushUnique(array, object) {
   if (array.every(element => element.id !== object.id)) {
@@ -34,6 +41,14 @@ export function importPolls(polls) {
   return { type: POLLS_IMPORT, polls };
 }
 
+export function importChat(chat) {
+  return { type: CHAT_IMPORT, chat };
+}
+
+export function importChats(chats) {
+  return { type: CHATS_IMPORT, chats };
+}
+
 export function importFetchedAccount(account) {
   return importFetchedAccounts([account]);
 }
@@ -97,3 +112,26 @@ export function importFetchedPoll(poll) {
 export function importErrorWhileFetchingAccountByUsername(username) {
   return { type: ACCOUNT_FETCH_FAIL_FOR_USERNAME_LOOKUP, username };
 };
+
+export function importFetchedChat(chat) {
+  return importFetchedChats([chat]);
+}
+
+export function importFetchedChats(chats) {
+  return (dispatch, getState) => {
+    const accounts = [];
+    const normalChats = [];
+
+    function processChat(chat) {
+      const normalOldChat = getState().getIn(['chats', chat.id]);
+
+      pushUnique(normalChats, normalizeChat(chat, normalOldChat));
+      pushUnique(accounts, chat.account);
+    }
+
+    chats.forEach(processChat);
+
+    dispatch(importFetchedAccounts(accounts));
+    dispatch(importChats(normalChats));
+  };
+}

app/soapbox/actions/importer/normalizer.js

@@ -80,3 +80,11 @@ export function normalizePoll(poll) {
 
   return normalPoll;
 }
+
+export function normalizeChat(chat, normalOldChat) {
+  const normalChat   = { ...chat };
+
+  normalChat.account = chat.account.id;
+
+  return normalChat;
+}

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

@@ -5,10 +5,14 @@ import { injectIntl, FormattedMessage } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { fetchChats } from 'soapbox/actions/chats';
 import ChatListAccount from './chat_list_account';
+import { makeGetChat } from 'soapbox/selectors';
 
-const mapStateToProps = state => ({
-  chats: state.get('chats'),
-});
+const mapStateToProps = state => {
+  const getChat = makeGetChat();
+  return {
+    chats: state.get('chats').map(chat => getChat(state, chat.toJS())),
+  };
+};
 
 export default @connect(mapStateToProps)
 @injectIntl
@@ -37,7 +41,7 @@ class ChatList extends ImmutablePureComponent {
         </div>
         <div className='chat-list__content'>
           {chats.toList().map(chat => (
-            <div className='chat-list-item'>
+            <div key={chat.get('id')} className='chat-list-item'>
               <ChatListAccount
                 account={chat.get('account')}
                 onClick={this.handleClickChat}

app/soapbox/reducers/chats.js

@@ -1,14 +1,19 @@
-import { CHATS_FETCH_SUCCESS } from '../actions/chats';
+import { CHAT_IMPORT, CHATS_IMPORT } from 'soapbox/actions/importer';
 import { Map as ImmutableMap, fromJS } from 'immutable';
 
+const importChat = (state, chat) => state.set(chat.id, fromJS(chat));
+
+const importChats = (state, chats) =>
+  state.withMutations(mutable => chats.forEach(chat => importChat(mutable, chat)));
+
 const initialState = ImmutableMap();
 
 export default function admin(state = initialState, action) {
   switch(action.type) {
-  case CHATS_FETCH_SUCCESS:
-    return state.merge(fromJS(action.data).reduce((acc, curr) => (
-      acc.set(curr.get('id'), curr)
-    ), ImmutableMap()));
+  case CHAT_IMPORT:
+    return importChat(state, action.chat);
+  case CHATS_IMPORT:
+    return importChats(state, action.chats);
   default:
     return state;
   }

app/soapbox/selectors/index.js

@@ -157,3 +157,20 @@ export const getAccountGallery = createSelector([
       .map(media => media.merge({ status, account })));
   }, ImmutableList());
 });
+
+export const makeGetChat = () => {
+  return createSelector(
+    [
+      (state, { id }) => state.getIn(['chats', id]),
+      (state, { id }) => state.getIn(['accounts', state.getIn(['chats', id, 'account'])]),
+    ],
+
+    (chat, account) => {
+      if (!chat) return null;
+
+      return chat.withMutations(map => {
+        map.set('account', account);
+      });
+    }
+  );
+};