refac

backend/open_webui/routers/prompts.py

@@ -146,6 +146,38 @@ async def get_prompt_by_command(
     )
 
 
+############################
+# GetPromptById
+############################
+
+
+@router.get("/id/{prompt_id}", response_model=Optional[PromptAccessResponse])
+async def get_prompt_by_id(
+    prompt_id: str, user=Depends(get_verified_user), db: Session = Depends(get_session)
+):
+    prompt = Prompts.get_prompt_by_id(prompt_id, db=db)
+
+    if prompt:
+        if (
+            user.role == "admin"
+            or prompt.user_id == user.id
+            or has_access(user.id, "read", prompt.access_control, db=db)
+        ):
+            return PromptAccessResponse(
+                **prompt.model_dump(),
+                write_access=(
+                    (user.role == "admin" and BYPASS_ADMIN_ACCESS_CONTROL)
+                    or user.id == prompt.user_id
+                    or has_access(user.id, "write", prompt.access_control, db=db)
+                ),
+            )
+
+    raise HTTPException(
+        status_code=status.HTTP_404_NOT_FOUND,
+        detail=ERROR_MESSAGES.NOT_FOUND,
+    )
+
+
 ############################
 # UpdatePromptByCommand
 ############################

src/lib/apis/prompts/index.ts

@@ -171,6 +171,38 @@ export const getPromptByCommand = async (token: string, command: string) => {
 	return res;
 };
 
+export const getPromptById = async (token: string, promptId: string) => {
+	let error = null;
+
+	const res = await fetch(`${WEBUI_API_BASE_URL}/prompts/id/${promptId}`, {
+		method: 'GET',
+		headers: {
+			Accept: 'application/json',
+			'Content-Type': 'application/json',
+			authorization: `Bearer ${token}`
+		}
+	})
+		.then(async (res) => {
+			if (!res.ok) throw await res.json();
+			return res.json();
+		})
+		.then((json) => {
+			return json;
+		})
+		.catch((err) => {
+			error = err.detail;
+
+			console.error(err);
+			return null;
+		});
+
+	if (error) {
+		throw error;
+	}
+
+	return res;
+};
+
 export const updatePromptByCommand = async (token: string, prompt: PromptItem) => {
 	let error = null;
 

src/lib/components/workspace/Prompts.svelte

@@ -338,7 +338,7 @@
 				{#each filteredItems as prompt}
 					<a
 						class=" flex space-x-4 cursor-pointer text-left w-full px-3 py-2.5 dark:hover:bg-gray-850/50 hover:bg-gray-50 transition rounded-2xl"
-						href={`/workspace/prompts/edit?command=${encodeURIComponent(prompt.command)}`}
+						href={`/workspace/prompts/${prompt.id}`}
 					>
 						<div class=" flex flex-col flex-1 space-x-4 cursor-pointer w-full pl-1">
 							<div class="flex items-center justify-between w-full">

src/routes/(app)/workspace/prompts/[id]/+page.svelte

@@ -2,11 +2,11 @@
 	import { toast } from 'svelte-sonner';
 	import { goto } from '$app/navigation';
 	import { prompts } from '$lib/stores';
-	import { onMount, tick, getContext } from 'svelte';
+	import { onMount, getContext } from 'svelte';
 
 	const i18n = getContext('i18n');
 
-	import { getPromptByCommand, getPrompts, updatePromptByCommand } from '$lib/apis/prompts';
+	import { getPromptById, getPrompts, updatePromptByCommand } from '$lib/apis/prompts';
 	import { page } from '$app/stores';
 
 	import PromptEditor from '$lib/components/workspace/Prompts/PromptEditor.svelte';
@@ -14,6 +14,9 @@
 	let prompt = null;
 	let disabled = false;
 
+	// Get prompt ID from route params
+	$: promptId = $page.params.id;
+
 	const onSubmit = async (_prompt) => {
 		console.log(_prompt);
 		const updatedPrompt = await updatePromptByCommand(localStorage.token, _prompt).catch((error) => {
@@ -26,6 +29,7 @@
 			await prompts.set(await getPrompts(localStorage.token));
 			// Update local prompt state to reflect the new version
 			prompt = {
+				id: updatedPrompt.id,
 				name: updatedPrompt.name,
 				command: updatedPrompt.command,
 				content: updatedPrompt.content,
@@ -36,11 +40,10 @@
 	};
 
 	onMount(async () => {
-		const command = $page.url.searchParams.get('command');
-		if (command) {
-			const _prompt = await getPromptByCommand(
+		if (promptId) {
+			const _prompt = await getPromptById(
 				localStorage.token,
-				command.replace(/\//g, '')
+				promptId
 			).catch((error) => {
 				toast.error(`${error}`);
 				return null;
@@ -49,6 +52,7 @@
 			if (_prompt) {
 				disabled = !_prompt.write_access ?? true;
 				prompt = {
+					id: _prompt.id,
 					name: _prompt.name,
 					command: _prompt.command,
 					content: _prompt.content,