app.py

import streamlit as st
from crewai import Crew, Process
from trip_agents import TripAgents
from dotenv import load_dotenv

load_dotenv()

class TripCrew:
    def __init__(self, origin, cities, date_range, interests):
        self.cities = cities
        self.origin = origin
        self.interests = interests
        self.date_range = date_range

    def run(self):
        agents = TripAgents()
        tasks = TripTasks()

        city_selector_agent = agents.city_selection_agent()
        local_expert_agent = agents.local_expert()
        travel_concierge_agent = agents.travel_concierge()

        identify_task = tasks.identify_task(
            city_selector_agent,
            self.origin,
            self.cities,
            self.interests,
            self.date_range
        )
        gather_task = tasks.gather_task(
            local_expert_agent,
            self.origin,
            self.interests,
            self.date_range
        )
        plan_task = tasks.plan_task(
            travel_concierge_agent, 
            self.origin,
            self.interests,
            self.date_range
        )

        crew = Crew(
            agents=[
                city_selector_agent, local_expert_agent, travel_concierge_agent
            ],
            tasks=[identify_task, gather_task, plan_task],
            verbose=True,
        )

        result = crew.kickoff()
        return result

# Function to initialize chat history in session state
def initialize_chat_history():
    if 'chat_history' not in st.session_state:
        st.session_state['chat_history'] = []

# Function to handle user input and AI response
def handle_user_input():
    user_input = st.session_state['user_input']
    if user_input:
        # Append user message to chat history
        st.session_state['chat_history'].append(f"<div style='text-align: right;'>You: {user_input}</div>")
        
        # Split the user input
        details = user_input.split(",")
        
        # Ensure there are enough details provided
        if len(details) < 4:
            st.session_state['chat_history'].append("<div style='color: red;'>Please provide all details in the format: location, cities, date range, interests</div>")
        else:
            # Get user input for trip planning
            location = details[0].strip()
            cities = details[1].strip()
            date_range = details[2].strip()
            interests = details[3].strip()
            
            # Run the trip planning agent
            trip_crew = TripCrew(location, cities, date_range, interests)
            result = trip_crew.run()
            
            # Append agent response to chat history
            st.session_state['chat_history'].append(f"<div style='text-align: right;'>{result}</div>")
        
        # Clear the input field
        st.session_state['user_input'] = ""

# Initialize chat history
initialize_chat_history()

# Main page layout
st.title("Welcome to Paris Travel Advisor!")

# Sidebar
st.sidebar.title("Chat History")
st.sidebar.write("Recent Conversations")
# Dummy chat history for UI demonstration
for i in range(5):
    st.sidebar.write(f"Conversation {i + 1}")
st.sidebar.button("New Chat")
st.sidebar.button("Clear Conversations")
st.sidebar.write("My Account")
st.sidebar.write("Logout")

# Main content
col1, col2, col3 = st.columns(3)

# Custom CSS for box with shadow effect and equal heights
box_shadow = """
<style>
.custom-box {
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
    padding: 15px;
    border-radius: 5px;
    background-color: #fff;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.custom-box h3 {
    margin-top: 0;
    font-size: 1.2rem;
}
.custom-box p {
    flex-grow: 1;
    font-size: 0.8rem;
}
</style>
"""
st.markdown(box_shadow, unsafe_allow_html=True)

with col1:
    # Plan Your Trip section with box
    st.markdown(
        """
        <div class="custom-box">
            <h3>Plan Your Trip</h3>
            <p>Plan your itinerary with ease. Search for flights, hotels, and activities, all in one place. Book your selections and create a personalized itinerary.</p>
        </div>
        """,
        unsafe_allow_html=True,
    )

with col2:
    # Trip Inspiration section with box
    st.markdown(
        """
        <div class="custom-box">
            <h3>Trip Inspiration</h3>
            <p>Find your dream vacation. Explore destinations, discover things to do, and get ideas for your next trip.</p>
        </div>
        """,
        unsafe_allow_html=True,
    )

with col3:
    # Travel Restrictions and Advisories section with box
    st.markdown(
        """
        <div class="custom-box">
            <h3>Travel Restrictions and Advisories</h3>
            <p>Stay informed, travel safe! Get the latest updates on travel advisories, visa requirements, and COVID-19 restrictions for your destinations.</p>
        </div>
        """,
        unsafe_allow_html=True,
    )

# Display chat history
for message in st.session_state['chat_history']:
    st.markdown(message, unsafe_allow_html=True)

# CSS styles for input container with absolute positioning and flexbox for centering
st.markdown(
    """
    <style>
    .input-container {
        position: fixed;
        bottom: 0;
        width: 100%;
        background-color: #f1f1f1;
        padding: 10px;
        box-sizing: border-box;
        display: flex; /* Added flexbox for centering */
        justify-content: center; /* Horizontally center elements */
        z-index: 9999; /* Ensure it stays above other content */
    }
    .input-container .column {
        margin: 0 5px;
    }
    </style>
    """,
    unsafe_allow_html=True,
)

# Input field and send button icon inside a container
input_container = st.empty()
with input_container.container():
    col1, col2 = st.columns([10, 1])
    with col1:
        user_input = st.text_input("", key="user_input", placeholder="Enter your trip details (location, cities, date range, interests)", help="Enter your trip details separated by commas")
    with col2:
        submit_button = st.button("⬆", on_click=handle_user_input)