stream_popover: Add "Rename topic" option in topic sidebar popover.

This commit adds "Rename topic" option in topic sidebar popover
which will be shown when user is only allowed to edit topics and
not streams.

Note that we still cannot show or hide the option as per the time
limit setting (since client may not have the first message of the
topic locally), so we just show or hide it as per
move_messages_within_stream_policy setting.

Fixes #19886.

web/src/click_handlers.js

@@ -286,6 +286,7 @@ export function initialize() {
         stream_popover.build_move_topic_to_stream_popover(
             message.stream_id,
             message.topic,
+            false,
             message,
         );
         e.stopPropagation();

web/src/hotkey.js

@@ -1013,7 +1013,7 @@ export function process_hotkey(e, hotkey) {
                 return false;
             }
 
-            stream_popover.build_move_topic_to_stream_popover(msg.stream_id, msg.topic, msg);
+            stream_popover.build_move_topic_to_stream_popover(msg.stream_id, msg.topic, false, msg);
             return true;
         }
         case "zoom_to_message_near": {

web/src/popover_menus.js

@@ -450,7 +450,12 @@ export function initialize() {
             });
 
             $popper.one("click", ".sidebar-popover-move-topic-messages", () => {
-                stream_popover.build_move_topic_to_stream_popover(stream_id, topic_name);
+                stream_popover.build_move_topic_to_stream_popover(stream_id, topic_name, false);
+                instance.hide();
+            });
+
+            $popper.one("click", ".sidebar-popover-rename-topic-messages", () => {
+                stream_popover.build_move_topic_to_stream_popover(stream_id, topic_name, true);
                 instance.hide();
             });
 
@@ -573,6 +578,7 @@ export function initialize() {
                 stream_popover.build_move_topic_to_stream_popover(
                     message.stream_id,
                     message.topic,
+                    false,
                     message,
                 );
                 e.preventDefault();

web/src/popover_menus_data.js

@@ -131,6 +131,7 @@ export function get_topic_popover_content_context({stream_id, topic_name, url})
     const topic_unmuted = user_topics.is_topic_unmuted(sub.stream_id, topic_name);
     const has_starred_messages = starred_messages.get_count_in_topic(sub.stream_id, topic_name) > 0;
     const can_move_topic = settings_data.user_can_move_messages_between_streams();
+    const can_rename_topic = settings_data.user_can_move_messages_to_another_topic();
     return {
         stream_name: sub.name,
         stream_id: sub.stream_id,
@@ -140,6 +141,7 @@ export function get_topic_popover_content_context({stream_id, topic_name, url})
         topic_unmuted,
         development_environment: page_params.development_environment,
         can_move_topic,
+        can_rename_topic,
         is_realm_admin: page_params.is_admin,
         topic_is_resolved: resolved_topic.is_resolved(topic_name),
         color: sub.color,

web/src/stream_popover.js

@@ -165,7 +165,12 @@ function build_stream_popover(opts) {
     show_left_sidebar_menu_icon(elt);
 }
 
-export function build_move_topic_to_stream_popover(current_stream_id, topic_name, message) {
+export function build_move_topic_to_stream_popover(
+    current_stream_id,
+    topic_name,
+    only_topic_edit,
+    message,
+) {
     const current_stream_name = stream_data.maybe_get_stream_name(current_stream_id);
     const args = {
         topic_name,
@@ -173,6 +178,7 @@ export function build_move_topic_to_stream_popover(current_stream_id, topic_name
         notify_new_thread: message_edit.notify_new_thread_default,
         notify_old_thread: message_edit.notify_old_thread_default,
         from_message_actions_popover: message !== undefined,
+        only_topic_edit,
     };
 
     // When the modal is opened for moving the whole topic from left sidebar,
@@ -184,7 +190,13 @@ export function build_move_topic_to_stream_popover(current_stream_id, topic_name
     let disable_stream_input = !settings_data.user_can_move_messages_between_streams();
     args.disable_topic_input = !settings_data.user_can_move_messages_to_another_topic();
 
-    let modal_heading = $t_html({defaultMessage: "Move topic"});
+    let modal_heading;
+    if (only_topic_edit) {
+        modal_heading = $t_html({defaultMessage: "Rename topic"});
+    } else {
+        modal_heading = $t_html({defaultMessage: "Move topic"});
+    }
+
     if (message !== undefined) {
         modal_heading = $t_html({defaultMessage: "Move messages"});
         // We disable topic input only for modal is opened from the message actions
@@ -235,7 +247,12 @@ export function build_move_topic_to_stream_popover(current_stream_id, topic_name
         const params = get_params_from_form();
 
         const {old_topic_name} = params;
-        let select_stream_id = stream_widget.value();
+        let select_stream_id;
+        if (only_topic_edit) {
+            select_stream_id = undefined;
+        } else {
+            select_stream_id = stream_widget.value();
+        }
 
         let {
             current_stream_id,
@@ -321,7 +338,25 @@ export function build_move_topic_to_stream_popover(current_stream_id, topic_name
     }
 
     function move_topic_post_render() {
+        $("#move_topic_modal .dialog_submit_button").prop("disabled", true);
+
         const $topic_input = $("#move_topic_form .inline_topic_edit");
+        composebox_typeahead.initialize_topic_edit_typeahead(
+            $topic_input,
+            current_stream_name,
+            false,
+        );
+
+        if (only_topic_edit) {
+            // Set select_stream_id to current_stream_id since we user is not allowed
+            // to edit stream in topic-edit only UI.
+            const select_stream_id = current_stream_id;
+            $topic_input.on("input", () => {
+                update_submit_button_disabled_state(select_stream_id);
+            });
+            return;
+        }
+
         $stream_header_colorblock = $("#dialog_widget_modal .topic_stream_edit_header").find(
             ".stream_header_colorblock",
         );
@@ -338,16 +373,9 @@ export function build_move_topic_to_stream_popover(current_stream_id, topic_name
         };
         stream_widget = new DropdownListWidget(opts);
 
-        composebox_typeahead.initialize_topic_edit_typeahead(
-            $topic_input,
-            current_stream_name,
-            false,
-        );
-
         stream_widget.setup();
 
         $("#select_stream_widget .dropdown-toggle").prop("disabled", disable_stream_input);
-        update_submit_button_disabled_state(stream_widget.value());
         $("#move_topic_modal .inline_topic_edit").on("input", () => {
             update_submit_button_disabled_state(stream_widget.value());
         });

web/templates/move_topic_to_stream.hbs

@@ -1,9 +1,14 @@
-{{#unless from_message_actions_popover}}
+{{#unless (or from_message_actions_popover only_topic_edit)}}
 <p>{{#tr}}Move all messages in <strong>{topic_name}</strong>{{/tr}} to:</p>
 {{/unless}}
 <form class="new-style" id="move_topic_form">
+    {{#if only_topic_edit }}
+    <p>{{t "Rename topic to:" }}</p>
+    {{else}}
     <p>{{t "Select a stream below or change topic name." }}</p>
+    {{/if}}
     <div class="topic_stream_edit_header">
+        {{#unless only_topic_edit}}
         <div class="stream_header_colorblock"></div>
         <div class="move-topic-dropdown">
             {{> settings/dropdown_list_widget
@@ -11,6 +16,7 @@
               list_placeholder=(t 'Filter streams')}}
         </div>
         <i class="fa fa-angle-right" aria-hidden="true"></i>
+        {{/unless}}
         <input name="new_topic_name" type="text" class="inline_topic_edit modal_text_input" autocomplete="off" value="{{topic_name}}" {{#if disable_topic_input}}disabled{{/if}} />
         <input name="old_topic_name" type="hidden" class="inline_topic_edit" value="{{topic_name}}" />
         <input name="current_stream_id" type="hidden" value="{{current_stream_id}}" />

web/templates/topic_sidebar_actions.hbs

@@ -76,6 +76,18 @@
             {{t "Move topic"}}
         </a>
     </li>
+    {{else if can_rename_topic}}
+    <hr />
+
+    <li>
+        <a tabindex="0" class="sidebar-popover-rename-topic-messages" data-stream-id="{{ stream_id }}" data-topic-name="{{ topic_name }}">
+            <i class="fa fa-pencil" aria-hidden="true"></i>
+            {{t "Rename topic"}}
+        </a>
+    </li>
+    {{/if}}
+
+    {{#if can_move_topic}}
     <li>
         <a tabindex="0" class="sidebar-popover-toggle-resolved" data-stream-id="{{ stream_id }}" data-topic-name="{{ topic_name }}">
             <i class="fa fa-check" aria-hidden="true"></i>