Re-enable map legend UI

[ramakanth98]

Description

Restores the map legend UI by rendering MapLegend again and adds static placeholder entries (with a note) so it appears even without backend data. Also makes the legend non-interactive so map gestures pass through.
Fixes #182.

Type of Change

• Bug fix
• New feature
• Documentation update
• Refactor
• Other (please describe):

How Has This Been Tested?

• Manual: npm run dev with Node v20.19.0 (Vite on http://localhost:5174/).
• Verified legend renders with placeholder entries and does not block map interactions.

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my code
• I have commented my code where necessary
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• I have updated the documentation (if applicable)

Related Issues

Fixes #182

Summary by CodeRabbit

Release Notes

• New Features

  • Map legend component is now enabled and displayed on the map interface
  • Added an informational note within the legend for additional context

• Improvements

  • Legend styling enhanced for better visual presentation and interaction
  • Legend overlay optimized to prevent interference with map navigation and gestures
  • Dark theme support improved for legend display

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

📝 Walkthrough

Walkthrough

The changes re-enable the MapLegend component in the App, refactor MapLegend to render legend items dynamically using data arrays, and add CSS styling to prevent the legend from blocking map interactions while introducing a legend-note section.

Changes

Cohort / File(s)	Summary
Component Integration & Refactoring src/App.tsx	Uncommented MapLegend component rendering to restore legend visibility in the main map view.
Legend Data-Driven Rendering src/components/Map/MapLegend.tsx	Introduced pointLegendItems and areaLegendItems arrays defining legend entries. Replaced static markup with dynamic map rendering for both Points and Areas sections. Added legend-note paragraph. Maintains React list stability using item.className as keys.
Legend Styling & Interaction src/styles/map.css	Added pointer-events: none and user-select: none to .map-legend to prevent legend from capturing map gestures. Introduced .legend-note class with styling (12px font, #7f8c8d color, 12px margin-bottom) and dark-mode override (color: #94a3b8).

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~15 minutes

Poem

🐰 The legend awakes from its slumber deep,
No longer hidden in code's dark keep!
With data arrays, neat and bright,
Points and areas dance in sight—
Non-blocking, graceful, a restful sight! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'Re-enable map legend UI' accurately and concisely summarizes the main change: uncommenting/enabling the MapLegend component rendering.
Linked Issues check	✅ Passed	All objectives from issue #182 are met: commented-out legend code re-enabled, MapLegend integrated into App.tsx, placeholder entries added, non-interactive overlay prevents gesture interference, and decisions documented.
Out of Scope Changes check	✅ Passed	All changes (MapLegend.tsx data refactor, CSS non-interactive styling, App.tsx uncomment) are directly aligned with issue #182 objectives; no extraneous modifications detected.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}