mitchell/mywebsite
1
0
Fork 0
mirror of https://github.com/mgerb/mywebsite synced 2026-01-12 02:42:48 +00:00
Code Issues Releases Wiki Activity

fixed routing

Browse Source
This commit is contained in:
mgerb42
2016-09-02 20:38:01 +00:00
parent 6bf367f9be
commit be5e95b6cf
6 changed files with 72 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
client/js/pages/Index.js
View File

@@ -2,10 +2,8 @@ import React from 'react';
//components
import Header from '../components/Header';
import Preview from '../components/Preview';
import Footer from '../components/Footer';
import Sidebar from '../components/Sidebar';
import Post from '../components/Post';
//css
import '../../assets/css/normalize.css';
@@ -13,50 +11,18 @@ import '../../assets/scss/main.scss';
import 'font-awesome/css/font-awesome.min.css';
import '../../assets/css/dracula.css';
//loading icon
import loading from '../../assets/images/loading.svg';
export default class Index extends React.Component {
componentDidMount() {
this.props.actions.fetchPreview();
this.page = this.props.params.page;
this.page === 'post' ? this.props.actions.fetchPost(this.props.params.category, this.props.params.post) : "";
}
componentWillReceiveProps(nextProps) {
if (this.props.params !== nextProps.params) {
const params = nextProps.params;
this.page = params.page;
if (typeof params.post !== 'undefined' && typeof params.category !== 'undefined') {
this.props.actions.fetchPost(params.category, params.post);
}
}
}
render() {
const fetched = this.props.redux.fetched;
const fetching = this.props.redux.fetching;
return (
<div>
<Header/>
<div class="Main">
{typeof this.page === 'undefined' && !fetching
? <Preview posts={this.props.redux.preview.posts}
postLimit={this.props.redux.postLimit}
increasePostLimit={this.props.actions.increasePostLimit}/>
: null}
{this.page === 'post' && !fetching ? <Post content={this.props.redux.post}/> : null}
{fetching ? loadingElement : null}
{React.cloneElement(this.props.children, this.props)}
<Sidebar/>
</div>
<Footer/>
</div>
);
}
}
const loadingElement = <div class="Loading">
<img src={loading} alt="loading..."/>
</div>;
}