feat: Lazy load file content on click

This commit is contained in:
Felipe Hernandez 2025-04-18 01:40:30 +02:00
parent 3b20c57ea8
commit 0577dc2990
2 changed files with 22 additions and 8 deletions

View file

@ -9,7 +9,7 @@ from open_webui.models.knowledge import (
KnowledgeResponse,
KnowledgeUserResponse,
)
from open_webui.models.files import Files, FileModel
from open_webui.models.files import Files, FileModel, FileMetadataResponse
from open_webui.retrieval.vector.connector import VECTOR_DB_CLIENT
from open_webui.routers.retrieval import (
process_file,
@ -235,7 +235,7 @@ async def reindex_knowledge_files(request: Request, user=Depends(get_verified_us
class KnowledgeFilesResponse(KnowledgeResponse):
files: list[FileModel]
files: list[FileMetadataResponse]
@router.get("/{id}", response_model=Optional[KnowledgeFilesResponse])
@ -251,7 +251,7 @@ async def get_knowledge_by_id(id: str, user=Depends(get_verified_user)):
):
file_ids = knowledge.data.get("file_ids", []) if knowledge.data else []
files = Files.get_files_by_ids(file_ids)
files = Files.get_file_metadatas_by_ids(file_ids)
return KnowledgeFilesResponse(
**knowledge.model_dump(),

View file

@ -11,7 +11,7 @@
import { page } from '$app/stores';
import { mobile, showSidebar, knowledge as _knowledge, config, user } from '$lib/stores';
import { updateFileDataContentById, uploadFile, deleteFileById } from '$lib/apis/files';
import { updateFileDataContentById, uploadFile, deleteFileById, getFileById } from '$lib/apis/files';
import {
addFileToKnowledgeById,
getKnowledgeById,
@ -84,12 +84,12 @@
let selectedFile = null;
let selectedFileId = null;
let selectedFileContent = '';
$: if (selectedFileId) {
const file = (knowledge?.files ?? []).find((file) => file.id === selectedFileId);
if (file) {
file.data = file.data ?? { content: '' };
selectedFile = file;
handleFileClick(file);
} else {
selectedFile = null;
}
@ -450,6 +450,20 @@
}
};
const handleFileClick = async (file) => {
try {
selectedFile = file;
const response = await getFileById(localStorage.token, file.id);
if (response) {
selectedFileContent = response.data.content;
} else {
toast.error($i18n.t('No content found in file.'));
}
} catch (e) {
toast.error($i18n.t('Failed to load file content.'));
}
};
const onDragOver = (e) => {
e.preventDefault();
@ -728,7 +742,7 @@
{#key selectedFile.id}
<RichTextInput
className="input-prose-sm"
bind:value={selectedFile.data.content}
bind:value={selectedFileContent}
placeholder={$i18n.t('Add content here')}
preserveBreaks={true}
/>
@ -786,7 +800,7 @@
{#key selectedFile.id}
<RichTextInput
className="input-prose-sm"
bind:value={selectedFile.data.content}
bind:value={selectedFileContent}
placeholder={$i18n.t('Add content here')}
preserveBreaks={true}
/>