Add feature to show popup for request in URL param #71
Conversation
| const [popup, setPopup] = useState(); | ||
|
|
||
| // display popup if request code is present in URL search param | ||
| useEffect(() => { |
There was a problem hiding this comment.
have to wrap this with useEffect so it only fires once the layers have been mounted.
There was a problem hiding this comment.
why do we need useEffect? don't we have all the info on render if paramRequest is truthy?
There was a problem hiding this comment.
I'm not 100% sure on the details of this but if you remove the useEffect wrapper, React just tries to rerender the component over and over again, resulting in Error: Too many re-renders. React limits the number of renders to prevent an infinite loop. I think it's because we are updating the state during render, versus after render if we useEffect. EIther way when working with maps, I have found it to be best to let layers render first before imposing state on it to prevent an unexpected sequence of events.
| "bottom-left": [12, -38], | ||
| bottom: [0, -38], | ||
| "bottom-right": [-12, -38] | ||
| "bottom-left": [6, -19], |
There was a problem hiding this comment.
just fixing offset so popover is closer to the marker.
| const [popup, setPopup] = useState(); | ||
|
|
||
| // display popup if request code is present in URL search param | ||
| useEffect(() => { |
There was a problem hiding this comment.
why do we need useEffect? don't we have all the info on render if paramRequest is truthy?
piratefsh
force-pushed
the
piratefsh/add-url-param-search
branch
from
4375200
to
5d6a1dd
Compare
Summary
Allow /delivery-needed to receive a request code via URL param and to display popover for corresponding request (if it exists).
e.g. http://localhost:3000/delivery-needed?request=MD4VL2 will open the app with the popover for
MD4VL2open.If the request cannot be found, it will display a warning alert with a link to return to the default view. This is to hopefully prevent confusion for folks looking at the map for a claimed delivery/
This can be used for linking the request on the map in the Slack app, making it easier for delivery volunteers to look locations up on the map.
Limitations