Getting posts and about rendered

This commit is contained in:
LordMathis 2019-03-26 20:24:39 +01:00
parent 2eb8acf315
commit e6d2c55c1f
9 changed files with 24 additions and 16 deletions

View File

@ -19,7 +19,7 @@
"express": "^4.13.4", "express": "^4.13.4",
"front-matter": "^2.2.0", "front-matter": "^2.2.0",
"jsonfile": "^4.0.0", "jsonfile": "^4.0.0",
"markdown-it": "^8.4.0", "markdown-it": "^8.4.2",
"moment": "^2.19.1", "moment": "^2.19.1",
"node-sass": "^4.9.0", "node-sass": "^4.9.0",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",

View File

@ -3,14 +3,18 @@ import React, { Component } from 'react'
import { Spinner, Header } from '.' import { Spinner, Header } from '.'
import '../static/stylesheets/globals.scss' import '../static/stylesheets/globals.scss'
import contentStyle from '../static/stylesheets/content.scss' import contentStyle from '../static/stylesheets/content.scss'
import MarkdownIt from 'markdown-it'
export default class About extends Component { export default class About extends Component {
static propTypes = { static propTypes = {
isLoading: PropTypes.bool.isRequired, isLoading: PropTypes.bool.isRequired,
about: PropTypes.object.isRequired about: PropTypes.string.isRequired
} }
render () { render () {
const md = MarkdownIt()
const result = md.render(this.props.about)
if (this.props.isLoading) { if (this.props.isLoading) {
return ( return (
<div className={contentStyle.contentWrapper} id="about"> <div className={contentStyle.contentWrapper} id="about">
@ -22,7 +26,7 @@ export default class About extends Component {
return ( return (
<div className={contentStyle.contentWrapper} id="about"> <div className={contentStyle.contentWrapper} id="about">
<Header header={'About Me'} /> <Header header={'About Me'} />
<div className={contentStyle.content} dangerouslySetInnerHTML={{ __html: this.props.about.body }}> <div className={contentStyle.content} dangerouslySetInnerHTML={{ __html: result }}>
</div> </div>
</div> </div>
) )

View File

@ -4,6 +4,7 @@ import { Spinner, Header, Navbar } from '.'
import '../static/stylesheets/globals.scss' import '../static/stylesheets/globals.scss'
import contentStyle from '../static/stylesheets/content.scss' import contentStyle from '../static/stylesheets/content.scss'
import styles from './Post.scss' import styles from './Post.scss'
import MarkdownIt from 'markdown-it'
export default class Post extends Component { export default class Post extends Component {
static propTypes = { static propTypes = {
@ -12,6 +13,9 @@ export default class Post extends Component {
} }
render () { render () {
const md = MarkdownIt()
const result = md.render(this.props.post)
if (this.props.isLoading) { if (this.props.isLoading) {
return ( return (
<div className={contentStyle.contentWrapper}> <div className={contentStyle.contentWrapper}>
@ -29,7 +33,7 @@ export default class Post extends Component {
<div className={styles.postDate}> <div className={styles.postDate}>
<h3>{this.props.post.published}</h3> <h3>{this.props.post.published}</h3>
</div> </div>
<div className={styles.postContent} dangerouslySetInnerHTML={{ __html: this.props.post.body }}> <div className={styles.postContent} dangerouslySetInnerHTML={{ __html: result }}>
</div> </div>
</div> </div>
</div> </div>

View File

@ -19,17 +19,16 @@ export default class MainContainer extends Component {
data = props.staticContext.data data = props.staticContext.data
} }
console.log(data)
this.state = { this.state = {
isLoadingBlog: !data.posts, isLoadingBlog: !data.posts,
isLoadingAbout: !data.about, isLoadingAbout: !data.other.about,
about: data.about, about: data.other.about,
posts: data.posts posts: data.posts
} }
} }
render () { render () {
console.log(this.state)
return ( return (
<div> <div>
<Home/> <Home/>

View File

@ -19,6 +19,8 @@ export default class PostContainer extends Component {
post = props.staticContext.data post = props.staticContext.data
} }
console.log(post)
this.state = { this.state = {
isLoading: !post, isLoading: !post,
error: false, error: false,

View File

@ -7,7 +7,7 @@ export function getData (reqPath = '') {
if (reqPath === '') { if (reqPath === '') {
return readData(config.dataPath) return readData(config.dataPath)
} else { } else {
const fileName = path.join(process.cwd(), 'renders/', reqPath + '.html') const fileName = path.join(process.cwd(), config.contentPath, reqPath + '.md')
return readFile(fileName, 'utf8') return readFile(fileName, 'utf8')
} }
}; };

View File

@ -62,9 +62,7 @@ export class Scanner {
this.data.posts.push(post) this.data.posts.push(post)
} else { } else {
this.data.other.push({ this.data.other[metadata.filename] = data
[metadata.filename]: data
})
} }
} }

View File

@ -131,7 +131,7 @@ const serverConfig = {
fileName: 'data.json', fileName: 'data.json',
content: JSON.stringify({ content: JSON.stringify({
'posts': [], 'posts': [],
'other': [] 'other': {}
}) })
}) })
] ]

View File

@ -5008,9 +5008,10 @@ map-visit@^1.0.0:
dependencies: dependencies:
object-visit "^1.0.0" object-visit "^1.0.0"
markdown-it@^8.4.0: markdown-it@^8.4.2:
version "8.4.1" version "8.4.2"
resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.1.tgz#206fe59b0e4e1b78a7c73250af9b34a4ad0aaf44" resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.2.tgz#386f98998dc15a37722aa7722084f4020bdd9b54"
integrity sha512-GcRz3AWTqSUphY3vsUqQSFMbgR38a4Lh3GWlHRh/7MRwz8mcu9n2IO7HOh+bXHrR9kOPDl5RNCaEsrneb+xhHQ==
dependencies: dependencies:
argparse "^1.0.7" argparse "^1.0.7"
entities "~1.1.1" entities "~1.1.1"