hackforla / hackforla/311-data

Pin Data Not Accurate on Hover

Open
#1,921 3 comments 0 reactions 0 assignees View on GitHub
Bug Complexity: Medium p-feature: Map ready for dev lead Role: Frontend size: 2pt
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

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.