Can we generate popups like the streamlit connection error?

Community Cloud
1

I noticed a nice popup when my streamlit app has a connection error. Can we generate a popup message like that?

1 Like
2

Hi @shawngiese . There are sum alternatives like st.warning(). I mean if you mentioned any code in try catch block then add st warning in the catch block. It will look similar like the popup error

3 Likes
3

Hi @shawngiese

In addition to what @Guna_Sekhar_Venkata had mentioned, there’s also st.toast()

2 Likes
4

Thanks for the ideas. Toast is pretty cool, I might want to use that somewhere else. Thanks. However I want to be able to throw up some info / text that takes up more space and that the user can close when they finish reading it.

Not expander or tabs either.

5

Hi @shawngiese . You can try st.info()

6

Can you post an image of the popup as a result of connection error?

7

image

1 Like
8

Here is a workaround while the native streamlit popup is under development.

I used the versatile streamlit-float library to construct a float dialog popup to authenticate a user.

Later I will make a demo for the typical connection error popup. Or everybody can make their own customized popups.

Sample output

If username and password are correct, the float dialog box will be hidden/removed.

image

Code

"""Generates a floating dialog to authenticate a user.

Sample username is "uuu", and sample password is "ppp".

pip install streamlit-float
"""


import streamlit as st
from streamlit import session_state as ss
from streamlit_float import *


# Very important
float_init()

# Declares session variables.
setattr(ss, 'is_login', getattr(ss, 'is_login', False))
setattr(ss, 'err_msg', getattr(ss, 'err_msg', None))


def main():
    # Creates a trigger to show a dialog box.
    dialog_container = float_dialog(
        not ss.is_login,  # If login is false dialog will be displayed.
        css='padding-top: 5px;'  # Beautify the float diablog box.
    )

    # Shows the dialog container.
    with dialog_container:
        def update_login_status():
            """A callback from OK button on this dialog box."""
            if ss.username == 'uuu' and ss.password == 'ppp':
                ss.is_login = True
            else:
                ss.err_msg = 'Incorrect username/password'

        st.markdown("## :blue[Login]")
        st.text_input('Username', key='username')
        st.text_input('Password', type='password', key='password')
        st.button("OK", on_click=update_login_status)
        msg = st.empty()

    if ss.err_msg:
        msg.error(ss.err_msg)

    if ss.is_login:
        st.subheader(f'Welcome {ss.username}')


if __name__ == '__main__':
    main()
2 Likes
9

This is a simpler demo for a random connection failures.

Sample Output

image

Code

import random

import streamlit as st
from streamlit import session_state as ss
from streamlit_float import *


# Very important
float_init()

# Declares session variable.
setattr(ss, 'is_connection_ok', getattr(ss, 'is_connection_ok', False))


def get_connection_status():
    """Returns random connection status."""
    return random.choice([False, True])


def main():
    # Creates a trigger to show a dialog box.
    if not ss.is_connection_ok:
        ss.is_connection_ok = get_connection_status()

    # Creates a dialog if connection is not ok.
    dialog_container = float_dialog(not ss.is_connection_ok)

    # Shows the dialog container.
    with dialog_container:
        def update_conn_status():
            ss.is_connection_ok = False  # To always generate random status
        
        st.markdown("**:red[Connection Error]**")
        st.markdown('Please fix your connection.')
        st.button("OK", on_click=update_conn_status)

    if ss.is_connection_ok:
        st.subheader('We are :green[connected!!]')


if __name__ == '__main__':
    main()
2 Likes
10

Thanks for the idea dataprofessor toast accepts too few characters and disappears after just a few seconds.

2 Likes
11

Right, the implementation using streamlit-float that @ferdy shared looks like a possible workaround.

1 Like
12

I saw that there was a potential commit to the streamlit dev branch too:

I hope it gets accepted : )

2 Likes
13

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.