Emil_Shanaty/open-webui-ai4me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

enh: renderMarkdownInPreviews

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2026-02-16 01:23:56 -06:00
parent 9e85055b8b
commit c26e8110af
4 changed files with 100 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/common/FileItemModal.svelte
+43 -6
View File
@@ -6,6 +6,7 @@
import { formatFileSize, getLineCount } from '$lib/utils';
import { WEBUI_API_BASE_URL } from '$lib/constants';
import { settings } from '$lib/stores';
import { getKnowledgeById } from '$lib/apis/knowledge';
import { getFileById, getFileContentById } from '$lib/apis/files';
@@ -14,6 +15,9 @@
const i18n = getContext('i18n');
const CONTENT_PREVIEW_LIMIT = 10000;
let expandedContent = false;
import Modal from './Modal.svelte';
import XMark from '../icons/XMark.svelte';
import Switch from './Switch.svelte';
@@ -147,6 +151,7 @@
const loadContent = async () => {
selectedTab = '';
expandedContent = false;
if (item?.type === 'collection') {
loading = true;
@@ -365,13 +370,45 @@
</div>
{:else if selectedTab === ''}
{#if item?.file?.data}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-xs whitespace-pre-wrap">
{(item?.file?.data?.content ?? '').trim() || 'No content'}
</div>
{@const rawContent = (item?.file?.data?.content ?? '').trim() || 'No content'}
{@const isTruncated = ($settings?.renderMarkdownInPreviews ?? true) && rawContent.length > CONTENT_PREVIEW_LIMIT && !expandedContent}
{#if $settings?.renderMarkdownInPreviews ?? true}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-sm prose dark:prose-invert max-w-full">
<Markdown content={isTruncated ? rawContent.slice(0, CONTENT_PREVIEW_LIMIT) : rawContent} id="file-preview" />
</div>
{#if isTruncated}
<button
class="mt-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition"
on:click={() => { expandedContent = true; }}
>
{$i18n.t('Show all ({{COUNT}} characters)', { COUNT: rawContent.length.toLocaleString() })}
</button>
{/if}
{:else}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-xs whitespace-pre-wrap">
{rawContent}
</div>
{/if}
{:else if item?.content}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-xs whitespace-pre-wrap">
{(item?.content ?? '').trim() || 'No content'}
</div>
{@const rawContent = (item?.content ?? '').trim() || 'No content'}
{@const isTruncated = ($settings?.renderMarkdownInPreviews ?? true) && rawContent.length > CONTENT_PREVIEW_LIMIT && !expandedContent}
{#if $settings?.renderMarkdownInPreviews ?? true}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-sm prose dark:prose-invert max-w-full">
<Markdown content={isTruncated ? rawContent.slice(0, CONTENT_PREVIEW_LIMIT) : rawContent} id="file-preview-content" />
</div>
{#if isTruncated}
<button
class="mt-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition"
on:click={() => { expandedContent = true; }}
>
{$i18n.t('Show all ({{COUNT}} characters)', { COUNT: rawContent.length.toLocaleString() })}
</button>
{/if}
{:else}
<div class="max-h-96 overflow-scroll scrollbar-hidden text-xs whitespace-pre-wrap">
{rawContent}
</div>
{/if}
{/if}
{:else if selectedTab === 'preview'}
{#if isAudio}