Repository navigation
feat: add interactive stations map with clustering and sidebar sync - #9
Merged
Merged
Conversation
- Create StationsMapContainer and StationsMap components with Mapbox integration - Add StationPin component with availability-based color coding (green/yellow/red) - Implement StationPopup showing station name, free bikes and empty slots - Update MapPlaceholder to support both networks and stations display - Integrate map into network detail page with Suspense and MapSkeleton fallback - Adjust DETAIL_ZOOM constant from 13 to 11 for better station visibility - Add unit tests for MapPlaceholder with stations support
- Create StationClusterMarkers component with Mapbox native clustering - Add STATION_CLUSTER_CONFIG with torea-bay color scale for visual distinction - Implement interactive cluster zoom on click - Update StationsMap to use clustering for better performance - Fix use-fit-bounds test to use MAP_CONFIG.DETAIL_ZOOM constant
- Create StationsSyncContext for shared state between sidebar and map - Add NetworkDetailClient wrapper to provide context - Refactor page.tsx to single fetch (was duplicated) - Make station rows clickable with flyTo animation to map - Sort stations by distance to map center - Add visual selection highlight on station rows - Support keyboard navigation (Enter/Space) for accessibility
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
New Components
StationsMap- Main map component with Mapbox integrationStationClusterMarkers- GeoJSON-based clustering with zoom-on-clickStationPin- Individual station markers with hover tooltipsStationPopup- Popup showing station name and bike/slot availabilityStationsSyncProvider- Context for sidebar-map state synchronizationAdditional Changes
StationRownow clickable with keyboard support and selected stateMapPlaceholderextended to support stations (for dev mode)STATION_CLUSTER_CONFIGconstantsTest Plan