From 05ea6cf6fd54a8b4820ba686080993c30ceaa262 Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Wed, 21 Feb 2024 12:51:52 -0800
Subject: [PATCH] feat: enable title generation prompt edit

---
 src/lib/apis/ollama/index.ts                  | 14 ++++++++++--
 .../components/chat/Settings/Interface.svelte | 22 +++++++++++++++++--
 src/routes/(app)/+page.svelte                 |  2 ++
 src/routes/(app)/c/[id]/+page.svelte          |  8 ++++++-
 4 files changed, 41 insertions(+), 5 deletions(-)

diff --git a/src/lib/apis/ollama/index.ts b/src/lib/apis/ollama/index.ts
index 625019660..954956aca 100644
--- a/src/lib/apis/ollama/index.ts
+++ b/src/lib/apis/ollama/index.ts
@@ -133,9 +133,19 @@ export const getOllamaModels = async (token: string = '') => {
 	});
 };
 
-export const generateTitle = async (token: string = '', model: string, prompt: string) => {
+// TODO: migrate to backend
+export const generateTitle = async (
+	token: string = '',
+	template: string,
+	model: string,
+	prompt: string
+) => {
 	let error = null;
 
+	template = template.replace(/{{prompt}}/g, prompt);
+
+	console.log(template);
+
 	const res = await fetch(`${OLLAMA_API_BASE_URL}/generate`, {
 		method: 'POST',
 		headers: {
@@ -144,7 +154,7 @@ export const generateTitle = async (token: string = '', model: string, prompt: s
 		},
 		body: JSON.stringify({
 			model: model,
-			prompt: `Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title': ${prompt}`,
+			prompt: template,
 			stream: false
 		})
 	})
diff --git a/src/lib/components/chat/Settings/Interface.svelte b/src/lib/components/chat/Settings/Interface.svelte
index 866818ab3..f2dfac5ca 100644
--- a/src/lib/components/chat/Settings/Interface.svelte
+++ b/src/lib/components/chat/Settings/Interface.svelte
@@ -13,6 +13,7 @@
 	let responseAutoCopy = false;
 	let titleAutoGenerateModel = '';
 	let fullScreenMode = false;
+	let titleGenerationPrompt = '';
 
 	// Interface
 	let promptSuggestions = [];
@@ -56,8 +57,14 @@
 	};
 
 	const updateInterfaceHandler = async () => {
-		promptSuggestions = await setDefaultPromptSuggestions(localStorage.token, promptSuggestions);
-		await config.set(await getBackendConfig());
+		if ($user.role === 'admin') {
+			promptSuggestions = await setDefaultPromptSuggestions(localStorage.token, promptSuggestions);
+			await config.set(await getBackendConfig());
+		}
+
+		saveSettings({
+			titleGenerationPrompt: titleGenerationPrompt ? titleGenerationPrompt : undefined
+		});
 	};
 
 	onMount(async () => {
@@ -72,6 +79,9 @@
 		showUsername = settings.showUsername ?? false;
 		fullScreenMode = settings.fullScreenMode ?? false;
 		titleAutoGenerateModel = settings.titleAutoGenerateModel ?? '';
+		titleGenerationPrompt =
+			settings.titleGenerationPrompt ??
+			`Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title': {{prompt}}`;
 	});
 </script>
 
@@ -212,6 +222,14 @@
 					</svg>
 				</button>
 			</div>
+			<div class="mt-3">
+				<div class=" mb-2.5 text-sm font-medium">Title Generation Prompt</div>
+				<textarea
+					bind:value={titleGenerationPrompt}
+					class="w-full rounded p-4 text-sm dark:text-gray-300 dark:bg-gray-800 outline-none resize-none"
+					rows="3"
+				/>
+			</div>
 		</div>
 
 		{#if $user.role === 'admin'}
diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
index 1d91a6144..9783ef5df 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/(app)/+page.svelte
@@ -742,6 +742,8 @@
 		if ($settings.titleAutoGenerate ?? true) {
 			const title = await generateTitle(
 				localStorage.token,
+				$settings?.titleGenerationPrompt ??
+					"Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title': {{prompt}}",
 				$settings?.titleAutoGenerateModel ?? selectedModels[0],
 				userPrompt
 			);
diff --git a/src/routes/(app)/c/[id]/+page.svelte b/src/routes/(app)/c/[id]/+page.svelte
index b719ebf2b..d68e85822 100644
--- a/src/routes/(app)/c/[id]/+page.svelte
+++ b/src/routes/(app)/c/[id]/+page.svelte
@@ -755,7 +755,13 @@
 
 	const generateChatTitle = async (_chatId, userPrompt) => {
 		if ($settings.titleAutoGenerate ?? true) {
-			const title = await generateTitle(localStorage.token, selectedModels[0], userPrompt);
+			const title = await generateTitle(
+				localStorage.token,
+				$settings?.titleGenerationPrompt ??
+					"Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title': {{prompt}}",
+				$settings?.titleAutoGenerateModel ?? selectedModels[0],
+				userPrompt
+			);
 
 			if (title) {
 				await setChatTitle(_chatId, title);