Show draftTimestamp in left pane preview

ts/components/ConversationList.dom.tsx

@@ -478,6 +478,7 @@ export function ConversationList({
             'badges',
             'color',
             'draftPreview',
+            'draftTimestamp',
             'groupId',
             'hasAvatar',
             'id',

ts/components/conversationList/ConversationListItem.dom.tsx

@@ -33,6 +33,7 @@ export type PropsData = Pick<
   | 'badges'
   | 'color'
   | 'draftPreview'
+  | 'draftTimestamp'
   | 'groupId'
   | 'hasAvatar'
   | 'id'
@@ -82,6 +83,7 @@ export const ConversationListItem: FunctionComponent<Props> = React.memo(
     buttonAriaLabel,
     color,
     draftPreview,
+    draftTimestamp,
     groupId,
     hasAvatar,
     i18n,
@@ -131,6 +133,7 @@ export const ConversationListItem: FunctionComponent<Props> = React.memo(
       </>
     );
 
+    let headerDate: number | undefined = lastUpdated;
     let messageText: ReactNode = null;
     let messageStatusIcon: ReactNode = null;
 
@@ -167,6 +170,7 @@ export const ConversationListItem: FunctionComponent<Props> = React.memo(
           />
         </>
       );
+      headerDate = draftTimestamp;
     } else if (lastMessage?.deletedForEveryone) {
       messageText = (
         <span className={`${MESSAGE_TEXT_CLASS_NAME}__deleted-for-everyone`}>
@@ -216,7 +220,7 @@ export const ConversationListItem: FunctionComponent<Props> = React.memo(
         conversationType={type}
         groupId={groupId}
         hasAvatar={hasAvatar}
-        headerDate={lastUpdated}
+        headerDate={headerDate}
         headerName={headerName}
         i18n={i18n}
         id={id}

ts/state/ducks/composer.preload.ts

@@ -860,7 +860,6 @@ function addAttachment(
           active_at: activeAt,
           draftChanged: false,
           draftTimestamp: now,
-          timestamp: now,
         });
       }
 

ts/state/ducks/conversations.preload.ts

@@ -419,6 +419,7 @@ export type ConversationType = ReadonlyDeep<
     draftBodyRanges?: DraftBodyRanges;
     // Summary for the left pane
     draftPreview?: DraftPreviewType;
+    draftTimestamp?: number;
 
     sharedGroupNames: ReadonlyArray<string>;
     groupDescription?: string;
@@ -4980,8 +4981,6 @@ function onConversationClosed(
           active_at: activeAt,
           draftChanged: false,
           draftTimestamp: now,
-          timestamp: now,
-          lastMessageReceivedAtMs: now,
         });
       } else {
         log.info(`${logId}: clearing draft info`);

ts/state/selectors/conversations.dom.ts

@@ -324,8 +324,13 @@ const collator = new Intl.Collator();
 export const _getConversationComparator = () => {
   return (left: ConversationType, right: ConversationType): number => {
     // These two fields can be sorted with each other; they are timestamps
-    const leftTimestamp = left.lastMessageReceivedAtMs || left.timestamp;
-    const rightTimestamp = right.lastMessageReceivedAtMs || right.timestamp;
+    const leftTimestamp = left.shouldShowDraft
+      ? left.draftTimestamp
+      : left.lastMessageReceivedAtMs || left.timestamp;
+    const rightTimestamp = right.shouldShowDraft
+      ? right.draftTimestamp
+      : right.lastMessageReceivedAtMs || right.timestamp;
+
     if (leftTimestamp && !rightTimestamp) {
       return -1;
     }

ts/util/getConversation.preload.ts

@@ -186,6 +186,7 @@ export function getConversation(model: ConversationModel): ConversationType {
     draftBodyRanges: attributes.draftBodyRanges,
     draftPreview,
     draftText,
+    draftTimestamp: dropNull(draftTimestamp),
     draftEditMessage,
     familyName: attributes.nicknameFamilyName ?? attributes.profileFamilyName,
     firstName: attributes.nicknameGivenName ?? attributes.profileName,