54 lines
1.2 KiB
TypeScript
54 lines
1.2 KiB
TypeScript
import React from 'react';
|
|
import Map from '../components/Map';
|
|
import {
|
|
IonHeader,
|
|
IonToolbar,
|
|
IonButtons,
|
|
IonMenuButton,
|
|
IonTitle,
|
|
IonContent,
|
|
IonPage,
|
|
} from '@ionic/react';
|
|
import { Location } from '../models/Location';
|
|
import { connect } from '../data/connect';
|
|
import * as selectors from '../data/selectors';
|
|
import './MapView.scss';
|
|
|
|
interface OwnProps {}
|
|
|
|
interface StateProps {
|
|
locations: Location[];
|
|
mapCenter: Location;
|
|
}
|
|
|
|
interface DispatchProps {}
|
|
|
|
interface MapViewProps extends OwnProps, StateProps, DispatchProps {}
|
|
|
|
const MapView: React.FC<MapViewProps> = ({ locations, mapCenter }) => {
|
|
return (
|
|
<IonPage id="map-view">
|
|
<IonHeader>
|
|
<IonToolbar>
|
|
<IonButtons slot="start">
|
|
<IonMenuButton></IonMenuButton>
|
|
</IonButtons>
|
|
<IonTitle>Map</IonTitle>
|
|
</IonToolbar>
|
|
</IonHeader>
|
|
|
|
<IonContent class="map-page">
|
|
<Map locations={locations} mapCenter={mapCenter} />
|
|
</IonContent>
|
|
</IonPage>
|
|
);
|
|
};
|
|
|
|
export default connect<OwnProps, StateProps, DispatchProps>({
|
|
mapStateToProps: (state) => ({
|
|
locations: state.data.locations,
|
|
mapCenter: selectors.mapCenter(state),
|
|
}),
|
|
component: MapView,
|
|
});
|