Kieran
/
snort
5
14
Fork 14
Code Issues 53 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

Cache transformed body

This commit is contained in:
Kieran 2023-01-14 18:50:24 +00:00
parent f5a5fcf22a
commit 3fd5fd8568
Signed by: Kieran
GPG Key ID: DE71CEB3925BE941
1 changed files with 20 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/element/Text.js
View File

@ -9,6 +9,7 @@ import LazyImage from "./LazyImage";
import Hashtag from "./Hashtag"; import Hashtag from "./Hashtag";
import './Text.css' import './Text.css'
import { useMemo } from "react";
function transformHttpLink(a) { function transformHttpLink(a) {
try { try {
@ -37,11 +38,11 @@ function transformHttpLink(a) {
return <a key={url} href={url} onClick={(e) => e.stopPropagation()}>{url.toString()}</a> return <a key={url} href={url} onClick={(e) => e.stopPropagation()}>{url.toString()}</a>
} }
} else if (tweetId) { } else if (tweetId) {
return ( return (
<div className="tweet" key={tweetId}> <div className="tweet" key={tweetId}>
<TwitterTweetEmbed tweetId={tweetId} /> <TwitterTweetEmbed tweetId={tweetId} />
</div> </div>
) )
} else if (youtubeId) { } else if (youtubeId) {
return ( return (
<> <>
@ -141,16 +142,16 @@ function extractHashtags(fragments) {
} }
function transformLi({ body, tags, users }) { function transformLi({ body, tags, users }) {
let fragments = transformText({ body, tags, users }) let fragments = transformText({ body, tags, users })
return <li>{fragments}</li> return <li>{fragments}</li>
} }
function transformParagraph({ body, tags, users }) { function transformParagraph({ body, tags, users }) {
const fragments = transformText({ body, tags, users }) const fragments = transformText({ body, tags, users })
if (fragments.every(f => typeof f === 'string')) { if (fragments.every(f => typeof f === 'string')) {
return <p>{fragments}</p> return <p>{fragments}</p>
} }
return <>{fragments}</> return <>{fragments}</>
} }
function transformText({ body, tags, users }) { function transformText({ body, tags, users }) {
@ -162,11 +163,13 @@ function transformText({ body, tags, users }) {
} }
export default function Text({ content, tags, users }) { export default function Text({ content, tags, users }) {
const components = { const components = useMemo(() => {
p: (props) => transformParagraph({ body: props.children, tags, users }), return {
a: (props) => transformHttpLink(props.href), p: (props) => transformParagraph({ body: props.children, tags, users }),
li: (props) => transformLi({ body: props.children, tags, users }), a: (props) => transformHttpLink(props.href),
} li: (props) => transformLi({ body: props.children, tags, users }),
};
}, [content]);
return <ReactMarkdown className="text" components={components}>{content}</ReactMarkdown> return <ReactMarkdown className="text" components={components}>{content}</ReactMarkdown>
} }