hackforla / hackforla/311-data
Pin Data Not Accurate on Hover
- Dominant language
- JavaScript
- Stars
- 73
- Forks
- 74
- PR merge metrics
- No merged PRs in 30d
Description
### Overview
We need to fix a bug where the Service Request details modal will sometimes, briefly, display the incorrect data, which is causing users to be confused about which Service Requests they are looking at.
### More Info
**Describe the bug**
On initializing the map and zooming in to neighborhood pins, when hovering over one pin it will display a request as expected. When hovering over another pin, it will either show a request with information of the previous request or of a completely random request that is no where near the pin the user is hovering over.
### Action Items
- [ ] Move the state for querying db for SR details information into redux
- [ ] create state that represents if a SR detail is currently being loaded
- [ ] create state that represents the SR details that were just requested
- [ ] Create a new component to represent the loading spinner
- [ ] launch db request when the loading spinner component mounts
- [ ] Modify the RequestDetail component to set/get redux state for SR details
- [ ] Modify Map.jsx to use two different refs
- [ ] one for the new SR loading spinner component
- [ ] one for the SR details modal
- [ ] Modify the Mapbox hover logic for SR points to include the following check
- [ ] determine if there is already a query in progress. If there is, cancel it before launching the next query
### Resources
Steps to reproduce the behavior:
1. Go to the chart and zoom in enough to see the pins.
2. Hover over one pin and wait for the data to load. Slowly move over to another pin and the data shows the previous pin data.
3. See error
Expected behavior
- Hovering over the pins should each show their respective data and color codes per request.
**Additional context**
Not sure if this happens in certain neighborhoods. While testing this, I tried multiple neighborhoods and some have this issue and others don't. Seems to happen at random.
**Screenshots**
Screen recording following steps to reproduce
Screen recording showing:
- An initial hover over a "Bulky Items" pin.
- Moused over to a different pin, "Homeless Encampment".
- Moused over to "Illegal Dumping" pin.
- Went back to first pin, "Bulky Items" but hover now shows "Single Streelight Issue".
- I went back and forth between the same pins to show the delay in data populating correctly.
https://github.com/user-attachments/assets/f288f9b0-ca27-43ed-83d0-cbd32b334869
Reporter Information
**Desktop (please complete the following information):**
- OS: Windows
- Browser: Firefox Developer Edition
- Version: 136.0b3 (64-bit)
Contributor guide
Assessment
This issue has not been assessed yet.