n/nyxmuks
1
0
Fork 0
forked from Mirrors/gomuks
Code Pull requests Activity

web/timeline: cache sanitized html

Browse source
This commit is contained in:
Tulir Asokan 2024-10-11 00:05:15 +03:00
parent f3bbb4c98e
commit 420a7dab4e
1 changed files with 11 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
web/src/ui/timeline/content/MessageBody.tsx
View file

@ -13,7 +13,7 @@
// //
// You should have received a copy of the GNU Affero General Public License // You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import { use } from "react" import { use, useMemo } from "react"
import sanitizeHtml from "sanitize-html" import sanitizeHtml from "sanitize-html"
import { getMediaURL } from "../../../api/media.ts" import { getMediaURL } from "../../../api/media.ts"
import { ContentURI } from "../../../api/types" import { ContentURI } from "../../../api/types"
@ -67,24 +67,26 @@ const MessageBody = ({ event }: EventContentProps) => {
if (event.type === "m.sticker") { if (event.type === "m.sticker") {
content.msgtype = "m.image" content.msgtype = "m.image"
} }
const __html = useMemo(() => {
if (content.format === "org.matrix.custom.html") {
return sanitizeHtml(content.formatted_body!, sanitizeHtmlParams)
}
return undefined
}, [content.format, content.formatted_body])
switch (content.msgtype) { switch (content.msgtype) {
case "m.text": case "m.text":
case "m.emote": case "m.emote":
case "m.notice": case "m.notice":
if (content.format === "org.matrix.custom.html") { if (__html) {
return <div className="html-body" dangerouslySetInnerHTML={{ return <div className="html-body" dangerouslySetInnerHTML={{ __html }}/>
__html: sanitizeHtml(content.formatted_body!, sanitizeHtmlParams),
}}/>
} }
return content.body return content.body
case "m.image": { case "m.image": {
const openLightbox = use(LightboxContext) const openLightbox = use(LightboxContext)
const style = calculateMediaSize(content.info?.w, content.info?.h) const style = calculateMediaSize(content.info?.w, content.info?.h)
let caption = null let caption = null
if (content.format === "org.matrix.custom.html") { if (__html) {
caption = <div className="html-body" dangerouslySetInnerHTML={{ caption = <div className="html-body" dangerouslySetInnerHTML={{ __html }}/>
__html: sanitizeHtml(content.formatted_body!, sanitizeHtmlParams),
}}/>
} else if (content.body && content.filename && content.body !== content.filename) { } else if (content.body && content.filename && content.body !== content.filename) {
caption = content.body caption = content.body
} }