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

remove mermail render cache (#11470)

Browse Source 
Co-authored-by: Gimling <huangjl@ruyi.ai>
This commit is contained in:
VoidIsVoid 2024-12-09 09:33:18 +08:00 committed by GitHub
parent 41d90c2408
commit a594e256ae
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 1 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
web/app/components/base/mermaid/index.tsx
View File

@ -1,7 +1,6 @@
import React, { useCallback, useEffect, useRef, useState } from 'react' import React, { useCallback, useEffect, useRef, useState } from 'react'
import mermaid from 'mermaid' import mermaid from 'mermaid'
import { usePrevious } from 'ahooks' import { usePrevious } from 'ahooks'
import CryptoJS from 'crypto-js'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { ExclamationTriangleIcon } from '@heroicons/react/24/outline' import { ExclamationTriangleIcon } from '@heroicons/react/24/outline'
import LoadingAnim from '@/app/components/base/chat/chat/loading-anim' import LoadingAnim from '@/app/components/base/chat/chat/loading-anim'
@ -38,7 +37,6 @@ const Flowchart = React.forwardRef((props: {
const [svgCode, setSvgCode] = useState(null) const [svgCode, setSvgCode] = useState(null)
const [look, setLook] = useState<'classic' | 'handDrawn'>('classic') const [look, setLook] = useState<'classic' | 'handDrawn'>('classic')
const chartId = useRef(`flowchart_${CryptoJS.MD5(props.PrimitiveCode).toString()}`)
const prevPrimitiveCode = usePrevious(props.PrimitiveCode) const prevPrimitiveCode = usePrevious(props.PrimitiveCode)
const [isLoading, setIsLoading] = useState(true) const [isLoading, setIsLoading] = useState(true)
const timeRef = useRef<NodeJS.Timeout>() const timeRef = useRef<NodeJS.Timeout>()
@ -51,12 +49,10 @@ const Flowchart = React.forwardRef((props: {
try { try {
if (typeof window !== 'undefined' && mermaidAPI) { if (typeof window !== 'undefined' && mermaidAPI) {
const svgGraph = await mermaidAPI.render(chartId.current, PrimitiveCode) const svgGraph = await mermaidAPI.render('flowchart', PrimitiveCode)
const base64Svg: any = await svgToBase64(svgGraph.svg) const base64Svg: any = await svgToBase64(svgGraph.svg)
setSvgCode(base64Svg) setSvgCode(base64Svg)
setIsLoading(false) setIsLoading(false)
if (chartId.current && base64Svg)
localStorage.setItem(chartId.current, base64Svg)
} }
} }
catch (error) { catch (error) {
@ -79,19 +75,11 @@ const Flowchart = React.forwardRef((props: {
}, },
}) })
localStorage.removeItem(chartId.current)
renderFlowchart(props.PrimitiveCode) renderFlowchart(props.PrimitiveCode)
} }
}, [look]) }, [look])
useEffect(() => { useEffect(() => {
const cachedSvg: any = localStorage.getItem(chartId.current)
if (cachedSvg) {
setSvgCode(cachedSvg)
setIsLoading(false)
return
}
if (timeRef.current) if (timeRef.current)
clearTimeout(timeRef.current) clearTimeout(timeRef.current)