Modularization concepts

[MateoSaezMata]

Description

Hi everyone.

I'm trying to structure my code so I can keep everything maintainable.

I saw the modularization examples and get some ideas.

I've ended with some structure like this:

from nicegui import ui

class MyPage:

    def __init__(self) -> None:

        @ui.page('/')
        def root():
            ui.button('Create card', on_click=lambda: self.card_creator(text='Ey'))
            with ui.row() as self.card_container:
                pass

    def card_creator(self, text):
        with self.card_container:
            with ui.card():
                ui.label(text)

MyPage()

ui.run()

This minimal example is intended to set a "container" ready to be filled upon some event.

Am I thinking it right?

It seems to run right, but when I have two tabs open (both localhost:8080) the first one stops creating cards and only the second one works properly.

It seems that the server creates the instance of MyPage on one tab but destroys it when the other tab is open.

Probably I'm missing something.

Thanks!

[falkoschindler]

Hi @MateoSaezMata,

There is only one instance of MyPage. When visiting the page "/", you're creating self.container and the button will add cards to it. The problem is that visiting page "/" in a second tab will overwrite self.container. Now both buttons will add cards to the new container shown on the second tab.

Pylint actually warns about defining instance attributes "outside" the __init__ method:

[MateoSaezMata]

So, when you say "There is only one instance of MyPage" this is true on what scope?

I mean: if I've opened one tab of "/" and then open another the second overwrite the container. That's why I'm the same "user"? What would happen if another person (another machine) request "/" at the same time as I do?

The question is: what is the concept which defines that a new instance of MyPage is created regardless of other instances of MyPage that are already created?

Maybe is a silly question or there's some docs that explain this behavior. Any help will be appreciated.

Thanks!

[rodja]

If you visit the page again, only the function root() will be called again on the single object created by the MyPage() constructor call.

what is the concept which defines that a new instance of MyPage is created

Thats basic Python. NiceGUI does not do any magic re-evaluation of you whole program like Streamlit does. Hence the MainPage() is only called once (actually twice, because reload=True by default in ui.run).

[MateoSaezMata]

I know that I instantiate MyPage once in regular python I only get one instance of MyPage. I thought the ui.run probably would serve different instances per user basis.
I see I was wrong.
So, I will keep the elements (which I want reference later) stored in variables local to the scope of function decorated with @ui.page (or its inner functions).

Thank you for your time.