Update app.py

app.py

@@ -3,13 +3,16 @@ from datetime import datetime, timedelta
 import base64
 import pandas as pd
 import pydeck as pdk
+from geopy.geocoders import Nominatim
+import qrcode
+from io import BytesIO
+
+# Import functions and tasks from travel.py
 from travel import (
     destination_research_task, accommodation_task, transportation_task,
     activities_task, dining_task, itinerary_task, chatbot_task,
-    run_task
+    run_task, update_llm
 )
-from geopy.geocoders import Nominatim
-from io import BytesIO
 
 st.set_page_config(
     page_title="Your AI Agent for Travelling",
@@ -18,6 +21,44 @@ st.set_page_config(
     initial_sidebar_state="expanded"
 )
 
+with st.sidebar:
+    st.image("image.png", width=250)
+    st.markdown("""
+<h3>Namude Yatra: The beginning of your dream journey</h3>
+<p style="font-size: 14px; color: var(--text-muted);">AI-Powered Agentic Travel Planning</p>
+""", unsafe_allow_html=True)
+    
+    # API Key Input (update dynamically)
+    api_key = st.text_input("Enter your GEMINI API Key", type="password")
+    if api_key:
+        update_llm(api_key)
+        st.success("API Key updated!")
+
+    st.markdown("""
+    <div class="sidebar-section">
+        <h2>About</h2>
+        <p>This tool creates a personalized travel itinerary based on your preferences. Fill in the form on the main page and let our expert travel agents plan your perfect trip!</p>
+    </div>
+    <div class="sidebar-section">
+        <h2>How It Works</h2>
+        <ul>
+            <li><b>Enter:</b> Your travel details</li>
+            <li><b>Analyze:</b> Preferences by AI</li>
+            <li><b>Generate:</b> Your comprehensive itinerary</li>
+            <li><b>Download:</b> Save and share your itinerary</li>
+        </ul>
+    </div>
+    <div class="sidebar-section">
+        <h2>Travel Agents</h2>
+        <div class="agent-item"><strong>🔭 Research Specialist</strong><br><small>Finds the best destinations based on your preferences.</small></div>
+        <div class="agent-item"><strong>🏨 Accommodation Expert</strong><br><small>Suggests suitable hotels and stays.</small></div>
+        <div class="agent-item"><strong>🚆 Transportation Planner</strong><br><small>Plans efficient travel routes.</small></div>
+        <div class="agent-item"><strong>🎯 Activities Curator</strong><br><small>Recommends activities tailored to your interests.</small></div>
+        <div class="agent-item"><strong>🍽️ Dining Connoisseur</strong><br><small>Finds the best dining experiences.</small></div>
+        <div class="agent-item"><strong>📅 Itinerary Creator</strong><br><small>Puts everything together in a daily plan.</small></div>
+    </div>
+    """, unsafe_allow_html=True)
+
 st.markdown("""
 <style>
     :root {
@@ -32,66 +73,14 @@ st.markdown("""
         --text-muted: #495057;
         --border: #e9ecef;
     }
-    /* Sidebar custom styles */
-    .sidebar-container {
-        padding: 20px;
-        background-color: var(--card-bg);
-        border-radius: 10px;
-        margin-bottom: 20px;
-        box-shadow: 0 2px 10px rgba(0,0,0,0.05);
-    }
-    .sidebar-header {
-        text-align: center;
-        margin-bottom: 20px;
-    }
-    .sidebar-header img {
-        margin-bottom: 10px;
-    }
-    .sidebar-header h3 {
-        margin-bottom: 5px;
-        color: var(--accent);
-        font-size: 1.5rem;
-    }
-    .sidebar-section {
-        margin-bottom: 20px;
-    }
-    .sidebar-section h2 {
-        margin-bottom: 10px;
-        color: var(--primary-dark);
-        border-bottom: 1px solid var(--border);
-        padding-bottom: 5px;
-    }
-    .sidebar-section p {
-        font-size: 14px;
-        color: var(--text-muted);
-    }
-    .sidebar-section ul {
-        list-style-type: disc;
-        margin-left: 20px;
-        color: var(--text);
-        font-size: 14px;
-    }
-    .agent-item {
-        margin-bottom: 10px;
-    }
-    .agent-item strong {
-        font-size: 18px;
-        color: var(--primary-dark);
-    }
-    .agent-item small {
-        font-size: 16px;
-    }
 </style>
 """, unsafe_allow_html=True)
 
 def get_download_link(text_content, filename):
-    """Generate a download link for the itinerary text file."""
     b64 = base64.b64encode(text_content.encode()).decode()
-    href = f'<a class="download-link" href="data:text/plain;base64,{b64}" download="{filename}"><i>📥</i> Save Your Itinerary</a>'
-    return href
+    return f'<a class="download-link" href="data:text/plain;base64,{b64}" download="{filename}"><i>📥</i> Save Your Itinerary</a>'
 
 def display_modern_progress(current_step, total_steps=6):
-    """Displays a progress bar and step indicators."""
     if 'progress_steps' not in st.session_state:
         st.session_state.progress_steps = {
             0: {'status': 'pending', 'name': "Trip Details"},
@@ -113,7 +102,6 @@ def display_modern_progress(current_step, total_steps=6):
     progress_percentage = (current_step / total_steps) * 100
     st.progress(progress_percentage / 100)
     
-    # Display step grid
     st.markdown("""
     <style>
     .compact-progress {
@@ -174,7 +162,6 @@ def display_modern_progress(current_step, total_steps=6):
         else:
             icon = "⭕"
             status_class = "pending"
-        
         st.markdown(f"""
         <div class="step-item {status_class}">
             <span class="step-icon">{icon}</span>
@@ -186,15 +173,12 @@ def display_modern_progress(current_step, total_steps=6):
     return progress_percentage
 
 def update_step_status(step_index, status):
-    """Update the status (pending, active, complete) for a given step index."""
     if 'progress_steps' in st.session_state and step_index in st.session_state.progress_steps:
         st.session_state.progress_steps[step_index]['status'] = status
 
 def run_task_with_logs(task, input_text, log_container, output_container, results_key=None):
-    """Runs a task with logging in a separate container."""
     if 'log_messages' not in st.session_state:
         st.session_state.log_messages = []
-    
     log_message = f"🤖 Starting {task.agent.role}..."
     st.session_state.log_messages.append(log_message)
     
@@ -207,7 +191,6 @@ def run_task_with_logs(task, input_text, log_container, output_container, result
     
     if results_key:
         st.session_state.results[results_key] = result
-    
     log_message = f"✅ {task.agent.role} completed!"
     st.session_state.log_messages.append(log_message)
     
@@ -219,7 +202,6 @@ def run_task_with_logs(task, input_text, log_container, output_container, result
     with output_container:
         st.markdown(f"### {task.agent.role} Output")
         st.markdown("<div class='agent-output'>" + result + "</div>", unsafe_allow_html=True)
-    
     return result
 
 if 'generated_itinerary' not in st.session_state:
@@ -258,56 +240,14 @@ st.markdown(f"""
 </div>
 """, unsafe_allow_html=True)
 
-
 st.markdown('<hr style="height:3px;border:none;background-color:#f0f0f0;margin-bottom:25px;">', unsafe_allow_html=True)
 
-with st.sidebar:
-    st.image("image.png", width=250)
-    st.markdown("""
-<h3>Namude Yatra: The beginning of your dream journey</h3>
-<p style="font-size: 14px; color: var(--text-muted);">AI-Powered Agentic Travel Planning</p>
-""", unsafe_allow_html=True)
-
-    
-    st.markdown('<div class="sidebar-section">', unsafe_allow_html=True)
-    st.markdown("<h2>About</h2>", unsafe_allow_html=True)
-    st.markdown("<p>This tool creates a personalized travel itinerary based on your preferences. Fill in the form on the main page and let our expert travel agents plan your perfect trip!</p>", unsafe_allow_html=True)
-    st.markdown('</div>', unsafe_allow_html=True)
-    
-    st.markdown('<div class="sidebar-section">', unsafe_allow_html=True)
-    st.markdown("<h2>How It Works</h2>", unsafe_allow_html=True)
-    st.markdown("""
-    <ul>
-      <li><b>Enter:</b> Your travel details</li>
-      <li><b>Analyze:</b> Preferences by AI</li>
-      <li><b>Generate:</b> Your comprehensive itinerary</li>
-      <li><b>Download:</b> Save and share your itinerary</li>
-    </ul>
-    """, unsafe_allow_html=True)
-    st.markdown('</div>', unsafe_allow_html=True)
-    
-    st.markdown('<div class="sidebar-section">', unsafe_allow_html=True)
-    st.markdown("<h2>Travel Agents</h2>", unsafe_allow_html=True)
-    agents = [
-        ("🔭 Research Specialist", "Finds the best destinations based on your preferences."),
-        ("🏨 Accommodation Expert", "Suggests suitable hotels and stays."),
-        ("🚆 Transportation Planner", "Plans efficient travel routes."),
-        ("🎯 Activities Curator", "Recommends activities tailored to your interests."),
-        ("🍽️ Dining Connoisseur", "Finds the best dining experiences."),
-        ("📅 Itinerary Creator", "Puts everything together in a daily plan.")
-    ]
-    for name, desc in agents:
-        st.markdown(f'<div class="agent-item"><strong>{name}</strong><br><small>{desc}</small></div>', unsafe_allow_html=True)
-    st.markdown('</div>', unsafe_allow_html=True)
-
 if not st.session_state.generation_complete:
     st.markdown('<div class="modern-card animate-in">', unsafe_allow_html=True)
-    st.markdown("<h3 style='font-weight: 600; color: var(--primary-dark); display: flex; align-items: center; gap: 10px;'><span style='font-size: 20px;'>✈️</span> Create Your Itinerary</h3>", unsafe_allow_html=True)
-    
+    st.markdown("<h3 style='font-weight: 600; color: var(--primary-dark); text-align: center;'>✈️ Create Your Itinerary</h3>", unsafe_allow_html=True)
     st.markdown("""
-    <p style="color: var(--text-muted); margin-bottom: 16px; font-size: 14px;">Complete the form below for a personalized travel plan.</p>
+    <p style="text-align: center; color: var(--text-muted); font-size: 14px;">Complete the form below for a personalized travel plan.</p>
     """, unsafe_allow_html=True)
-    
     with st.form("travel_form"):
         col1, col2 = st.columns(2)
         with col1:
@@ -318,7 +258,7 @@ if not st.session_state.generation_complete:
             start_date = st.date_input("Start Date", min_value=datetime.now(), label_visibility="collapsed")
             duration = st.slider("Duration (days)", min_value=1, max_value=30, value=7)
             end_date = start_date + timedelta(days=duration-1)
-            st.markdown(f'<p style="font-size: 13px; color: var(--text-muted);">{start_date.strftime("%b %d")} - {end_date.strftime("%b %d, %Y")}</p>', unsafe_allow_html=True)
+            st.markdown(f'<p style="font-size: 13px; color: var(--text-muted); text-align: center;">{start_date.strftime("%b %d")} - {end_date.strftime("%b %d, %Y")}</p>', unsafe_allow_html=True)
         with col2:
             st.markdown('<p style="font-weight: 500; color: var(--primary); font-size: 14px;">Preferences</p>', unsafe_allow_html=True)
             travelers = st.number_input("Travelers", min_value=1, max_value=15, value=2)
@@ -348,8 +288,7 @@ if not st.session_state.generation_complete:
                 "preferences": preferences,
                 "special_requirements": special_requirements
             }
-
-            st.session_state.user_input = user_input 
+            st.session_state.user_input = user_input
             input_context = f"""Travel Request Details:
 Origin: {user_input['origin']}
 Destination: {user_input['destination']}
@@ -362,13 +301,13 @@ Preferences/Interests: {user_input['preferences']}
 Special Requirements: {user_input['special_requirements']}
 """
             modified_input_context = "Please output the response in English.\n" + input_context
-            
+
             # Processing Animation
             st.markdown("""
-            <div class="sleek-processing-container" style="text-align:center; padding:20px 0;">
-              <div class="pulse-container" style="position:relative; width:50px; height:50px;">
-                <div class="pulse-ring" style="position:absolute; width:100%; height:100%; border:2px solid #4361ee; border-radius:50%; animation:pulse 1.5s ease-out infinite;"></div>
-                <div class="pulse-core" style="position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:12px; height:12px; background-color:#4361ee; border-radius:50%; box-shadow:0 0 8px rgba(67,97,238,0.6);"></div>
+            <div style="text-align: center; padding:20px 0;">
+              <div style="position:relative; width:50px; height:50px;">
+                <div style="position:absolute; width:100%; height:100%; border:2px solid #4361ee; border-radius:50%; animation:pulse 1.5s ease-out infinite;"></div>
+                <div style="position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:12px; height:12px; background-color:#4361ee; border-radius:50%; box-shadow:0 0 8px rgba(67,97,238,0.6);"></div>
               </div>
             </div>
             <style>
@@ -379,7 +318,7 @@ Special Requirements: {user_input['special_requirements']}
             }
             </style>
             """, unsafe_allow_html=True)
-            
+
             st.markdown('<div class="modern-card">', unsafe_allow_html=True)
             progress_tab, logs_tab, details_tab = st.tabs(["📊 Progress", "🔄 Live Activity", "📋 Your Travel Request"])
             with details_tab:
@@ -403,7 +342,6 @@ Special Requirements: {user_input['special_requirements']}
                 st.session_state.log_messages = []
             st.markdown('</div>', unsafe_allow_html=True)
             
-            # Output container for the Agents
             output_container = st.container()
             with output_container:
                 st.markdown('<div class="modern-card">', unsafe_allow_html=True)
@@ -411,7 +349,6 @@ Special Requirements: {user_input['special_requirements']}
                 st.info("Our AI agents will show their work here as they create your itinerary")
                 st.markdown('</div>', unsafe_allow_html=True)
             
-            # Steps
             st.session_state.current_step = 0
             
             # Step 1: Destination Research
@@ -419,7 +356,7 @@ Special Requirements: {user_input['special_requirements']}
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             destination_info = run_task_with_logs(
-                destination_research_task, 
+                destination_research_task,
                 modified_input_context.format(destination=user_input['destination'], preferences=user_input['preferences']),
                 log_container,
                 output_container,
@@ -433,7 +370,7 @@ Special Requirements: {user_input['special_requirements']}
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             accommodation_info = run_task_with_logs(
-                accommodation_task, 
+                accommodation_task,
                 modified_input_context.format(destination=user_input['destination'], budget=user_input['budget'], preferences=user_input['preferences']),
                 log_container,
                 output_container,
@@ -447,7 +384,7 @@ Special Requirements: {user_input['special_requirements']}
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             transportation_info = run_task_with_logs(
-                transportation_task, 
+                transportation_task,
                 modified_input_context.format(origin=user_input['origin'], destination=user_input['destination']),
                 log_container,
                 output_container,
@@ -461,7 +398,7 @@ Special Requirements: {user_input['special_requirements']}
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             activities_info = run_task_with_logs(
-                activities_task, 
+                activities_task,
                 modified_input_context.format(destination=user_input['destination'], preferences=user_input['preferences']),
                 log_container,
                 output_container,
@@ -475,7 +412,7 @@ Special Requirements: {user_input['special_requirements']}
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             dining_info = run_task_with_logs(
-                dining_task, 
+                dining_task,
                 modified_input_context.format(destination=user_input['destination'], preferences=user_input['preferences']),
                 log_container,
                 output_container,
@@ -506,7 +443,7 @@ Dining Recommendations:
 {dining_info}
 """
             itinerary = run_task_with_logs(
-                itinerary_task, 
+                itinerary_task,
                 combined_info.format(duration=user_input['duration'], origin=user_input['origin'], destination=user_input['destination']),
                 log_container,
                 output_container,
@@ -517,14 +454,13 @@ Dining Recommendations:
             with st.session_state.progress_placeholder.container():
                 display_modern_progress(st.session_state.current_step)
             
-            # Store the final itinerary
             st.session_state.generated_itinerary = itinerary
             st.session_state.generation_complete = True
             date_str = datetime.now().strftime("%Y-%m-%d")
             st.session_state.filename = f"{user_input['destination'].replace(' ', '_')}_{date_str}_itinerary.txt"
 
+
 if st.session_state.generation_complete:
-    # Success Animation
     st.markdown("""
     <div class="modern-card animate-in">
       <div style="display: flex; justify-content: center; margin-bottom: 20px;">
@@ -538,7 +474,6 @@ if st.session_state.generation_complete:
       <h2 style="text-align: center; color: var(--primary-dark);">Your Travel Itinerary is Ready! 🎉</h2>
       <p style="text-align: center; color: var(--text-muted); margin-bottom: 20px;">We've created a personalized travel experience just for you. Explore your itinerary below.</p>
     </div>
-    
     <style>
     .success-animation {
       width: 100px;
@@ -584,7 +519,6 @@ if st.session_state.generation_complete:
     </style>
     """, unsafe_allow_html=True)
     
-    # Tabs
     itinerary_tab, details_tab, download_tab, map_tab, chatbot_tab = st.tabs([
         "🗒️ Full Itinerary", 
         "💼 Details", 
@@ -614,7 +548,6 @@ if st.session_state.generation_complete:
             st.markdown("### 🍽️ Dining Recommendations")
             st.markdown(st.session_state.results["dining_info"])
     
-    # Download & Share Tab (No QR code)
     with download_tab:
         col1, col2 = st.columns([2, 1])
         with col1:
@@ -624,25 +557,20 @@ if st.session_state.generation_complete:
             <div style="background-color: var(--background); padding: 15px; border-radius: 10px; margin-top: 20px;">
                 <h4>Your Itinerary File</h4>
                 <p style="font-size: 0.9rem; color: var(--text-muted);">Text format - Can be opened in any text editor</p>
+            </div>
             """, unsafe_allow_html=True)
-
-            # Download link
             st.markdown(
                 "<div style='margin: 10px 0;'>"
                 + get_download_link(st.session_state.generated_itinerary, st.session_state.filename)
                 + "</div>",
                 unsafe_allow_html=True
             )
-            st.markdown("</div>", unsafe_allow_html=True)
-
             st.markdown("### Share Your Itinerary")
             st.markdown("*Coming soon: Additional sharing features (email, phone, etc.)*")
-
         with col2:
             st.markdown("### Save for Mobile")
             st.markdown("*Coming soon: Additional mobile features such as a dedicated app or push notifications*")
     
-    # Map & Visualization Tab
     with map_tab:
         st.markdown("### Destination Map")
         dest = st.session_state.get("destination", "Paris")
@@ -664,7 +592,6 @@ if st.session_state.generation_complete:
             "name": [dest]
         })
         st.map(map_data)
-        
         st.markdown("#### Interactive Map with Pydeck")
         layer = pdk.Layer(
             "ScatterplotLayer",
@@ -682,7 +609,6 @@ if st.session_state.generation_complete:
         deck_chart = pdk.Deck(layers=[layer], initial_view_state=view_state)
         st.pydeck_chart(deck_chart)
     
-    # Chatbot Interface
     with chatbot_tab:
         st.markdown("### AI Chatbot Interface")
         if "chat_history" not in st.session_state:
@@ -707,7 +633,6 @@ if st.session_state.generation_complete:
             st.markdown(f"**{chat['speaker']}** ({time_str}): {chat['message']}")
         st.markdown("</div>", unsafe_allow_html=True)
 
-# Footer
 st.markdown("""
 <div style="margin-top: 50px; text-align: center; padding: 20px; color: var(--text-muted); font-size: 0.8rem;">
     <p>Built with ❤️ for you</p>