mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-30 15:55:09 -05:00
54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
import { useRef, useEffect, type FC } from 'react'
|
|
// @ts-ignore
|
|
import Linkify from 'react-linkify'
|
|
import useIsMounted from '../../../shared/hooks/use-is-mounted'
|
|
import { configureMathJax } from '../../mathjax/configure'
|
|
import { loadMathJax } from '../../mathjax/load-mathjax'
|
|
|
|
const MessageContent: FC<{ content: string }> = ({ content }) => {
|
|
const root = useRef<HTMLDivElement | null>(null)
|
|
const mounted = useIsMounted()
|
|
|
|
useEffect(() => {
|
|
if (root.current) {
|
|
// adds attributes to all the links generated by <Linkify/>, required due to https://github.com/tasti/react-linkify/issues/99
|
|
for (const a of root.current.getElementsByTagName('a')) {
|
|
a.setAttribute('target', '_blank')
|
|
a.setAttribute('rel', 'noreferrer noopener')
|
|
}
|
|
|
|
// MathJax v2 typesetting
|
|
if (window.MathJax?.Hub) {
|
|
const { Hub } = window.MathJax
|
|
|
|
const timeout = setTimeout(() => {
|
|
configureMathJax()
|
|
Hub.Queue(['Typeset', Hub, root.current])
|
|
}, 0)
|
|
|
|
return () => clearTimeout(timeout)
|
|
}
|
|
|
|
// MathJax v3 typesetting
|
|
loadMathJax()
|
|
.then(MathJax => {
|
|
if (mounted.current) {
|
|
MathJax.typesetPromise([root.current]).catch((error: Error) => {
|
|
console.error(error)
|
|
})
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error(error)
|
|
})
|
|
}
|
|
}, [content, mounted])
|
|
|
|
return (
|
|
<p ref={root}>
|
|
<Linkify>{content}</Linkify>
|
|
</p>
|
|
)
|
|
}
|
|
|
|
export default MessageContent
|