github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-06-05 14:07:30 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

FIX: Add hashtag placeholder when chat message sent (#23287)

Browse Source 
This commit fixes an issue from 2ecc8291e8878e2060350e2254532ed0b2598cb1
where the user sees an ugly plain #hashtag when sending a chat
message. Now, we add a basic placeholder that looks like the
cooked hashtag with a grey square, which is then filled in
once the "sent" message bus event for the message comes back,
and we do decorateCooked on the message to fill in the proper
hashtag details.
This commit is contained in:
Martin Brennan
2023-08-30 11:31:34 +10:00
committed by GitHub
parent 875a817410
commit bbd908ae09
6 changed files with 87 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
plugins/chat/assets/javascripts/discourse/lib/transform-auto-links.js Normal file
View File

@ -0,0 +1,36 @@
import getURL from "discourse-common/lib/get-url";
import { generatePlaceholderHashtagHTML } from "discourse/lib/hashtag-autocomplete";
const domParser = new DOMParser();
export default function transformAutolinks(cooked) {
const html = domParser.parseFromString(cooked, "text/html");
transformMentions(html);
transformHashtags(html);
return html.body.innerHTML;
}
function transformMentions(html) {
(html.querySelectorAll("span.mention") || []).forEach((mentionSpan) => {
let mentionLink = document.createElement("a");
let mentionText = document.createTextNode(mentionSpan.innerText);
mentionLink.classList.add("mention");
mentionLink.appendChild(mentionText);
mentionLink.href = getURL(`/u/${mentionSpan.innerText.substring(1)}`);
mentionSpan.replaceWith(mentionLink);
});
}
function transformHashtags(html) {
(html.querySelectorAll("span.hashtag-raw") || []).forEach((hashtagSpan) => {
// Doesn't matter what "type" of hashtag we use here, it will get replaced anyway,
// this is just for the placeholder HTML.
generatePlaceholderHashtagHTML("category", hashtagSpan, {
id: -1,
text: "...",
relative_url: "/",
slug: "",
icon: "square-full",
});
});
}

20
plugins/chat/assets/javascripts/discourse/lib/transform-mentions.js
View File

@ -1,20 +0,0 @@
import getURL from "discourse-common/lib/get-url";
const domParser = new DOMParser();
export default function transformMentions(cooked) {
const html = domParser.parseFromString(cooked, "text/html");
transform(html);
return html.body.innerHTML;
}
function transform(html) {
(html.querySelectorAll("span.mention") || []).forEach((mentionSpan) => {
let mentionLink = document.createElement("a");
let mentionText = document.createTextNode(mentionSpan.innerText);
mentionLink.classList.add("mention");
mentionLink.appendChild(mentionText);
mentionLink.href = getURL(`/u/${mentionSpan.innerText.substring(1)}`);
mentionSpan.parentNode.replaceChild(mentionLink, mentionSpan);
});
}

4
plugins/chat/assets/javascripts/discourse/models/chat-message.js
View File

@ -5,7 +5,7 @@ import ChatMessageReaction from "discourse/plugins/chat/discourse/models/chat-me
import Bookmark from "discourse/models/bookmark";
import I18n from "I18n";
import { generateCookFunction } from "discourse/lib/text";
import transformMentions from "discourse/plugins/chat/discourse/lib/transform-mentions";
import transformAutolinks from "discourse/plugins/chat/discourse/lib/transform-auto-links";
import { getOwner } from "discourse-common/lib/get-owner";
import discourseLater from "discourse-common/lib/later";
@ -192,7 +192,7 @@ export default class ChatMessage {
} else {
const cookFunction = await generateCookFunction(markdownOptions);
ChatMessage.cookFunction = (raw) => {
return transformMentions(cookFunction(raw));
return transformAutolinks(cookFunction(raw));
};
this.cooked = ChatMessage.cookFunction(this.message);