branch with all the code before cleanup

pages.py

@@ -0,0 +1,35 @@
+# sidebar.py
+
+import streamlit as st
+import streamlit_router as sr
+
+def common_sidebar(router):
+    st.sidebar.markdown("# Sidebar Navigation")
+    st.sidebar.markdown("---")
+    st.sidebar.markdown("### Pages")
+    if st.sidebar.button("Home"):
+        router.redirect(*router.build('/'))
+    if st.sidebar.button("TIL Feedback"):
+        router.redirect(*router.build('/feedback'))
+    if st.sidebar.button("Course Suggester"):
+        router.redirect(*router.build('/course_suggester'))
+    if st.sidebar.button("Course Lesson Extractor"):
+        router.redirect(*router.build('/lessons_extractor'))
+    if st.sidebar.button("Article Recommender"):
+        router.redirect(*router.build('/article_recommendor'))
+    if st.sidebar.button("Recent Article Suggester"):
+        router.redirect(*router.build('/research_article_suggester'))
+
+def with_sidebar(func):
+    def wrapper(*args, **kwargs):
+        from ui_main import router  # Import router from the main file
+        current_route = st.query_params.get("route", [""])[0]
+        
+        if current_route in ['feedback', 'course_suggester', 'lessons_extractor', 'article_recommendor', 'research_article_suggester']:
+            common_sidebar(router)
+        
+        return func(*args, **kwargs)
+    return wrapper
+
+
+

ui/article_recommendation.py

@@ -2,7 +2,6 @@ from dotenv import load_dotenv
 import json
 import streamlit as st
 import utils.settings as settings
-
 from workflows.article_suggestion import article_recommendation_crew
 from utils.write_to_json import write_dict_to_json as write_dict_to_json
 load_dotenv()
@@ -17,7 +16,7 @@ def icon(emoji: str):
     )
 
 
-def main():
+def article_recommendor_main():
     page_bg_img = '''
         <style>
         [data-testid="stAppViewContainer"]{
@@ -106,4 +105,4 @@ def main():
     if st.sidebar.button("← Back to Main Page"):
         st.session_state.page = "main"
 if __name__ == "__main__":
-    main()
+    article_recommendor_main()

ui/course_learn_suggest_expectations.py

@@ -4,7 +4,9 @@ from streamlit_extras.stylable_container import stylable_container
 from workflows.courses.expectation_revision import ExpectationRevision
 
 
-def main():
+
+
+def course_suggester_main():
     st.markdown("""
     <style>
       [data-testid="stAppViewContainer"]{
@@ -143,4 +145,4 @@ def main():
 
 
 if __name__ == "__main__":
-    main()
+    course_suggester_main()

ui/course_lessons_extractor.py

@@ -4,6 +4,7 @@ from contextlib import contextmanager
 from dotenv import load_dotenv
 from workflows.courses.lessons_extractor import LessonsExtractor
 from streamlit_extras.capture import stdout
+
 load_dotenv()
 
 
@@ -16,8 +17,7 @@ def setup_event_loop():
     finally:
         loop.close()
         asyncio.set_event_loop(None)
-
-def main():
+def lessons_extractor_main():
     page_bg_img = '''
         <style>
         [data-testid="stAppViewContainer"]{
@@ -71,4 +71,4 @@ def main():
             st.markdown(f"Concpets: {', '.join(lesson['concepts'])}")
 
 if __name__ == "__main__":
-    main()
+    lessons_extractor_main()

ui/research_paper.py

@@ -4,7 +4,9 @@ from streamlit_extras.capture import stdout
 
 
 
-def main():
+
+
+def research_article_suggester_main():
 
     st.markdown(
         """
@@ -139,4 +141,4 @@ def main():
     if st.sidebar.button("← Back to Main Page"):
         st.session_state.page = "main"
 if __name__ == "__main__":
-    main()
+    research_aricle_suggester_main()

ui/til_feedback.py

@@ -5,7 +5,11 @@ from streamlit_extras.capture import stdout
 from langsmith import Client
 from workflows.utils.feedback import Feedback
 
+
+
 load_dotenv()
+
+
 def feedback_main():
 
     page_bg_img = '''
@@ -125,5 +129,6 @@ def clear_feedback_state(results):
         if key.endswith("_feedback_given"):
             st.session_state[key] = False
 
+
 if __name__ == "__main__":
     feedback_main()

ui_main.py

@@ -1,46 +1,39 @@
 from dotenv import load_dotenv
 from streamlit_extras.stylable_container import stylable_container
-from ui.article_recommendation import main as article_recommendor_main
-from ui.course_lessons_extractor import main as lessons_extractor_main
-from ui.research_paper import main as research_article_suggester_main
-from ui.til_feedback import feedback_main
-from ui.course_learn_suggest_expectations import main as course_suggester_main
+from ui.article_recommendation import article_recommendor_main
+from ui.course_lessons_extractor import lessons_extractor_main
+from ui.research_paper import research_article_suggester_main
+from ui.til_feedback import  feedback_main
+from ui.course_learn_suggest_expectations import course_suggester_main
+# from pages import card_main
 import math
 import streamlit as st
 import subprocess
+import streamlit_router as sr
 
 load_dotenv()
 
 subprocess.run(["playwright", "install", "chromium"])
 
+st.set_page_config(page_title='Growthy AI Workflows', page_icon='📰',layout="wide")
 
 def load_css(file_name):
     with open(file_name) as f:
         return f.read()
 
-
-def main():
-
-    if 'page' not in st.session_state:
-        st.session_state.page = "main"
-
-    if st.session_state.page == "main":
-        show_main_page()
-    elif st.session_state.page == "article_recommendor":
-        article_recommendor_main()
-    elif st.session_state.page == "research_article_suggester":
-        research_article_suggester_main()
-    elif st.session_state.page == "feedback":
-        feedback_main()
-    elif st.session_state.page == "lessons_extractor":
-        lessons_extractor_main()
-    elif st.session_state.page == "course_suggester":
-        course_suggester_main()
+def common_sidebar():
+    st.sidebar.markdown("# Sidebar Navigation")
+    st.sidebar.markdown("---")
+    st.sidebar.markdown("### Pages")
+    st.sidebar.button("Home", on_click=lambda: router.redirect(*router.build("show_main_page")))
+    st.sidebar.button("TIL Feedback", on_click=lambda: router.redirect(*router.build("feedback_main_wrapper")))
+    st.sidebar.button("Course Suggester", on_click=lambda: router.redirect(*router.build("course_suggester_main_wrapper")))
+    st.sidebar.button("Course Lesson Extractor", on_click=lambda: router.redirect(*router.build("lessons_extractor_main_wrapper")))
+    st.sidebar.button("Article Recommender", on_click=lambda: router.redirect(*router.build("article_recommendor_main_wrapper")))
+    st.sidebar.button("Recent Article Suggester", on_click=lambda: router.redirect(*router.build("research_article_suggester_main_wrapper")))
 
 
 def show_main_page():
-    st.set_page_config(page_title='Growthy AI Workflows',
-                       page_icon='📰', layout="wide")
     page_bg_img = '''
         <style>
         [data-testid="stAppViewContainer"]{
@@ -53,96 +46,141 @@ def show_main_page():
         [data-testid="stToolbar"]{
             right: 2rem;
         }
-
-
+        [data-testid="column"] {
+                text-align: center;
+                                } 
+    
         </style>
         '''
     st.markdown(page_bg_img, unsafe_allow_html=True)
-
+    
     css = load_css("ui/main.css")
 
     st.markdown(f"<style>{css}</style>", unsafe_allow_html=True)
 
-    st.markdown('<div class="main-title">Welcome to Growthy AI Workflows!</div>',
-                unsafe_allow_html=True)
+    st.markdown('<div class="main-title">Welcome to Growthy AI Workflows!</div>', unsafe_allow_html=True)
     st.markdown("---")
 
+    # card_info = [
+    #     {"title": "TIL Feedback", "description": "Provide your valuable feedback.", "key": "feedback_main_wrapper","image":"https://agent.ai/icons/search.svg"},
+    #     {"title": "Course Suggester", "description": "Get suggestions for courses", "key": "course_suggester_main_wrapper","image":"https://agent.ai/icons/prospecting.svg"},
+    #     {"title": "Course Lesson Extractor", "description": "Extract lessons for a given course", "key": "lessons_extractor_main_wrapper","image":"https://agent.ai/icons/business-analyst.svg"},
+    #     {"title": "Article Recommender", "description": "Discover articles tailored to your interests.", "key": "article_recommendor_main_wrapper","image":"https://agent.ai/icons/robot.svg"},
+    #     {"title": "Recent Article Suggester", "description": "Get suggestions for recent research articles.", "key": "research_article_suggester_main_wrapper","image":"https://agent.ai/icons/data.svg"},
+       
+    # ]
     card_info = [
-        {"title": "TIL Feedback", "description": "Provide your valuable feedback.",
-            "key": "feedback", "image": "https://agent.ai/icons/search.svg"},
-        {"title": "Course Learn suggest Expectations", "description": "Get expectation & check question for course",
-            "key": "course_suggester", "image": "https://agent.ai/icons/prospecting.svg"},
-        {"title": "Course Lesson Extractor", "description": "Extract lessons for a given course",
-            "key": "lessons_extractor", "image": "https://agent.ai/icons/business-analyst.svg"},
-        {"title": "Article Recommender", "description": "Discover articles tailored to your interests.",
-            "key": "article_recommendor", "image": "https://agent.ai/icons/robot.svg"},
-        {"title": "Recent Article Suggester", "description": "Get suggestions for recent research articles.",
-            "key": "research_article_suggester", "image": "https://agent.ai/icons/data.svg"},
-
-    ]
+    {"title": "TIL Feedback", "description": "Provide your valuable feedback.", "key": "feedback_main_wrapper", "image": "📝"},
+    {"title": "Course Suggester", "description": "Get suggestions for courses", "key": "course_suggester_main_wrapper", "image": "📚"},
+    {"title": "Course Lesson Extractor", "description": "Extract lessons for a given course", "key": "lessons_extractor_main_wrapper", "image": "📑"},
+    {"title": "Article Recommender", "description": "Discover articles tailored to your interests.", "key": "article_recommendor_main_wrapper", "image": "📰"},
+    {"title": "Recent Article Suggester", "description": "Get suggestions for recent research articles.", "key": "research_article_suggester_main_wrapper", "image": "🔍"},
+]
 
     num_cols = 3
     num_rows = math.ceil(len(card_info) / num_cols)
 
-    col1, col2, col3 = st.columns([1, 8, 1])
+    col1, col2, col3 = st.columns([1,8,1])
 
     with col2:
         for row in range(num_rows):
-            cols = st.columns(num_cols)
+            cols = st.columns(num_cols,gap="large")
             for col in range(num_cols):
                 index = row * num_cols + col
                 if index < len(card_info):
                     card = card_info[index]
                     with cols[col]:
-                        with stylable_container(
-                            key="inside_container_with_border",
-                            css_styles="""
-                                    {
-                                        background-color: #e9eaec;
-                                        border-radius: 10px;
-                                        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
-                                        padding:10px;
-                                        display: flex;
-                                        flex-direction: row;
-                                        flex-wrap: wrap;
-                                        align-items: center;
-                                        justify-content: center;
-                                        height:1000px;
-                                        border: 1px solid #C0C0C0;
-
-                                    }  """,
-                        ):
-                            with st.container():
-                                st.image(card["image"])
-                            st.markdown(
-                                f"""
-                                    <div style=" display: flex; flex-wrap:wrap; flex-direction: column; text-align: center; justify-content: center; align-items: center">
-                                        <span style="font-weight:900; font-size: 24px;"> {card["title"]}</span>
-                                        <p class="styled-description">{card["description"]}</p>
-                                    </div>
+                        with st.container(height=280,border=False):
+                            with stylable_container(
+                                key="inside_container_with_border",
+                                
+                                css_styles="""
+                                        {
+                                            background-color: #e9eaec;
+                                            border-radius: 10px;
+                                            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
+                                            # padding:10px;
+                                            display: flex;
+                                            flex-direction: row;
+                                            flex-wrap: wrap;
+                                            align-items: center;
+                                            justify-content: center;
+                                            border: 1px solid #C0C0C0;
+                                            text-align: center;
+                                            margin-bottom: 10px;
+                                        }  """,
+                                ):
+                                    # with st.container():
+                                    st.markdown(
+                                        f"""
+                                        <div style="
+                                            font-size: 4rem; 
+                                            margin-bottom: 10px;
+                                        ">
+                                            {card['image']}
+                                        </div>
+                                        """, unsafe_allow_html=True
+                                    )
+                                    st.markdown(
+                                        f"""
+                                        <div style=" display: flex; flex-wrap:wrap; flex-direction: column; text-align: center; justify-content: center; align-items: center">
+                                            <span style="font-weight:900; font-size: 24px;"> {card["title"]}</span>
+                                            <p class="styled-description">{card["description"]}</p>
+                                        </div>
+                                        """, unsafe_allow_html=True
+                                    )
+                                    if st.button("Explore", key=card["key"]):
+                                            router.redirect(*router.build(f"{card['key']}"))
+                                            # st.experimental_rerun()
+                                            # st.session_state.page = card["key"]
+
+                                    st.markdown(
+                                    """
+                                    <style>
+                                    # [data-testid="stImage"] img {
+                                    #     padding:10px;
+                                    #     height: 100px;
+                                    #     width: 100px;
+                                    #     border-radius: 50%;
+                                    #     border: 2px solid white;
+
+                                    #  } 
+
+                                    [data-testid="column"] div[data-testid="column"]{
+                                            margin: 10px;
+                                        }                            
+                                    </style>
                                     """, unsafe_allow_html=True
-                            )
-                            if st.button("Explore", key=card["key"]):
-                                st.session_state.page = card["key"]
-                            st.markdown(
-                                """
-                                <style>
-                                [data-testid="stImage"] img {
-                                    padding:10px;
-                                    height: 100px;
-                                    width: 100px;
-                                    border-radius: 50%;
-                                    border: 2px solid white;
-
-                                }
-                                [data-testid="column"] {
-                                    text-align: center;
-                                }
-
-                                </style>
-                                """, unsafe_allow_html=True
-                            )
-
-
-if __name__ == '__main__':
-    main()
+                                            )      
+
+# Wrapping each main page function to include the common sidebar
+def feedback_main_wrapper():
+    common_sidebar()
+    feedback_main()
+
+def course_suggester_main_wrapper():
+    common_sidebar()
+    course_suggester_main()
+
+def lessons_extractor_main_wrapper():
+    common_sidebar()
+    lessons_extractor_main()
+
+def article_recommendor_main_wrapper():
+    common_sidebar()
+    article_recommendor_main()
+
+def research_article_suggester_main_wrapper():
+    common_sidebar()
+    research_article_suggester_main()
+                   
+router = sr.StreamlitRouter()
+
+router.register(show_main_page, '/')
+router.register(feedback_main_wrapper, '/feedback', methods=['GET'])
+router.register(course_suggester_main_wrapper, '/course_suggester')
+router.register(lessons_extractor_main_wrapper, '/lessons_extractor')
+router.register(article_recommendor_main_wrapper, '/article_recommendor')
+router.register(research_article_suggester_main_wrapper, '/research_article_suggester')
+
+router.serve()