need4deed-org / need4deed-org/fe

feat: add volunteer map tab showing available/active volunteers by postcode

Open
#623 0 comments 0 reactions 1 assignee View on GitHub

@DarrellRoberts is already working on this.

Since Sep 16, 2026.

enhancement
Dominant language
TypeScript
Stars
3
Forks
24
Avg merge
2d 16h
Merged PRs (30d)
44

Description

Summary

The volunteer search page already has ViewMode.MAP defined in src/components/Dashboard/common/types.ts and the VolunteerListController already switches on it. Wire up the map view.

Behaviour

  • Show only volunteers with statusEngagement = available OR statusMatch = active (same filters already available in the filter panel)
  • Place one pin per volunteer at their postcode lat/lon (from https://github.com/need4deed-org/be/issues/661)
  • Skip volunteers with no coordinates
  • Clicking a pin navigates to the volunteer detail page

Tasks

  • Add a 3rd tab "Karte" to Volunteers.tsx (currently has 2 tabs)
  • In VolunteerListController, render MapView when ViewMode.MAP
  • Pass volunteer markers from the list query result
  • Pre-apply engagement/match status filter when map tab is active

Depends on

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.