From a50329fb97db7dac9a1e55796211eafa80626258 Mon Sep 17 00:00:00 2001
From: Florian Duros <florianduros@element.io>
Date: Fri, 7 Oct 2022 10:52:19 +0200
Subject: [PATCH] Focus and clear content after sending a message

---
 .../views/rooms/wysiwyg_composer/WysiwygComposer.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/views/rooms/wysiwyg_composer/WysiwygComposer.tsx b/src/components/views/rooms/wysiwyg_composer/WysiwygComposer.tsx
index 495f0c101e..d5a9706989 100644
--- a/src/components/views/rooms/wysiwyg_composer/WysiwygComposer.tsx
+++ b/src/components/views/rooms/wysiwyg_composer/WysiwygComposer.tsx
@@ -40,18 +40,20 @@ export function WysiwygComposer(
     const mxClient = useMatrixClientContext();
 
     const [content, setContent] = useState<string>();
-    const { ref, isWysiwygReady } = useWysiwyg({ onChange: (_content) => {
+    const { ref, isWysiwygReady, wysiwyg } = useWysiwyg({ onChange: (_content) => {
         setContent(_content);
         onChange(_content);
     } });
 
-    const memoizedSendMessage = useCallback(() => sendMessage(content, mxClient, { roomContext, ...props }),
-        [content, mxClient, roomContext, props],
-    );
+    const memoizedSendMessage = useCallback(() => {
+        sendMessage(content, mxClient, { roomContext, ...props });
+        wysiwyg.clear();
+        ref.current?.focus();
+    }, [content, mxClient, roomContext, wysiwyg, props, ref]);
 
     return (
         <>
-            <div className="mx_SendMessageComposer" style={{ minHeight: '30px' }} ref={ref} contentEditable={!disabled && isWysiwygReady} />
+            <div className="mx_SendMessageComposer" style={{ minHeight: '30px', marginBottom: '5px' }} ref={ref} contentEditable={!disabled && isWysiwygReady} />
             { children?.(memoizedSendMessage) }
         </>
     );