enh: reply to message

src/lib/components/channel/Thread.svelte

@@ -22,11 +22,14 @@
 	let messages = null;
 	let top = false;
 
+	let messagesContainerElement = null;
+	let chatInputElement = null;
+
+	let replyToMessage = null;
+
 	let typingUsers = [];
 	let typingUsersTimeout = {};
 
-	let messagesContainerElement = null;
-
 	$: if (threadId) {
 		initHandler();
 	}
@@ -128,12 +131,15 @@
 
 		const res = await sendMessage(localStorage.token, channel.id, {
 			parent_id: threadId,
+			reply_to_id: replyToMessage?.id ?? null,
 			content: content,
 			data: data
 		}).catch((error) => {
 			toast.error(`${error}`);
 			return null;
 		});
+
+		replyToMessage = null;
 	};
 
 	const onChange = async () => {
@@ -180,9 +186,16 @@
 				<Messages
 					id={threadId}
 					{channel}
-					{messages}
 					{top}
+					{messages}
+					{replyToMessage}
 					thread={true}
+					onReply={async (message) => {
+						replyToMessage = message;
+
+						await tick();
+						chatInputElement?.focus();
+					}}
 					onLoad={async () => {
 						const newMessages = await getChannelThreadMessages(
 							localStorage.token,
@@ -207,6 +220,8 @@
 
 			<div class=" pb-[1rem] px-2.5 w-full">
 				<MessageInput
+					bind:replyToMessage
+					bind:chatInputElement
 					id={threadId}
 					disabled={!channel?.write_access}
 					placeholder={!channel?.write_access