Add user color settings

app/pages/settings.py

@@ -0,0 +1,58 @@
+import streamlit as st
+from pandas.core.ops.docstrings import key
+from pandas.io.formats.style import Styler
+
+import queries.crud as crud
+
+is_login_enabled = hasattr(st, 'user') and hasattr(st.user, 'is_logged_in')
+is_logged_in = is_login_enabled and st.user.is_logged_in
+
+st.title("Settings")
+
+if hasattr(st.session_state, 'user_name'):
+    st.markdown(f"Currently logged in as **{st.session_state.user_name}**")
+
+st.header("Colors")
+with st.container(key="settings-color-selector"):
+    palettes = crud.get_color_palettes()
+    selected = crud.get_color_palette()
+    for palette in palettes.iterrows():
+        id = palette[1]['id']
+        name = palette[1]['name']
+        color1 = palette[1]['color1']
+        color2 = palette[1]['color2']
+        color3 = palette[1]['color3']
+        color4 = palette[1]['color4']
+
+        if selected == id:
+            with st.container(horizontal=True, key=f"settings-color-selector-selected"):
+                st.button(f"{name} **(selected)**", disabled=True, width="stretch", icon=":material/radio_button_checked:")
+                st.html(f"""
+                  <span class="settings-color-selector-colors">
+                      <span style="background-color:#{color1}">&nbsp;</span>
+                      <span style="background-color:#{color2}">&nbsp;</span>
+                      <span style="background-color:#{color3}">&nbsp;</span>
+                      <span style="background-color:#{color4}">&nbsp;</span>
+                  </span>
+                """, width=400)
+        else:
+            with st.container(horizontal=True):
+                if st.button(f"{name}", width="stretch", icon=":material/radio_button_unchecked:"):
+                    crud.set_color_palette(id)
+                    st.rerun()
+
+                st.html(f"""
+                  <span class="settings-color-selector-colors">
+                      <span style="background-color:#{color1}">&nbsp;</span>
+                      <span style="background-color:#{color2}">&nbsp;</span>
+                      <span style="background-color:#{color3}">&nbsp;</span>
+                      <span style="background-color:#{color4}">&nbsp;</span>
+                  </span>
+                """, width=400)
+
+
+st.header("Actions")
+with st.container():
+    if is_logged_in:
+        if st.button("Logout", icon=":material/logout:", width="stretch"):
+            st.logout()