Add satellite/OSM toggle to map#138
Conversation
Introduce a satellite view toggle for the map. Adds MdSatellite/MdSatelliteAlt imports, a persistent isSatellite state (useLocalStorage key "isSatellite"), and a control button (with tooltip) that switches the tile layers. When enabled, the map uses Esri World_Imagery tiles plus a semi-transparent OpenRailwayMap overlay; when disabled it falls back to the original OpenStreetMap + OpenRailwayMap attribution and tile. Also introduces a SatelliteIcon computed from isSatellite and preserves existing controls and fullscreen behavior.
📝 WalkthroughWalkthrough
ChangesSatellite View Toggle
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/map/components/Map.tsx`:
- Around line 287-291: The TileLayer component in the Map.tsx file has a
className attribute set to styles.test which appears to be a development
artifact. Verify whether this test styling is intentional for the TileLayer
component; if it is not needed, remove the className prop entirely from the
TileLayer element.
- Around line 280-284: The TileLayer component rendering the OpenRailwayMap
tiles (with url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png")
has an attribution prop that duplicates credit already included in the main Esri
TileLayer attribution, causing OpenRailwayMap to appear twice in the map footer.
Remove the attribution prop from this OpenRailwayMap TileLayer component to
eliminate the duplicate while keeping the credit in the primary attribution
source.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 0a21d0cc-01f9-442d-8a25-0d4c8c412aff
📒 Files selected for processing (1)
packages/map/components/Map.tsx
| <TileLayer | ||
| url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png" | ||
| opacity={0.6} | ||
| attribution='© <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a>' | ||
| /> |
There was a problem hiding this comment.
Remove duplicate OpenRailwayMap attribution.
The OpenRailwayMap attribution on line 283 duplicates the credit already included in the main Esri TileLayer attribution on line 277. Leaflet combines all TileLayer attributions, causing OpenRailwayMap to appear twice in the map footer.
🧹 Proposed fix
<TileLayer
url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png"
opacity={0.6}
- attribution='© <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a>'
/>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <TileLayer | |
| url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png" | |
| opacity={0.6} | |
| attribution='© <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a>' | |
| /> | |
| <TileLayer | |
| url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png" | |
| opacity={0.6} | |
| /> |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/map/components/Map.tsx` around lines 280 - 284, The TileLayer
component rendering the OpenRailwayMap tiles (with
url="https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png") has an
attribution prop that duplicates credit already included in the main Esri
TileLayer attribution, causing OpenRailwayMap to appear twice in the map footer.
Remove the attribution prop from this OpenRailwayMap TileLayer component to
eliminate the duplicate while keeping the credit in the primary attribution
source.
| <TileLayer | ||
| className={styles.test} | ||
| attribution='© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | © <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a> | <a href="https://discord.gg/d65Q8gWM5W">Created by SimRail France 🇫🇷 Community</a>' | ||
| url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" | ||
| /> |
There was a problem hiding this comment.
Verify or remove className={styles.test}.
The className test on line 288 appears to be a development artifact. Verify whether this styling is intentional; if not, please remove it.
🧹 Proposed fix (if unintentional)
<TileLayer
- className={styles.test}
attribution='© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | © <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a> | <a href="https://discord.gg/d65Q8gWM5W">Created by SimRail France 🇫🇷 Community</a>'
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <TileLayer | |
| className={styles.test} | |
| attribution='© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | © <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a> | <a href="https://discord.gg/d65Q8gWM5W">Created by SimRail France 🇫🇷 Community</a>' | |
| url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" | |
| /> | |
| <TileLayer | |
| attribution='© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | © <a href="http://www.openrailwaymap.org/">OpenRailwayMap</a> | <a href="https://discord.gg/d65Q8gWM5W">Created by SimRail France 🇫🇷 Community</a>' | |
| url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" | |
| /> |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/map/components/Map.tsx` around lines 287 - 291, The TileLayer
component in the Map.tsx file has a className attribute set to styles.test which
appears to be a development artifact. Verify whether this test styling is
intentional for the TileLayer component; if it is not needed, remove the
className prop entirely from the TileLayer element.
1 participant
Introduce a satellite view toggle for the map.
Adds MdSatellite/MdSatelliteAlt imports, a persistent isSatellite state (useLocalStorage key "isSatellite"), and a control button (with tooltip) that switches the tile layers. When enabled, the map uses Esri World_Imagery tiles plus a semi-transparent OpenRailwayMap overlay; when disabled it falls back to the original OpenStreetMap + OpenRailwayMap attribution and tile.
Also introduces a SatelliteIcon computed from isSatellite and preserves existing controls and fullscreen behavior.
Summary by CodeRabbit
Release Notes