compose: Auto-close unchanged auto-opened drafts on narrow change.

Fixes #30104.

web/src/compose.js

@@ -171,6 +171,7 @@ export function send_message_success(request, data) {
 
 export function send_message(request = create_message_object()) {
     compose_state.set_recipient_edited_manually(false);
+    compose_state.set_is_content_unedited_restored_draft(false);
     if (request.type === "private") {
         request.to = JSON.stringify(request.to);
     } else {

web/src/compose_actions.ts

@@ -122,6 +122,7 @@ function clear_box(): void {
     compose_validate.set_user_acknowledged_stream_wildcard_flag(false);
 
     compose_state.set_recipient_edited_manually(false);
+    compose_state.set_is_content_unedited_restored_draft(false);
     clear_textarea();
     compose_validate.check_overflow_text();
     drafts.set_compose_draft_id(undefined);
@@ -306,6 +307,7 @@ export function start(raw_opts: ComposeActionsStartOpts): void {
 
     // If we're not explicitly opening a different draft, restore the last
     // saved draft (if it exists).
+    let restoring_last_draft = false;
     if (
         compose_state.can_restore_drafts() &&
         !opts.content &&
@@ -315,6 +317,7 @@ export function start(raw_opts: ComposeActionsStartOpts): void {
     ) {
         const possible_last_draft = drafts.get_last_restorable_draft_based_on_compose_state();
         if (possible_last_draft !== undefined) {
+            restoring_last_draft = true;
             opts.draft_id = possible_last_draft.id;
             // Add a space at the end so that if the user starts typing
             // as soon as the composebox opens, they have a bit of separation
@@ -332,6 +335,11 @@ export function start(raw_opts: ComposeActionsStartOpts): void {
         // display that it's too long.
         compose_validate.check_overflow_text();
     }
+    // This has to happen after we insert the content, so that the next "input" event
+    // is from user input.
+    if (restoring_last_draft) {
+        compose_state.set_is_content_unedited_restored_draft(true);
+    }
 
     compose_state.set_message_type(opts.message_type);
 
@@ -406,7 +414,7 @@ export function on_show_navigation_view(): void {
     }
 
     // Leave the compose box open if there is content or if the recipient was edited.
-    if (compose_state.has_message_content() || compose_state.is_recipient_edited_manually()) {
+    if (compose_state.has_novel_message_content() || compose_state.is_recipient_edited_manually()) {
         return;
     }
 
@@ -426,7 +434,10 @@ export function on_topic_narrow(): void {
     if (compose_state.stream_name() !== narrow_state.stream_name()) {
         // If we changed streams, then we only leave the
         // compose box open if there is content or if the recipient was edited.
-        if (compose_state.has_message_content() || compose_state.is_recipient_edited_manually()) {
+        if (
+            compose_state.has_novel_message_content() ||
+            compose_state.is_recipient_edited_manually()
+        ) {
             compose_fade.update_message_list();
             return;
         }
@@ -437,7 +448,7 @@ export function on_topic_narrow(): void {
     }
 
     if (
-        (compose_state.topic() && compose_state.has_message_content()) ||
+        (compose_state.topic() && compose_state.has_novel_message_content()) ||
         compose_state.is_recipient_edited_manually()
     ) {
         // If the user has written something to a different topic or edited it,
@@ -492,7 +503,7 @@ export function on_narrow(opts: NarrowActivateOpts): void {
         return;
     }
 
-    if (compose_state.has_message_content() || compose_state.is_recipient_edited_manually()) {
+    if (compose_state.has_novel_message_content() || compose_state.is_recipient_edited_manually()) {
         compose_fade.update_message_list();
         return;
     }

web/src/compose_setup.js

@@ -89,6 +89,10 @@ export function initialize() {
         } else {
             $(".add-poll").parent().removeClass("disabled-on-hover");
         }
+
+        if (compose_state.get_is_content_unedited_restored_draft()) {
+            compose_state.set_is_content_unedited_restored_draft(false);
+        }
     });
 
     $("#compose form").on("submit", (e) => {

web/src/compose_state.ts

@@ -7,6 +7,7 @@ import * as sub_store from "./sub_store";
 
 let message_type: "stream" | "private" | undefined;
 let recipient_edited_manually = false;
+let is_content_unedited_restored_draft = false;
 let last_focused_compose_type_input: HTMLTextAreaElement | undefined;
 
 // We use this variable to keep track of whether user has viewed the topic resolved
@@ -25,6 +26,14 @@ export function is_recipient_edited_manually(): boolean {
     return recipient_edited_manually;
 }
 
+export function set_is_content_unedited_restored_draft(flag: boolean): void {
+    is_content_unedited_restored_draft = flag;
+}
+
+export function get_is_content_unedited_restored_draft(): boolean {
+    return is_content_unedited_restored_draft;
+}
+
 export function set_last_focused_compose_type_input(element: HTMLTextAreaElement): void {
     last_focused_compose_type_input = element;
 }
@@ -190,6 +199,10 @@ export function has_message_content(): boolean {
     return message_content() !== "";
 }
 
+export function has_novel_message_content(): boolean {
+    return message_content() !== "" && !get_is_content_unedited_restored_draft();
+}
+
 const MINIMUM_MESSAGE_LENGTH_TO_SAVE_DRAFT = 2;
 export function has_savable_message_content(): boolean {
     return message_content().length > MINIMUM_MESSAGE_LENGTH_TO_SAVE_DRAFT;