compose: Show warning while composing to a resolved topic.

This commit creates the function warn_if_topic_resolved that checks if
the topic to which the user is composing is resolved or not. First it
checks if the stream exists and then if the topic name starts with the
RESOLVED_TOPIC_PREFIX. If the conditions are true, a warning banner is
shown to the user.

It also shows to the user a button to unresolve the topic, if he has
the permission to do so.

Fixes #20584.

static/js/compose.js

@@ -14,6 +14,7 @@ import * as flatpickr from "./flatpickr";
 import {$t, $t_html} from "./i18n";
 import * as loading from "./loading";
 import * as markdown from "./markdown";
+import * as message_edit from "./message_edit";
 import * as notifications from "./notifications";
 import {page_params} from "./page_params";
 import * as people from "./people";
@@ -92,6 +93,7 @@ export function update_fade() {
     }
 
     const msg_type = compose_state.get_message_type();
+    compose_validate.warn_if_topic_resolved();
     compose_fade.set_focused_recipient(msg_type);
     compose_fade.update_all();
 }
@@ -447,6 +449,25 @@ export function initialize() {
         $("#compose-send-status").hide();
     });
 
+    $("#compose_resolved_topic").on("click", ".compose_unresolve_topic", (event) => {
+        event.preventDefault();
+
+        const target = $(event.target).parents(".compose_resolved_topic");
+        const stream_id = Number.parseInt(target.attr("data-stream-id"), 10);
+        const topic_name = target.attr("data-topic-name");
+
+        message_edit.with_first_message_id(stream_id, topic_name, (message_id) => {
+            message_edit.toggle_resolve_topic(message_id, topic_name);
+            compose_validate.clear_topic_resolved_warning();
+        });
+    });
+
+    $("#compose_resolved_topic").on("click", ".compose_resolved_topic_close", (event) => {
+        event.preventDefault();
+
+        compose_validate.clear_topic_resolved_warning();
+    });
+
     $("#compose_invite_users").on("click", ".compose_invite_link", (event) => {
         event.preventDefault();