Add function to update browser bar URL

[platinops]

Sometimes when you change the state of you application, you also want to have this reflected in the browser URL bar. That way, users can bookmark/share that URL and return to the state where they left off. I could not immediately find this functionality in NiceGUI out of the box.

Simple use case:

@ui.page('/select/{id}')
def page(id: int):
    select1 = ui.select([1, 2, 3], value=id).on_value_change(
        lambda e: ui.navigate.set_browser_url(f'/select/{e.value}')
    )
    select2 = ui.select({1: 'One', 2: 'Two', 3: 'Three'}).bind_value(select1, 'value')
    ui.link('Link to selected option', f'/select/{id}')

[trivedihoney]

Hello @platinops,
If we are to integrate the pushState functionality, it would be great to integrate replaceState as well!

Usage can look like,
ui.navigate.set_browser_url(f'/select/{e.value}', replace=True)

Or two separate functions can be also created like ui.navigate.push & ui.navigate.replace for more clarity.

Thoughts?

[rodja]

Great idea @platinops. Maybe we can simplify the name to make it more consistent with navigate.to, navigate.backward, ...? What do you think about ui.navigate.update('/path')? And for @trivedihoney's suggestion we either introduce ui.navigate.replace('/path') or introduce a parameter ui.navigate.update('/path', with_history=False).

Having this build in would also be beneficial for #2811 where it is currently done by building js commands:

https://github.com/Alyxion/nicegui/blob/1e5b3267ab938da9d802be1fe9be2e36fe75e5e3/nicegui/single_page_router.py#L226

[platinops]

@trivedihoney: Fair point, sounds logical to support replaceState too.

@rodja: OK for me to use ui.navigate.update. It's a bit more cryptic, but looks more compact/clean.

Also slightly related, getting the browser's geolocation like in this example could also be a builtin NiceGUI function? Would you also include it under ui.navigate?

Not sure if it makes sense, but would it reasonable to consider the browser url and geolocation as ui.Element, similar to dcc.Location in Plotly Dash? This would allow binding other elements' values to the URL path and/or query parameters.