pomp/pompy.dev
1
0
Fork 0
Code Issues 8 Pull requests Activity Actions

removed toc section for posts with no toc

Browse source
This commit is contained in:
Kim, Jimin 2021-08-17 09:11:21 +09:00
parent a5cad47c78
commit aa7f34ff7d
1 changed files with 114 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

34
source/src/pages/Page.tsx
View file

@ -256,9 +256,7 @@ export default class Page extends React.Component<PageProps, PageState> {
}
render() {
if (this.state.loading) {
return <Spinner size={200} />
} else {
if (this.state.loading) return <Spinner size={200} />
if (!this.state.fetchedPage) return <NotFound />
return (
@ -291,9 +289,8 @@ export default class Page extends React.Component<PageProps, PageState> {
) : (
<br />
)}
<StyledTitle>
{this.state.fetchedPage.title}
</StyledTitle>
<StyledTitle>{this.state.fetchedPage.title}</StyledTitle>
{/* Post tags */}
<small>
<TagList direction="left">
@ -302,8 +299,8 @@ export default class Page extends React.Component<PageProps, PageState> {
return (
<td
key={
this.state.fetchedPage
?.title + tag
this.state.fetchedPage?.title +
tag
}
>
<Tag text={tag} />
@ -314,17 +311,17 @@ export default class Page extends React.Component<PageProps, PageState> {
<></>
)}
</TagList>
<br />
{!this.state.isUnsearchable && (
<StyledMetaContainer>
<FontAwesomeIcon icon={faCalendar} />{" "}
{this.state.fetchedPage?.date ||
"Unknown date"}
{this.state.fetchedPage?.date || "Unknown date"}
&nbsp;&nbsp;&nbsp;&nbsp;
<FontAwesomeIcon icon={faHourglass} />{" "}
{this.state.fetchedPage?.readTime
? this.state.fetchedPage?.readTime +
" read"
? this.state.fetchedPage?.readTime + " read"
: "unknown length"}
&nbsp;&nbsp;&nbsp;&nbsp;
<FontAwesomeIcon icon={faBook} />{" "}
@ -335,13 +332,13 @@ export default class Page extends React.Component<PageProps, PageState> {
</StyledMetaContainer>
)}
</small>
{/* Horizontal Separator */}
<hr />
{
// add table of contents if it exists
this.state.fetchedPage.toc && (
!!this.state.fetchedPage?.toc?.props.children
.length && (
<>
<StyledTocToggleButton
onClick={() => {
@ -355,15 +352,11 @@ export default class Page extends React.Component<PageProps, PageState> {
{this.state.isTocOpened ? (
<FontAwesomeIcon icon={faCaretUp} />
) : (
<FontAwesomeIcon
icon={faCaretDown}
/>
<FontAwesomeIcon icon={faCaretDown} />
)}
</StyledTocToggleButton>
<StyledCollapseContainer>
<Collapse
isOpened={this.state.isTocOpened}
>
<Collapse isOpened={this.state.isTocOpened}>
<div className="white-link">
{this.state.fetchedPage.toc}
</div>
@ -384,5 +377,4 @@ export default class Page extends React.Component<PageProps, PageState> {
</>
)
}
}
}