Chats: improve the way messageIds are sorted

app/soapbox/actions/chats.js

@@ -47,7 +47,7 @@ export function fetchChatMessages(chatId, maxId = null) {
 
 export function sendChatMessage(chatId, params) {
   return (dispatch, getState) => {
-    const uuid = uuidv4();
+    const uuid = `末_${Date.now()}_${uuidv4()}`;
     const me = getState().get('me');
     dispatch({ type: CHAT_MESSAGE_SEND_REQUEST, chatId, params, uuid, me });
     return api(getState).post(`/api/v1/pleroma/chats/${chatId}/messages`, params).then(({ data }) => {

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

@@ -21,7 +21,7 @@ const mapStateToProps = (state, { chatMessageIds }) => ({
   chatMessages: chatMessageIds.reduce((acc, curr) => {
     const chatMessage = state.getIn(['chat_messages', curr]);
     return chatMessage ? acc.push(chatMessage) : acc;
-  }, ImmutableList()).sort().reverse(),
+  }, ImmutableList()),
 });
 
 export default @connect(mapStateToProps)

app/soapbox/reducers/chat_message_lists.js

@@ -9,9 +9,15 @@ import { Map as ImmutableMap, OrderedSet as ImmutableOrderedSet } from 'immutabl
 
 const initialState = ImmutableMap();
 
+const idComparator = (a, b) => {
+  if (a < b) return 1;
+  if (a > b) return -1;
+  return 0;
+};
+
 const updateList = (state, chatId, messageIds) => {
   const ids = state.get(chatId, ImmutableOrderedSet());
-  const newIds = ids.union(messageIds);
+  const newIds = ids.union(messageIds).sort(idComparator);
   return state.set(chatId, newIds);
 };
 
@@ -31,22 +37,28 @@ const importLastMessages = (state, chats) =>
       if (chat.last_message) importMessage(mutable, chat.last_message);
     }));
 
+const replaceMessage = (state, chatId, oldId, newId) => {
+  const ids = state.get(chatId, ImmutableOrderedSet());
+  const newIds = ids.delete(oldId).add(newId).sort(idComparator);
+  return state.set(chatId, newIds);
+};
+
 export default function chatMessageLists(state = initialState, action) {
   switch(action.type) {
   case CHAT_MESSAGE_SEND_REQUEST:
-    return updateList(state, action.chatId, [action.uuid]).sort();
+    return updateList(state, action.chatId, [action.uuid]);
   case CHATS_FETCH_SUCCESS:
-    return importLastMessages(state, action.chats).sort();
+    return importLastMessages(state, action.chats);
   case STREAMING_CHAT_UPDATE:
     if (action.chat.last_message &&
         action.chat.last_message.account_id !== action.me)
-      return importMessages(state, [action.chat.last_message]).sort();
+      return importMessages(state, [action.chat.last_message]);
     else
       return state;
   case CHAT_MESSAGES_FETCH_SUCCESS:
-    return updateList(state, action.chatId, action.chatMessages.map(chat => chat.id).reverse()).sort();
+    return updateList(state, action.chatId, action.chatMessages.map(chat => chat.id));
   case CHAT_MESSAGE_SEND_SUCCESS:
-    return updateList(state, action.chatId, [action.chatMessage.id]).sort();
+    return replaceMessage(state, action.chatId, action.uuid, action.chatMessage.id);
   default:
     return state;
   }