message-editing: Add support for dynamic elements in edit-history.

Edit history of message was rendered directly without passing
it through rendered_markdown.js. Due to this several visual
features for dynamic elements like time, spoilers, mentions
etc were not available.

To fix above issues we pass the content of edit-history
through rendered_markdown before showing edit history modal.

Fixes: #16029.
This commit is contained in:
Purushottam Tiwari
2022-02-22 15:05:06 +05:30
committed by Tim Abbott
parent 16687d4c74
commit 3984df88bb
3 changed files with 48 additions and 21 deletions

View File

@@ -11,6 +11,7 @@ import * as message_lists from "./message_lists";
import {page_params} from "./page_params"; import {page_params} from "./page_params";
import * as people from "./people"; import * as people from "./people";
import * as popovers from "./popovers"; import * as popovers from "./popovers";
import * as rendered_markdown from "./rendered_markdown";
import * as rows from "./rows"; import * as rows from "./rows";
import * as stream_data from "./stream_data"; import * as stream_data from "./stream_data";
import * as sub_store from "./sub_store"; import * as sub_store from "./sub_store";
@@ -125,6 +126,13 @@ export function fetch_and_render_message_history(message) {
edited_messages: content_edit_history, edited_messages: content_edit_history,
}), }),
); );
// Pass the history through rendered_markdown.js
// to update dynamic_elements in the content.
$("#message-history")
.find(".rendered_markdown")
.each(function () {
rendered_markdown.update_elements($(this));
});
}, },
error(xhr) { error(xhr) {
ui_report.error( ui_report.error(

View File

@@ -869,28 +869,35 @@ export function register_click_handlers() {
} }
}); });
$("#main_div, #compose .preview_content").on("click", ".code_external_link", function (e) { $("#main_div, #preview_content, #message-history").on(
const view_in_playground_button = $(this); "click",
const codehilite_div = $(this).closest(".codehilite"); ".code_external_link",
e.stopPropagation(); function (e) {
const playground_info = realm_playground.get_playground_info_for_languages( const view_in_playground_button = $(this);
codehilite_div.data("code-language"), const codehilite_div = $(this).closest(".codehilite");
); e.stopPropagation();
// We do the code extraction here and set the target href combining the url_prefix const playground_info = realm_playground.get_playground_info_for_languages(
// and the extracted code. Depending on whether the language has multiple playground codehilite_div.data("code-language"),
// links configured, a popover is show. );
const extracted_code = codehilite_div.find("code").text(); // We do the code extraction here and set the target href combining the url_prefix
if (playground_info.length === 1) { // and the extracted code. Depending on whether the language has multiple playground
const url_prefix = playground_info[0].url_prefix; // links configured, a popover is show.
view_in_playground_button.attr("href", url_prefix + encodeURIComponent(extracted_code)); const extracted_code = codehilite_div.find("code").text();
} else { if (playground_info.length === 1) {
for (const $playground of playground_info) { const url_prefix = playground_info[0].url_prefix;
$playground.playground_url = view_in_playground_button.attr(
$playground.url_prefix + encodeURIComponent(extracted_code); "href",
url_prefix + encodeURIComponent(extracted_code),
);
} else {
for (const $playground of playground_info) {
$playground.playground_url =
$playground.url_prefix + encodeURIComponent(extracted_code);
}
toggle_playground_link_popover(this, playground_info);
} }
toggle_playground_link_popover(this, playground_info); },
} );
});
$("body").on("click", ".popover_playground_link", (e) => { $("body").on("click", ".popover_playground_link", (e) => {
hide_playground_links_popover(); hide_playground_links_popover();

View File

@@ -515,6 +515,18 @@
display: none; display: none;
} }
.message_edit_history_content .copy_codeblock {
/* Copy code block button is hidden in edit history, this is done
because of issues faced in copying code blocks in edit history
modal. This may be changed later as we decide upon a proper ux
for displaying edit-history. */
display: none;
}
.message_edit_history_content .code_external_link {
right: 5px;
}
.preview_content .code_external_link { .preview_content .code_external_link {
right: 12px; right: 12px;
} }