import React from 'react';

import Hello from '../components/hello';
//TODO Why is this component not working?
//import Map from '../components/map';
import MapSimple from '../components/map-simple';
import MapNext from '../components/map-next';
import MapNxt from '../components/map-nxt';
//TODO Why is this component not working?
//import MapNxt2 from '../components/map-nxt2';
import MapArray from '../components/map-array';
//TODO Why is this component not working?
//import MapWithMarker from '../components/map-with-marker';
import MapCircleFixed from '../components/map-circle-fixed';
import Map1kCircleFixed from '../components/map-1k-circle-fixed';
import '../style.css';

const array = [
    {id: '1', lat: '52.2659474', lon: '10.43949', name: 'Software Ingenieur Begerad'},
    {id: '3', lat: '53.5836365', lon: '10.015369', name: 'WTF Kooperative eG'},
    {id: '4', lat: '48.0143619', lon: '7.8450213', name: 'WEtell GmbH'},
    {id: '5', lat: '53.6388387', lon: '10.014872', name: 'Hostsharing eG'},
    {id: '6', lat: '50.8320953', lon: '6.4719321', name: 'AfB gGmbH'}
];

const Home = () => {
    return (
	<>
	    <h2>Home</h2>
	    <h3>(React.js Lambda Function Component)</h3>
	    <Hello msg="Hello World!" />
	    {/**<Map />*/}
	    {/**<MapWithMarker />*/}
	    <br />
	    <MapArray array={ array } />
	    <br />
	    <MapNext />
	    <br />
	    <MapNxt />
	    <br />
	    <MapSimple />
	    <MapCircleFixed />
	    <Map1kCircleFixed />
	</>
    );
}

export default Home
