diff --git a/src/lib/components/workspace/Knowledge/KnowledgeBase.svelte b/src/lib/components/workspace/Knowledge/KnowledgeBase.svelte
index bf3a27f880..9e6be7835b 100644
--- a/src/lib/components/workspace/Knowledge/KnowledgeBase.svelte
+++ b/src/lib/components/workspace/Knowledge/KnowledgeBase.svelte
@@ -46,6 +46,7 @@
 		testExternalKnowledgeRetrieval
 	} from '$lib/apis/knowledge';
 	import { processUrl } from '$lib/apis/retrieval';
+	import { WEBUI_API_BASE_URL } from '$lib/constants';
 
 	import { blobToFile, copyToClipboard } from '$lib/utils';
 	import { computeFileHash } from '$lib/utils/hash';
@@ -909,6 +910,10 @@
 		}
 	};
 
+	const openFileHandler = (fileId: string) => {
+		window.open(`${WEBUI_API_BASE_URL}/files/${encodeURIComponent(fileId)}/content`, '_blank');
+	};
+
 	let debounceTimeout = null;
 
 	let dragged = false;
@@ -1555,6 +1560,7 @@
 														}
 													}
 												}}
+												onOpen={(fileId) => openFileHandler(fileId)}
 												onDelete={(fileId) => {
 													selectedFileId = null;
 													selectedFile = null;
diff --git a/src/lib/components/workspace/Knowledge/KnowledgeBase/Files.svelte b/src/lib/components/workspace/Knowledge/KnowledgeBase/Files.svelte
index 680514a74c..6f74f1179e 100644
--- a/src/lib/components/workspace/Knowledge/KnowledgeBase/Files.svelte
+++ b/src/lib/components/workspace/Knowledge/KnowledgeBase/Files.svelte
@@ -11,8 +11,6 @@
 
 	import { capitalizeFirstLetter, formatFileSize } from '$lib/utils';
 
-	import { WEBUI_BASE_URL } from '$lib/constants';
-
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
 	import Dropdown from '$lib/components/common/Dropdown.svelte';
 	import DropdownMenu from '$lib/components/common/DropdownMenu.svelte';
@@ -24,25 +22,46 @@
 	import Spinner from '$lib/components/common/Spinner.svelte';
 	import DirectoryRow from './DirectoryRow.svelte';
 
+	type KnowledgeFile = {
+		id?: string;
+		tempId?: string;
+		itemId?: string;
+		name?: string;
+		status?: string;
+		meta?: {
+			name?: string;
+			size?: number;
+		};
+		updated_at?: number;
+		user?: {
+			email?: string;
+			name?: string;
+		};
+	};
+
 	export let knowledge = null;
 	export let selectedFileId = null;
-	export let files = [];
+	export let files: KnowledgeFile[] = [];
 	export let directories = [];
 
-	export let onClick = (fileId) => {};
-	export let onDelete = (fileId) => {};
-	export let onRename = (fileId: string, name: string) => {};
-	export let onNavigateDirectory = (directoryId: string) => {};
-	export let onRenameDirectory = (id: string, name: string) => {};
-	export let onDeleteDirectory = (id: string) => {};
-	export let onMoveFileToDirectory = (fileId: string, directoryId: string) => {};
-	export let onMoveDirectoryToDirectory = (dirId: string, targetDirectoryId: string) => {};
+	export let onClick: (fileId: string | undefined) => void = () => {};
+	export let onOpen: (fileId: string) => void = () => {};
+	export let onDelete: (fileId: string | undefined) => void = () => {};
+	export let onRename: (fileId: string, name: string) => void = () => {};
+	export let onNavigateDirectory: (directoryId: string) => void = () => {};
+	export let onRenameDirectory: (id: string, name: string) => void = () => {};
+	export let onDeleteDirectory: (id: string) => void = () => {};
+	export let onMoveFileToDirectory: (fileId: string, directoryId: string) => void = () => {};
+	export let onMoveDirectoryToDirectory: (
+		dirId: string,
+		targetDirectoryId: string
+	) => void = () => {};
 
 	let editingFileId: string | null = null;
 	let editName = '';
 	let editInput: HTMLInputElement;
 
-	const startRename = (file: any) => {
+	const startRename = (file: KnowledgeFile) => {
 		editingFileId = file?.id ?? file?.tempId;
 		editName = file?.name ?? file?.meta?.name ?? '';
 		setTimeout(() => editInput?.select(), 0);
@@ -58,9 +77,16 @@
 	const cancelRename = () => {
 		editingFileId = null;
 	};
+
+	const openFile = (file: KnowledgeFile) => {
+		const fileId = file?.id ?? file?.tempId;
+		if (!fileId) return;
+
+		onOpen(fileId);
+	};
 </script>
 
-<div class=" max-h-full flex flex-col w-full gap-[0.03125rem]">
+<div class=" max-h-full flex flex-col w-full gap-[0.03125rem]" role="list">
 	<!-- Directories first -->
 	{#each directories as dir (dir.id)}
 		<DirectoryRow
@@ -80,6 +106,7 @@
 			class=" flex cursor-pointer w-full px-2 bg-transparent dark:hover:bg-gray-850/50 hover:bg-white rounded-xl transition {selectedFileId
 				? ''
 				: 'hover:bg-gray-100 dark:hover:bg-gray-850'}"
+			role="listitem"
 			draggable="true"
 			on:dragstart={(e) => {
 				const fileId = file?.id ?? file?.tempId;
@@ -90,16 +117,16 @@
 		>
 			<div class="flex items-center">
 				{#if file?.status !== 'uploading'}
-					<button
-						class="p-1 rounded-full transition"
-						type="button"
-						on:click={() => {
-							let fileId = file?.id ?? file?.tempId;
-							onClick(fileId);
-						}}
-					>
-						<DocumentPage className="size-3.5" />
-					</button>
+					<Tooltip content={$i18n.t('Open file')}>
+						<button
+							class="p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-850 transition"
+							type="button"
+							aria-label={$i18n.t('Open file')}
+							on:click={() => openFile(file)}
+						>
+							<DocumentPage className="size-3.5" />
+						</button>
+					</Tooltip>
 				{:else}
 					<Spinner className="size-3.5" />
 				{/if}
@@ -140,7 +167,9 @@
 							<div class="line-clamp-1 text-xs">
 								{file?.name ?? file?.meta?.name}
 								{#if file?.meta?.size}
-									<span class="text-[0.6875rem] text-gray-500">{formatFileSize(file?.meta?.size)}</span>
+									<span class="text-[0.6875rem] text-gray-500"
+										>{formatFileSize(file?.meta?.size)}</span
+									>
 								{/if}
 							</div>
 						{/if}
@@ -199,10 +228,7 @@
 								<button
 									type="button"
 									class="select-none flex h-[1.6875rem] w-full cursor-pointer items-center gap-2 rounded-xl bg-transparent px-2 text-xs transition hover:text-gray-900 dark:hover:text-gray-100"
-									on:click={() => {
-										let fileId = file?.id ?? file?.tempId;
-										window.open(`${WEBUI_BASE_URL}/api/v1/files/${fileId}/content`, '_blank');
-									}}
+									on:click={() => openFile(file)}
 								>
 									<Download className="size-3.5" />
 									{$i18n.t('Download')}