Linking Components

[Simon-U]

One feature I want to use your library for is linking components across browser windows.

We have several pages with the same dropdown filters and we want to link them. The user can make selections and directly compare the result of this selection in a different view/dashboard. I tried it with broadcast and that worked really well. But it would be sent to all users.

One option to solve it would be rooms. But I would need to ensure that the socket joins the room on start. Dash_devices achieved something similar with:

@app.callback_shared(None, [Input('shared_slider_no_output', 'value')])
def func(value):
    print('Shared slider no output', value)

I think this would basically wrap two steps:

1. The socket joins a specific room for sharing the input
2. Trigger the sent to socket on value change
3. Have the client-side callback update the state of the value

[RenaudLN]

I added an example on how to do that in usage3.py. The main idea is that you need to add some form of session id that can be used as a room name and that all tabs/windows will join.

[Simon-U]

Yeah, that's what I tried to achieve. Once we have a user management in place, I want to use the user_id as a room. That what the user has their components in sync without interfering with other users.

I will pull your changes and update my Readme and everything today.

[Simon-U]

@RenaudLN I have a question. My users try to hit a page but some parts, connected to the socket throw an error:

'Request' object has no attribute 'sid'. I had that before, and I assume it's because the callback is fired, but the socket is still not connected. Is there away to make sure my socket connects first? Maybe with flask decorator before_request or something similar?