diff --git a/MAP_EVENT_INTEGRATION.md b/MAP_EVENT_INTEGRATION.md index c9a5d8d..ae99dfd 100644 --- a/MAP_EVENT_INTEGRATION.md +++ b/MAP_EVENT_INTEGRATION.md @@ -4,6 +4,12 @@ Successfully integrated cleanup events with the interactive map, allowing users to view both litter reports and cleanup events on the same map interface. +## Recent Updates + +### Latest Changes (Commit: 8e73d8a) +1. **Event Popup Enhancement**: Added "View Event Details" button that navigates to `/events?id={eventId}` +2. **Map Positioning**: Adjusted default center from Dublin (53.3498, -6.2603) to (53.4, -7.5) to show all of Ireland, especially when filter panel is open + ## Changes Made ### 1. MapPage Component (`src/pages/MapPage.tsx`) @@ -43,6 +49,12 @@ Successfully integrated cleanup events with the interactive map, allowing users - 32x32 pixel markers with white border - Hover effects and click interactions - Detailed popup with formatted information +- "View Event Details" button in popup for navigation to event page + +**Map Positioning:** +- Default center: (53.4, -7.5) - optimized to show all of Ireland +- Zoom level: 7 +- Ensures Ireland is fully visible even with filter panel open ### 3. MapFilters Component (`src/components/map/MapFilters.tsx`) @@ -76,6 +88,7 @@ Each event popup shows: - ♻️ Litter collected (for completed events) - Status badge (color-coded) - Event description +- **"View Event Details" button** - navigates to event details page ## API Integration @@ -138,11 +151,17 @@ This implementation addresses: - **Requirement 2.1**: Interactive map visualization - **Requirement 2.2**: Marker click handlers -## Commit +## Commits -Changes committed with message: +### Initial Implementation (91ecbd2) ``` Link map items with events - Display cleanup events on interactive map ``` -Git hash: `91ecbd2` +### Enhancement (8e73d8a) +``` +Improve event popup and map positioning + +- Added 'View Event Details' button in event popup +- Adjusted map center to better show all of Ireland +``` diff --git a/src/components/map/MapView.tsx b/src/components/map/MapView.tsx index a56ade4..a183f30 100644 --- a/src/components/map/MapView.tsx +++ b/src/components/map/MapView.tsx @@ -43,7 +43,7 @@ export function MapView({ showClusters = true, showHeatmap = false, showHotspots = false, - center = [53.4, -7.5], // Centered to show all of Ireland + center = [53.4, -8.0], // Centered to show all of Ireland with filter panel open zoom = 7, }: MapViewProps) { const mapRef = useRef(null);