diff --git a/src/renderer/src/assets/styles/markdown.scss b/src/renderer/src/assets/styles/markdown.scss index af007f98..7b6e0656 100644 --- a/src/renderer/src/assets/styles/markdown.scss +++ b/src/renderer/src/assets/styles/markdown.scss @@ -55,6 +55,8 @@ p { margin: 1em 0; + white-space: pre-wrap; + &:last-child { margin-bottom: 5px; } diff --git a/src/renderer/src/pages/home/Markdown/Markdown.tsx b/src/renderer/src/pages/home/Markdown/Markdown.tsx index d4bb34af..0b810c49 100644 --- a/src/renderer/src/pages/home/Markdown/Markdown.tsx +++ b/src/renderer/src/pages/home/Markdown/Markdown.tsx @@ -21,15 +21,6 @@ interface Props { message: Message } -const rehypePlugins = [rehypeRaw, rehypeMathjax] -const remarkPlugins = [remarkMath, remarkGfm] - -const components = { - code: CodeBlock, - a: Link, - img: ImagePreview -} - const Markdown: FC = ({ message }) => { const { t } = useTranslation() const { renderInputMessageAsMarkdown } = useSettings() @@ -41,6 +32,11 @@ const Markdown: FC = ({ message }) => { return escapeBrackets(content) }, [message.content, message.status, t]) + const rehypePlugins = useMemo(() => { + const hasUnsafeElements = /<(input|textarea|select)/i.test(messageContent) + return hasUnsafeElements ? [rehypeMathjax] : [rehypeRaw, rehypeMathjax] + }, [messageContent]) + if (message.role === 'user' && !renderInputMessageAsMarkdown) { return

{messageContent}

} @@ -49,8 +45,14 @@ const Markdown: FC = ({ message }) => { } + remarkPlugins={[remarkMath, remarkGfm]} + components={ + { + a: Link, + code: CodeBlock, + img: ImagePreview + } as Partial + } remarkRehypeOptions={{ footnoteLabel: t('common.footnotes'), footnoteLabelTagName: 'h4',