AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-14 11:05:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: markdown code lang capitalization and line number color (#1098)

Browse Source
This commit is contained in:
Joel 2023-09-04 11:31:25 +08:00 committed by GitHub
parent 6fa2454c9a
commit cc9edfffd8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
web/app/components/base/markdown.tsx
View File

@ -10,17 +10,26 @@ import type { RefObject } from 'react'
import { useEffect, useRef, useState } from 'react' import { useEffect, useRef, useState } from 'react'
import CopyBtn from '@/app/components/app/chat/copy-btn' import CopyBtn from '@/app/components/app/chat/copy-btn'
// import { copyToClipboard } from "../utils"; // Available language https://github.com/react-syntax-highlighter/react-syntax-highlighter/blob/master/AVAILABLE_LANGUAGES_HLJS.MD
// https://txtfiddle.com/~hlshwya/extract-urls-from-text const capitalizationLanguageNameMap: Record<string, string> = {
// const urlRegex = /\b((https?|ftp|file):\/\/|(www|ftp)\.)[-A-Z0-9+&@#\/%?=~_|$!:,.;]*[A-Z0-9+&@#\/%=~_|$]/ig sql: 'SQL',
javascript: 'JavaScript',
typescript: 'TypeScript',
vbscript: 'VBScript',
css: 'CSS',
html: 'HTML',
xml: 'XML',
php: 'PHP',
}
const getCorrectCapitalizationLanguageName = (language: string) => {
if (!language)
return 'Plain'
// function highlightURL(content: string) { if (language in capitalizationLanguageNameMap)
// return content.replace(urlRegex, (url) => { return capitalizationLanguageNameMap[language]
// // fix http:// in [] will be parsed to link agin
// const res = `[${url.replace('://', ':&#47;&#47;')}](${url})` return language.charAt(0).toUpperCase() + language.substring(1)
// return res }
// })
// }
export function PreCode(props: { children: any }) { export function PreCode(props: { children: any }) {
const ref = useRef<HTMLPreElement>(null) const ref = useRef<HTMLPreElement>(null)
@ -75,12 +84,7 @@ export function Markdown(props: { content: string }) {
code({ node, inline, className, children, ...props }) { code({ node, inline, className, children, ...props }) {
const match = /language-(\w+)/.exec(className || '') const match = /language-(\w+)/.exec(className || '')
const language = match?.[1] const language = match?.[1]
const languageShowName = (() => { const languageShowName = getCorrectCapitalizationLanguageName(language || '')
if (language)
return language.charAt(0).toUpperCase() + language.substring(1)
return 'Plain'
})()
return (!inline && match) return (!inline && match)
? ( ? (
<div> <div>

4
web/app/styles/markdown.scss
View File

@ -1047,3 +1047,7 @@
.markdown-body ::-webkit-calendar-picker-indicator { .markdown-body ::-webkit-calendar-picker-indicator {
filter: invert(50%); filter: invert(50%);
} }
.markdown-body .react-syntax-highlighter-line-number {
color: #D0D5DD;
}