Finished login component

Did the following:
 - Extract front-end from component;
 - Added localStorage for remembering API details and access key;
 - Added routing to login component;

Todo:
 - Remove getApi*FromDTO;
 - Create ProtectedRoute to prevent unauthorized entry to /dashboard;

src/Components/AppComponent/App.tsx

@@ -6,18 +6,14 @@ import Login from '../LoginComponent/Login';
 import Dashboard from '../DashboardComponent/Dashboard';
 
 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} />
+  		  <Route exact path="/"
+		  	component={Login} />
+  		  <Route path="/dashboard"
+		  	component={Dashboard} />
   		  <Redirect to="/" />
   		</Switch>
 	  );

src/Components/LoginComponent/Login.tsx

@@ -1,44 +1,61 @@
 import React from 'react';
-import { Card, Button, InputGroup, FormControl } from 'react-bootstrap';
+import LoginView from '../../Views/LoginView';
+import API_DTO from '../../DTOs/api.dto';
+
+export default class Login extends React.Component<{
+	history: any
+}, {
+	dto: any
+}> {
 
-export default class Login extends React.Component {
 	// eslint-disable-next-line
 	constructor(props: any) {
       super(props);
+	  this.persistApiLink = this.persistApiLink.bind(this);
+	  this.persistAccessToken = this.persistAccessToken.bind(this);
+	  this.verifyLogin = this.verifyLogin.bind(this);
+	  this.getApiLinkFromDTO = this.getApiLinkFromDTO.bind(this);
+	  this.getApiTokenFromDTO = this.getApiTokenFromDTO.bind(this);
     }
 
-	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>
-			);
+	componentDidMount() {
+   	  const DTO = new API_DTO();
+	  DTO.setApiLink(localStorage.getItem("APILink"));
+  	  DTO.setApiToken(localStorage.getItem("AccessToken"));
+  	  this.setState({ dto: DTO });
+	}
+
+	verifyLogin() {
+		console.log("API Link: " + this.state.dto.getApiLink());
+		console.log("API Token: " + this.state.dto.getApiToken());
+		localStorage.setItem("lastLoggedIn", new Date().toUTCString());
+		// eslint-disable-next-line
+		this.props.history.push('/dashboard');
+	};
+
+	getApiLinkFromDTO(): string {
+		return this.state.dto.getApiLink();
+	}
+
+	getApiTokenFromDTO(): string {
+		return this.state.dto.getApiToken();
+	}
+
+	persistApiLink(e: any): void {
+		this.state.dto.setApiLink(e.target.value);
+	}
+
+	persistAccessToken(e: any): void {
+		this.state.dto.setApiToken(e.target.value);
+	}
+
+	render() {
+		return (<LoginView
+				persistApiLink={this.persistApiLink}
+				persistAccessToken={this.persistAccessToken}
+				verifyLogin={this.verifyLogin}
+				getApiLinkFromDTO={this.getApiLinkFromDTO}
+				getApiTokenFromDTO={this.getApiTokenFromDTO}
+			/>);
 	}
 }