From 74a745b9d625c3c6c6747167a740922b03231a4b Mon Sep 17 00:00:00 2001 From: "Begerad, Stefan" Date: Mon, 11 Sep 2023 21:55:56 +0200 Subject: [PATCH] feat: add DB FaSta and StaDa content --- app/app.jsx | 6 +-- app/components/fasta.jsx | 69 +++++++++++++++++++++++++++++++++++ app/components/wikidata.jsx | 4 +- app/pages/station-profile.jsx | 28 +++++++++++--- app/utils/request.js | 22 ++++++++++- package-lock.json | 4 +- package.json | 6 +-- 7 files changed, 122 insertions(+), 17 deletions(-) create mode 100644 app/components/fasta.jsx diff --git a/app/app.jsx b/app/app.jsx index fd15e3e..58e0749 100644 --- a/app/app.jsx +++ b/app/app.jsx @@ -13,9 +13,9 @@ export default function App() { return (
-

- This website (Version: {VERSION}) dislays a public transport station profile for the provided UIC station code. - +

+ This website (Version: {VERSION}) dislays a public transport station profile for the provided UIC station code. + } /> } /> diff --git a/app/components/fasta.jsx b/app/components/fasta.jsx new file mode 100644 index 0000000..7b2fb95 --- /dev/null +++ b/app/components/fasta.jsx @@ -0,0 +1,69 @@ +import React, { useEffect, useState } from 'react'; +import PropTypes from 'prop-types'; + +import { + getDB +} from '../utils/request'; + +/** + * @param dbStdSttn object from DB Stada API + * @return object DB Fasta as JSON object + */ +async function fetchFasta(dbStdSttn) { + const no = dbStdSttn.result[0].number; + //console.log('fetchFasta() no: ' + no); + const address = 'https://apis.deutschebahn.com/db-api-marketplace/apis/fasta/v2/stations/' + no; + //console.log('fetchFasta() address: ' + address); + const objct = await getDB(address); + const strng = JSON.stringify(objct); + //console.log('fetchFasta() strng: ' + strng); + return objct; + }; + +/*destructure props object*/ +export default function Fasta ({ sttn }) { + + const [fastaSttn, setFastaSttn] = useState({}); + + /*fetch array in a JavaScript function*/ + const fetch = async () => { + if ( Object.keys(sttn).length !== 0 ) { + //console.log('Fasta:fetch() sttn: ' + JSON.stringify(sttn)); + const rslt = sttn.result; + if ((rslt !== undefined || rslt !== null ) && rslt.length > 0) { + //console.log('Fasta:fetch() rslt.lngth: ' + rslt.length); + const objct = await fetchFasta(sttn); + const strng = JSON.stringify(objct); + //console.log('Fasta:fetch() strng: ' + strng); + setFastaSttn((fastaSttn) => objct); + } else { + console.error('fetch() rslt NOT valid'); + } + } else { + console.error('fetch() sttn NOT valid'); + } + }; + + useEffect(() => { + /*effect goes here*/ + fetch(); + /*use an empty dependency array to ensure the hook is running only once*/ + /*TODO study dependency array: https://reactjs.org/docs/hooks-effect.html*/ + }, [sttn]); + + return ( + <> +

Station Facilities  + + (DB FaSta) + +

+
+		    {JSON.stringify(fastaSttn, null, '\t')}
+		
+ + ); +}; +Fasta.propTypes = { + sttn: PropTypes.object +}; diff --git a/app/components/wikidata.jsx b/app/components/wikidata.jsx index 7bcc082..28a53be 100644 --- a/app/components/wikidata.jsx +++ b/app/components/wikidata.jsx @@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import { - get, getWikidata } from '../utils/request'; @@ -28,14 +27,13 @@ export default function Wikidata ({ sttn }) { if ((sttn !== undefined || sttn !== null ) && sttn.length > 0) { //console.log('fetch() sttn.length: ' + sttn.length); - const objct = await getWikidata(sttn[0].tags.wikidata); //console.log('fetch() objct.type: ' + objct.type); const strng = JSON.stringify(objct); //console.log('fetch() strng: ' + strng); setWikidata((wikidata) => objct); } else { - //console.log('fetch() sttn NOT valid'); + console.error('fetch() sttn NOT valid'); } }; diff --git a/app/pages/station-profile.jsx b/app/pages/station-profile.jsx index 225993b..c279d2e 100644 --- a/app/pages/station-profile.jsx +++ b/app/pages/station-profile.jsx @@ -1,17 +1,17 @@ import React, { useEffect, useState } from 'react'; import { useParams } from "react-router-dom"; -import { - get -} from '../utils/request'; +import { get, getDB } from '../utils/request'; import Wikidata from '../components/wikidata'; +import Fasta from '../components/fasta'; export default function StationProfile() { // Get the userId param from the URL. const { uic } = useParams(); + const [stada, setStada] = useState({}); const [sttnRry, setSttnRry] = useState([]); const [bsRry, setBsRry] = useState([]); const [bpRry, setBpRry] = useState([]); @@ -24,8 +24,17 @@ export default function StationProfile() { ////console.log('StationProfile:useEffect() uic: ' + uic); - const address = 'https://overpass-api.de/api/interpreter?data=[out:json][timeout:60];node[uic_ref=' + uic + '];'; - ////console.log('StationProfile:useEffect() address: ' + address);/ + let address = 'https://apis.deutschebahn.com/db-api-marketplace/apis/station-data/v2/stations?eva=' + uic; + //console.log('StationProfile:useEffect() address: ' + address); + + //get db stada data + getDB(address). + then(data => { + setStada((stada) => data); + }); + + address = 'https://overpass-api.de/api/interpreter?data=[out:json][timeout:60];node[uic_ref=' + uic + '];'; + //console.log('StationProfile:useEffect() address: ' + address); //get station array get(address + 'node[public_transport=station][railway=station](around:2);out body center qt;') @@ -144,6 +153,15 @@ export default function StationProfile() { }) } +

Station Data  + + (DB StaDa) + +

+
+		{JSON.stringify(stada, null, '\t')}
+	    
+

Station Plan ( Key diff --git a/app/utils/request.js b/app/utils/request.js index ecfe6d1..d4071a1 100644 --- a/app/utils/request.js +++ b/app/utils/request.js @@ -19,7 +19,7 @@ export async function getWikidata(q) { * http get request * * @param pth path - * @return response as JSON data + * @return response as JSON object */ export async function get(pth) { const data = await fetch(pth, { @@ -32,3 +32,23 @@ export async function get(pth) { const objct = await data.json(); return objct; }; + +/** + * http get request for DB API + * + * @param pth path to DB API + * @return response as JSON object + */ +export async function getDB(pth) { + const data = await fetch(pth, { + method: 'GET', + headers: { + 'DB-Api-Key': '08bb79b8e4c2711852bb48d09b0299c3', + 'DB-Client-Id': 'a86337b51c0361477219b62df158d5b7', + 'Accept': 'application/json', + 'Content-Type': 'application/json' + } + }); + const objct = await data.json(); + return objct; +}; diff --git a/package-lock.json b/package-lock.json index d7a435f..f3b885d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { - "name": "react-example", + "name": "station-profile", "version": "0.5.0", "lockfileVersion": 2, "requires": true, "packages": { "": { - "name": "react-example", + "name": "station-profile", "version": "0.5.0", "license": "GPL-3.0-or-later", "dependencies": { diff --git a/package.json b/package.json index 260a182..73f1c9e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "private": true, - "name": "react-example", - "description": "React.js example", + "name": "station-profile", + "description": "Station Profile", "version": "0.5.0", "main": "index.js", "keywords": [ @@ -16,7 +16,7 @@ "test": "echo \"Error: no test specified\" && exit 1" }, "devDependencies": { - "@babel/core": "7.22.10", + "@babel/core": "7.22.10", "@babel/preset-env": "7.22.10", "@babel/preset-react": "7.22.5", "babel-loader": "9.1.3",