From b8457b0121957974ad8199c1dd3511ec08d3a97f Mon Sep 17 00:00:00 2001
From: Alun Turner <alunt@element.io>
Date: Thu, 15 Jun 2023 18:08:37 +0100
Subject: [PATCH] use the new messageContent property

---
 .../wysiwyg_composer/components/WysiwygAutocomplete.tsx  | 9 +++++++--
 .../wysiwyg_composer/components/WysiwygComposer.tsx      | 6 +++---
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/views/rooms/wysiwyg_composer/components/WysiwygAutocomplete.tsx b/src/components/views/rooms/wysiwyg_composer/components/WysiwygAutocomplete.tsx
index a5355ed6e73..9c41aed56a4 100644
--- a/src/components/views/rooms/wysiwyg_composer/components/WysiwygAutocomplete.tsx
+++ b/src/components/views/rooms/wysiwyg_composer/components/WysiwygAutocomplete.tsx
@@ -42,6 +42,11 @@ interface WysiwygAutocompleteProps {
      * a command in the autocomplete list or pressing enter on a selected item
      */
     handleCommand: FormattingFunctions["command"];
+
+    /**
+     * Handler purely for the at-room mentions special case
+     */
+    handleAtRoomMention: FormattingFunctions["mentionAtRoom"];
 }
 
 /**
@@ -53,7 +58,7 @@ interface WysiwygAutocompleteProps {
  */
 const WysiwygAutocomplete = forwardRef(
     (
-        { suggestion, handleMention, handleCommand }: WysiwygAutocompleteProps,
+        { suggestion, handleMention, handleCommand, handleAtRoomMention }: WysiwygAutocompleteProps,
         ref: ForwardedRef<Autocomplete>,
     ): JSX.Element | null => {
         const { room } = useRoomContext();
@@ -78,7 +83,7 @@ const WysiwygAutocomplete = forwardRef(
                     if (isNotUndefined(style)) {
                         attributesMap.set("style", style);
                     }
-                    handleMention("#", getMentionDisplayText(completion, client), attributesMap);
+                    handleAtRoomMention(attributesMap);
                     return;
                 }
                 case "room":
diff --git a/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx b/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
index 7a15184f673..ba0dad529b8 100644
--- a/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
+++ b/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
@@ -61,7 +61,7 @@ export const WysiwygComposer = memo(function WysiwygComposer({
     const autocompleteRef = useRef<Autocomplete | null>(null);
 
     const inputEventProcessor = useInputEventProcessor(onSend, autocompleteRef, initialContent, eventRelation);
-    const { ref, isWysiwygReady, content, actionStates, wysiwyg, suggestion, getMessageHTMLContent } = useWysiwyg({
+    const { ref, isWysiwygReady, content, actionStates, wysiwyg, suggestion, messageContent } = useWysiwyg({
         initialContent,
         inputEventProcessor,
     });
@@ -74,11 +74,10 @@ export const WysiwygComposer = memo(function WysiwygComposer({
     useSetCursorPosition(!isReady, ref);
 
     useEffect(() => {
-        const messageContent = getMessageHTMLContent();
         if (!disabled && isNotNull(messageContent)) {
             onChange(messageContent);
         }
-    }, [onChange, getMessageHTMLContent, disabled]);
+    }, [onChange, messageContent, disabled]);
 
     useEffect(() => {
         function handleClick(e: Event): void {
@@ -118,6 +117,7 @@ export const WysiwygComposer = memo(function WysiwygComposer({
                 ref={autocompleteRef}
                 suggestion={suggestion}
                 handleMention={wysiwyg.mention}
+                handleAtRoomMention={wysiwyg.mentionAtRoom}
                 handleCommand={wysiwyg.command}
             />
             <FormattingButtons composer={wysiwyg} actionStates={actionStates} />