From ec5ded3f2a8a658f125ff037e4e932dadeeb8518 Mon Sep 17 00:00:00 2001 From: Pradyumna Sinha Date: Tue, 12 Oct 2021 04:43:19 +0530 Subject: [PATCH] message_edit: Reinit topic input box typeahead in message edit UI. This fixes an issue where the auto-complete dropdown doesn't reflect the changed stream in the message edit UI. We add an unlisten method to the typeahead library to support this reinitialization cleanly and in a way that can be readily reused in the future. Fixes #19874. --- static/js/message_edit.js | 12 ++++++++++++ static/third/bootstrap-typeahead/typeahead.js | 9 +++++++++ 2 files changed, 21 insertions(+) diff --git a/static/js/message_edit.js b/static/js/message_edit.js index 0cf31ed877..3c080bd58d 100644 --- a/static/js/message_edit.js +++ b/static/js/message_edit.js @@ -31,6 +31,7 @@ import * as rows from "./rows"; import * as settings_data from "./settings_data"; import * as stream_bar from "./stream_bar"; import * as stream_data from "./stream_data"; +import * as sub_store from "./sub_store"; import * as ui_report from "./ui_report"; import * as upload from "./upload"; @@ -585,6 +586,17 @@ function edit_message(row, raw_content) { const is_stream_edited = is_stream_editable ? new_stream_id !== original_stream_id : false; message_edit_topic_propagate.toggle(is_topic_edited || is_stream_edited); message_edit_breadcrumb_messages.toggle(is_stream_edited); + + if (is_stream_edited) { + /* Reinitialize the typeahead component with content for the new stream. */ + const new_stream_name = sub_store.get(new_stream_id).name; + message_edit_topic.data("typeahead").unlisten(); + composebox_typeahead.initialize_topic_edit_typeahead( + message_edit_topic, + new_stream_name, + true, + ); + } } if (!message.locally_echoed) { diff --git a/static/third/bootstrap-typeahead/typeahead.js b/static/third/bootstrap-typeahead/typeahead.js index 74e1f3f7ec..285430ba3b 100644 --- a/static/third/bootstrap-typeahead/typeahead.js +++ b/static/third/bootstrap-typeahead/typeahead.js @@ -330,6 +330,15 @@ .on('mouseenter', 'li', this.mouseenter.bind(this)) } + , unlisten: function () { + this.$container.remove(); + var events = ["blur", "keydown", "keyup", "keypress"]; + for (var i=0; i