2020-05-22 14:38:19 +02:00
|
|
|
import React, { ReactElement } from 'react'
|
2019-12-14 15:46:43 +01:00
|
|
|
import Changelog from '../../atoms/Changelog'
|
2022-11-11 03:31:54 +01:00
|
|
|
import * as styles from './Content.module.css'
|
2023-01-29 22:58:19 +01:00
|
|
|
import PostToc from './Toc'
|
2018-07-22 04:27:37 +02:00
|
|
|
|
2022-11-11 03:31:54 +01:00
|
|
|
export default function PostContent({
|
|
|
|
post
|
|
|
|
}: {
|
|
|
|
post: Queries.BlogPostBySlugQuery['post']
|
|
|
|
}): ReactElement {
|
2018-07-22 04:27:37 +02:00
|
|
|
const separator = '<!-- more -->'
|
2018-11-21 23:39:09 +01:00
|
|
|
const changelog = post.frontmatter.changelog
|
2018-07-22 04:27:37 +02:00
|
|
|
|
2018-11-21 23:39:09 +01:00
|
|
|
let content = post.html
|
2018-07-22 04:27:37 +02:00
|
|
|
|
2021-02-28 04:50:05 +01:00
|
|
|
if (post.fields.type === 'article') {
|
2021-03-04 01:20:39 +01:00
|
|
|
// Remove lead paragraph from content
|
2018-07-22 04:27:37 +02:00
|
|
|
if (content.includes(separator)) {
|
|
|
|
content = content.split(separator)[1]
|
|
|
|
} else {
|
|
|
|
const lead = content.split('\n')[0]
|
|
|
|
content = content.replace(lead, '')
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-11-21 23:39:09 +01:00
|
|
|
return (
|
2019-10-02 13:35:50 +02:00
|
|
|
<>
|
2019-11-08 20:47:23 +01:00
|
|
|
{post.frontmatter.toc && (
|
|
|
|
<PostToc tableOfContents={post.tableOfContents} />
|
|
|
|
)}
|
2021-03-04 01:20:39 +01:00
|
|
|
<div
|
|
|
|
dangerouslySetInnerHTML={{ __html: content }}
|
2022-11-11 03:31:54 +01:00
|
|
|
className={styles.content}
|
2021-03-04 01:20:39 +01:00
|
|
|
/>
|
2018-11-21 23:39:09 +01:00
|
|
|
{changelog && <Changelog repo={changelog} />}
|
2019-10-02 13:35:50 +02:00
|
|
|
</>
|
2018-11-21 23:39:09 +01:00
|
|
|
)
|
2018-07-22 04:27:37 +02:00
|
|
|
}
|