From 9ed8c141e583da44fa2926856a1865d536dd43a0 Mon Sep 17 00:00:00 2001 From: Sayan Banerjee Date: Mon, 18 Dec 2023 09:51:31 +0530 Subject: [PATCH 1/2] fix for :Text area only shows the last line of the message when switched to any other page --- .../room/composer/RoomComposer/hooks/useAutoGrow.ts | 13 ++++++------- .../views/room/composer/messageBox/MessageBox.tsx | 2 +- 2 files changed, 7 insertions(+), 8 deletions(-) diff --git a/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts b/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts index 4ce30df1bb3fc..9556239a0359c 100644 --- a/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts +++ b/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts @@ -14,7 +14,7 @@ const shadowStyleBase: CSSProperties = { export const useAutoGrow = ( ref: RefObject, - shadowRef: RefObject, + shadowRef: RefObject, hideTextArea?: boolean, ): { textAreaStyle: CSSProperties; @@ -37,8 +37,7 @@ export const useAutoGrow = ( if (!textarea) { return; } - - const handleInput = () => { + const updateTextareaSize = () => { const { value } = textarea; const { current: shadow } = shadowRef; if (!shadow) { @@ -51,11 +50,11 @@ export const useAutoGrow = ( .replace(/\n$/, '
 ') .replace(/\n/g, '
'); }; - - textarea.addEventListener('input', handleInput); + updateTextareaSize(); + textarea.addEventListener('input', updateTextareaSize); return () => { - textarea.removeEventListener('input', handleInput); - }; + textarea.removeEventListener('input', updateTextareaSize); + }; }, [ref, shadowRef]); const shadowContentSize = useContentBoxSize(shadowRef); diff --git a/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx b/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx index f7d5bfaf58e33..330fdbb8771d4 100644 --- a/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx +++ b/apps/meteor/client/views/room/composer/messageBox/MessageBox.tsx @@ -126,7 +126,7 @@ const MessageBox = ({ const textareaRef = useRef(null); const messageComposerRef = useRef(null); - const shadowRef = useRef(null); + const shadowRef = useRef(null); const storageID = `messagebox_${room._id}${tmid ? `-${tmid}` : ''}`; From f82dd662b45fdc3afecb6e1f3f8f5eb0315ee94a Mon Sep 17 00:00:00 2001 From: Sayan Banerjee Date: Sun, 31 Dec 2023 11:28:55 +0530 Subject: [PATCH 2/2] fixed linting error --- .../views/room/composer/RoomComposer/hooks/useAutoGrow.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts b/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts index 9556239a0359c..ab2df1cd46304 100644 --- a/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts +++ b/apps/meteor/client/views/room/composer/RoomComposer/hooks/useAutoGrow.ts @@ -54,7 +54,7 @@ export const useAutoGrow = ( textarea.addEventListener('input', updateTextareaSize); return () => { textarea.removeEventListener('input', updateTextareaSize); - }; + }; }, [ref, shadowRef]); const shadowContentSize = useContentBoxSize(shadowRef);