From 13f00521225db4d41d37c901ea0a87baae64a63b Mon Sep 17 00:00:00 2001
From: Carlos Daniel Vilaseca <carlosd.vilaseca@generalsoftwareinc.com>
Date: Sun, 3 Mar 2024 17:33:01 -0500
Subject: [PATCH] rf: dom queries in UserMessage component

---
 src/lib/components/chat/Messages/UserMessage.svelte | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/chat/Messages/UserMessage.svelte b/src/lib/components/chat/Messages/UserMessage.svelte
index 6f41c5df..0a547227 100644
--- a/src/lib/components/chat/Messages/UserMessage.svelte
+++ b/src/lib/components/chat/Messages/UserMessage.svelte
@@ -20,18 +20,17 @@
 
 	let edit = false;
 	let editedContent = '';
-
+	let messageEditTextArea: HTMLTextAreaElement;
 	const editMessageHandler = async () => {
 		edit = true;
 		editedContent = message.content;
 
 		await tick();
-		const editElement = document.getElementById(`message-edit-${message.id}`);
 
-		editElement.style.height = '';
-		editElement.style.height = `${editElement.scrollHeight}px`;
+		messageEditTextArea.style.height = '';
+		messageEditTextArea.style.height = `${messageEditTextArea.scrollHeight}px`;
 
-		editElement?.focus();
+		messageEditTextArea?.focus();
 	};
 
 	const editMessageConfirmHandler = async () => {
@@ -165,10 +164,11 @@
 				<div class=" w-full">
 					<textarea
 						id="message-edit-{message.id}"
+						bind:this={messageEditTextArea}
 						class=" bg-transparent outline-none w-full resize-none"
 						bind:value={editedContent}
 						on:input={(e) => {
-							e.target.style.height = `${e.target.scrollHeight}px`;
+							messageEditTextArea.style.height = `${messageEditTextArea.scrollHeight}px`;
 						}}
 					/>