scriptoriumadmin/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-09-11 22:52:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

enh: file nav html rendering

Browse source
This commit is contained in:
Timothy Jaeryang Baek 2026-03-02 12:45:50 -06:00
parent bec227da30
commit 3909b62ffc
2 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/lib/components/chat/FileNav.svelte
View file

@ -62,10 +62,12 @@
const MD_EXTS = new Set(['md', 'markdown', 'mdx']);
const CSV_EXTS = new Set(['csv', 'tsv']);
const HTML_EXTS = new Set(['html', 'htm']);
const getFileExt = (path: string | null) => path?.split('.').pop()?.toLowerCase() ?? '';
$: isMarkdown = MD_EXTS.has(getFileExt(selectedFile));
$: isCsv = CSV_EXTS.has(getFileExt(selectedFile));
$: isHtml = HTML_EXTS.has(getFileExt(selectedFile));
$: isTextFile = fileContent !== null && fileImageUrl === null && filePdfData === null;
// ── Upload / folder creation ─────────────────────────────────────────
@ -513,7 +515,7 @@
</button>
</Tooltip>
{/if}
{#if (isMarkdown || isCsv) && fileContent !== null && !editing}
{#if (isMarkdown || isCsv || isHtml) && fileContent !== null && !editing}
<Tooltip content={showRaw ? $i18n.t('Preview') : $i18n.t('Source')}>
<button
class="shrink-0 p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition text-gray-400 dark:text-gray-500 hover:text-gray-600 dark:hover:text-gray-400"

14
src/lib/components/chat/FileNav/FilePreview.svelte
View file

@ -3,6 +3,7 @@
import panzoom, { type PanZoom } from 'panzoom';
import { marked } from 'marked';
import DOMPurify from 'dompurify';
import { settings } from '$lib/stores';
import Spinner from '../../common/Spinner.svelte';
import PDFViewer from '../../common/PDFViewer.svelte';
@ -57,10 +58,12 @@
const MD_EXTS = new Set(['md', 'markdown', 'mdx']);
const CSV_EXTS = new Set(['csv', 'tsv']);
const HTML_EXTS = new Set(['html', 'htm']);
const getExt = (path: string | null) => path?.split('.').pop()?.toLowerCase() ?? '';
$: isMarkdown = MD_EXTS.has(getExt(selectedFile));
$: isCsv = CSV_EXTS.has(getExt(selectedFile));
$: isHtml = HTML_EXTS.has(getExt(selectedFile));
$: csvDelimiter = getExt(selectedFile) === 'tsv' ? '\t' : ',';
$: renderedHtml =
isMarkdown && fileContent
@ -166,7 +169,16 @@
{:else if filePdfData !== null}
<PDFViewer bind:this={pdfViewerRef} data={filePdfData} className="w-full h-full" />
{:else if fileContent !== null}
{#if isMarkdown && !showRaw}
{#if isHtml && !showRaw}
<iframe
srcdoc={fileContent}
sandbox="allow-scripts allow-downloads{($settings?.iframeSandboxAllowForms ?? false)
? ' allow-forms'
: ''}{($settings?.iframeSandboxAllowSameOrigin ?? false) ? ' allow-same-origin' : ''}"
class="w-full h-full border-none bg-white"
title="HTML Preview"
/>
{:else if isMarkdown && !showRaw}
<div class="prose dark:prose-invert max-w-full text-sm p-3">
{@html renderedHtml}
</div>