feature (404): proper 404 page - #28

client/pages/homepage.js

@@ -11,15 +11,12 @@ export class HomePage extends React.Component {
     componentDidMount(){
         Session.isLogged()
             .then((res) => {
-                if(res === true){
+                if(res && res.result === true){
                     this.props.history.push('/files');
                 }else{
                     this.props.history.push('/login');
                 }
-            })
-            .catch((res) => {
-                console.warn(res)
-            })
+            });
     }
     render() {
         return (

client/pages/notfound.js

@@ -1,16 +0,0 @@
-import React from 'react';
-import { Link } from 'react-router';
-
-export class NotFoundPage extends React.Component {
-    render() {
-        return (
-            <div className="not-found">
-              <h1>404</h1>
-              <h2>Page not found!</h2>
-              <p>
-                <Link to="/">Go back to the main page</Link>
-              </p>
-            </div>
-        );
-    }
-}

client/pages/notfoundpage.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+import { Button } from '../components/';
+import './notfoundpage.scss';
+
+export class NotFoundPage extends React.Component {
+    constructor(props){
+        super(props);
+        this.state = {
+            timeout: 10
+        };
+    }
+
+    componentDidMount(){
+        this.countdown();
+    }
+
+    countdown(){
+        if(this.state.timeout > 0){
+            this.setState({timeout: this.state.timeout - 1});
+            window.setTimeout(() => {
+                this.countdown();
+            }, 1000);
+        }else{
+            this.props.history.push("/");
+        }
+    }
+
+    render() {
+        return (
+            <div className="component_page_notfound">
+              <h1>Oops!</h1>
+              <h2>We can't seem to find the page you're looking for.</h2>
+              <p>
+                You will be redirected to the <Link to="/">homepage</Link> in {this.state.timeout} seconds
+              </p>
+            </div>
+        );
+    }
+}

client/pages/notfoundpage.scss

@@ -0,0 +1,9 @@
+.component_page_notfound{
+    max-width: 600px;
+    margin: 50px auto 0 auto;
+
+    h1{margin: 5px 0; font-size: 3.1em;}
+    h2{margin: 10px 0; font-weight: normal;}
+    p{font-style: italic;}
+    a{border-bottom: 1px dashed;}
+}