mastermindzh/rickvanlieshout.com
1
0
Fork 0
mirror of https://github.com/mastermindzh/rickvanlieshout.com synced 2024-12-26 14:59:14 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #70 from yodahuang/master

Browse Source 
Refactor the React logic and introduce Fragment
This commit is contained in:
Alexander Shelepenok 2018-10-15 22:44:53 +03:00 committed by GitHub
commit 5c4e5e32de
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 63 additions and 144 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/CategoryTemplateDetails/index.jsx
View File

@ -4,8 +4,8 @@ import Post from '../Post';
class CategoryTemplateDetails extends React.Component {
render() {
const items = [];
const { category } = this.props.pathContext;
const posts = this.props.data.allMarkdownRemark.edges;
const { category } = this.props.category;
const posts = this.props.posts;
posts.forEach((post) => {
items.push(<Post data={post} key={post.node.fields.slug} />);
});

9
src/components/Disqus/Disqus.jsx
View File

@ -19,15 +19,12 @@ class Disqus extends Component {
this.setState({ toasts });
}
render() {
const { postNode, siteMetadata } = this.props;
if (!siteMetadata.disqusShortname) {
return null;
}
const { postNode, shortName, url: siteUrl } = this.props;
const post = postNode.frontmatter;
const url = siteMetadata.url + postNode.fields.slug;
const url = siteUrl + postNode.fields.slug;
return (
<ReactDisqusComments
shortname={siteMetadata.disqusShortname}
shortname={shortName}
identifier={post.title}
title={post.title}
url={url}

4
src/components/PageTemplateDetails/index.jsx
View File

@ -4,11 +4,11 @@ import './style.scss';
class PageTemplateDetails extends React.Component {
render() {
const page = this.props.data.markdownRemark;
const page = this.props.page;
return (
<div>
<Sidebar {...this.props} />
<Sidebar siteMetadata={this.props.siteMetadata} />
<div className="content">
<div className="content__inner">
<div className="page">

8
src/components/PostTemplateDetails/index.jsx
View File

@ -6,8 +6,8 @@ import './style.scss';
class PostTemplateDetails extends React.Component {
render() {
const { subtitle, author } = this.props.data.site.siteMetadata;
const post = this.props.data.markdownRemark;
const { subtitle, author, disqusShortname, url } = this.props.siteMetadata;
const post = this.props.post;
const tags = post.fields.tagSlugs;
const homeBlock = (
@ -32,7 +32,7 @@ class PostTemplateDetails extends React.Component {
const commentsBlock = (
<div>
<Disqus postNode={post} siteMetadata={this.props.data.site.siteMetadata} />
<Disqus postNode={post} shortName={disqusShortname} url={url} />
</div>
);
@ -56,7 +56,7 @@ class PostTemplateDetails extends React.Component {
<br /> <strong>{author.name}</strong> on Twitter
</a>
</p>
{commentsBlock}
{disqusShortname && commentsBlock}
</div>
</div>
</div>

24
src/components/Sidebar/index.jsx
View File

@ -9,7 +9,7 @@ import './style.scss';
class Sidebar extends React.Component {
render() {
const { location } = this.props;
const { author, subtitle, copyright, menu } = this.props.data.site.siteMetadata;
const { author, subtitle, copyright, menu } = this.props.siteMetadata;
const isHomePage = get(location, 'pathname', '/') === '/';
/* eslint-disable jsx-a11y/img-redundant-alt */
@ -58,3 +58,25 @@ class Sidebar extends React.Component {
}
export default Sidebar;
export const conponentQuery = graphql`
fragment sidebarFragment on siteMetadata_2{
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
`;

4
src/components/TagTemplateDetails/index.jsx
View File

@ -4,8 +4,8 @@ import Post from '../Post';
class TagTemplateDetails extends React.Component {
render() {
const items = [];
const tagTitle = this.props.pathContext.tag;
const posts = this.props.data.allMarkdownRemark.edges;
const tagTitle = this.props.tag;
const posts = this.props.posts;
posts.forEach((post) => {
items.push(<Post data={post} key={post.node.fields.slug} />);
});

19
src/pages/404.jsx
View File

@ -5,7 +5,7 @@ class NotFoundRoute extends React.Component {
render() {
return (
<div>
<Sidebar {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<div className="content">
<div className="content__inner">
<div className="page">
@ -27,22 +27,7 @@ export const pageQuery = graphql`
query NotFoundQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
}

19
src/pages/categories.jsx
View File

@ -12,7 +12,7 @@ class CategoriesRoute extends React.Component {
return (
<div>
<Helmet title={`All Categories - ${title}`} />
<Sidebar {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<div className="content">
<div className="content__inner">
<div className="page">
@ -44,22 +44,7 @@ export const pageQuery = graphql`
query CategoryesQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
allMarkdownRemark(

19
src/pages/index.jsx
View File

@ -18,7 +18,7 @@ class IndexRoute extends React.Component {
<title>{title}</title>
<meta name="description" content={subtitle} />
</Helmet>
<Sidebar {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<div className="content">
<div className="content__inner">
{items}
@ -35,22 +35,7 @@ export const pageQuery = graphql`
query IndexQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
allMarkdownRemark(

19
src/pages/tags.jsx
View File

@ -12,7 +12,7 @@ class TagsRoute extends React.Component {
return (
<div>
<Helmet title={`All Tags - ${title}`} />
<Sidebar {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<div className="content">
<div className="content__inner">
<div className="page">
@ -44,22 +44,7 @@ export const pageQuery = graphql`
query TagsQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
allMarkdownRemark(

26
src/templates/category-template.jsx
View File

@ -5,14 +5,15 @@ import CategoryTemplateDetails from '../components/CategoryTemplateDetails';
class CategoryTemplate extends React.Component {
render() {
const { title } = this.props.data.site.siteMetadata;
const { category } = this.props.pathContext;
const title = this.props.data.site.siteMetadata.title;
const category = this.props.pathContext.category;
const posts = this.props.data.allMarkdownRemark.edges;
return (
<div>
<Helmet title={`${category} - ${title}`} />
<Sidebar {...this.props} />
<CategoryTemplateDetails {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<CategoryTemplateDetails category={category} posts={posts} />
</div>
);
}
@ -24,22 +25,7 @@ export const pageQuery = graphql`
query CategoryPage($category: String) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
allMarkdownRemark(

25
src/templates/page-template.jsx
View File

@ -4,7 +4,8 @@ import PageTemplateDetails from '../components/PageTemplateDetails';
class PageTemplate extends React.Component {
render() {
const { title, subtitle } = this.props.data.site.siteMetadata;
const siteMetadata = this.props.data.site.siteMetadata;
const { title, subtitle } = siteMetadata;
const page = this.props.data.markdownRemark;
const { title: pageTitle, description: pageDescription } = page.frontmatter;
const description = pageDescription !== null ? pageDescription : subtitle;
@ -15,7 +16,10 @@ class PageTemplate extends React.Component {
<title>{`${pageTitle} - ${title}`}</title>
<meta name="description" content={description} />
</Helmet>
<PageTemplateDetails {...this.props} />
<PageTemplateDetails
siteMetadata={siteMetadata}
page={page}
/>
</div>
);
}
@ -27,22 +31,7 @@ export const pageQuery = graphql`
query PageBySlug($slug: String!) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
markdownRemark(fields: { slug: { eq: $slug } }) {

6
src/templates/post-template.jsx
View File

@ -4,7 +4,8 @@ import PostTemplateDetails from '../components/PostTemplateDetails';
class PostTemplate extends React.Component {
render() {
const { title, subtitle } = this.props.data.site.siteMetadata;
const siteMetadata = this.props.data.site.siteMetadata;
const { title, subtitle } = siteMetadata;
const post = this.props.data.markdownRemark;
const { title: postTitle, description: postDescription } = post.frontmatter;
const description = postDescription !== null ? postDescription : subtitle;
@ -15,7 +16,7 @@ class PostTemplate extends React.Component {
<title>{`${postTitle} - ${title}`}</title>
<meta name="description" content={description} />
</Helmet>
<PostTemplateDetails {...this.props} />
<PostTemplateDetails siteMetadata={siteMetadata} post={post} />
</div>
);
}
@ -29,7 +30,6 @@ export const pageQuery = graphql`
siteMetadata {
title
subtitle
copyright
author {
name
twitter

21
src/templates/tag-template.jsx
View File

@ -11,8 +11,8 @@ class TagTemplate extends React.Component {
return (
<div>
<Helmet title={`All Posts tagged as "${tag}" - ${title}`} />
<Sidebar {...this.props} />
<TagTemplateDetails {...this.props} />
<Sidebar siteMetadata={this.props.data.site.siteMetadata} />
<TagTemplateDetails posts={this.props.data.allMarkdownRemark.edges} tag={tag} />
</div>
);
}
@ -24,22 +24,7 @@ export const pageQuery = graphql`
query TagPage($tag: String) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
...sidebarFragment
}
}
allMarkdownRemark(