Merge pull request #3 from williameriksson126/we-AccessToken-class

Add: AccessToken now updated to seperate class

package-lock.json

@@ -12386,6 +12386,11 @@
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
+    "react-native-push-notification": {
+      "version": "6.1.3",
+      "resolved": "https://registry.npmjs.org/react-native-push-notification/-/react-native-push-notification-6.1.3.tgz",
+      "integrity": "sha512-qNbFCkObCXwSFQbK6hJyx1Bym1D7V4XM8iN2L6eL3GAdNLmeBTdLdx3mPbKJtuaDJ1+deniFTQ2rz6hU4ELOXA=="
+    },
     "react-push-notification": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/react-push-notification/-/react-push-notification-1.3.0.tgz",

package.json

@@ -10,6 +10,7 @@
     "react": "^17.0.1",
     "react-axios": "^2.0.3",
     "react-dom": "^17.0.1",
+    "react-native-push-notification": "^6.1.3",
     "react-push-notification": "^1.3.0",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.0",

src/App.js

@@ -5,7 +5,7 @@ import React, { Component } from "react";
 import { BrowserRouter as Router, Route } from "react-router-dom";
 
 import BottomMenu from "./components/BottomMenu.js";
-import AccessToken from "./components/AccessToken.js";
+//import AccessToken from "./components/AccessToken.js";
 import NearbyStation from "./components/NearbyStation";
 
 import Tickets from "./components/pages/Tickets.js";

src/classes/AccessToken.js

@@ -0,0 +1,21 @@
+import axios from 'axios';
+
+class AccessToken {
+    credentials = 'NXR5N2d4bUFmUWxVSERIZG03a2dhcVh3SzVJYTp3cElPVVJuSkpjVHRPNnJPUlltWVlQcTR3WGth'
+    device = '123'
+
+    constructor() {
+        const headers = {
+          'Content-Type': 'application/x-www-form-urlencoded',
+          'Authorization': 'Basic ' + this.credentials
+        };
+
+        axios.post('https://api.vasttrafik.se/token','grant_type=client_credentials&scope=device_'+this.device, {headers} )
+            .then(response => {
+                console.log(response);
+                this.token = response.data.access_token
+        });
+    }
+}
+
+export default AccessToken

src/components/AccessToken.js

@@ -1,65 +0,0 @@
-import React from 'react';
-import axios from 'axios';
-
-var globToken = ''
-
-const GetToken = () => {
-  const vars = {
-    credentials: 'NXR5N2d4bUFmUWxVSERIZG03a2dhcVh3SzVJYTp3cElPVVJuSkpjVHRPNnJPUlltWVlQcTR3WGth',
-    token: undefined,
-    device: '123',
-  }
-
-  const headers = {
-    'Content-Type': 'application/x-www-form-urlencoded',
-    'Authorization': 'Basic ' + vars.credentials
-  };
-
-  axios.post('https://api.vasttrafik.se/token','grant_type=client_credentials&scope=device_'+vars.device, { headers })
-    .then(response => {
-      console.log(response);
-      globToken = response.data.access_token
-  });
-}
-
-class AccessToken extends React.Component {
-  state = {
-    token: 'No Token',
-  }
-
-  handleChange = event => {
-    this.setState({ token: event.target.value});
-  }
-
-  handleSubmit = event => {
-    event.preventDefault();
-
-    this.setState({
-      credentials: 'Attempting to send token'
-    });
-    GetToken();
-  }
-
-  handleFetch = event => {
-    event.preventDefault();
-    this.setState({token: globToken})
-  }
-
-  render() {
-    return (
-      <div>
-        <form onSubmit={this.handleSubmit}>
-          <button type="submit">Get Token</button>
-        </form>
-        <h1>
-          {this.state.token}
-        </h1>
-        <form onSubmit={this.handleFetch}>
-          <button type="submit">fetch</button>
-        </form>
-      </div>
-    )
-  }
-}
-
-export default AccessToken

src/components/NearbyStation.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import axios from 'axios';
+import AccessToken from '../classes/AccessToken'
 
 class NearbyStation extends React.Component {
     state = {
@@ -7,7 +8,7 @@ class NearbyStation extends React.Component {
         long: '12.0',
         stops: [],
         token: undefined,
-        device: '123',
+        tokenClass: new AccessToken()
     }
 
     handleChangeLat = event => {
@@ -18,15 +19,11 @@ class NearbyStation extends React.Component {
         this.setState({ long: event.target.value});
     }
 
-    handleChangeToken = event => {
-        this.setState({ token: event.target.value})
-    }
-
     handleSubmit = event => {
         event.preventDefault();
 
         const headers = {
-            'Authorization': 'Bearer ' + this.state.token
+            'Authorization': 'Bearer ' + this.state.tokenClass.token
         };
 
         console.log('Attempted connection')
@@ -52,10 +49,6 @@ class NearbyStation extends React.Component {
                         Longitude coord:
                         <input type="text" name="long" onChange={this.handleChangeLong} />
                     </label>
-                    <label>
-                        Token:
-                        <input type="text" name="token" onChange={this.handleChangeToken} />
-                    </label>
                     <button type="submit">Stops</button>
                 </form>
                 <h1>