From 397d3f2811bc79cf1e48ef02c0c92e3c1ef54f35 Mon Sep 17 00:00:00 2001
From: LordMathis <namesny.matus@gmail.com>
Date: Sat, 30 Dec 2017 22:26:39 +0100
Subject: [PATCH] Change routes and component structure

---
 src/components/About.js         | 28 ++++++++++++++++++----------
 src/components/App.js           |  5 +----
 src/components/Blog.js          |  4 +++-
 src/components/Home.js          | 15 ---------------
 src/components/Portfolio.js     | 11 -----------
 src/components/Resume.js        | 11 -----------
 src/components/index.js         |  4 +---
 src/containers/BlogContainer.js | 22 +++++++++++++++++-----
 src/utils/api.js                |  4 ++++
 src/utils/compiler.js           |  3 +--
 10 files changed, 45 insertions(+), 62 deletions(-)
 delete mode 100644 src/components/Portfolio.js
 delete mode 100644 src/components/Resume.js

diff --git a/src/components/About.js b/src/components/About.js
index c1711d3..49a0706 100644
--- a/src/components/About.js
+++ b/src/components/About.js
@@ -1,12 +1,20 @@
-import React from 'react';
-//  import { Home } from '.';
+import React, {Component} from 'react';
 
-export const About = () => (
-  <div>
-    <div className="content-wrapper">
-      <h1>About</h1>
-    </div>
-  </div>
-);
+export default class About extends Component {
 
-export default About;
+  render () {
+    if (this.props.isLoading) {
+      return (
+        <div className="content-wrapper">
+          <h1>Loading</h1>
+        </div>
+      );
+    }
+
+    return (
+      <div className="content-wrapper">
+        { this.props.about.hello }
+      </div>
+    )
+  }
+}
diff --git a/src/components/App.js b/src/components/App.js
index c6d6081..94ab983 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,17 +1,14 @@
 import React from 'react';
 import { Route, Switch } from 'react-router-dom';
-import { Home, About, Portfolio, Resume, NotFoundPage } from '.';
+import { Home, NotFoundPage } from '.';
 import { BlogContainer, PostContainer } from '../containers';
 
 export const App = () => (
   <div>
     <Route component={Home} />
     <Switch>
-      <Route exact path="/about" component={About} />
       <Route exact path="/blog" component={BlogContainer} />
       <Route path="/blog/post/:postname" component={PostContainer} />
-      <Route exact path="/portfolio" component={Portfolio} />
-      <Route exact path="/resume" component={Resume} />
       <Route component={NotFoundPage} />
     </Switch>
   </div>
diff --git a/src/components/Blog.js b/src/components/Blog.js
index 3e32c16..e0454a5 100644
--- a/src/components/Blog.js
+++ b/src/components/Blog.js
@@ -5,7 +5,9 @@ export default class Blog extends Component {
   render() {
     if (this.props.isLoading) {
       return (
-        <h1>Loading</h1>
+        <div className="content-wrapper">
+          <h1>Loading</h1>
+        </div>
       );
     }
 
diff --git a/src/components/Home.js b/src/components/Home.js
index 578790b..d62737a 100644
--- a/src/components/Home.js
+++ b/src/components/Home.js
@@ -37,26 +37,11 @@ export default class Home extends Component {
           </div>
           <div className="menu-links">
             <ul>
-              <li>
-                <Link to="/about">
-                  <i className="fa fa-question" aria-hidden="true" /> About
-                </Link>
-              </li>
               <li>
                 <Link to="/blog">
                   <i className="fa fa-pencil-square-o" aria-hidden="true" /> Blog
                 </Link>
               </li>
-              <li>
-                <Link to="/portfolio">
-                  <i className="fa fa-briefcase" aria-hidden="true" /> Portfolio
-                </Link>
-              </li>
-              <li>
-                <Link to="/resume">
-                  <i className="fa fa-file-text-o" aria-hidden="true" /> Resume
-                </Link>
-              </li>
             </ul>
           </div>
         </div>
diff --git a/src/components/Portfolio.js b/src/components/Portfolio.js
deleted file mode 100644
index b99fe98..0000000
--- a/src/components/Portfolio.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-export const Portfolio = () => (
-  <div>
-    <div className="content-wrapper">
-      <h1>Portfolio</h1>
-    </div>
-  </div>
-);
-
-export default Portfolio;
diff --git a/src/components/Resume.js b/src/components/Resume.js
deleted file mode 100644
index d265999..0000000
--- a/src/components/Resume.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-export const Resume = () => (
-  <div>
-    <div className="content-wrapper">
-      <h1>Resume</h1>
-    </div>
-  </div>
-);
-
-export default Resume;
diff --git a/src/components/index.js b/src/components/index.js
index 6ac40d1..dbcc3db 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,8 +1,6 @@
 export { default as Home } from './Home';
-export { default as About } from './About';
 export { default as Blog } from './Blog';
+export { default as About } from './About';
 export { default as Post } from './Post';
-export { default as Portfolio } from './Portfolio';
-export { default as Resume } from './Resume';
 export { default as NotFoundPage } from './NotFoundPage';
 export { default as App } from './App';
diff --git a/src/containers/BlogContainer.js b/src/containers/BlogContainer.js
index 5d8e81f..88275eb 100644
--- a/src/containers/BlogContainer.js
+++ b/src/containers/BlogContainer.js
@@ -1,6 +1,6 @@
 import React, {Component} from 'react';
 import axios from 'axios';
-import {Blog} from '../components';
+import {About, Blog} from '../components';
 
 export default class BlogContainer extends Component {
 
@@ -8,14 +8,22 @@ export default class BlogContainer extends Component {
     super();
 
     this.state = {
-      isLoading: true,
+      isLoadingBlog: true,
+      isLoadingAbout: true,
     }
   }
 
   componentDidMount() {
+    axios.get('/api/about').then((res) => {
+      this.setState({
+        isLoadingAbout: false,
+        about: res.data,
+      });
+    })
+
     axios.get('/api/blog').then((res) => {
       this.setState({
-        isLoading: false,
+        isLoadingBlog: false,
         posts: res.data,
       });
     })
@@ -23,8 +31,12 @@ export default class BlogContainer extends Component {
 
   render() {
     return (
-      <Blog isLoading={this.state.isLoading}
-            posts={this.state.posts}/>
+      <div>
+        <About isLoading={this.state.isLoadingAbout}
+          about={this.state.about}/>
+        <Blog isLoading={this.state.isLoadingBlog}
+          posts={this.state.posts}/>
+      </div>
     )
   }
 }
diff --git a/src/utils/api.js b/src/utils/api.js
index 36ace24..1c995df 100644
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -7,6 +7,10 @@ api.get('/blog', (req, res) => {
   res.json(data.posts);
 });
 
+api.get('/about', (req, res) => {
+  res.json({"hello": "hello"});
+});
+
 api.get('/post/:postname', (req, res) => {
   const postname = req.params.postname;
   const post = data.posts.find((el) => {
diff --git a/src/utils/compiler.js b/src/utils/compiler.js
index 6a61783..e87c161 100644
--- a/src/utils/compiler.js
+++ b/src/utils/compiler.js
@@ -50,9 +50,8 @@ function compile(filepath, data, fileData, callback) {
 
   fs.writeFile(renderedpath, rendered, (err) => {
     if (err) callback(err);
+    else callback(null, post);
   });
-
-  callback(null, post);
 }
 
 function Compiler(data) {