feat: add Wikidata content
This commit is contained in:
parent
c8816d5652
commit
bc59364067
|
@ -0,0 +1,60 @@
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
|
import {
|
||||||
|
get,
|
||||||
|
getWikidata
|
||||||
|
} from '../utils/request';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param osmSttn array of object of OSM station
|
||||||
|
* @return object
|
||||||
|
*/
|
||||||
|
async function fetchWikidata(osmSttn) {
|
||||||
|
const objct = await getWikidata(osmSttn[0].tags.wikidata);
|
||||||
|
//console.log('fetchWikidata() objct.type: ' + objct.type);
|
||||||
|
const strng = JSON.stringify(objct);
|
||||||
|
//console.log('fetchWikidata() strng: ' + strng);
|
||||||
|
return objct;
|
||||||
|
};
|
||||||
|
|
||||||
|
/*destructure props object*/
|
||||||
|
export default function Wikidata ({ sttn }) {
|
||||||
|
|
||||||
|
const [wikidata, setWikidata] = useState({});
|
||||||
|
|
||||||
|
/*fetch array in a JavaScript function*/
|
||||||
|
const fetch = async () => {
|
||||||
|
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');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
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 (
|
||||||
|
<>
|
||||||
|
<p>Wikidata</p>
|
||||||
|
<pre>
|
||||||
|
{JSON.stringify(wikidata, null, '\t')}
|
||||||
|
</pre>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
Wikidata.propTypes = {
|
||||||
|
sttn: PropTypes.array
|
||||||
|
};
|
|
@ -1,7 +1,11 @@
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
|
|
||||||
import {get} from '../utils/request';
|
import {
|
||||||
|
get
|
||||||
|
} from '../utils/request';
|
||||||
|
|
||||||
|
import Wikidata from '../components/wikidata';
|
||||||
|
|
||||||
export default function StationProfile() {
|
export default function StationProfile() {
|
||||||
|
|
||||||
|
@ -18,10 +22,10 @@ export default function StationProfile() {
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
||||||
//console.log('StationProfile:useEffect() uic: ' + uic);
|
////console.log('StationProfile:useEffect() uic: ' + uic);
|
||||||
|
|
||||||
const address = 'https://overpass-api.de/api/interpreter?data=[out:json][timeout:60];node[uic_ref=' + uic + '];';
|
const address = 'https://overpass-api.de/api/interpreter?data=[out:json][timeout:60];node[uic_ref=' + uic + '];';
|
||||||
//console.log('StationProfile:useEffect() address: ' + address);/
|
////console.log('StationProfile:useEffect() address: ' + address);/
|
||||||
|
|
||||||
//get station array
|
//get station array
|
||||||
get(address + 'node[public_transport=station][railway=station](around:2);out body center qt;')
|
get(address + 'node[public_transport=station][railway=station](around:2);out body center qt;')
|
||||||
|
@ -187,6 +191,7 @@ export default function StationProfile() {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</ul>
|
</ul>
|
||||||
|
<Wikidata sttn={sttnRry} />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,25 @@
|
||||||
|
/**
|
||||||
|
* get Wikidata content as string
|
||||||
|
* @param unique q Wikidata content identifier
|
||||||
|
* @return Wikidata content as string
|
||||||
|
*/
|
||||||
|
export async function getWikidata(q) {
|
||||||
|
//console.log('request:getWikidata() q: ' + q);
|
||||||
|
const address = 'https://www.wikidata.org/w/rest.php/wikibase/v0/entities/items/' + q;
|
||||||
|
//console.log('request:getWikidata() address: ' + address)
|
||||||
|
const objct = await get(address);
|
||||||
|
////console.log('request:getWikidata() objct: ' + JSON.stringify(objct));
|
||||||
|
//const strng = JSON.stringify(objct);
|
||||||
|
////console.log('request:getWikidata() strng: ' + strng);
|
||||||
|
//return strng;
|
||||||
|
return objct
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* http get request
|
* http get request
|
||||||
*
|
*
|
||||||
* @param pth path
|
* @param pth path
|
||||||
|
* @return response as JSON data
|
||||||
*/
|
*/
|
||||||
export async function get(pth) {
|
export async function get(pth) {
|
||||||
const data = await fetch(pth, {
|
const data = await fetch(pth, {
|
||||||
|
@ -11,6 +29,6 @@ export async function get(pth) {
|
||||||
'Content-Type': 'application/json'
|
'Content-Type': 'application/json'
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const jsonData = await data.json();
|
const objct = await data.json();
|
||||||
return jsonData;
|
return objct;
|
||||||
}
|
};
|
||||||
|
|
Loading…
Reference in New Issue