Add router and login part

src/Components/AppComponent/App.css

@@ -1,38 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}

src/Components/AppComponent/App.tsx

@@ -1,12 +1,25 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+
 import React from 'react';
-import './App.css';
+import { Switch, Route, Redirect } from 'react-router-dom';
+import Login from '../LoginComponent/Login';
+import Dashboard from '../DashboardComponent/Dashboard';
 
-const App = () => {
-  return (
-    <div className="App">
-      <header className="App-header">Hi</header>
-    </div>
-  );
+export default class App extends React.Component {
+	componentDidMount() {
+		if((localStorage.getItem("APILink") !== undefined || localStorage.getItem("APILink") !== '') &&
+		(localStorage.getItem("AccessToken") !== undefined || localStorage.getItem("AccessToken") !== '')) {
+			return <Redirect to="/dashboard" />
+		};
+	}
+
+	render() {
+	  return (
+	    <Switch>
+  		  <Route exact path="/" component={Login} />
+  		  <Route path="/dashboard" component={Dashboard} />
+  		  <Redirect to="/" />
+  		</Switch>
+	  );
+	}
 }
-
-export default App;

src/Components/DashboardComponent/Dashboard.tsx

@@ -0,0 +1,7 @@
+import React from 'react';
+
+export default class Dashboard extends React.Component {
+	render () {
+		return (<h1> This is the dashboard, fuck yeah </h1>)
+	}
+}

src/Components/LoginComponent/Login.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import { Card, Button, InputGroup, FormControl } from 'react-bootstrap';
+
+export default class Login extends React.Component {
+	// eslint-disable-next-line
+	constructor(props: any) {
+      super(props);
+    }
+
+	render () {
+		return (
+			<div className="LoginComponent">
+				<Card className="text-center">
+				  <Card.Body>
+				    <Card.Title>Please login to see the dashboard.</Card.Title>
+				    <Card.Text>
+				      Please fill in the following items: <br /><br />
+						<InputGroup className="mb-3">
+					      <InputGroup.Prepend>
+					        <InputGroup.Text id="inputGroup-sizing-default">API url</InputGroup.Text>
+					      </InputGroup.Prepend>
+					      <FormControl
+					        aria-label="Default"
+					        aria-describedby="inputGroup-sizing-default"
+					      />
+					    </InputGroup>
+						<InputGroup className="mb-3">
+					      <InputGroup.Prepend>
+					        <InputGroup.Text id="inputGroup-sizing-default">API token</InputGroup.Text>
+					      </InputGroup.Prepend>
+					      <FormControl
+					        aria-label="Default"
+					        aria-describedby="inputGroup-sizing-default"
+					      />
+					    </InputGroup>
+				    </Card.Text>
+				    <Button variant="primary">Login</Button>
+				  </Card.Body>
+				  <Card.Footer className="text-muted">Your last login was X-X-X @ XX:XX</Card.Footer>
+				</Card>
+			</div>
+			);
+	}
+}