import ClipboardJS from "clipboard"; import $ from "jquery"; import * as resolved_topic from "../shared/js/resolved_topic"; import render_delete_message_modal from "../templates/confirm_dialog/confirm_delete_message.hbs"; import render_message_edit_form from "../templates/message_edit_form.hbs"; import render_topic_edit_form from "../templates/topic_edit_form.hbs"; import * as blueslip from "./blueslip"; import * as channel from "./channel"; import * as compose from "./compose"; import * as compose_actions from "./compose_actions"; import * as compose_ui from "./compose_ui"; import * as composebox_typeahead from "./composebox_typeahead"; import * as condense from "./condense"; import * as confirm_dialog from "./confirm_dialog"; import * as dialog_widget from "./dialog_widget"; import {DropdownListWidget} from "./dropdown_list_widget"; import * as echo from "./echo"; import * as giphy from "./giphy"; import {$t, $t_html} from "./i18n"; import * as loading from "./loading"; import * as markdown from "./markdown"; import * as message_lists from "./message_lists"; import * as message_store from "./message_store"; import * as message_viewport from "./message_viewport"; import {page_params} from "./page_params"; import * as resize from "./resize"; 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"; import * as util from "./util"; const currently_editing_messages = new Map(); let currently_deleting_messages = []; let currently_topic_editing_messages = []; const currently_echoing_messages = new Map(); // These variables are designed to preserve the user's most recent // choices when editing a group of messages, to make it convenient to // move several topics in a row with the same settings. export let notify_old_thread_default = false; export let notify_new_thread_default = true; export const editability_types = { NO: 1, NO_LONGER: 2, // Note: TOPIC_ONLY does not include stream messages with no topic sent // by someone else. You can edit the topic of such a message by editing // the topic of the whole recipient_row it appears in, but you can't // directly edit the topic of such a message. // Similar story for messages whose topic you can change only because // you are an admin. TOPIC_ONLY: 3, FULL: 4, }; export function is_topic_editable(message, edit_limit_seconds_buffer = 0) { if (!page_params.realm_allow_message_editing) { // If message editing is disabled, so is topic editing. return false; } // Organization admins and message senders can edit message topics indefinitely. if (page_params.is_admin) { return true; } if (message.sent_by_me) { return true; } if (!settings_data.user_can_edit_topic_of_any_message()) { return false; } // moderators can edit the topic if edit_topic_policy allows them to do so, // irrespective of the topic editing deadline. if (page_params.is_moderator) { return true; } // If you're using community topic editing, there's a deadline. return ( page_params.realm_community_topic_editing_limit_seconds + edit_limit_seconds_buffer + (message.timestamp - Date.now() / 1000) > 0 ); } function is_widget_message(message) { if (message.submessages && message.submessages.length !== 0) { return true; } return false; } export function get_editability(message, edit_limit_seconds_buffer = 0) { if (!message) { return editability_types.NO; } if (!is_topic_editable(message, edit_limit_seconds_buffer)) { return editability_types.NO; } if (message.failed_request) { // TODO: For completely failed requests, we should be able // to "edit" the message, but it won't really be like // other message updates. This commit changed the result // from FULL to NO, since the prior implementation was // buggy. return editability_types.NO; } // Locally echoed messages are not editable, since the message hasn't // finished being sent yet. if (message.locally_echoed) { return editability_types.NO; } if (!page_params.realm_allow_message_editing) { return editability_types.NO; } if ( page_params.realm_message_content_edit_limit_seconds === null && message.sent_by_me && !is_widget_message(message) ) { return editability_types.FULL; } if (currently_echoing_messages.has(message.id)) { return editability_types.NO; } if ( page_params.realm_message_content_edit_limit_seconds + edit_limit_seconds_buffer + (message.timestamp - Date.now() / 1000) > 0 && message.sent_by_me && !is_widget_message(message) ) { return editability_types.FULL; } // time's up! if (message.type === "stream") { return editability_types.TOPIC_ONLY; } return editability_types.NO_LONGER; } export function get_deletability(message) { if (page_params.is_admin) { return true; } if (!message.sent_by_me) { return false; } if (message.locally_echoed) { return false; } if (!settings_data.user_can_delete_own_message()) { return false; } if (page_params.realm_message_content_delete_limit_seconds === null) { // This means no time limit for message deletion. return true; } if ( page_params.realm_message_content_delete_limit_seconds + (message.timestamp - Date.now() / 1000) > 0 ) { return true; } return false; } export function stream_and_topic_exist_in_edit_history(message, stream_id, topic) { /* Checks to see if a stream_id and a topic match any historical stream_id and topic state in the message's edit history. Does not check the message's current stream_id and topic for a match to the stream_id and topic parameters. */ const narrow_dict = {stream_id, topic}; const message_dict = {stream_id: message.stream_id, topic: message.topic}; if (!message.edit_history) { // If message edit history is disabled in the organization, // the client does not have the information locally to answer // this question correctly. return false; } for (const edit_history_event of message.edit_history) { if (!edit_history_event.prev_stream && !edit_history_event.prev_topic) { // Message was not moved in this edit event. continue; } if (edit_history_event.prev_stream) { // This edit event changed the stream. We expect the // following to be true due to the invariants of the edit // history data structure: // edit_history_event.stream === message_dict.stream_id message_dict.stream_id = edit_history_event.prev_stream; } if (edit_history_event.prev_topic) { // This edit event changed the topic. We expect the // following to be true due to the invariants of the edit // history data structure: // util.lower_same(edit_history_event.topic, message_dict.topic) message_dict.topic = edit_history_event.prev_topic; } if (util.same_stream_and_topic(narrow_dict, message_dict)) { return true; } } return false; } export function update_message_topic_editing_pencil() { if (page_params.realm_allow_message_editing) { $(".on_hover_topic_edit, .always_visible_topic_edit").show(); } else { $(".on_hover_topic_edit, .always_visible_topic_edit").hide(); } } export function hide_message_edit_spinner($row) { $row.find(".loader").hide(); $row.find(".message_edit_save span").show(); $row.find(".message_edit_save").removeClass("disable-btn"); $row.find(".message_edit_cancel").removeClass("disable-btn"); } export function show_message_edit_spinner($row) { const using_dark_theme = settings_data.using_dark_theme(); loading.show_button_spinner($row.find(".loader"), using_dark_theme); $row.find(".message_edit_save span").hide(); $row.find(".message_edit_save").addClass("disable-btn"); $row.find(".message_edit_cancel").addClass("disable-btn"); } export function show_topic_edit_spinner($row) { const $spinner = $row.find(".topic_edit_spinner"); loading.make_indicator($spinner); $spinner.css({height: ""}); $(".topic_edit_save").hide(); $(".topic_edit_cancel").hide(); $(".topic_edit_spinner").show(); } export function end_if_focused_on_inline_topic_edit() { const $focused_elem = $(".topic_edit_form").find(":focus"); if ($focused_elem.length === 1) { $focused_elem.trigger("blur"); const $recipient_row = $focused_elem.closest(".recipient_row"); end_inline_topic_edit($recipient_row); } } export function end_if_focused_on_message_row_edit() { const $focused_elem = $(".message_edit").find(":focus"); if ($focused_elem.length === 1) { $focused_elem.trigger("blur"); const $row = $focused_elem.closest(".message_row"); end_message_row_edit($row); } } function handle_message_row_edit_keydown(e) { switch (e.key) { case "Enter": if ($(e.target).hasClass("message_edit_content")) { // Pressing Enter to save edits is coupled with Enter to send if (composebox_typeahead.should_enter_send(e)) { const $row = $(".message_edit_content:focus").closest(".message_row"); const $message_edit_save_button = $row.find(".message_edit_save"); if ($message_edit_save_button.prop("disabled")) { // In cases when the save button is disabled // we need to disable save on pressing Enter // Prevent default to avoid new-line on pressing // Enter inside the textarea in this case e.preventDefault(); return; } save_message_row_edit($row); e.stopPropagation(); e.preventDefault(); } else { composebox_typeahead.handle_enter($(e.target), e); return; } } else if ($(".typeahead:visible").length > 0) { // Accepting typeahead is handled by the typeahead library. return; } else if ( $(e.target).hasClass("message_edit_topic") || $(e.target).hasClass("message_edit_topic_propagate") ) { // Enter should save the topic edit, as long as it's // not being used to accept typeahead. const $row = $(e.target).closest(".message_row"); save_message_row_edit($row); e.stopPropagation(); } return; case "Escape": // Handle escape keys in the message_edit form. end_if_focused_on_message_row_edit(); e.stopPropagation(); e.preventDefault(); return; default: return; } } function handle_inline_topic_edit_keydown(e) { let $row; switch (e.key) { case "Enter": // Handle Enter key in the recipient bar/inline topic edit form if ($(".typeahead:visible").length > 0) { // Accepting typeahead should not trigger a save. e.preventDefault(); return; } $row = $(e.target).closest(".recipient_row"); save_inline_topic_edit($row); e.stopPropagation(); e.preventDefault(); return; case "Escape": // handle Esc end_if_focused_on_inline_topic_edit(); e.stopPropagation(); e.preventDefault(); return; default: return; } } function timer_text(seconds_left) { const minutes = Math.floor(seconds_left / 60); const seconds = seconds_left % 60; if (minutes >= 1) { return $t({defaultMessage: "{minutes} min to edit"}, {minutes: minutes.toString()}); } else if (seconds_left >= 10) { return $t( {defaultMessage: "{seconds} sec to edit"}, {seconds: (seconds - (seconds % 5)).toString()}, ); } return $t({defaultMessage: "{seconds} sec to edit"}, {seconds: seconds.toString()}); } function create_copy_to_clipboard_handler($row, source, message_id) { const clipboard = new ClipboardJS(source, { target: () => document.querySelector(`#edit_form_${CSS.escape(message_id)} .message_edit_content`), }); clipboard.on("success", () => { end_message_row_edit($row); $row.find(".alert-msg").text($t({defaultMessage: "Copied!"})); $row.find(".alert-msg").css("display", "block"); $row.find(".alert-msg").delay(1000).fadeOut(300); if ($(".tooltip").is(":visible")) { $(".tooltip").hide(); } }); } export function get_available_streams_for_moving_messages(current_stream_id) { return stream_data .subscribed_subs() .filter((stream) => { if (stream.id === current_stream_id) { return true; } return stream_data.can_post_messages_in_stream(stream); }) .map((stream) => ({ name: stream.name, value: stream.stream_id.toString(), })); } function edit_message($row, raw_content) { let stream_widget; $row.find(".message_reactions").hide(); condense.hide_message_expander($row); condense.hide_message_condenser($row); const content_top = $row.find(".message_top_line")[0].getBoundingClientRect().top; const message = message_lists.current.get(rows.id($row)); // We potentially got to this function by clicking a button that implied the // user would be able to edit their message. Give a little bit of buffer in // case the button has been around for a bit, e.g. we show the // edit_content_button (hovering pencil icon) as long as the user would have // been able to click it at the time the mouse entered the message_row. Also // a buffer in case their computer is slow, or stalled for a second, etc // If you change this number also change edit_limit_buffer in // zerver.actions.message_edit.check_update_message const seconds_left_buffer = 5; const editability = get_editability(message, seconds_left_buffer); const max_file_upload_size = page_params.max_file_upload_size_mib; let file_upload_enabled = false; if (max_file_upload_size > 0) { file_upload_enabled = true; } const is_stream_editable = message.is_stream && settings_data.user_can_move_messages_between_streams(); const is_editable = editability === editability_types.TOPIC_ONLY || editability === editability_types.FULL || is_stream_editable; const is_content_editable = editability === editability_types.FULL; // current message's stream has been already been added and selected in Handlebars const available_streams = is_stream_editable ? get_available_streams_for_moving_messages(message.stream_id) : null; const select_move_stream_widget_name = `select_move_stream_${message.id}`; const opts = { widget_name: select_move_stream_widget_name, data: available_streams, default_text: $t({defaultMessage: "No streams"}), include_current_item: true, value: message.stream_id, on_update: set_propagate_selector_display, }; const $form = $( render_message_edit_form({ is_stream: message.type === "stream", 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, minutes_to_edit: Math.floor(page_params.realm_message_content_edit_limit_seconds / 60), is_stream_editable, select_move_stream_widget_name, notify_new_thread: notify_new_thread_default, notify_old_thread: notify_old_thread_default, giphy_enabled: giphy.is_giphy_enabled(), max_message_length: page_params.max_message_length, }), ); const edit_obj = {$form, raw_content}; currently_editing_messages.set(message.id, edit_obj); message_lists.current.show_edit_message($row, edit_obj); $form.on("keydown", handle_message_row_edit_keydown); $form .find(".message-edit-feature-group .video_link") .toggle(compose.compute_show_video_chat_button()); upload.feature_check($(`#edit_form_${CSS.escape(rows.id($row))} .compose_upload_file`)); const $stream_header_colorblock = $row.find(".stream_header_colorblock"); const $message_edit_content = $row.find("textarea.message_edit_content"); const $message_edit_topic = $row.find("input.message_edit_topic"); const $message_edit_topic_propagate = $row.find("select.message_edit_topic_propagate"); const $message_edit_breadcrumb_messages = $row.find("div.message_edit_breadcrumb_messages"); const $message_edit_countdown_timer = $row.find(".message_edit_countdown_timer"); const $copy_message = $row.find(".copy_message"); // One might expect us to initially show the message move // propagation select UI if and only if the user has permission to // edit the topic. However, in the common case that a user sent // the message themselves and thus has permission to edit the // content, this dropdown can feel like clutter, so we don't show // it until the stream/topic has been changed in that case. // // So we show this widget initially if and only if the stream or // topic is editable, but the content is not. $message_edit_topic_propagate.toggle(is_editable && !is_content_editable); if (is_stream_editable) { stream_widget = new DropdownListWidget(opts); stream_widget.setup(); } stream_bar.decorate(message.stream, $stream_header_colorblock, false); switch (editability) { case editability_types.NO: $message_edit_content.attr("readonly", "readonly"); $message_edit_topic.attr("readonly", "readonly"); create_copy_to_clipboard_handler($row, $copy_message[0], message.id); break; case editability_types.NO_LONGER: // You can currently only reach this state in non-streams. If that // changes (e.g. if we stop allowing topics to be modified forever // 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: { $copy_message.remove(); const edit_id = `#edit_form_${CSS.escape(rows.id($row))} .message_edit_content`; const listeners = resize.watch_manual_resize(edit_id); if (listeners) { currently_editing_messages.get(rows.id($row)).listeners = listeners; } composebox_typeahead.initialize_compose_typeahead(edit_id); compose_ui.handle_keyup(null, $(edit_id).expectOne()); $(edit_id).on("keydown", function (event) { compose_ui.handle_keydown(event, $(this).expectOne()); }); $(edit_id).on("keyup", function (event) { compose_ui.handle_keyup(event, $(this).expectOne()); }); break; } } // Add tooltip if ( editability !== editability_types.NO && page_params.realm_message_content_edit_limit_seconds > 0 ) { $row.find(".message-edit-timer").show(); } // add timer if ( editability === editability_types.FULL && page_params.realm_message_content_edit_limit_seconds > 0 ) { // Give them at least 10 seconds. // If you change this number also change edit_limit_buffer in // zerver.actions.message_edit.check_update_message const min_seconds_to_edit = 10; let seconds_left = page_params.realm_message_content_edit_limit_seconds + (message.timestamp - Date.now() / 1000); seconds_left = Math.floor(Math.max(seconds_left, min_seconds_to_edit)); // I believe this needs to be defined outside the countdown_timer, since // row just refers to something like the currently selected message, and // can change out from under us const $message_edit_save = $row.find("button.message_edit_save"); // Do this right away, rather than waiting for the timer to do its first update, // since otherwise there is a noticeable lag $message_edit_countdown_timer.text(timer_text(seconds_left)); const countdown_timer = setInterval(() => { seconds_left -= 1; if (seconds_left <= 0) { clearInterval(countdown_timer); $message_edit_content.prop("readonly", "readonly"); if (message.type === "stream") { $message_edit_topic.prop("readonly", "readonly"); $message_edit_topic_propagate.hide(); $message_edit_breadcrumb_messages.hide(); } // We don't go directly to a "TOPIC_ONLY" type state (with an active Save button), // since it isn't clear what to do with the half-finished edit. It's nice to keep // the half-finished edit around so that they can copy-paste it, but we don't want // people to think "Save" will save the half-finished edit. $message_edit_save.addClass("disabled"); $message_edit_countdown_timer.text($t({defaultMessage: "Time's up!"})); } else { $message_edit_countdown_timer.text(timer_text(seconds_left)); } }, 1000); } if (!is_editable) { $row.find(".message_edit_close").trigger("focus"); } else if (message.type === "stream" && message.topic === compose.empty_topic_placeholder()) { $message_edit_topic.val(""); $message_edit_topic.trigger("focus"); } else if (editability === editability_types.TOPIC_ONLY) { $row.find(".message_edit_topic").trigger("focus"); } else { $message_edit_content.trigger("focus"); // Put cursor at end of input. const contents = $message_edit_content.val(); $message_edit_content.val(""); $message_edit_content.val(contents); } // Scroll to keep the top of the message content text in the same // place visually, adjusting for border and padding. const edit_top = $message_edit_content[0].getBoundingClientRect().top; const scroll_by = edit_top - content_top + 5 - 14; edit_obj.scrolled_by = scroll_by; message_viewport.scrollTop(message_viewport.scrollTop() + scroll_by); const original_stream_id = message.stream_id; const original_topic = message.topic; // Change the `stream_header_colorblock` when clicked on any dropdown item. function update_stream_header_colorblock() { // Stop the execution if stream_widget is undefined. if (!stream_widget) { return; } const stream_name = stream_data.maybe_get_stream_name( Number.parseInt(stream_widget.value(), 10), ); stream_bar.decorate(stream_name, $stream_header_colorblock, false); } function set_propagate_selector_display() { update_stream_header_colorblock(); const new_topic = $message_edit_topic.val(); const new_stream_id = is_stream_editable ? Number.parseInt(stream_widget.value(), 10) : null; const is_topic_edited = new_topic !== original_topic && new_topic !== ""; 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_topic_propagate.is(":visible"), ); $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) { $message_edit_topic.on("keyup", () => { set_propagate_selector_display(); }); } composebox_typeahead.initialize_topic_edit_typeahead($message_edit_topic, message.stream, true); } function start_edit_maintaining_scroll($row, content) { edit_message($row, content); const row_bottom = $row.height() + $row.offset().top; const composebox_top = $("#compose").offset().top; if (row_bottom > composebox_top) { message_viewport.scrollTop(message_viewport.scrollTop() + row_bottom - composebox_top); } } function start_edit_with_content($row, content, edit_box_open_callback) { start_edit_maintaining_scroll($row, content); if (edit_box_open_callback) { edit_box_open_callback(); } upload.setup_upload({ mode: "edit", row: rows.id($row), }); } export function start($row, edit_box_open_callback) { const message = message_lists.current.get(rows.id($row)); if (message === undefined) { blueslip.error("Couldn't find message ID for edit " + rows.id($row)); return; } if (message.raw_content) { start_edit_with_content($row, message.raw_content, edit_box_open_callback); return; } const msg_list = message_lists.current; channel.get({ url: "/json/messages/" + message.id, success(data) { if (message_lists.current === msg_list) { message.raw_content = data.raw_content; start_edit_with_content($row, message.raw_content, edit_box_open_callback); } }, }); } export function toggle_resolve_topic(message_id, old_topic_name) { let new_topic_name; if (resolved_topic.is_resolved(old_topic_name)) { new_topic_name = resolved_topic.unresolve_name(old_topic_name); } else { new_topic_name = resolved_topic.resolve_name(old_topic_name); } const request = { propagate_mode: "change_all", topic: new_topic_name, send_notification_to_old_thread: false, send_notification_to_new_thread: true, }; channel.patch({ url: "/json/messages/" + message_id, data: request, }); } export function start_inline_topic_edit($recipient_row) { const $form = $( render_topic_edit_form({ max_topic_length: page_params.max_topic_length, }), ); message_lists.current.show_edit_topic_on_recipient_row($recipient_row, $form); $form.on("keydown", handle_inline_topic_edit_keydown); $(".topic_edit_spinner").hide(); const msg_id = rows.id_for_recipient_row($recipient_row); const message = message_lists.current.get(msg_id); let topic = message.topic; if (topic === compose.empty_topic_placeholder()) { topic = ""; } const $inline_topic_edit_input = $form.find(".inline_topic_edit"); $inline_topic_edit_input.val(topic).trigger("select").trigger("focus"); composebox_typeahead.initialize_topic_edit_typeahead( $inline_topic_edit_input, message.stream, false, ); } export function is_editing(id) { return currently_editing_messages.has(id); } export function end_inline_topic_edit($row) { message_lists.current.hide_edit_topic_on_recipient_row($row); } export function end_message_row_edit($row) { const message = message_lists.current.get(rows.id($row)); if (message !== undefined && currently_editing_messages.has(message.id)) { const scroll_by = currently_editing_messages.get(message.id).scrolled_by; const original_scrollTop = message_viewport.scrollTop(); // Clean up resize event listeners const listeners = currently_editing_messages.get(message.id).listeners; const edit_box = document.querySelector( `#edit_form_${CSS.escape(message.id)} .message_edit_content`, ); if (listeners !== undefined) { // Event listeners to clean up are only set in some edit types edit_box.removeEventListener("mousedown", listeners[0]); document.body.removeEventListener("mouseup", listeners[1]); } currently_editing_messages.delete(message.id); message_lists.current.hide_edit_message($row); message_viewport.scrollTop(original_scrollTop - scroll_by); compose.abort_video_callbacks(message.id); } if ($row.find(".condensed").length !== 0) { condense.show_message_expander($row); } else { condense.show_message_condenser($row); } $row.find(".message_reactions").show(); // We have to blur out text fields, or else hotkeys.js // thinks we are still editing. $row.find(".message_edit").trigger("blur"); // We should hide the editing typeahead if it is visible $row.find("input.message_edit_topic").trigger("blur"); } export function end_message_edit(message_id) { const $row = message_lists.current.get_row(message_id); if ($row.length > 0) { end_message_row_edit($row); } else if (currently_editing_messages.has(message_id)) { // We should delete the message_id from currently_editing_messages // if it exists there but we cannot find the row. currently_editing_messages.delete(message_id); } } export function save_inline_topic_edit($row) { const msg_list = message_lists.current; let message_id = rows.id_for_recipient_row($row); const message = message_lists.current.get(message_id); const old_topic = message.topic; const new_topic = $row.find(".inline_topic_edit").val(); const topic_changed = new_topic !== old_topic && new_topic.trim() !== ""; if (!topic_changed) { // this means the inline_topic_edit was opened and submitted without // changing anything, therefore, we should just close the inline topic edit. end_inline_topic_edit($row); return; } show_topic_edit_spinner($row); if (message.locally_echoed) { if (topic_changed) { echo.edit_locally(message, {new_topic}); $row = message_lists.current.get_row(message_id); } end_inline_topic_edit($row); return; } const request = { message_id: message.id, topic: new_topic, propagate_mode: "change_later", }; channel.patch({ url: "/json/messages/" + message.id, data: request, success() { const $spinner = $row.find(".topic_edit_spinner"); loading.destroy_indicator($spinner); }, error(xhr) { const $spinner = $row.find(".topic_edit_spinner"); loading.destroy_indicator($spinner); if (msg_list === message_lists.current) { message_id = rows.id_for_recipient_row($row); const message = channel.xhr_error_message( $t({defaultMessage: "Error saving edit"}), xhr, ); $row.find(".edit_error").text(message).css("display", "inline-block"); } }, }); } export function save_message_row_edit($row) { const msg_list = message_lists.current; let message_id = rows.id($row); const message = message_lists.current.get(message_id); let changed = false; let edit_locally_echoed = false; let content_changed = false; let new_content; const old_content = message.raw_content; let topic_changed = false; let new_topic; const old_topic = message.topic; let stream_changed = false; let new_stream_id; const old_stream_id = message.stream_id; show_message_edit_spinner($row); const $edit_content_input = $row.find(".message_edit_content"); const can_edit_content = $edit_content_input.attr("readonly") !== "readonly"; if (can_edit_content) { new_content = $edit_content_input.val(); content_changed = old_content !== new_content; changed = content_changed; } const $edit_topic_input = $row.find(".message_edit_topic"); const can_edit_topic = message.is_stream && $edit_topic_input.attr("readonly") !== "readonly"; if (can_edit_topic) { new_topic = $edit_topic_input.val(); topic_changed = new_topic !== old_topic && new_topic.trim() !== ""; } const can_edit_stream = message.is_stream && settings_data.user_can_move_messages_between_streams(); if (can_edit_stream) { const $edit_stream_input = $(`#id_select_move_stream_${message_id}`); new_stream_id = Number.parseInt($edit_stream_input.data("value"), 10); stream_changed = new_stream_id !== old_stream_id; } // Editing a not-yet-acked message (because the original send attempt failed) // just results in the in-memory message being changed if (message.locally_echoed) { if (new_content !== message.raw_content || topic_changed || stream_changed) { // `edit_locally` handles the case where `new_topic/new_stream_id` is undefined echo.edit_locally(message, { raw_content: new_content, new_topic, new_stream_id, }); $row = message_lists.current.get_row(message_id); } end_message_row_edit($row); return; } const request = {message_id: message.id}; if (topic_changed || stream_changed) { const selected_topic_propagation = $row.find("select.message_edit_topic_propagate").val() || "change_later"; const send_notification_to_old_thread = $row .find(".send_notification_to_old_thread") .is(":checked"); const send_notification_to_new_thread = $row .find(".send_notification_to_new_thread") .is(":checked"); request.propagate_mode = selected_topic_propagation; request.send_notification_to_old_thread = send_notification_to_old_thread; request.send_notification_to_new_thread = send_notification_to_new_thread; notify_old_thread_default = send_notification_to_old_thread; notify_new_thread_default = send_notification_to_new_thread; changed = true; } if (topic_changed) { request.topic = new_topic; } if (stream_changed) { request.stream_id = new_stream_id; } if (content_changed) { request.content = new_content; } if (!changed) { // If they didn't change anything, just cancel it. end_message_row_edit($row); return; } if ( changed && !topic_changed && !stream_changed && !markdown.contains_backend_only_syntax(new_content) ) { // If the topic isn't changed, and the new message content // could have been locally echoed, than we can locally echo // the edit. currently_echoing_messages.set(message_id, { raw_content: new_content, orig_content: message.content, orig_raw_content: message.raw_content, // Store flags that are about user interaction with the // message so that echo.edit_locally() can restore these // flags. starred: message.starred, historical: message.historical, collapsed: message.collapsed, // These flags are rendering artifacts we'll want if the // edit fails and we need to revert to the original // rendering of the message. alerted: message.alerted, mentioned: message.mentioned, mentioned_me_directly: message.mentioned, }); edit_locally_echoed = true; // Settings these attributes causes a "SAVING" notice to // briefly appear where "EDITED" would normally appear until // the message is acknowledged by the server. message.local_edit_timestamp = Math.round(Date.now() / 1000); echo.edit_locally(message, currently_echoing_messages.get(message_id)); $row = message_lists.current.get_row(message_id); end_message_row_edit($row); } channel.patch({ url: "/json/messages/" + message.id, data: request, success() { if (edit_locally_echoed) { delete message.local_edit_timestamp; currently_echoing_messages.delete(message_id); } hide_message_edit_spinner($row); }, error(xhr) { if (msg_list === message_lists.current) { message_id = rows.id($row); if (edit_locally_echoed) { const echoed_message = message_store.get(message_id); const echo_data = currently_echoing_messages.get(message_id); delete echoed_message.local_edit_timestamp; currently_echoing_messages.delete(message_id); // Restore the original content. echo.edit_locally(echoed_message, { content: echo_data.orig_content, raw_content: echo_data.orig_raw_content, mentioned: echo_data.mentioned, mentioned_me_directly: echo_data.mentioned_me_directly, alerted: echo_data.alerted, }); $row = message_lists.current.get_row(message_id); if (!is_editing(message_id)) { // Return to the message editing open UI state with the edited content. start_edit_maintaining_scroll($row, echo_data.raw_content); } } hide_message_edit_spinner($row); const message = channel.xhr_error_message( $t({defaultMessage: "Error saving edit"}), xhr, ); $row.find(".edit_error").text(message).show(); } }, }); // The message will automatically get replaced via message_list.update_message. } export function maybe_show_edit($row, id) { if (currently_editing_messages.has(id)) { message_lists.current.show_edit_message($row, currently_editing_messages.get(id)); } } export function edit_last_sent_message() { const msg = message_lists.current.get_last_message_sent_by_me(); if (!msg) { return; } if (!msg.id) { blueslip.error("Message has invalid id in edit_last_sent_message."); return; } const msg_editability_type = get_editability(msg, 5); if (msg_editability_type !== editability_types.FULL) { return; } const $msg_row = message_lists.current.get_row(msg.id); if (!$msg_row) { // This should never happen, since we got the message above // from message_lists.current. blueslip.error("Could not find row for id " + msg.id); return; } message_lists.current.select_id(msg.id, {then_scroll: true, from_scroll: true}); // Finally do the real work! compose_actions.cancel(); start($msg_row, () => { $(".message_edit_content").trigger("focus"); }); } export function delete_message(msg_id) { const html_body = render_delete_message_modal(); function do_delete_message() { currently_deleting_messages.push(msg_id); channel.del({ url: "/json/messages/" + msg_id, success() { currently_deleting_messages = currently_deleting_messages.filter( (id) => id !== msg_id, ); dialog_widget.hide_dialog_spinner(); dialog_widget.close_modal(); }, error(xhr) { currently_deleting_messages = currently_deleting_messages.filter( (id) => id !== msg_id, ); dialog_widget.hide_dialog_spinner(); ui_report.error( $t_html({defaultMessage: "Error deleting message"}), xhr, $("#dialog_error"), ); }, }); } confirm_dialog.launch({ html_heading: $t_html({defaultMessage: "Delete message?"}), html_body, help_link: "/help/edit-or-delete-a-message#delete-a-message", on_click: do_delete_message, loading_spinner: true, }); } export function delete_topic(stream_id, topic_name) { channel.post({ url: "/json/streams/" + stream_id + "/delete_topic", data: { topic_name, }, }); } export function handle_narrow_deactivated() { for (const [idx, elem] of currently_editing_messages) { if (message_lists.current.get(idx) !== undefined) { const $row = message_lists.current.get_row(idx); message_lists.current.show_edit_message($row, elem); } } } export function move_topic_containing_message_to_stream( message_id, new_stream_id, new_topic_name, send_notification_to_new_thread, send_notification_to_old_thread, ) { function reset_modal_ui() { currently_topic_editing_messages = currently_topic_editing_messages.filter( (id) => id !== message_id, ); dialog_widget.hide_dialog_spinner(); dialog_widget.close_modal(); } if (currently_topic_editing_messages.includes(message_id)) { ui_report.client_error( $t_html({defaultMessage: "A Topic Move already in progress."}), $("#move_topic_modal #dialog_error"), ); return; } currently_topic_editing_messages.push(message_id); const request = { stream_id: new_stream_id, propagate_mode: "change_all", topic: new_topic_name, send_notification_to_old_thread, send_notification_to_new_thread, }; notify_old_thread_default = send_notification_to_old_thread; notify_new_thread_default = send_notification_to_new_thread; channel.patch({ url: "/json/messages/" + message_id, data: request, success() { // The main UI will update via receiving the event // from server_events.js. reset_modal_ui(); }, error(xhr) { reset_modal_ui(); ui_report.error( $t_html({defaultMessage: "Error moving the topic"}), xhr, $("#home-error"), 4000, ); }, }); } export function with_first_message_id(stream_id, topic_name, success_cb, error_cb) { // The API endpoint for editing messages to change their // content, topic, or stream requires a message ID. // // Because we don't have full data in the browser client, it's // possible that we might display a topic in the left sidebar // (and thus expose the UI for moving its topic to another // stream) without having a message ID that is definitely // within the topic. (The comments in stream_topic_history.js // discuss the tricky issues around message deletion that are // involved here). // // To ensure this option works reliably at a small latency // cost for a rare operation, we just ask the server for the // latest message ID in the topic. const data = { anchor: "newest", num_before: 1, num_after: 0, narrow: JSON.stringify([ {operator: "stream", operand: stream_id}, {operator: "topic", operand: topic_name}, ]), }; channel.get({ url: "/json/messages", data, success(data) { const message_id = data.messages[0].id; success_cb(message_id); }, error: error_cb, }); }