Simplify components, add sha256() for later

mapper/src/App.js

@@ -11,8 +11,6 @@ import 'leaflet/dist/leaflet.css';
 import 'react-range-slider-input/dist/style.css';
 
 
-let tzcache = {};
-
 // num: number of steps per duration
 // secs: number of seconds per step
 const durations = [
@@ -38,6 +36,13 @@ const parseSlider = (end, duration, slider) => {
 	return [lowStr, highStr];
 };
 
+//async function sha256(source) {
+//	const sourceBytes = new TextEncoder().encode(source);
+//	const digest = await crypto.subtle.digest('SHA-256', sourceBytes);
+//	const resultBytes = [...new Uint8Array(digest)];
+//	return resultBytes.map(x => x.toString(16).padStart(2, '0')).join('');
+//}
+
 function useSensor(measurement, name, end, duration) {
 	const [data, setData] = useState(false);
 	const [loading, setLoading] = useState(false);
@@ -67,7 +72,7 @@ function useSensor(measurement, name, end, duration) {
 
 
 
-function Owntracks({end, duration, slider}) {
+function Map({end, duration, slider}) {
 	const [data, loading] = useSensor('owntracks', 'OwnTracks', end, duration);
 
 	const range = parseSlider(end, duration, slider);
@@ -81,7 +86,7 @@ function Owntracks({end, duration, slider}) {
 	}
 
 	return (
-		<>
+		<div className='container'>
 			{loading ?
 				<p>Loading...</p>
 			:
@@ -103,15 +108,6 @@ function Owntracks({end, duration, slider}) {
 						</form>
 					</>
 			}
-		</>
-	);
-}
-
-
-function Graphs({end, duration, slider}) {
-	return (
-		<div className='container'>
-			<Owntracks end={end} duration={duration} slider={slider} />
 		</div>
 	);
 }
@@ -267,7 +263,7 @@ function App() {
 				setSlider={setSlider}
 			/>
 
-			<Graphs
+			<Map
 				end={end}
 				duration={duration}
 				slider={slider}