From 960c12fe9df174cda9fda8f1ad2a91f6769b18c6 Mon Sep 17 00:00:00 2001
From: LordMathis <namesny.matus@gmail.com>
Date: Fri, 15 Jun 2018 17:30:20 +0200
Subject: [PATCH] Update 404 page

---
 src/components/App.js             |  4 ++--
 src/components/NotFoundPage.js    | 13 +++++++------
 src/components/NotFoundWrapper.js | 15 +++++++++++++++
 src/components/index.js           |  1 +
 src/containers/PostContainer.js   | 26 +++++++++++++++++++++-----
 5 files changed, 46 insertions(+), 13 deletions(-)
 create mode 100644 src/components/NotFoundWrapper.js

diff --git a/src/components/App.js b/src/components/App.js
index 740230e..316d82b 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Route, Switch } from 'react-router-dom';
-import { Home, NotFoundPage } from '.';
+import { Home, NotFoundWrapper } from '.';
 import { MainContainer, PostContainer } from '../containers';
 
 export const App = () => (
@@ -8,7 +8,7 @@ export const App = () => (
     <Switch>
       <Route exact path="/" component={MainContainer} />
       <Route path="/post/:postname" component={PostContainer} />
-      <Route component={NotFoundPage} />
+      <Route component={NotFoundWrapper} />
     </Switch>
   </div>
 );
diff --git a/src/components/NotFoundPage.js b/src/components/NotFoundPage.js
index 9ee555e..03479cb 100644
--- a/src/components/NotFoundPage.js
+++ b/src/components/NotFoundPage.js
@@ -1,17 +1,18 @@
 import React from 'react';
+import {Navbar, Header} from '.';
 import '../static/stylesheets/globals.scss';
 import contentStyle from '../static/stylesheets/content.scss';
 
 export const NotFoundPage = (props) => {
-  if (props.location.pathname === '/') {
-    return null;
-  }
   return (
     <div>
+      <Navbar />
       <div className={contentStyle.contentWrapper}>
-        <h1>Uhm... WHAT?</h1>
-        <h2>Looks like you&apos;re lost</h2>
-        <p>404 Page not found</p>
+        <Header header={"Uhm... WHAT?"} />
+        <div className={contentStyle.content}>
+          <p>Looks like you&apos;re lost</p>
+          <p>404 Page not found</p>
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/NotFoundWrapper.js b/src/components/NotFoundWrapper.js
new file mode 100644
index 0000000..4c47f00
--- /dev/null
+++ b/src/components/NotFoundWrapper.js
@@ -0,0 +1,15 @@
+import React, {Component} from 'react';
+import {Wrapper, NotFoundPage} from '.';
+import '../static/stylesheets/globals.scss';
+import styles from './Wrapper.scss';
+
+export default class NotFoundWrapper extends Component {
+
+  render () {
+    return (
+      <Wrapper>
+        <NotFoundPage />
+      </Wrapper>
+    )
+  }
+}
diff --git a/src/components/index.js b/src/components/index.js
index f887064..af0f26a 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -3,6 +3,7 @@ export { default as Blog } from './Blog';
 export { default as About } from './About';
 export { default as Post } from './Post';
 export { default as NotFoundPage } from './NotFoundPage';
+export { default as NotFoundWrapper } from './NotFoundWrapper';
 export { default as Spinner } from './Spinner';
 export { default as Header } from './Header';
 export { default as Wrapper } from './Wrapper';
diff --git a/src/containers/PostContainer.js b/src/containers/PostContainer.js
index ea40d40..902f099 100644
--- a/src/containers/PostContainer.js
+++ b/src/containers/PostContainer.js
@@ -1,6 +1,6 @@
 import React, {Component} from 'react';
 import axios from 'axios';
-import {Post, Wrapper} from '../components';
+import {Post, Wrapper, NotFoundPage} from '../components';
 
 export default class PostContainer extends Component {
   constructor() {
@@ -8,6 +8,7 @@ export default class PostContainer extends Component {
 
     this.state = {
       isLoading: true,
+      error: false,
     };
   }
 
@@ -15,14 +16,29 @@ export default class PostContainer extends Component {
     const url = '/api/post/' + this.props.match.params.postname;
 
     axios.get(url).then((res) => {
-      this.setState({
-        isLoading: false,
-        post: res.data,
-      });
+      if (res.data.error) {
+        this.setState({
+          error: true,
+        });
+      }
+      else {
+        this.setState({
+          error: false,
+          isLoading: false,
+          post: res.data,
+        });
+      }
     })
   }
 
   render() {
+
+    if (this.state.error) {
+      return (
+        <NotFoundPage />
+      )
+    }
+
     return (
       <Wrapper>
         <Post isLoading={this.state.isLoading}