Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add map picker for land registration #251

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

MarcusDavidG
Copy link

@MarcusDavidG MarcusDavidG commented Dec 19, 2024

  • Add MapPicker component for visual coordinate selection
  • Integrate map picker into RegisterLandModal
  • Replace manual coordinate input with interactive map
  • Add visual marker for selected location
  • Display selected coordinates below map

Detailed Information

Title

Add map picker for land registration coordinates

Description

Changes Made

  • Added new MapPicker component for visual coordinate selection
  • Integrated interactive map into RegisterLandModal
  • Replaced manual coordinate input fields with map interface
  • Added visual marker to show selected location
  • Added coordinate display below map

Features

  • Users can now click on a map to select land coordinates
  • Real-time display of selected latitude and longitude
  • Visual marker shows the exact selected location
  • Map is fully interactive with zoom and pan controls
  • Maintains all existing form validation and submission logic

Technical Details

  • Uses react-leaflet for map implementation
  • Dynamically loaded to avoid SSR issues
  • Properly handles marker icon assets
  • Maintains TypeScript type safety
  • Preserves existing form functionality

Testing

To test the changes:

  1. Navigate to the land registration form.
  2. Click on the map to select a location.
  3. Verify the coordinates update.
  4. Complete other form fields.
  5. Submit the form with the selected location.

Related Issues

Closes #240


Type of Change

  • 🐛 Bug fix or ⚙️ Enhancement
  • ✨ New feature or chore (change with no new features or fixes)
  • 📚 Documentation update

Checklist (select as many as applicable)

  • The code follows the style guidelines of this project.
  • All new and existing tests pass.
  • This pull request is ready to be merged and reviewed.

- Add MapPicker component for visual coordinate selection
- Integrate map picker into RegisterLandModal
- Replace manual coordinate input with interactive map
- Add visual marker for selected location
- Display selected coordinates below map
Copy link
Contributor

@Solomonsolomonsolomon Solomonsolomonsolomon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You installed a package,yet the package.json was not modified, please fix

@fishonamos fishonamos self-requested a review December 20, 2024 06:13
- Add leaflet: ^1.9.4
- Add react-leaflet: ^5.0.0
- Add @types/leaflet: ^1.9.15
Copy link
Author

@MarcusDavidG MarcusDavidG left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully updated the package.json by committing the package.json and package-lock.json files that include the Leaflet dependencies:
leaflet: ^1.9.4
react-leaflet: ^5.0.0
@types/leaflet: ^1.9.15

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Latitude and longitude should be picked from map on land registraion
2 participants