Elastic D&D - Update 3 - App Page 2 & the Account Tab

Last week was an in-depth breakdown of building a login page with Streamlit. If you missed it, you can check that out here!

Coding Page 2

Page 2 of the Streamlit application currently consists of 3 tabs: Note Input, Virtual DM, and Account. Virtual DM is a work-in-progress, so I will cover that in a future update. Note Input covers both audio and text notes, which I will be covering over the next couple of weeks. Today, I want to focus on Tab 3: the Account Tab. Full code here:

def app_page2():
    st.session_state["log_index"] = "dnd-notes-" + st.session_state.username
    # displays note input, virtual DM, and account widgets
    tab1, tab2, tab3 = st.tabs(["Note Input", "WIP - Ask Virtual DM", "Account"])
    # note input tab
    with tab1:
        st.session_state["note_type"] = st.selectbox("Audio or Text?", ["Audio","Text"], index=0)
        # runs app_page2_* functions depending on what is selected in selectbox
        if st.session_state.note_type == "Audio":
            st.session_state.runpage = app_page2_audio
            st.session_state.runpage()
        elif st.session_state.note_type == "Text":
            st.session_state.runpage = app_page2_text
            st.session_state.runpage()
        else:
            pass
    # virtual DM tab
    with tab2:
        #I want to run notes through AI to be able to ask questions from this tab and receive answers
        pass
    # Account tab
    with tab3:
        # runs app_page2_password_reset function
        st.session_state.runpage = app_page2_password_reset
        st.session_state.runpage()
        # logout button
        authenticator.logout('Logout', 'main')

NOTE:

The first line of the function is very important! This sets the Elastic index based on the username of who is logged in, allowing for the separation of notes. I will dig into that more when we get to the Note Input blog.

The Account Tab

The Account tab is quite simple. It is built from two things: a function that displays password reset widgets and a logout button. Said widgets have you enter your old password, and your new password twice. When submitted, either the text input will be hashed and the YAML file is updated, or an error will be returned.

The logout button will remove username from session state, which takes you back to the login page!

# Account tab
    with tab3:
        # runs app_page2_password_reset function
        st.session_state.runpage = app_page2_password_reset
        st.session_state.runpage()
        # logout button
        authenticator.logout('Logout', 'main')

def app_page2_password_reset():
    try:
        if authenticator.reset_password(st.session_state.username, 'Reset password'):
            success_message('Password modified successfully')
            update_yml()
    except Exception as e:
        error_message(e)

Related Functions

def error_message(text):
    # displays error message
    import time

    error = st.error(text)
    time.sleep(1)
    error.empty()

def success_message(text):
    # displays success message
    import time

    success = st.success(text)
    time.sleep(1)
    success.empty()

def update_yml():
    # updates login authentication configuration file
    import yaml

    with open(streamlit_project_path + "auth.yml", 'w') as file:
        yaml.dump(config, file, default_flow_style=False)

Closing Remarks

Apologies for the short post this week! I have some stuff going on and not a whole bunch of time. However, it did seem logical to finish all of the code relating to Streamlit-Authenticator.

Next week, I will be covering the Note Input tab; probably just the text portion.

Check out the GitHub repo below. You can also find my Twitch account in the socials link, where I will be actively working on this during the week while interacting with whoever is hanging out!

GitHub Repo
Socials

Happy Coding,
Joe