Fix Article/Post naming
Post/Posts is better than FullArticle/Articles since that's really what they are. Paves the way for a Page to render an Article.
This commit is contained in:
parent
60e6e75cb4
commit
5e7fbcd3a4
2 changed files with 26 additions and 26 deletions
10
src/App.js
10
src/App.js
|
|
@ -10,7 +10,7 @@ import 'highlight.js/styles/github-gist.css';
|
|||
|
||||
import { Container, Row, Column } from './skeleton';
|
||||
|
||||
import { Articles, FullArticle } from './Article';
|
||||
import { Post, Posts } from './Article';
|
||||
import { Footer } from './Footer';
|
||||
import { Header } from './Header';
|
||||
import { NavList, TagNav, HistoryNav } from './Nav';
|
||||
|
|
@ -37,13 +37,13 @@ class App extends Component {
|
|||
</Column>
|
||||
<Column width="eight">
|
||||
<Switch>
|
||||
<Route exact path="/" component={Articles} />
|
||||
<Route exact path="/" component={Posts} />
|
||||
{ /* Page routes */ }
|
||||
<Route path="/about" component={About} />
|
||||
|
||||
{ /* Article routes */ }
|
||||
<Route path="/page/:page" component={Articles} />
|
||||
<Route path="/:year/:month/:slug" component={FullArticle} />
|
||||
{ /* Post routes */ }
|
||||
<Route path="/page/:page" component={Posts} />
|
||||
<Route path="/:year/:month/:slug" component={Post} />
|
||||
|
||||
{ /* 404 fallback */ }
|
||||
<Route component={NotFound} />
|
||||
|
|
|
|||
|
|
@ -83,18 +83,18 @@ class Article extends Component {
|
|||
}
|
||||
|
||||
|
||||
class FullArticle extends Component {
|
||||
class Post extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props = props;
|
||||
this.params = props.match.params;
|
||||
|
||||
this.state = {
|
||||
article: null
|
||||
post: null
|
||||
}
|
||||
}
|
||||
|
||||
fetchArticle() {
|
||||
fetchPost() {
|
||||
fetch('/site.json')
|
||||
.then((resp) => resp.json())
|
||||
.then((blob) => {
|
||||
|
|
@ -106,33 +106,33 @@ class FullArticle extends Component {
|
|||
}
|
||||
|
||||
if (slug === this.params.slug) {
|
||||
this.setState({article: post})
|
||||
this.setState({post: post})
|
||||
found = true;
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
if (!found) {
|
||||
console.log('article not found');
|
||||
console.log('post not found');
|
||||
/* TODO: return 404 */
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.fetchArticle();
|
||||
this.fetchPost();
|
||||
}
|
||||
|
||||
componentWillReceiveProps(props) {
|
||||
this.params = props.match.params;
|
||||
this.fetchArticle();
|
||||
this.fetchPost();
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.article) {
|
||||
if (this.state.post) {
|
||||
return (
|
||||
<Article
|
||||
article={this.state.article}
|
||||
article={this.state.post}
|
||||
/>
|
||||
)
|
||||
} else {
|
||||
|
|
@ -143,7 +143,7 @@ class FullArticle extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
class Articles extends Component {
|
||||
class Posts extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
|
|
@ -153,12 +153,12 @@ class Articles extends Component {
|
|||
|
||||
this.params = props.match.params;
|
||||
this.state = {
|
||||
articles: null,
|
||||
posts: null,
|
||||
}
|
||||
}
|
||||
|
||||
fetchArticles() {
|
||||
// Fetch articles from JSON blob
|
||||
fetchPosts() {
|
||||
// Fetch posts from JSON blob
|
||||
fetch('/site.json')
|
||||
.then((resp) => resp.json())
|
||||
.then((blob) => {
|
||||
|
|
@ -168,25 +168,25 @@ class Articles extends Component {
|
|||
}
|
||||
let posts = blob.posts.slice(offset, offset + this.per_page);
|
||||
|
||||
this.setState({articles: posts});
|
||||
this.setState({posts: posts});
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.fetchArticles();
|
||||
this.fetchPosts();
|
||||
}
|
||||
|
||||
componentWillReceiveProps(props) {
|
||||
this.params = props.match.params;
|
||||
this.fetchArticles();
|
||||
this.fetchPosts();
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.articles != null) {
|
||||
let articles = this.state.articles.map(article =>
|
||||
if (this.state.posts != null) {
|
||||
let articles = this.state.posts.map(post =>
|
||||
<Article
|
||||
key={article.title}
|
||||
article={article}
|
||||
key={post.title}
|
||||
article={post}
|
||||
blurb
|
||||
/>
|
||||
);
|
||||
|
|
@ -205,4 +205,4 @@ class Articles extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
export { Article, FullArticle, Articles };
|
||||
export { Article, Post, Posts };
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue