diff --git a/lib/shared/message-utils.js b/lib/shared/message-utils.js
--- a/lib/shared/message-utils.js
+++ b/lib/shared/message-utils.js
@@ -159,11 +159,11 @@
   messageInfos: $ReadOnlyArray<T>,
 ): T[] {
   const lengths = findMessageIDMaxLengths(
-    messageInfos.map(message => message?.id),
+    messageInfos.map(message => message?.id ?? message?.localID),
   );
   return _orderBy([
     'time',
-    (message: T) => extendMessageID(message?.id, lengths),
+    (message: T) => extendMessageID(message?.id ?? message?.localID, lengths),
   ])(['desc', 'desc'])(messageInfos);
 }
 
diff --git a/lib/shared/message-utils.test.js b/lib/shared/message-utils.test.js
--- a/lib/shared/message-utils.test.js
+++ b/lib/shared/message-utils.test.js
@@ -5,6 +5,8 @@
   isInvalidPinSource,
   isUnableToBeRenderedIndependently,
   findNewestMessageTimePerKeyserver,
+  sortMessageInfoList,
+  sortMessageIDs,
 } from './message-utils.js';
 import { messageSpecs } from '../shared/messages/message-specs.js';
 import type {
@@ -800,3 +802,185 @@
     expect(findNewestMessageTimePerKeyserver(messages)).toEqual(result);
   });
 });
+
+describe('sortMessageInfoList', () => {
+  it('should sort messages by time and then by the number in id', () => {
+    const messages: $ReadOnlyArray<RawMessageInfo> = [
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 4,
+        text: 'test',
+        id: '256|9',
+      },
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 2,
+        text: 'test',
+        localID: 'local100',
+      },
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '256|1',
+      },
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: 'local10',
+      },
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: 'local200',
+      },
+      {
+        type: 0,
+        threadID: '256|100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '256|20',
+      },
+    ];
+    const result = sortMessageInfoList(messages);
+    expect(result.map(item => item.id ?? item.localID)).toEqual([
+      '256|9',
+      'local100',
+      'local200',
+      'local10',
+      '256|20',
+      '256|1',
+    ]);
+  });
+
+  it('on the keyserver, should sort messages by time and then by id', () => {
+    const messages: $ReadOnlyArray<RawMessageInfo> = [
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 4,
+        text: 'test',
+        id: '9',
+      },
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 2,
+        text: 'test',
+        localID: '100',
+      },
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '1',
+      },
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: '10',
+      },
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: '200',
+      },
+      {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '20',
+      },
+    ];
+    const result = sortMessageInfoList(messages);
+    expect(result.map(item => item.id ?? item.localID)).toEqual([
+      '9',
+      '100',
+      '200',
+      '20',
+      '10',
+      '1',
+    ]);
+  });
+});
+
+describe('sortMessageIDs', () => {
+  it('should sort messages by time and then by the number in id', () => {
+    const messages = {
+      ['256|0']: {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 5,
+        text: 'test',
+        id: '256|0',
+      },
+      ['256|100']: {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '256|100',
+      },
+      ['local333']: {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: 'local333',
+      },
+      ['256|1325993']: {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        localID: '256|1325993',
+      },
+      ['256|1']: {
+        type: 0,
+        threadID: '100',
+        creatorID: '256',
+        time: 1,
+        text: 'test',
+        id: '256|1',
+      },
+    };
+    expect(
+      sortMessageIDs(messages)([
+        '256|0',
+        '256|100',
+        'local333',
+        '256|1325993',
+        '256|1',
+      ]),
+    ).toEqual(['256|0', 'local333', '256|1325993', '256|100', '256|1']);
+  });
+});