Sanitize untrusted variables from message previews before translation

Fixes https://github.com/vector-im/element-web/issues/18314

src/languageHandler.tsx

@@ -160,6 +160,17 @@ export function _t(text: string, variables?: IVariables, tags?: Tags): Translate
     }
 }
 
+/**
+ * Sanitizes unsafe text for the sanitizer, ensuring references to variables will not be considered
+ * replaceable by the translation functions.
+ * @param {string} text The text to sanitize.
+ * @returns {string} The sanitized text.
+ */
+export function sanitizeForTranslation(text: string): string {
+    // Add a non-breaking space so the regex doesn't trigger when translating.
+    return text.replace(/\$\(([^)]*)\)/g, '$\xa0($1)');
+}
+
 /*
  * Similar to _t(), except only does substitutions, and no translation
  * @param {string} text The text, e.g "click <a>here</a> now to %(foo)s".

src/stores/room-list/previews/MessageEventPreview.ts

@@ -17,7 +17,7 @@ limitations under the License.
 import { IPreview } from "./IPreview";
 import { TagID } from "../models";
 import { MatrixEvent } from "matrix-js-sdk/src/models/event";
-import { _t } from "../../../languageHandler";
+import { _t, sanitizeForTranslation } from "../../../languageHandler";
 import { getSenderName, isSelf, shouldPrefixMessagesIn } from "./utils";
 import ReplyThread from "../../../components/views/elements/ReplyThread";
 import { getHtmlText } from "../../../HtmlUtils";
@@ -58,6 +58,8 @@ export class MessageEventPreview implements IPreview {
             body = getHtmlText(body);
         }
 
+        body = sanitizeForTranslation(body);
+
         if (msgtype === 'm.emote') {
             return _t("* %(senderName)s %(emote)s", { senderName: getSenderName(event), emote: body });
         }