[Stack Monitoring][Angular removal] Datepicker not updated when url is changed

[estermv]

When the time is changed in the url, for example, with the zoom-out behavior from charts or from the browser go back button, the datepicker is not synced with the url.

[elasticmachine]

Pinging @elastic/logs-metrics-ui (Team:logs-metrics-ui)

[klacabane]

So we have two-way binding between the timepicker and the url and we're currently only handling the timepicker->url by directly mutating the global state, which ends up updating the url. Didn't dive deep enough to understand the magic behind that yet.

We need a way to propagate a url change down to the datepicker. The timefilter object that's exposed via the useKibana hook may be a good option as it seems responsive to url changes through the timeUpdate$ observable. Can we subscribe to that and make appropriate state changes ?
Two open questions so far:

• will this introduce a circular event chain: timepicker change -triggers-> url change -triggers-> observable event -triggers-> timepicker change ... ?
• the timefilter class is prefixed with a TODO: remove that's 2 years old, is that still relevant ? Looks like we're using that all over the place already so I guess it's not

[klacabane]

Looks like we're clear on the circular event chain, submitting a fix