compose: Disable send button when upload/s are in progress.

Earlier, the send button's state was determined independently by the
message length and the upload status, and its containing `div`'s state
was separately determined on recipient change by whether the user had
permission to post in that stream, or if direct messages were allowed
in the organisation. The main problem was that as the message length
check was run on each character input, it often overrode the upload
status check.

Now for consistency, the code has been refactored to always disable the
send button by accordingly styling its containing `div`; and using the
observer pattern we update it anytime the message length, upload status,
or the recipient changes, considering **all** of them together.

(The Save button when editing a message still works like before -- only
dependent on upload status.)

Fixes: #21135.
This commit is contained in:
N-Shar-ma
2023-11-11 01:30:25 +05:30
committed by Tim Abbott
parent 6bc9092786
commit cec11be7c1
6 changed files with 65 additions and 22 deletions

View File

@@ -561,7 +561,6 @@ test_ui("test_check_overflow_text", ({mock_template}) => {
const $textarea = $("textarea#compose-textarea");
const $indicator = $("#compose-limit-indicator");
const $send_button = $("#compose-send-button");
let banner_rendered = false;
mock_template("compose_banner/compose_banner.hbs", false, (data) => {
assert.equal(data.classname, compose_banner.CLASSNAMES.message_too_long);
@@ -585,7 +584,7 @@ test_ui("test_check_overflow_text", ({mock_template}) => {
assert.equal(limit_indicator_html, "10001​/10000\n");
assert.ok($textarea.hasClass("over_limit"));
assert.ok(banner_rendered);
assert.ok($send_button.prop("disabled"));
assert.ok($(".message-send-controls").hasClass("disabled-message-send-controls"));
// Indicator should show orange colored text
banner_rendered = false;
@@ -594,7 +593,7 @@ test_ui("test_check_overflow_text", ({mock_template}) => {
assert.ok(!$indicator.hasClass("over_limit"));
assert.equal(limit_indicator_html, "9001​/10000\n");
assert.ok(!$textarea.hasClass("over_limit"));
assert.ok(!$send_button.prop("disabled"));
assert.ok(!$(".message-send-controls").hasClass("disabled-message-send-controls"));
assert.ok(!banner_rendered);
// Indicator must be empty