File size: 2,814 Bytes
0c20ea8 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 |
import React, { useState, useEffect } from "react";
import { useDispatch } from "react-redux";
import { fetchPoiRequest } from "./redux/actions/poiActions";
import { poiList } from "./data/data";
import { Poi } from "./redux/types/Poi";
import DropDown from "./components/generalInformation/dropdown/DropDown";
import DemographicsSection from "./sections/demographics";
import FootfallSection from "./sections/footfall";
import ModeSection from "./sections/mode";
import DescriptionSection from "./sections/description";
import InformationSection from "./sections/information";
import DrawerSection from "./sections/drawer";
import TraficSection from "./sections/trafic";
import MapSection from "./sections/map";
import GraphSections from "./components/main/GraphSections";
import "./styles/global/App.css";
import "./styles/global/customScrollBar.css";
const App = () => {
const [selectedPoi, setSelectedPoi] = useState<Poi>(poiList.items[0]);
const [isFootfallSection, setFootfallSection] = useState(true);
const [isModeSection, setModeSection] = useState(true);
const [isDemographicsSection, setDemographicsSection] = useState(true);
const [isInformationSection, setInformationSection] = useState(true);
const [isTraficSection, setTraficSection] = useState(true);
const [isMapView, setIsMapView] = useState(false);
const dispatch = useDispatch();
useEffect(() => {
dispatch(fetchPoiRequest());
}, [dispatch]);
return (
<div className="rootContent">
<DrawerSection
poiList={poiList.items}
setSelectedPoi={setSelectedPoi}
isFootfallSection={isFootfallSection}
setFootfallSection={setFootfallSection}
isModeSection={isModeSection}
setModeSection={setModeSection}
isDemographicsSection={isDemographicsSection}
setDemographicsSection={setDemographicsSection}
isInformationSection={isInformationSection}
setInformationSection={setInformationSection}
isTraficSection={isTraficSection}
setTraficSection={setTraficSection}
isMapView={isMapView}
setIsMapView={setIsMapView}
/>
{isMapView ? (
<MapSection selectedPoi={selectedPoi} />
) : (
<div className="mainContent">
<br></br>
<DropDown
poiList={poiList.items}
selectedPoi={selectedPoi}
setSelectedPoi={setSelectedPoi}
/>
<GraphSections
selectedPoi={selectedPoi}
isDemographicsSection={isDemographicsSection}
isFootfallSection={isFootfallSection}
isModeSection={isModeSection}
isInformationSection={isInformationSection}
isTraficSection={isTraficSection}
/>
</div>
)}
</div>
);
};
export default App;
|