Introducing multipage apps! 📄

[thiago]

This is great news! I noticed there are some problems with imports though. My streamlit code is structured in this way: (…)

I may be missing something here, but my understanding is that the old behavior was just never possible in Python (i.e. this is unrelated to Streamlit).

For example, I just created this folder structure:

root_dir
└── k2_oai
    ├── __init__.py
    └── dashboard
        ├── __init__.py
        ├── app.py
        └── components
            └── login.py

where app.py has just one line:

from k2_oai.dashboard.components import login

Then I did:

$ cd root_dir
$ python -m venv .venv
$ . .venv/bin/activate
$ python k2_oai/dashboard/app.py

Traceback (most recent call last):

File "(...)/k2_oai/dashboard/app.py", line 1, in <module>

from k2_oai.dashboards.components import login

ModuleNotFoundError: No module named 'k2_oai' 

$ cd k2_oai
$ python dashboard/app.py

Traceback (most recent call last):

File "(...)/k2_oai/dashboard/app.py", line 1, in <module>

from k2_oai.dashboards.components import login

ModuleNotFoundError: No module named 'k2_oai' 

$ cd dashboard
$ python app.py

Traceback (most recent call last):

File "(...)/k2_oai/dashboard/app.py", line 1, in <module>

from k2_oai.dashboards.components import login

ModuleNotFoundError: No module named 'k2_oai' 

Am I missing something?

[thiagola92]

Reaction until now:

1- Emoji on file name? weird… but cool…
2- python support imports on file with emoji on name? it doesn’t… so it’s weird because i can’t run the file alone
3- Now i have to remove __init__.py file from the directory? weird… but okay
4- Using number at the start of the file to sort? weird… but okay
5- Specific folder to implement multipage? weird… but okay

I’m happy that have multipage support, i was expecting some new structure in streamlit but i’m totally okay with this way!

Love your work

PS: I was going to say that emoji + number increase too much the file name but emojis can represent many things using only one character

[baggiponte]

Hi, thank you for your reply! Indeed I have been incorrect. My folder structure is (I skipped the __init__.py):

root_dir
├──  app.py
└──  k2_oai
    └── dashboard
        ├── pages
        └── components
            └── login.py

You can actually see it here.

@vdonato

Hi @baggiponte, could you file a GitHub issue with an example that minimally reproduces the issue? Thanks!

@vdonato sorry for the delay - I am kinda overwhelmed atm but will do it as soon as I can! Thank you for the prompt reply and for being so responsive to our feedback!

[fredzannarbor]

good points.

it’s been quite a while since I had to resort to numeric prefix sorting in an application.
If the interface can parse page names, why can’t it just parse init.py and discard it?

Longterm we should be heading towards a drag and drop sorting and subdirectory browse interface for pages; maybe by third parties.

[R_D]

Is there a way to have the side bar up top, so it looks like a navigation bar for a multipaged app? @vdonato

[Chris_Junta]

Good day. Can you add “user class” argument for every widget? It’ll be so much easier to customize app via css

[Etienne_G]

Hello,
First, thanks for your job.
I have few questions :

Is it possible to remove the “main” of the multipage menu easily ?
Is it possible to have just a title and nothing else in the menu (without smiley or bug) ?
Is it possible to rename the folder pages ?

thanks
etienne

[Georgehwp]

Is there a way to nest multiple pages? To create some organisation to the structure?

[Shawn_Pereira]

Hi @Georgehwp , oustside of the new multipage functions, you can do the following to create any sort of structure, substructure of multipages using session state and functions:

1. create a … say runpage… variable
2. equate it a function that holds all your widgets for a given page
3. Run the variable as a function to activate the page
4. Have a Return / other button/s to navigate you to the previous / any other page

The advantage of this method (over the new method) is that you do not need to have a Pages folder, sequentially rename all your page files in case new pages need to be inserted in between, etc.

Cheers

[vdonato]

Hi @R_D,

Do mean if there’s a way to have the sidebar be displayed as a top bar instead? There’s currently no way of doing that, and I think it’d be more likely (although we have no concrete plans of doing this at the moment) that we would build alternate ways of displaying the multipage app page selector that don’t live in the sidebar than provide the ability to move the sidebar entirely.

[vdonato]

Hey @Chris_Junta,

We’ve actually been thinking through ways of doing this, but we want to be sure that the way that it’s implemented both feels “streamlit-y” and is maintainable well into the future. I think a recent idea that has seemed promising has been to auto-generate CSS classes from widget keys.

(CC @jrieke)

[vdonato]

Hi @Etienne_G,

• I’m not sure what you mean by the “main” of the multipage menu. Do you mean the menu itself? If so, there’s a (hidden) config option ui.hideSidebarNav that can be set to hide the menu entirely
• There’s currently no way to hide the icons entirely in the menu
• There’s also currently no way to use a different directory to add pages to, although we’ve seen a few requests to customize the folder name, so we’ll be considering adding this as a config option in the future.

[Chris_Junta]

Thank you. It is a good idea. Not very flexible, because that way I can’t set different display states for one widget/key (exmpl: item selected/not selected), but nevertheless It’ll be a huge step forward

[simonb]

@thiago, building upon that, is there now any streamlit-y way to redirect to the main page from any other page? I haven’t found anything [yet] to help me with this in the context of a possible return home button and session_state reset.

Thanks!
Simon

[mirfan899]

Still looking for editable dataframe. Is there a time-frame for the features which will be included in streamlit or we have to just keep checking the forum for updates?

[Charly_Wargnier]

Hi @mirfan899

You can use the streamlit-ag-grid component to edit dataframes on the fly.

Look at this public app for more details.

Regarding an ETA for that feature to be available natively, @lukasmasuch should be able to shed some light on it

Best,
Charly

[lukasmasuch]

We have plans for improving the dataframe soon, but we don’t have any official time-frame for specific features yet. You can also subscribe to this issue on Github to get notified once we add editing capabilities.

[neldivad]

If I want to hide that mini extra sidebar, which file do I insert the code ui.hideSidebarNav in?

[neldivad]

Not a good fix because it also hides your charts and data tables.

[hagsted]

Nice update. But is there a reason that the st.set_page_config(), is not used to decorate the file menu, other than streamlit of course will need to look in the files for it, instead of just making a file listing?

The file names with utf8 characters does seem to act up for me. I try to add a number in a blue box as the icon, but the page icon is shown followed by the number in the blue box and file name. However the page icon should not be shown. File name look like this 01_1️⃣_page_name.py.

I would also like to have the possibility to add some header above the page table.

Otherwise it has worked flawless for our whole page, with 9 sub pages.