messages: Add spinner for messages sent on slow connections.

At times, it might get confusing for users who are on
slow connections if their messages has not been sent
even after 5s. Including a spinner that will only show
up after 5 seconds has elapsed will keep user informed
about their slow connection.

5s is set as minimum time because showing up a spinner
before than might be distracting for users on normal
connections.

Fixes: #19328.

web/src/echo.js

@@ -453,6 +453,17 @@ function abort_message(message) {
     }
 }
 
+export function display_slow_send_loading_spinner(message) {
+    const $row = $(`div[zid="${message.id}"]`);
+    if (message.locally_echoed && !message.failed_request) {
+        $row.find(".slow-send-spinner").removeClass("hidden");
+        // We don't need to do anything special to ensure this gets
+        // cleaned up if the message is delivered, because the
+        // message's HTML gets replaced once the message is
+        // successfully sent.
+    }
+}
+
 export function initialize() {
     function on_failed_action(selector, callback) {
         $("#main_div").on("click", selector, function (e) {