Wait for blockchain to display the account management routes

1 files changed, 12 insertions, 31 deletions

diff --git a/packages/website/ts/pages/not_found.tsx b/packages/website/ts/pages/not_found.tsx
index 96c73d4ec..674271636 100644
--- a/packages/website/ts/pages/not_found.tsx
+++ b/packages/website/ts/pages/not_found.tsx
@@ -3,6 +3,7 @@ import * as _ from 'lodash';
 import * as React from 'react';
 import { Footer } from 'ts/components/footer';
 import { TopBar } from 'ts/components/top_bar/top_bar';
+import { FullscreenMessage } from 'ts/pages/fullscreen_message';
 import { Dispatcher } from 'ts/redux/dispatcher';
 import { Translate } from 'ts/utils/translate';
 
@@ -12,35 +13,15 @@ export interface NotFoundProps {
     dispatcher: Dispatcher;
 }
 
-interface NotFoundState {}
-
-const styles: Styles = {
-    thin: {
-        fontWeight: 100,
-    },
+export const NotFound = (props: NotFoundProps) => {
+    return (
+        <div>
+            <TopBar blockchainIsLoaded={false} location={this.props.location} translate={this.props.translate} />
+            <FullscreenMessage
+                headerText={'404 Not Found'}
+                bodyText={"Hm... looks like we couldn't find what you are looking for."}
+            />
+            <Footer translate={this.props.translate} dispatcher={this.props.dispatcher} />
+        </div>
+    );
 };
-
-export class NotFound extends React.Component<NotFoundProps, NotFoundState> {
-    public render(): React.ReactNode {
-        return (
-            <div>
-                <TopBar blockchainIsLoaded={false} location={this.props.location} translate={this.props.translate} />
-                <div className="mx-auto max-width-4 py4">
-                    <div className="center py4">
-                        <div className="py4">
-                            <div className="py4">
-                                <h1 style={{ ...styles.thin }}>404 Not Found</h1>
-                                <div className="py1">
-                                    <div className="py3">
-                                        Hm... looks like we couldn't find what you are looking for.
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <Footer translate={this.props.translate} dispatcher={this.props.dispatcher} />
-            </div>
-        );
-    }
-}