diff options
Diffstat (limited to 'src/lib/Markdown')
| -rw-r--r-- | src/lib/Markdown/Markdown.tsx | 41 | 
1 files changed, 26 insertions, 15 deletions
| diff --git a/src/lib/Markdown/Markdown.tsx b/src/lib/Markdown/Markdown.tsx index 4fa6a9a..32732ec 100644 --- a/src/lib/Markdown/Markdown.tsx +++ b/src/lib/Markdown/Markdown.tsx @@ -10,7 +10,7 @@ import Heading from './Heading';  import Image from './Image';  interface PropTypes { -  data?: string; +  source?: string;    url?: string;    // eslint-disable-next-line @typescript-eslint/no-explicit-any    context?: Record<string, any>; @@ -24,33 +24,44 @@ const resolveUrls = (line: string, baseUrl: string): string => line.replace(    (match, text, url) => `[${text}](${baseUrl}/${url})`,  ); +// eslint-disable-next-line @typescript-eslint/no-explicit-any +const WrappedInlineCode = (context: Record<string, any>): React.FC => ({ children }) => { +  if (typeof children === 'string' && children?.startsWith('$')) { +    const symbol = children.slice(1); +    return context[symbol] || null; +  } +  return <InlineCode>{children}</InlineCode>; +}; + +const Markdown: React.FC<PropTypes> = ({ +  children, +  url, +  source, +  context = {}, +}) => { +  const [markdown, setMarkdown] = useState<string>(source || ''); -const Markdown: React.FC<PropTypes> = ({ data, url, context = {} }) => { -  const [markdown, setMarkdown] = useState<string>(data || ''); +  useEffect(() => { +    if (url) axios.get(url).then(response => setMarkdown(response.data)); +  }, [url]); -  if (url) axios.get(url).then(response => setMarkdown(response.data)); +  useEffect(() => { +    if (source) setMarkdown(source); +  }, [source]);    useEffect(() => { -    if (!url) setMarkdown(data || ''); -  }, [data, url]); +    if (children && typeof children === 'string') setMarkdown(children); +  }, [children]);    const baseUrl = url?.slice(0, url.lastIndexOf('/')) || '';    const sanitized = resolveUrls(markdown, baseUrl); -  const WrappedInlineCode: React.FC = ({ children }) => { -    if (typeof children === 'string' && children?.startsWith('$')) { -      const symbol = children.slice(1); -      return context[symbol] || null; -    } -    return <InlineCode>{children}</InlineCode>; -  }; -    const renderers = {      heading: Heading,      code: CodeBlock,      link: Link,      image: Image, -    inlineCode: WrappedInlineCode, +    inlineCode: WrappedInlineCode(context),    };    return ( | 
