I would like to add a feature in the modern web app, but I need some pointers.
I want to provide a url for each device which when entered into the browser will navigate to the main map page centered on that device. That is the same behavior as clicking the device in the device list of the main page. But this way, I can provide a url link to a user which when clicked will take the user directly to the device on the map.
The url could be something like https://{my_site}/device/{deviceId}
I expect that I will need a new Route in Navigation.js like this
<Route path="device/:deviceId" element={<MainPage />} />
I have setup the source code for the server and modern web app in debug mode, but I have not figured out how or where to process the deviceId parameter to replicate this behavior.
Any suggestions?
I think using an optional query parameter would be better. Then you can process it on the main page and select the device.
Thanks Anton, your suggestion to use query parameters helped me find the solution... The desired behavior is already built in!
The url needs to be constructed like so: https://{my_site}/?deviceId={deviceId}
The processing happens in useEffectAsync of Navigation.js which parses the query parameters, grabs the deviceId, fetches the corresponding Id from the database, selects that Id via devicesActions, and finally navigates to the MainPage and clears out the query parameter.
I would like to add a feature in the modern web app, but I need some pointers.
I want to provide a url for each device which when entered into the browser will navigate to the main map page centered on that device. That is the same behavior as clicking the device in the device list of the main page. But this way, I can provide a url link to a user which when clicked will take the user directly to the device on the map.
The url could be something like
https://{my_site}/device/{deviceId}I expect that I will need a new Route in Navigation.js like this
<Route path="device/:deviceId" element={<MainPage />} />I have setup the source code for the server and modern web app in debug mode, but I have not figured out how or where to process the deviceId parameter to replicate this behavior.
Any suggestions?