overleaf/services/web/frontend/js/features/chat/components/message-content.js
Miguel Serrano f9871103bf Merge pull request #3949 from overleaf/msm-reenable-eslint-const-rule
Reenable eslint `prefer-const` rule

GitOrigin-RevId: 4f3825be8b8dff381095209085a36eaab76260d5
2021-05-06 02:09:14 +00:00

52 lines
1.4 KiB
JavaScript

import React, { useRef, useEffect } from 'react'
import PropTypes from 'prop-types'
import Linkify from 'react-linkify'
function MessageContent({ content }) {
const root = useRef(null)
useEffect(() => {
if (!(window.MathJax && window.MathJax.Hub)) {
return
}
const MJHub = window.MathJax.Hub
const inlineMathConfig = MJHub.config && MJHub.config.tex2jax.inlineMath
const alreadyConfigured = inlineMathConfig.some(
c => c[0] === '$' && c[1] === '$'
)
if (!alreadyConfigured) {
MJHub.Config({
tex2jax: {
inlineMath: inlineMathConfig.concat([['$', '$']]),
},
})
}
}, [])
useEffect(() => {
// 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 typesetting
const MJHub = window.MathJax.Hub
const timeoutHandler = setTimeout(() => {
MJHub.Queue(['Typeset', MJHub, root.current])
}, 0)
return () => clearTimeout(timeoutHandler)
}, [content])
return (
<p ref={root}>
<Linkify>{content}</Linkify>
</p>
)
}
MessageContent.propTypes = {
content: PropTypes.string.isRequired,
}
export default MessageContent