From ff90b125eea7ea2dc581bf689d1504e4d756c1de Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Tue, 6 Aug 2024 11:43:47 +0200 Subject: [PATCH 01/11] Revert "refac" This reverts commit a140d319fe7630dd00b7f160d0ac91302043acc9. --- .../{Markdown.svelte => MarkdownTokens.svelte} | 18 ++---------------- .../chat/Messages/ResponseMessage.svelte | 11 ++++++++--- 2 files changed, 10 insertions(+), 19 deletions(-) rename src/lib/components/chat/Messages/{Markdown.svelte => MarkdownTokens.svelte} (89%) diff --git a/src/lib/components/chat/Messages/Markdown.svelte b/src/lib/components/chat/Messages/MarkdownTokens.svelte similarity index 89% rename from src/lib/components/chat/Messages/Markdown.svelte rename to src/lib/components/chat/Messages/MarkdownTokens.svelte index e43907530..fd86a586c 100644 --- a/src/lib/components/chat/Messages/Markdown.svelte +++ b/src/lib/components/chat/Messages/MarkdownTokens.svelte @@ -1,28 +1,14 @@ {#each tokens as token} diff --git a/src/lib/components/chat/Messages/MarkdownTokens.svelte b/src/lib/components/chat/Messages/MarkdownTokens.svelte index fd86a586c..a182e5cd5 100644 --- a/src/lib/components/chat/Messages/MarkdownTokens.svelte +++ b/src/lib/components/chat/Messages/MarkdownTokens.svelte @@ -1,4 +1,5 @@ -{#each tokens as token, tokenIdx} - {#if token.type === 'hr'} -
- {:else if token.type === 'heading'} +{#each tokens as token, tokenIdx (`${id}-${tokenIdx}`)} + {#if token.type === 'code'} + {#if token.lang === 'mermaid'} + 
{revertSanitizedResponseContent(token.text)}
+ {:else} + + {/if} + + {:else} - {console.log('Unknown token', token)} + {@html marked.parse(token.raw, { + ...defaults, + gfm: true, + breaks: true, + renderer + })} {/if} {/each} diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte index a0cadaf27..99c2e3f5b 100644 --- a/src/lib/components/chat/Messages/ResponseMessage.svelte +++ b/src/lib/components/chat/Messages/ResponseMessage.svelte @@ -77,9 +77,16 @@ let selectedCitation = null; - $: tokens = marked.lexer( - replaceTokens(sanitizeResponseContent(message?.content), model?.name, $user?.name) - ); + let tokens; + + $: (async () => { + if (message?.content) { + tokens = marked.lexer( + replaceTokens(sanitizeResponseContent(message?.content), model?.name, $user?.name) + ); + // console.log(message?.content, tokens); + } + })(); $: if (message) { renderStyling(); @@ -413,7 +420,7 @@ {/if}
{#if (message?.statusHistory ?? [...(message?.status ? [message?.status] : [])]).length > 0} @@ -493,14 +500,13 @@
{:else} -
+
{#if message.content === '' && !message.error} {:else if message.content && message.error !== true} - - {#key tokens} + {#key message.id} {/key} {/if} From 7cbc94592e22f77f2e18fcab35a7d980153b0381 Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Tue, 6 Aug 2024 23:48:10 +0200 Subject: [PATCH 05/11] fix: styling --- src/lib/components/chat/Messages/ResponseMessage.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte index 99c2e3f5b..924ab24c3 100644 --- a/src/lib/components/chat/Messages/ResponseMessage.svelte +++ b/src/lib/components/chat/Messages/ResponseMessage.svelte @@ -420,7 +420,7 @@ {/if}
{#if (message?.statusHistory ?? [...(message?.status ? [message?.status] : [])]).length > 0} From d19b96d0c201f43e9746a7a14ea31244c57d0382 Mon Sep 17 00:00:00 2001 From: silentoplayz <50341825+silentoplayz@users.noreply.github.com> Date: Tue, 6 Aug 2024 23:10:04 +0000 Subject: [PATCH 06/11] Update bug_report.md --- .github/ISSUE_TEMPLATE/bug_report.md | 43 ++++++++++++++-------------- 1 file changed, 22 insertions(+), 21 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index 10958583f..82783fdf3 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -8,36 +8,41 @@ assignees: '' # Bug Report -## Description +## Installation Method -**Bug Summary:** -[Provide a brief but clear summary of the bug] - -**Steps to Reproduce:** -[Outline the steps to reproduce the bug. Be as detailed as possible.] - -**Expected Behavior:** -[Describe what you expected to happen.] - -**Actual Behavior:** -[Describe what actually happened.] +[Describe the method you used to install the project, e.g., git clone, Docker, pip, etc.] ## Environment -- **Open WebUI Version:** [e.g., 0.1.120] -- **Ollama (if applicable):** [e.g., 0.1.30, 0.1.32-rc1] +- **Open WebUI Version:** [e.g., v0.3.11] +- **Ollama (if applicable):** [e.g., v0.2.0, v0.1.32-rc1] - **Operating System:** [e.g., Windows 10, macOS Big Sur, Ubuntu 20.04] - **Browser (if applicable):** [e.g., Chrome 100.0, Firefox 98.0] -## Reproduction Details - **Confirmation:** - [ ] I have read and followed all the instructions provided in the README.md. - [ ] I am on the latest version of both Open WebUI and Ollama. - [ ] I have included the browser console logs. - [ ] I have included the Docker container logs. +- [ ] I have provided the exact steps to reproduce the bug in the "Steps to Reproduce" section below. + +## Expected Behavior: +[Describe what you expected to happen.] + +## Actual Behavior: +[Describe what actually happened.] + +## Description + +**Bug Summary:** +[Provide a brief but clear summary of the bug] + +## Reproduction Details + +**Steps to Reproduce:** +[Outline the steps to reproduce the bug. Be as detailed as possible.] ## Logs and Screenshots @@ -47,13 +52,9 @@ assignees: '' **Docker Container Logs:** [Include relevant Docker container logs, if applicable] -**Screenshots (if applicable):** +**Screenshots/Screen Recordings (if applicable):** [Attach any relevant screenshots to help illustrate the issue] -## Installation Method - -[Describe the method you used to install the project, e.g., manual installation, Docker, package manager, etc.] - ## Additional Information [Include any additional details that may help in understanding and reproducing the issue. This could include specific configurations, error messages, or anything else relevant to the bug.] From e6b3de310bb3f1c55ff2c085ce24a64347787d26 Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Wed, 7 Aug 2024 01:55:37 +0200 Subject: [PATCH 07/11] refac --- .../chat/Messages/MarkdownTokens.svelte | 115 ++++++++++++++---- src/lib/components/common/Image.svelte | 23 ++-- 2 files changed, 100 insertions(+), 38 deletions(-) diff --git a/src/lib/components/chat/Messages/MarkdownTokens.svelte b/src/lib/components/chat/Messages/MarkdownTokens.svelte index a182e5cd5..b9dd6bfd4 100644 --- a/src/lib/components/chat/Messages/MarkdownTokens.svelte +++ b/src/lib/components/chat/Messages/MarkdownTokens.svelte @@ -2,14 +2,20 @@ import { marked } from 'marked'; import type { Token } from 'marked'; import { revertSanitizedResponseContent, unescapeHtml } from '$lib/utils'; - import CodeBlock from '$lib/components/chat/Messages/CodeBlock.svelte'; + import { onMount } from 'svelte'; + + import Image from '$lib/components/common/Image.svelte'; + import CodeBlock from '$lib/components/chat/Messages/CodeBlock.svelte'; + import MarkdownInlineTokens from '$lib/components/chat/Messages/MarkdownInlineTokens.svelte'; export let id: string; export let tokens: Token[]; export let top = true; + let containerElement; + const headerComponent = (depth: number) => { return 'h' + depth; }; @@ -20,8 +26,61 @@ return `${code.replaceAll('&', '&')}`; }; + let codes = []; renderer.code = (code, lang) => { - return `
${code}
`; + codes.push({ + code: code, + lang: lang + }); + codes = codes; + const codeId = `${id}-${codes.length}`; + + const interval = setInterval(() => { + if (document.getElementById(`code-${codeId}`)) { + clearInterval(interval); + + new CodeBlock({ + target: document.getElementById(`code-${codeId}`), + props: { + id: `${id}-${codes.length}`, + lang: lang, + code: revertSanitizedResponseContent(code) + }, + hydrate: true, + $$inline: true + }); + } + }, 10); + + return `
`; + }; + + let images = []; + renderer.image = (href, title, text) => { + images.push({ + href: href, + title: title, + text: text + }); + images = images; + + const imageId = `${id}-${images.length}`; + + const interval = setInterval(() => { + if (document.getElementById(`image-${imageId}`)) { + clearInterval(interval); + new Image({ + target: document.getElementById(`image-${imageId}`), + props: { + src: href, + alt: text + }, + hydrate: true + }); + } + }, 10); + + return ` diff --git a/src/lib/components/common/Image.svelte b/src/lib/components/common/Image.svelte index 76340f414..53305b836 100644 --- a/src/lib/components/common/Image.svelte +++ b/src/lib/components/common/Image.svelte @@ -13,18 +13,13 @@ let showImagePreview = false; -
- - - { - showImagePreview = true; - }} - src={_src} - {alt} - class=" rounded-lg cursor-pointer" - draggable="false" - data-cy="image" - /> -
+ + From 0d019a00c9568f2fda4b510e5e5b1fe1e6315d8b Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Wed, 7 Aug 2024 02:06:57 +0200 Subject: [PATCH 08/11] refac --- src/lib/components/chat/Messages/ResponseMessage.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte index 924ab24c3..912b3226c 100644 --- a/src/lib/components/chat/Messages/ResponseMessage.svelte +++ b/src/lib/components/chat/Messages/ResponseMessage.svelte @@ -420,7 +420,7 @@ {/if}
{#if (message?.statusHistory ?? [...(message?.status ? [message?.status] : [])]).length > 0} From d692649bac1f2562e17d9283996823bde46a797f Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Wed, 7 Aug 2024 02:11:37 +0200 Subject: [PATCH 09/11] refac --- .../chat/Messages/MarkdownTokens.svelte | 24 ++++++++++++------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/src/lib/components/chat/Messages/MarkdownTokens.svelte b/src/lib/components/chat/Messages/MarkdownTokens.svelte index b9dd6bfd4..23a4ab06c 100644 --- a/src/lib/components/chat/Messages/MarkdownTokens.svelte +++ b/src/lib/components/chat/Messages/MarkdownTokens.svelte @@ -36,11 +36,12 @@ const codeId = `${id}-${codes.length}`; const interval = setInterval(() => { - if (document.getElementById(`code-${codeId}`)) { + const codeElement = document.getElementById(`code-${codeId}`); + if (codeElement) { clearInterval(interval); new CodeBlock({ - target: document.getElementById(`code-${codeId}`), + target: codeElement, props: { id: `${id}-${codes.length}`, lang: lang, @@ -52,7 +53,7 @@ } }, 10); - return `
`; + return `
`; }; let images = []; @@ -65,22 +66,29 @@ images = images; const imageId = `${id}-${images.length}`; - const interval = setInterval(() => { - if (document.getElementById(`image-${imageId}`)) { + const imageElement = document.getElementById(`image-${imageId}`); + if (imageElement) { clearInterval(interval); + + // If the image is already loaded, don't load it again + if (imageElement.innerHTML) { + return; + } + + console.log('image', href, text); new Image({ - target: document.getElementById(`image-${imageId}`), + target: imageElement, props: { src: href, alt: text }, - hydrate: true + $$inline: true }); } }, 10); - return `
`; + return `
`; }; // Open all links in a new tab/window (from https://github.com/markedjs/marked/issues/655#issuecomment-383226346) From 5904ef86f2a9899380db3e634ac131161dc5fe28 Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Wed, 7 Aug 2024 02:18:29 +0200 Subject: [PATCH 10/11] refac --- src/lib/components/chat/Messages/MarkdownTokens.svelte | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/lib/components/chat/Messages/MarkdownTokens.svelte b/src/lib/components/chat/Messages/MarkdownTokens.svelte index 23a4ab06c..843d03a6f 100644 --- a/src/lib/components/chat/Messages/MarkdownTokens.svelte +++ b/src/lib/components/chat/Messages/MarkdownTokens.svelte @@ -39,6 +39,10 @@ const codeElement = document.getElementById(`code-${codeId}`); if (codeElement) { clearInterval(interval); + // If the code is already loaded, don't load it again + if (codeElement.innerHTML) { + return; + } new CodeBlock({ target: codeElement, From 0c231fd387cbf2379576a7aa2fa5852843f435a5 Mon Sep 17 00:00:00 2001 From: "Timothy J. Baek" Date: Wed, 7 Aug 2024 12:22:35 +0200 Subject: [PATCH 11/11] fix: styling --- src/lib/components/chat/Messages/ResponseMessage.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte index 912b3226c..fdc846205 100644 --- a/src/lib/components/chat/Messages/ResponseMessage.svelte +++ b/src/lib/components/chat/Messages/ResponseMessage.svelte @@ -420,7 +420,7 @@ {/if}
{#if (message?.statusHistory ?? [...(message?.status ? [message?.status] : [])]).length > 0}