ReactiveComponents + URL Params?

[djsiroky]

I'm hoping to use ReactiveComponent with URL params as a way to split out the state/query generation from the UI of a filter. Is this possible?

The filters are not mounted when my app is loaded, but I've set my app up to allow "saved searches" by saving the window.location.search value and navigating to the URL to load the saved seaach. Since some filter components aren't mounted, they don't show up in the SelectedFilters component until someone clicks on the icon to show the filter dialog.

So, I'm hoping to have a ReactiveComponent for each filter somewhere that is not conditionally rendered and therefore always mounted, then using props to have a UI component further down to control the query. I'm able to get this to work without using URL Params, but when I try to load a saved search, only the non-ReactiveComponent filters show up. If I only save ReactiveComponent values / use them in the URL, the "Clear All" button shows up, but no filters.

I've created a minimal reproduction here: https://codesandbox.io/s/reactivecomponent-with-urlparams-j51r3?file=/src/index.js
You can go to the app itself here: https://j51r3.csb.app/
And the hope would be that using this URL would at least filter the results to that brand: https://j51r3.csb.app/?BrandSensor="Ford"
But as you can see, it just clears the URL params.

Thank you!