From 62a948bc5be6229104b4ffbe1957d43937d2188e Mon Sep 17 00:00:00 2001
From: Alun Turner <alunt@element.io>
Date: Thu, 15 Jun 2023 17:46:10 +0100
Subject: [PATCH] extract message content to variable

---
 .../wysiwyg_composer/components/WysiwygComposer.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx b/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
index c4c50b8392c..7a15184f673 100644
--- a/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
+++ b/src/components/views/rooms/wysiwyg_composer/components/WysiwygComposer.tsx
@@ -30,10 +30,11 @@ import { useRoomContext } from "../../../../../contexts/RoomContext";
 import defaultDispatcher from "../../../../../dispatcher/dispatcher";
 import { Action } from "../../../../../dispatcher/actions";
 import { parsePermalink } from "../../../../../utils/permalinks/Permalinks";
+import { isNotNull } from "../../../../../Typeguards";
 
 interface WysiwygComposerProps {
     disabled?: boolean;
-    onChange?: (content: string) => void;
+    onChange: (content: string) => void;
     onSend: () => void;
     placeholder?: string;
     initialContent?: string;
@@ -60,10 +61,11 @@ 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 } = useWysiwyg({
+    const { ref, isWysiwygReady, content, actionStates, wysiwyg, suggestion, getMessageHTMLContent } = useWysiwyg({
         initialContent,
         inputEventProcessor,
     });
+
     const { isFocused, onFocus } = useIsFocused();
 
     const isReady = isWysiwygReady && !disabled;
@@ -72,10 +74,11 @@ export const WysiwygComposer = memo(function WysiwygComposer({
     useSetCursorPosition(!isReady, ref);
 
     useEffect(() => {
-        if (!disabled && content !== null) {
-            onChange?.(content);
+        const messageContent = getMessageHTMLContent();
+        if (!disabled && isNotNull(messageContent)) {
+            onChange(messageContent);
         }
-    }, [onChange, content, disabled]);
+    }, [onChange, getMessageHTMLContent, disabled]);
 
     useEffect(() => {
         function handleClick(e: Event): void {