message_actions: Split the View source / Move message option into two menu options.

Split the View source / Move message option into two menu options that
take you to the same UI: Move message and View message source.
Previously, it was confusing to have this double option,
and hard to parse it at a glance.

-View message source uses the current icon.

-Move message uses the arrows icon from the Move topic menu option.

-New option order: (1) Move message, (2) Quote and reply or forward,
 (3) View message source.

Also remove the "Topic editing only" and "View source" text on the
bottom right of the message edit UI along with the tooltips. Only
the timer text is shown (along with tooltip) when content editing
is allowed.

static/js/message_edit.js

@@ -454,8 +454,6 @@ function edit_message($row, raw_content) {
             message_id: message.id,
             is_editable,
             is_content_editable,
-            is_widget_message: is_widget_message(message),
-            has_been_editable: editability !== editability_types.NO,
             topic: message.topic,
             content: raw_content,
             file_upload_enabled,
@@ -517,13 +515,11 @@ function edit_message($row, raw_content) {
             // in streams), then we'll need to disable
             // row.find('input.message_edit_topic') as well.
             $message_edit_content.attr("readonly", "readonly");
-            $message_edit_countdown_timer.text($t({defaultMessage: "View source"}));
             create_copy_to_clipboard_handler($row, $copy_message[0], message.id);
             break;
         case editability_types.TOPIC_ONLY:
             $message_edit_content.attr("readonly", "readonly");
             // Hint why you can edit the topic but not the message content
-            $message_edit_countdown_timer.text($t({defaultMessage: "Topic editing only"}));
             create_copy_to_clipboard_handler($row, $copy_message[0], message.id);
             break;
         case editability_types.FULL: {
@@ -547,7 +543,7 @@ function edit_message($row, raw_content) {
 
     // Add tooltip
     if (
-        editability !== editability_types.NO &&
+        editability === editability_types.FULL &&
         page_params.realm_message_content_edit_limit_seconds > 0
     ) {
         $row.find(".message-edit-timer").show();

static/js/popovers.js

@@ -469,15 +469,18 @@ export function toggle_actions_popover(element, id) {
         const editability = message_edit.get_editability(message);
         let use_edit_icon;
         let editability_menu_item;
+        let view_source_menu_item;
+
         if (editability === message_edit.editability_types.FULL) {
             use_edit_icon = true;
             editability_menu_item = $t({defaultMessage: "Edit message"});
         } else if (editability === message_edit.editability_types.TOPIC_ONLY) {
             use_edit_icon = false;
-            editability_menu_item = $t({defaultMessage: "View source / Move message"});
+            editability_menu_item = $t({defaultMessage: "Move message"});
+            view_source_menu_item = $t({defaultMessage: "View message source"});
         } else {
             use_edit_icon = false;
-            editability_menu_item = $t({defaultMessage: "View source"});
+            view_source_menu_item = $t({defaultMessage: "View message source"});
         }
 
         // Theoretically, it could be useful to offer this even for a
@@ -513,10 +516,11 @@ export function toggle_actions_popover(element, id) {
         const should_display_uncollapse =
             !message.locally_echoed && !message.is_me_message && message.collapsed;
 
-        const should_display_edit_and_view_source =
-            message.content !== "<p>(deleted)</p>" ||
+        const should_display_edit_and_move_message =
             editability === message_edit.editability_types.FULL ||
             editability === message_edit.editability_types.TOPIC_ONLY;
+        const should_display_view_source = editability !== message_edit.editability_types.FULL;
+
         const should_display_quote_and_reply =
             message.content !== "<p>(deleted)</p>" && not_spectator;
 
@@ -534,6 +538,7 @@ export function toggle_actions_popover(element, id) {
             use_edit_icon,
             editability_menu_item,
             should_display_mark_as_unread,
+            view_source_menu_item,
             should_display_collapse,
             should_display_uncollapse,
             should_display_add_reaction_option: message.sent_by_me,
@@ -544,7 +549,8 @@ export function toggle_actions_popover(element, id) {
             should_display_delete_option,
             should_display_read_receipts_option,
             should_display_reminder_option: feature_flags.reminders_in_message_action_menu,
-            should_display_edit_and_view_source,
+            should_display_edit_and_move_message,
+            should_display_view_source,
             should_display_quote_and_reply,
         };
 
@@ -1230,7 +1236,7 @@ export function register_click_handlers() {
         e.stopPropagation();
         e.preventDefault();
     });
-    $("body").on("click", ".popover_edit_message", (e) => {
+    $("body").on("click", ".popover_edit_message, .popover_view_source", (e) => {
         const message_id = $(e.currentTarget).data("message-id");
         const $row = message_lists.current.get_row(message_id);
         hide_actions_popover();

static/templates/actions_popover_content.hbs

@@ -9,10 +9,10 @@
     </li>
     {{/if}}
 
-    {{#if should_display_edit_and_view_source}}
+    {{#if should_display_edit_and_move_message}}
     <li>
         <a class="popover_edit_message" data-message-id="{{message_id}}" tabindex="0">
-            <i class="{{#if use_edit_icon}}fa fa-pencil{{else}}fa fa-file-code-o{{/if}}" aria-hidden="true"></i> {{editability_menu_item}}
+            <i class="{{#if use_edit_icon}}fa fa-pencil{{else}}fa fa-arrows{{/if}}" aria-hidden="true"></i> {{editability_menu_item}}
             <span class="hotkey-hint">(e)</span>
         </a>
     </li>
@@ -27,6 +27,14 @@
     </li>
     {{/if}}
 
+    {{#if should_display_view_source}}
+    <li>
+        <a class="popover_view_source" data-message-id="{{message_id}}" tabindex="0">
+            <i class="fa fa-file-code-o" aria-hidden="true"></i> {{view_source_menu_item}}
+        </a>
+    </li>
+    {{/if}}
+
     {{#if should_display_mark_as_unread}}
         <li>
             <a class="mark_as_unread" data-message-id="{{message_id}}">

static/templates/message_edit_form.hbs

@@ -65,12 +65,12 @@
             {{else}}
                 <button type="button" class="button small rounded message_edit_close">{{t "Close" }}</button>
             {{/if}}
-            {{#if has_been_editable}}
+            {{#if is_content_editable}}
             <div class="message-edit-timer">
                 <span class="message_edit_countdown_timer"></span>
                 <span>
                     <i id="message_edit_tooltip" class="tippy-zulip-tooltip message_edit_tooltip fa fa-question-circle" aria-hidden="true"
-                      {{#if is_widget_message}} data-tippy-content="{{#tr}}Widgets cannot be edited.{{/tr}}" {{else}} data-tippy-content="{{#tr}}This organization is configured to restrict editing of message content to {minutes_to_edit} minutes after it is sent.{{/tr}}" {{/if}}>
+                      data-tippy-content="{{#tr}}This organization is configured to restrict editing of message content to {minutes_to_edit} minutes after it is sent.{{/tr}}">
                     </i>
                 </span>
             </div>

templates/zerver/help/move-content-to-another-stream.md

@@ -47,9 +47,8 @@ destination streams.
 
 {!message-actions-menu.md!}
 
-1. Select the first option. It may be called **View source / Move message**,
-   or simply **Edit message**. If it's called **View source**, then you are not
-   allowed to edit the stream of that message.
+1. Select **Move message** or **Edit message** (only one of these options will be shown). If you do
+   not see either option, you do not have permission to move this message.
 
 1. Select the destination stream for the message from the streams dropdown list.
 

templates/zerver/help/move-content-to-another-topic.md

@@ -22,9 +22,8 @@ for the details on when topic editing is allowed.
 
 {!message-actions-menu.md!}
 
-1. Select the first option. It may be called **View source / Move message**,
-   or simply **Edit message**. If it's called **View source**, then you are not
-   allowed to edit the topic of that message.
+1. Select **Move message** or **Edit message** (only one of these options will be shown). If you do
+   not see either option, you do not have permission to move this message.
 
 1. Set the destination topic.
 

templates/zerver/help/rename-a-topic.md

@@ -36,9 +36,8 @@ for the details on when topic editing is allowed.
 
 {!message-actions-menu.md!}
 
-1. Select the first option. It may be called **View source / Move message**,
-   or simply **Edit message**. If it's called **View source**, then you are not
-   allowed to edit the topic of that message.
+1. Select **Move message** or **Edit message** (only one of these options will be shown). If you do
+   not see either option, you do not have permission to edit the topic of this message.
 
 1. Edit the topic.