UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2024-11-07 00:59:52 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

enh: render markdown user message

Browse Source
This commit is contained in:
Timothy J. Baek 2024-08-15 15:41:02 +02:00
parent 4dd404ac3b
commit dbd5b4c9f1
1 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/lib/components/chat/Messages/UserMessage.svelte
View File

@ -10,6 +10,9 @@
import { user as _user } from '$lib/stores';
import { getFileContentById } from '$lib/apis/files';
import FileItem from '$lib/components/common/FileItem.svelte';
import { marked } from 'marked';
import { processResponseContent, replaceTokens } from '$lib/utils';
import MarkdownTokens from './MarkdownTokens.svelte';
const i18n = getContext('i18n');
@ -91,7 +94,7 @@
{/if}
<div
class="prose chat-{message.role} w-full max-w-full flex flex-col justify-end dark:prose-invert prose-headings:my-0 prose-p:my-0 prose-p:-mb-4 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-img:my-0 prose-ul:-my-4 prose-ol:-my-4 prose-li:-my-3 prose-ul:-mb-6 prose-ol:-mb-6 prose-li:-mb-4 whitespace-pre-line"
class="prose chat-{message.role} w-full max-w-full dark:prose-invert prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line"
>
{#if message.files}
<div class="mt-2.5 mb-1 w-full flex flex-col justify-end overflow-x-auto gap-1 flex-wrap">
@ -162,7 +165,7 @@
</div>
{:else}
<div class="w-full">
<div class="flex {($settings?.chatBubble ?? true) ? 'justify-end' : ''} mb-2">
<div class="flex {($settings?.chatBubble ?? true) ? 'justify-end' : ''} pb-2">
<div
class="rounded-3xl {($settings?.chatBubble ?? true)
? `max-w-[90%] px-5 py-2 bg-gray-50 dark:bg-gray-850 ${
@ -170,7 +173,16 @@
}`
: ''}"
>
<pre id="user-message">{message.content}</pre>
{#if message.content}
<div class="">
{#key message.id}
<MarkdownTokens
id={message.id}
tokens={marked.lexer(processResponseContent(message?.content))}
/>
{/key}
</div>
{/if}
</div>
</div>