overleaf/services/web/frontend/js/features/chat/components/message-content.tsx
Jakob Ackermann 1213709578 Merge pull request #14980 from overleaf/jpa-debug-console
[web] migrate frontend logging to debugConsole

GitOrigin-RevId: b03ff9030b03fff059738d2270bc4b4912e79f16
2023-09-28 08:04:12 +00:00

51 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'
import { debugConsole } from '@/utils/debugging'
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(debugConsole.error)
}
})
.catch(debugConsole.error)
}
}, [content, mounted])
return (
<p ref={root}>
<Linkify>{content}</Linkify>
</p>
)
}
export default MessageContent