feat(MediaMap): Implement onUnmounted cleanup and optimize cluster logic #1777
Conversation
✅ Deploy Preview for activist-org ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Thank you for the pull request! ❤️The activist team will do our best to address your contribution as soon as we can. If you're not already a member of our public Matrix community, please consider joining! We'd suggest that you use the Element client as well as Element X for a mobile app, and definitely join the Note activist uses Conventional Comments in reviews to make sure that communication is as clear as possible. |
Maintainer ChecklistThe following is a checklist for maintainers to make sure this process goes as well as possible. Feel free to address the points below yourself in further commits if you realize that actions are needed :)
|
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
First PR Commit Check
- The commit messages for the remote branch of a new contributor should be checked to make sure their email is set up correctly so that they receive credit for their contribution
- The contributor's name and icon in remote commits should be the same as what appears in the PR
- If there's a mismatch, the contributor needs to make sure that the email they use for GitHub matches what they have for
git config user.emailin their local activist repo (can be set withgit config --global user.email "GITHUB_EMAIL")
|
note:@brmlee this is breaking on build, which tells me the app is breaking when this is run. Please ask to us where things are defined for example certain types if you can't find them and assuming they exist or not. shared/types you will find all types and all map typing are in map.ts and map-type.ts. mapLibre is the library we are using for maps. First fix the build and then check if it works. |
…gs (resolves build errors)
|
note: @brmlee some of the tests are breaking and I noticed you removed the map layers. Return those and plus fix the issues above and I will check it |
…gs (resolves build errors)
|
@brmlee the tests are still breaking can you fix the issues? |
2 participants
Contributor checklist
(Assuming you will run these before submitting)
Description
This PR addresses the performance, stability, and UX issues described in issue #1292 by implementing necessary cleanup and optimizing map interaction logic.
Key Changes:
onUnmountedlifecycle hook infrontend/components/media/MediaMap.vueto ensure the MapLibre GL instance is properly removed usingmapInstance.remove(). This resolves memory leaks and prevents page crashes, especially when navigating away from the map view.useClusterMap()) to ensure the visual switch from a cluster circle to individual markers is seamless and animated.radiusandmaxZoomparameters (inuseClusterMap()) to make clusters split earlier, resolving the issue where zooming often resulted in finding only a midpoint cluster.useRouting()to confirm that GeoJSON sources for old routes are completely cleared and route calculation is debounced when switching between modes (bike/walk) or adding multiple waypoints.Testing:
I tested this fix by repeatedly navigating to and from the map component to check for crashes and by rapidly zooming in and out on clustered data to verify the smooth transition and earlier splitting behavior. Routing stability was checked by quickly toggling modes and adding waypoints.
Related issue