moved functions to utils file

visual_components.py

@@ -1,65 +0,0 @@
-import streamlit.components.v1 as components
-import streamlit as st
-import pandas as pd
-
-
-def create_data_input_table(datapoint, col_names):
-    st.subheader("Flagged Transaction:")
-    data = datapoint.iloc[0].tolist()
-    data[7:12] = [bool(value) for value in data[7:12]]
-    df = pd.DataFrame({"Feature name": col_names, "Value": data })
-    st.dataframe(df, hide_index=True, width=450, height=35*len(df)+38)
-
-# Create a function to generate a table
-def create_table(texts, values, title):
-    # TODO: change color dataframe header -> tried many different options but none worked see below
-    # header_style = '''s
-    # <style>
-    #     th{
-    #         background-color: #00052D;
-    #     }
-    # </style>
-    # '''
-    df = pd.DataFrame({"Feature Explanation": texts, 'Value': values})
-    # df = df.style.set_properties(**{
-    #        'selector': 'th',
-    #        'props': [
-    #            ('background-color', 'black'),``
-    #            ('color', 'cyan')]
-    #    })
-    # df = df.style.set_properties(**{'background-color': 'black',
-    #                        'color': 'green'})
-
-    st.markdown(f'#### {title}')  # Markdown for styling
-    # headers = {
-    #     'selector': 'th',
-    #     'props': 'background-color' '#67c5a4'#'background-color: #000066; color: white;'
-    #     }
-    header = {
-      'selector': 'th',
-    'props': 'background-color: #000066; color: white;'
-}
-    
-    # df = df.style.set_table_styles({
-    #         ('Feature Explanation', 'Value'): [{'selector': 'th', 'props': 'border-left: 1px solid white'},
-    #                                 {'selector': 'td', 'props': 'border-left: 1px solid #000066'}]
-    #     }, axis=0)
-    df = df.style.set_table_styles([header])
-    
-    # df.style.set_table_styles([headers])
-    st.dataframe(df, hide_index=True, width=450)  # Display a simple table
-    # st.markdown(header_style, unsafe_allow_html=True)
-
-def ChangeButtonColour(widget_label, font_color, background_color='transparent'):
-    htmlstr = f"""
-        <script>
-            var elements = window.parent.document.querySelectorAll('button');
-            for (var i = 0; i < elements.length; ++i) {{ 
-                if (elements[i].innerText == '{widget_label}') {{ 
-                    elements[i].style.color ='{font_color}';
-                    elements[i].style.background = '{background_color}'
-                }}
-            }}
-        </script>
-        """
-    components.html(f"{htmlstr}", height=0, width=0)