message_list_hover: Fix glitch when hovering over a message.

If we hover over a message, we see the message edit button
(provided the settings allow so). But if the edit deadline is
passed while we're hovering, we still see the edit button,
when it should be hidden.

This commit fixes this by updating the edit button
visibility when the edit deadline is passed.

Fixes #15810.

web/src/message_edit.ts

@@ -215,6 +215,14 @@ export function is_content_editable(message: Message, edit_limit_seconds_buffer
     return false;
 }
 
+export function remaining_content_edit_time(message: Message): number {
+    if (!is_content_editable(message)) {
+        return 0;
+    }
+    const limit_seconds = realm.realm_message_content_edit_limit_seconds ?? Infinity;
+    return limit_seconds + (message.timestamp - Date.now() / 1000);
+}
+
 export function is_message_sent_by_my_bot(message: Message): boolean {
     const user = people.get_by_user_id(message.sender_id);
     if (!user.is_bot || user.bot_owner_id === null) {

web/src/message_list_hover.ts

@@ -9,10 +9,15 @@ import * as thumbnail from "./thumbnail.ts";
 import {user_settings} from "./user_settings.ts";
 
 let $current_message_hover: JQuery | undefined;
+let edit_timeout: ReturnType<typeof setTimeout> | undefined;
 export function message_unhover(): void {
     if ($current_message_hover === undefined) {
         return;
     }
+    if (edit_timeout !== undefined) {
+        clearTimeout(edit_timeout);
+        edit_timeout = undefined;
+    }
     $current_message_hover.removeClass("can-edit-content can-move-message");
     $current_message_hover = undefined;
 }
@@ -60,6 +65,19 @@ function change_edit_content_button($message_row: JQuery, message: Message): voi
     } else if (!is_content_editable && !can_move_message) {
         $edit_content.removeClass("can-edit-content can-move-message");
     }
+
+    if (edit_timeout === undefined) {
+        const remaining_edit_time = message_edit.remaining_content_edit_time(message) * 1000;
+        if (remaining_edit_time > 0 && remaining_edit_time < Infinity) {
+            edit_timeout = setTimeout(() => {
+                const visible = $.contains(document.body, $edit_content[0]!);
+                if (!visible) {
+                    return;
+                }
+                change_edit_content_button($message_row, message);
+            }, remaining_edit_time);
+        }
+    }
 }
 
 export function initialize(): void {