From 91871077516cd571a5a4f5b24877f489f5c5ff3d Mon Sep 17 00:00:00 2001 From: Ajay Bura <32841439+ajbura@users.noreply.github.com> Date: Sun, 7 Aug 2022 14:28:49 +0530 Subject: [PATCH] Stop sending mxid in body for pills --- src/client/state/RoomsInput.js | 81 ++++++++++++++++++++++------------ 1 file changed, 53 insertions(+), 28 deletions(-) diff --git a/src/client/state/RoomsInput.js b/src/client/state/RoomsInput.js index b9215c85..6b085fb3 100644 --- a/src/client/state/RoomsInput.js +++ b/src/client/state/RoomsInput.js @@ -10,6 +10,8 @@ import cons from './cons'; import settings from './settings'; const blurhashField = 'xyz.amorgan.blurhash'; +const MXID_REGEX = /\B@\S+:\S+\.\S+[^.,:;?!\s]/g; +const SHORTCODE_REGEX = /\B:([\w-]+):\B/g; function encodeBlurhash(img) { const canvas = document.createElement('canvas'); @@ -130,10 +132,25 @@ function bindReplyToContent(roomId, reply, content) { return newContent; } -function formatAndEmojifyText(mx, roomList, roomId, text) { - const room = mx.getRoom(roomId); +function findAndReplace(text, regex, filter, replace) { + let copyText = text; + Array.from(copyText.matchAll(regex)) + .filter(filter) + .reverse() /* to replace backward to forward */ + .forEach((match) => { + const matchText = match[0]; + const tag = replace(match); + + copyText = copyText.substr(0, match.index) + + tag + + copyText.substr(match.index + matchText.length); + }); + return copyText; +} + +function formatAndEmojifyText(mx, roomList, room, text) { const { userIdsToDisplayNames } = room.currentState; - const parentIds = roomList.getAllParentSpaces(roomId); + const parentIds = roomList.getAllParentSpaces(room.roomId); const parentRooms = [...parentIds].map((id) => mx.getRoom(id)); const allEmoji = getShortcodeToEmoji(mx, [room, ...parentRooms]); @@ -144,24 +161,20 @@ function formatAndEmojifyText(mx, roomList, roomId, text) { formattedText = text; } - const MXID_REGEX = /\B@\S+:\S+\.\S+[^.,:;?!\s]/g; - Array.from(formattedText.matchAll(MXID_REGEX)) - .filter((mxidMatch) => userIdsToDisplayNames[mxidMatch[0]]) - .reverse() - .forEach((mxidMatch) => { - const tag = `${userIdsToDisplayNames[mxidMatch[0]]}`; - - formattedText = formattedText.substr(0, mxidMatch.index) - + tag - + formattedText.substr(mxidMatch.index + mxidMatch[0].length); - }); - - const SHORTCODE_REGEX = /\B:([\w-]+):\B/g; - Array.from(formattedText.matchAll(SHORTCODE_REGEX)) - .filter((shortcodeMatch) => allEmoji.has(shortcodeMatch[1])) - .reverse() /* Reversing the array ensures that indices are preserved as we start replacing */ - .forEach((shortcodeMatch) => { - const emoji = allEmoji.get(shortcodeMatch[1]); + formattedText = findAndReplace( + formattedText, + MXID_REGEX, + (match) => userIdsToDisplayNames[match[0]], + (match) => ( + `@${userIdsToDisplayNames[match[0]]}` + ), + ); + formattedText = findAndReplace( + formattedText, + SHORTCODE_REGEX, + (match) => allEmoji.has(match[1]), + (match) => { + const emoji = allEmoji.get(match[1]); let tag; if (emoji.mxc) { @@ -175,11 +188,9 @@ function formatAndEmojifyText(mx, roomList, roomId, text) { } else { tag = emoji.unicode; } - - formattedText = formattedText.substr(0, shortcodeMatch.index) - + tag - + formattedText.substr(shortcodeMatch.index + shortcodeMatch[0].length); - }); + return tag; + }, + ); return formattedText; } @@ -274,6 +285,7 @@ class RoomsInput extends EventEmitter { } async sendInput(roomId) { + const room = this.matrixClient.getRoom(roomId); const input = this.getInput(roomId); input.isSending = true; this.roomIdToInput.set(roomId, input); @@ -292,9 +304,15 @@ class RoomsInput extends EventEmitter { const formattedBody = formatAndEmojifyText( this.matrixClient, this.roomList, - roomId, + room, input.message, ); + content.body = findAndReplace( + content.body, + MXID_REGEX, + (match) => room.currentState.userIdsToDisplayNames[match[0]], + (match) => `@${room.currentState.userIdsToDisplayNames[match[0]]}`, + ); if (formattedBody !== input.message) { // Formatting was applied, and we need to switch to custom HTML content.format = 'org.matrix.custom.html'; @@ -446,6 +464,7 @@ class RoomsInput extends EventEmitter { } async sendEditedMessage(roomId, mEvent, editedBody) { + const room = this.matrixClient.getRoom(roomId); const isReply = typeof mEvent.getWireContent()['m.relates_to']?.['m.in_reply_to'] !== 'undefined'; const content = { @@ -465,9 +484,15 @@ class RoomsInput extends EventEmitter { const formattedBody = formatAndEmojifyText( this.matrixClient, this.roomList, - roomId, + room, editedBody, ); + content.body = findAndReplace( + content.body, + MXID_REGEX, + (match) => room.currentState.userIdsToDisplayNames[match[0]], + (match) => `@${room.currentState.userIdsToDisplayNames[match[0]]}`, + ); if (formattedBody !== editedBody) { content.formatted_body = ` * ${formattedBody}`; content.format = 'org.matrix.custom.html';