Merge pull request #2 from williameriksson126/we-VT-API-Access-Token-tests

We vt api access token tests

package-lock.json

@@ -3030,6 +3030,14 @@
       "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.0.2.tgz",
       "integrity": "sha512-arU1h31OGFu+LPrOLGZ7nB45v940NMDMEJeNmbutu57P+UFDVnkZg3e+J1I2HJRZ9hT7gO8J91dn/PMrAiKakA=="
     },
+    "axios": {
+      "version": "0.21.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.0.tgz",
+      "integrity": "sha512-fmkJBknJKoZwem3/IKSSLpkdNXZeBu5Q7GA/aRsr2btgrptmSCxi2oFjZHqGdK9DoTil9PIHlPIZw2EcRJXRvw==",
+      "requires": {
+        "follow-redirects": "^1.10.0"
+      }
+    },
     "axobject-query": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",

package.json

@@ -6,6 +6,7 @@
     "@testing-library/jest-dom": "^5.11.6",
     "@testing-library/react": "^11.1.2",
     "@testing-library/user-event": "^12.2.2",
+    "axios": "^0.21.0",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^5.2.0",

src/App.js

@@ -6,6 +6,8 @@ import { BrowserRouter as Router, Route } from 'react-router-dom';
 
 import NavigationDrawer from './components/NavigationDrawer.js'
 import BottomMenu from './components/BottomMenu.js'
+import AccessToken from './components/AccessToken.js'
+import NearbyStation from './components/NearbyStation';
 
 import Tickets from './components/pages/Tickets.js'; 
 import TicketsBuy from './components/pages/TicketsBuy.js';

src/components/AccessToken.js

@@ -0,0 +1,65 @@
+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/Button.js

@@ -1,4 +1,4 @@
-import React, {Component} from 'react'
+import React, {Component} from 'react';
 
 class Button extends Component {
     render() {

src/components/NearbyStation.js

@@ -0,0 +1,96 @@
+import React from 'react';
+import axios from 'axios';
+
+class NearbyStation extends React.Component {
+    state = {
+        lat: '57.7',
+        long: '12.0',
+        stops: [],
+        token: undefined,
+        device: '123',
+    }
+
+    handleChangeLat = event => {
+        this.setState({ lat: event.target.value});
+    }
+
+    handleChangeLong = event => {
+        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
+        };
+
+        console.log('Attempted connection')
+
+        axios.get('https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops?originCoordLat='+this.state.lat+'&originCoordLong='+this.state.long+'&maxNo=20&format=json', { headers })
+            .then(response => {
+                console.log(response.data.LocationList.StopLocation)
+                this.setState({
+                    stops: response.data.LocationList.StopLocation,
+                })
+            })
+    }
+
+    render() {
+        return (
+            <div>
+                <form onSubmit={this.handleSubmit}>
+                    <label>
+                        Lattitude coord:
+                        <input type="text" name="lat" onChange={this.handleChangeLat} />
+                    </label>
+                    <label>
+                        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>
+                    {this.state.lat}
+                </h1>
+                <h1>
+                    {this.state.long}
+                </h1>
+                {this.state.stops.map((item) =>
+                    <div>
+                        <h1>
+                            {item.name},
+                            {item.id},
+                            {item.lat},
+                            {item.lon},
+                            {item.track}
+                        </h1>
+                    </div>
+                )}
+            </div>
+        )
+    }
+}
+export default NearbyStation
+
+//https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops?originCoordLat=57.5987&originCoordLong=11.9454&maxNo=20&format=json
+
+//https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops
+
+
+//'https://reqres.in/api/articles'
+
+//'https://api.vasttrafik.se/token'
+
+//grant_type=client_credentials&scope=<device_id>
+
+//BPvMjPidHckBtETZxr3dHP1rptQa
+//z5MFCS_wwmqprc0s4iLZWBAUJdga