From 75096c24ac11a3209aab389aaa75fbffe66ce431 Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Thu, 3 Jul 2025 21:28:09 +0400
Subject: [PATCH] refac

---
 src/lib/components/admin/Functions.svelte      | 18 +++++++++---------
 .../chat/MessageInput/Commands/Prompts.svelte  | 15 +++++++--------
 src/lib/components/common/RichTextInput.svelte |  5 +++++
 3 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/lib/components/admin/Functions.svelte b/src/lib/components/admin/Functions.svelte
index 5e60dfc9eb..5d1e6dbb98 100644
--- a/src/lib/components/admin/Functions.svelte
+++ b/src/lib/components/admin/Functions.svelte
@@ -287,15 +287,6 @@
 				}}>{$i18n.t('All')}</button
 			>
 
-			<button
-				class="min-w-fit p-1.5 {selectedType === 'filter'
-					? ''
-					: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
-				on:click={() => {
-					selectedType = 'filter';
-				}}>{$i18n.t('Filter')}</button
-			>
-
 			<button
 				class="min-w-fit p-1.5 {selectedType === 'pipe'
 					? ''
@@ -305,6 +296,15 @@
 				}}>{$i18n.t('Pipe')}</button
 			>
 
+			<button
+				class="min-w-fit p-1.5 {selectedType === 'filter'
+					? ''
+					: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition"
+				on:click={() => {
+					selectedType = 'filter';
+				}}>{$i18n.t('Filter')}</button
+			>
+
 			<button
 				class="min-w-fit p-1.5 {selectedType === 'action'
 					? ''
diff --git a/src/lib/components/chat/MessageInput/Commands/Prompts.svelte b/src/lib/components/chat/MessageInput/Commands/Prompts.svelte
index a4a6b9237e..75eba660e0 100644
--- a/src/lib/components/chat/MessageInput/Commands/Prompts.svelte
+++ b/src/lib/components/chat/MessageInput/Commands/Prompts.svelte
@@ -175,17 +175,16 @@
 
 			if (words.length > 0) {
 				const word = words.at(0);
-				const fullPrompt = prompt;
-
-				prompt = prompt.substring(0, word?.endIndex + 1);
 				await tick();
 
-				chatInputElement.scrollTop = chatInputElement.scrollHeight;
+				if (!($settings?.richTextInput ?? true)) {
+					chatInputElement.setSelectionRange(word.startIndex, word.endIndex + 1);
+					chatInputElement.focus();
 
-				prompt = fullPrompt;
-				await tick();
-
-				chatInputElement.setSelectionRange(word?.startIndex, word.endIndex + 1);
+					// This is a workaround to ensure the cursor is placed correctly
+					// after the text is inserted, especially for multiline inputs.
+					chatInputElement.setSelectionRange(word.startIndex, word.endIndex + 1);
+				}
 			} else {
 				chatInputElement.scrollTop = chatInputElement.scrollHeight;
 			}
diff --git a/src/lib/components/common/RichTextInput.svelte b/src/lib/components/common/RichTextInput.svelte
index eb7013e5e6..5ef0a460f1 100644
--- a/src/lib/components/common/RichTextInput.svelte
+++ b/src/lib/components/common/RichTextInput.svelte
@@ -123,6 +123,11 @@
 			if (dispatch) {
 				const tr = state.tr.setSelection(TextSelection.create(doc, template.from, template.to));
 				dispatch(tr);
+
+				// Scroll to the selected template
+				dispatch(
+					tr.scrollIntoView().setMeta('preventScroll', true) // Prevent default scrolling behavior
+				);
 			}
 			return true;
 		}