added multipage navigation

app.py

@@ -20,7 +20,7 @@ def icon(emoji: str):
     )
 
 
-st.set_page_config(layout="wide")
+# st.set_page_config(layout="wide")
 
 
 def main():
@@ -94,6 +94,7 @@ def main():
                 st.markdown(f"**Reason For Recommendation:** {article.get('reason_for_recommendation', '')}")
                 st.markdown("---")
 
-
+    if st.sidebar.button("← Back to Main Page"):
+        st.session_state.page = "main"
 if __name__ == "__main__":
     main()

main.py

@@ -0,0 +1,130 @@
+import streamlit as st
+from dotenv import load_dotenv
+load_dotenv()
+from streamlit_extras.stylable_container import stylable_container
+
+from app import main as article_recommendor_main
+from research_paper import main as research_article_suggester_main
+from test import main as feedback_main
+
+st.set_page_config(page_title='Multi-Page App', page_icon='📰', layout='wide')
+
+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()
+
+def show_main_page():
+    st.markdown(
+        """
+        <style> 
+          body {
+                background-color: #2e2e2e;
+                background-size: cover;
+                background-position: center;
+                background-repeat: no-repeat;
+            }
+            .main-title {
+                font-size: 3em;
+                font-weight: bold;
+                margin-top: 20px;
+                text-align: center;
+            }
+            .sub-header {
+                font-size: 1.5em;
+                margin: 20px 0;
+                text-align: center;
+            }
+            .card {
+                
+                border-radius: 10px;
+                padding: 20px;
+                width: 300px;
+                height: 300px;    
+                text-align: center;
+                margin: 20px;
+            }
+            .card-button {
+                background-color: #ff4b4b;
+                color: white;
+                border: none;
+                padding: 10px 20px;
+                font-size: 1em;
+                border-radius: 5px;
+                cursor: pointer;
+            }
+            .card-button:hover {
+                background-color: #ff7979;
+            }
+        </style>
+        """, unsafe_allow_html=True)
+
+    st.markdown('<div class="main-title">Welcome to the Multi-Page App!</div>', unsafe_allow_html=True)
+    st.markdown("---")
+    st.markdown('<div class="sub-header">Navigate to Specific Pages:</div>', unsafe_allow_html=True)
+
+    card_info = [
+        {"title": "Article Recommendor", "description": "Discover articles tailored to your interests.", "key": "article_recommendor"},
+        {"title": "Recent Article Suggester", "description": "Get suggestions for recent research articles.", "key": "research_article_suggester"},
+        {"title": "Feedback", "description": "Provide your valuable feedback.", "key": "feedback"},
+
+        
+    ]
+
+    num_cols = 3 
+    num_rows = (len(card_info) + num_cols - 1) // num_cols
+
+    with stylable_container(
+        key="container_with_border",
+        css_styles="""
+            {
+                display: flex;
+                # justify-content: center;
+                align-items: center;
+                flex-wrap: wrap;
+            }
+            """,
+    ):
+        
+        for row in range(num_rows):
+                cols = st.columns(num_cols)
+                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="""
+                                        {                                        
+                                            border-radius: 10px;
+                                            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+                                            align-items: center;
+                                            flex-wrap: wrap;
+                                            padding:10px;
+                                        }
+                                        """,
+                                ):
+                                st.markdown(
+                                    f'''
+                                    <div class="card">
+                                        <h2>{card["title"]}</h2>
+                                        <p>{card["description"]}</p>
+                                    
+                                    </div>
+                                    ''', unsafe_allow_html=True)
+                                                
+                                if st.button(f"Go to {card['title']}", key=card["key"]):
+                                        st.session_state.page = card["key"]
+
+    
+if __name__ == '__main__':
+    main()

research_paper.py

@@ -2,9 +2,11 @@ import streamlit as st
 from crew.research_article_suggester import RecentArticleSuggester
 from streamlit_extras.capture import stdout
 
-def main():
-    st.set_page_config(page_title='Recent Article Suggester', page_icon='📰', layout='wide')
 
+# st.set_page_config(page_title='Recent Article Suggester', page_icon='📰', layout='wide')
+
+def main():
+   
     st.markdown(
         """
         <style>
@@ -125,6 +127,7 @@ def main():
                     """,
                     unsafe_allow_html=True
                 )
-
+    if st.sidebar.button("← Back to Main Page"):
+        st.session_state.page = "main"
 if __name__ == "__main__":
     main()

test.py

@@ -13,8 +13,8 @@ from streamlit_extras.capture import stdout
 
 
 def main():
-    st.set_page_config(page_title='Today I Learnt',
-                       page_icon='📰', layout='wide')
+    # st.set_page_config(page_title='Today I Learnt',
+    #                    page_icon='📰', layout='wide')
     st.markdown("<div class='container'>", unsafe_allow_html=True)
 
     st.markdown(