tdpeuter/open-webui
tdpeuter/open-webui
1
Fork 0
forked from open-webui/open-webui
Code Issues Pull requests 1 Releases 2 Packages Activity Actions

fix: code block unmount issue

Browse source
This commit is contained in:
Timothy J. Baek 2024-01-22 04:14:07 -08:00
parent 917ab08f5c
commit 52e7684ff4
2 changed files with 330 additions and 326 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/lib/components/chat/Messages/CodeBlock.svelte
View file

@ -20,11 +20,12 @@
$: highlightedCode = code ? hljs.highlightAuto(code, hljs.getLanguage(lang)?.aliases).value : ''; $: highlightedCode = code ? hljs.highlightAuto(code, hljs.getLanguage(lang)?.aliases).value : '';
</script> </script>
<div class="mb-4"> {#if code}
<div class="mb-4">
<div <div
class="flex justify-between bg-[#202123] text-white text-xs px-4 pt-1 pb-0.5 rounded-t-lg overflow-x-auto" class="flex justify-between bg-[#202123] text-white text-xs px-4 pt-1 pb-0.5 rounded-t-lg overflow-x-auto"
> >
<div class="p-1">{lang}</div> <div class="p-1">{@html lang}</div>
<button class="copy-code-button bg-none border-none p-1" on:click={copyCode} <button class="copy-code-button bg-none border-none p-1" on:click={copyCode}
>{copied ? 'Copied' : 'Copy Code'}</button >{copied ? 'Copied' : 'Copy Code'}</button
> >
@ -33,4 +34,5 @@
<pre class=" rounded-b-lg hljs p-4 px-5 overflow-x-auto rounded-t-none"><code <pre class=" rounded-b-lg hljs p-4 px-5 overflow-x-auto rounded-t-none"><code
class="language-{lang} rounded-t-none whitespace-pre">{@html highlightedCode || code}</code class="language-{lang} rounded-t-none whitespace-pre">{@html highlightedCode || code}</code
></pre> ></pre>
</div> </div>
{/if}

8
src/lib/components/chat/Messages/ResponseMessage.svelte
View file

@ -154,7 +154,8 @@
}); });
</script> </script>
<div class=" flex w-full message-{message.id}"> {#key message.id}
<div class=" flex w-full message-{message.id}">
<ProfileImage src={modelfiles[message.model]?.imageUrl ?? '/favicon.png'} /> <ProfileImage src={modelfiles[message.model]?.imageUrl ?? '/favicon.png'} />
<div class="w-full overflow-hidden"> <div class="w-full overflow-hidden">
@ -240,9 +241,9 @@
{:else} {:else}
{#each tokens as token} {#each tokens as token}
{#if token.type === 'code'} {#if token.type === 'code'}
<!-- {token.text} -->
<CodeBlock lang={token.lang} code={token.text} /> <CodeBlock lang={token.lang} code={token.text} />
{:else} {:else}
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html marked.parse(token.raw, { {@html marked.parse(token.raw, {
...defaults, ...defaults,
gfm: true, gfm: true,
@ -501,4 +502,5 @@
</div> </div>
{/if} {/if}
</div> </div>
</div> </div>
{/key}