Refreshable global methods with local scope

[mbrulatout]

Question

Hi there,

We hit an issue with module level refreshables, which ended up sharing context between users. After digging a bit, we found that this was documented.
Based on the variant C doc, I expected the following MRE to work.

from datetime import datetime
def time():
    ui.label(f'Time: {datetime.now()}')

def time2():
    ui.label(f'Time2: {datetime.now()}')

def button_cb():
    refreshable_time2 = ui.refreshable(time2)
    refreshable_time2.refresh() # doesn't work :(

@ui.page(f"/ui/mre1/")
def mre1() -> None:
    refreshable_time = ui.refreshable(time)
    refreshable_time()
    ui.button('Refresh', on_click=refreshable_time.refresh)

    time2()
    ui.button('Refresh2', on_click=button_cb)

Spoiler: while time works, time2 refresh doesn't.
Somehow, I guess that you can't "bind the refreshable property to an existing object"

While time2 doesn't make much sense here as it's a MRE, in quite complex scenarii, where a global method defining various elements that need to be refreshed in multiple other methods, it does.
You could think about this simple usecase:

• An API with POST/PUT/PATCH on an User object. Various UI forms for each API call
• A table displaying various info about users
• You probably want a refreshable property on the table and call that table.refresh() in each impacting code path.

Due to the ever-growing amount of nested methods callbacks, passing ui.refreshable args everywhere offers a bad DX overall.
I ended up writing something like the following. It's basically a refreshable storage, hiding some of the complexity to allow usecases like time2 to work this time. I had to use some client storage to avoid shared context again.

class RefreshableType(Enum):
    TIME1 = "time1"
    TIME2 = "time2"

class RefreshableItems:
    """A class to store and manage refreshable items
    This offers a centralized way to store and access refreshable items without having to pass them around.
    It's also easy to add new refreshable items for later use.
    """

    def __init__(self, **kwargs: Any) -> None:
        # use client storage to avoid shared context
        app.storage.client["refreshables"] = {RefreshableType(k): ui.refreshable(v) for k, v in kwargs.items()}

    def refresh(self, item: RefreshableType, *args: Any, **kwargs: Any) -> None:
        """Refresh a specific refreshable with optional parameters"""
        if args or kwargs:
            app.storage.client["refreshables"][item].refresh(*args, **kwargs)
        else:
            app.storage.client["refreshables"][item].refresh()

    def invoke(self, item: RefreshableType, *args: Any, **kwargs: Any) -> Any:
        """Call a refreshable directly"""
        return app.storage.client["refreshables"][item](*args, **kwargs)

    @classmethod
    def create(cls) -> "RefreshableItems":
       # Basically act as a refreshable store
        return cls(
            time1=time,
            time2=time2,
        )


_page_refreshables: RefreshableItems
def button_cb2():
    _page_refreshables.refresh(RefreshableType.TIME2)

@ui.page(f"/ui/mre2/")
def mre2() -> None:

    global _page_refreshables
    _page_refreshables = RefreshableItems.create()

   # Note that these might actually be called initially quite deep in the call stack. 
    _page_refreshables.invoke(RefreshableType.TIME1)
    _page_refreshables.invoke(RefreshableType.TIME2)

    ui.button('Refresh', on_click=lambda _:_page_refreshables.refresh(RefreshableType.TIME1))
    ui.button('Refresh2', on_click=button_cb2)

While this works fine, and seems to answer my needs, it doesn't look that great.
Would you happen to have any recommendation about that kind of usecases ?

[balex89]

Hi, @mbrulatout!
If i got you right, to boil it down, you need to have a "user-scoped global refreshable".

If that so, you might want consider an approach mentioned in #4321 .
Basically you go with Local scope (variant B) (putting refreshables inside a class). but the class is a Singleton across user/client/tab/whatever suits you.

Hope it helped!

[kleynjan]

Hi @mbrulatout, not sure if it suits your use case but you might want to take a look at StatefulRefreshable here: #4172 (comment)

My approach is to always pass a state var to a refreshable and have the 'client' (eg, page function) link it up to app.storage.* for sharing (or not sharing) state and for persistence.