"use client";
import "leaflet/dist/leaflet.css";
import { useMapStore } from "_store/mapStore";
import { MapContainer } from "react-leaflet";
import { BaseMaps } from "(dispatch)/_components/map/BaseMaps";
import { ContextMenu } from "(dispatch)/_components/map/ContextMenu";
import { MissionMarkers } from "(dispatch)/_components/map/MissionMarkers";
import { SearchElements } from "(dispatch)/_components/map/SearchElements";

export default ({}) => {
	const { map } = useMapStore();

	return (
		<MapContainer className="flex-1" center={map.center} zoom={map.zoom}>
			<BaseMaps />
			<SearchElements />
			<ContextMenu />
			<MissionMarkers />
		</MapContainer>
	);
};