scriptoriumadmin/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-09-12 23:02:35 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

feat: use rich text editor for knowledge file editing

Browse source 
Replace the plain textarea in the knowledge base file editor drawer with the same RichTextInput (TipTap) component already used by the Add Text Content modal. This resolves an inconsistency where creating new text content offered a full WYSIWYG experience with formatting toolbar, headings, bold, lists, and code blocks, while editing existing files was limited to an unstyled textarea.

Since the RichTextInput markdown parser collapses single newlines (standard markdown behavior), file content is pre-processed on load to normalize single newlines into paragraph breaks. This ensures extracted text from PDFs, DOCXs, and other files preserves its line structure when displayed in the rich text editor. The wrapper div also retains the original aria-label for accessibility.
This commit is contained in:
DrMelone 2026-03-17 17:11:55 +01:00
parent 09cb1b3ba7
commit b65accae45
1 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/lib/components/workspace/Knowledge/KnowledgeBase.svelte
View file

@ -172,7 +172,13 @@
const fileSelectHandler = async (file) => {
try {
selectedFile = file;
selectedFileContent = selectedFile?.data?.content || '';
const rawContent = selectedFile?.data?.content || '';
// Normalize single newlines to paragraph breaks (double newlines) so the
// rich text editor's markdown parser preserves them. Without this, single
// newlines get collapsed into spaces during markdown parsing (breaks: false).
// Existing double+ newlines (paragraph breaks) are left unchanged.
selectedFileContent = rawContent.replace(/(?<!\n)\n(?!\n)/g, '\n\n');
} catch (e) {
toast.error($i18n.t('Failed to load file content.'));
}
@ -1111,7 +1117,7 @@
</div>
{#key selectedFile.id}
<div class="flex-1 overflow-y-auto px-3 py-2">
<div class="flex-1 overflow-y-auto px-3 py-2" role="textbox" aria-label={$i18n.t('File content')}>
<RichTextInput
bind:value={selectedFileContent}
placeholder={$i18n.t('Add content here')}