initial test and 404 page

smart-hut/src/App.js

@@ -1,9 +1,10 @@
 import React from "react";
-import { Switch, Route, Redirect } from "react-router-dom";
+import {BrowserRouter, Switch, Route, Redirect } from "react-router-dom";
 import Home from "./views/Home";
 import Dashboard from "./views/DashboardTest";
 import Signup from "./views/Signup";
 import Login from "./views/Login";
+import FourOhFour from "./views/FourOhFour";
 import ForgotPass from "./views/Forgot-password";
 import ChangePass from "./views/Forgot-pass-reset";
 import queryString from 'query-string';
@@ -33,10 +34,12 @@ class App extends React.Component {
   }
 
   componentDidMount() {
-    const values = queryString.parse(this.props.location.search);
-    this.setState({
-        query : values
-    });
+    if (this.props.location) {
+      const values = queryString.parse(this.props.location.search);
+      this.setState({
+          query : values
+      });
+    }
   }
 
   auth(data) {
@@ -77,6 +80,7 @@ class App extends React.Component {
 
   render() {
     return (
+      <BrowserRouter>
         <Switch>
           <Route path="/" exact component={Home} />
           <Route path="/login" >
@@ -92,7 +96,9 @@ class App extends React.Component {
           <Route path="/forgot-pass-reset" >
               <ChangePass query={this.state.query}/>
           </Route>
+          <Route component={FourOhFour} />
         </Switch>
+      </BrowserRouter>
     );
   }
 }

smart-hut/src/App.test.js

@@ -1,9 +1,16 @@
 import React from 'react';
 import { render } from '@testing-library/react';
+import { Router } from "react-router";
+import { createMemoryHistory } from "history";
 import App from './App';
 
-test('renders learn react link', () => {
-  const { getByText } = render(<App />);
-  const linkElement = getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
+test("redirects to homepage", () => {
+  const history = createMemoryHistory();
+  render(
+    <Router history={history}>
+      <App />
+    </Router>
+  );
+  expect(history.location.pathname).toBe("/");
 });
+

smart-hut/src/index.js

@@ -3,17 +3,13 @@ import ReactDOM from 'react-dom';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
 //React Router
-import { BrowserRouter, Route, Switch } from "react-router-dom";
+//import { BrowserRouter, Route, Switch } from "react-router-dom";
 
-const routes = (
-    <BrowserRouter>
-      <Switch>
-        <Route path="/" component={App} />
-      </Switch>
-    </BrowserRouter>
+const index = (
+    <App />
   );
 
 ReactDOM.render(
-    routes
+    index
     , document.getElementById('root'));
 serviceWorker.unregister();

smart-hut/src/views/FourOhFour.js

@@ -0,0 +1,19 @@
+import React, {Component} from 'react';
+import { Message} from 'semantic-ui-react';
+import {Link } from "react-router-dom";
+
+
+export default class FourOhFour  extends Component {
+
+    render() {
+        return (
+            <Message>
+                <Message.Header>404 Page Not Found</Message.Header>
+                <p>
+                Hey what are you doing here? 
+                Go back to our homepage <Link to="/"/>
+                </p>
+            </Message>
+        )
+    }
+}