Update app.py

app.py

@@ -2,7 +2,6 @@
 
 import gradio as gr
 from bs4 import BeautifulSoup
-import requests
 from sentence_transformers import SentenceTransformer
 import faiss
 import numpy as np
@@ -13,6 +12,7 @@ import base64
 import logging
 import os
 import sys
+import uuid  # For unique IDs
 
 # Import OpenAI library
 import openai
@@ -35,7 +35,7 @@ logger.addHandler(console_handler)
 # Initialize models and variables
 logger.info("Initializing models and variables")
 embedding_model = SentenceTransformer('all-MiniLM-L6-v2')
-faiss_index = None
+faiss_index = faiss.IndexIDMap(faiss.IndexFlatL2(embedding_model.get_sentence_embedding_dimension()))
 bookmarks = []
 fetch_cache = {}
 
@@ -101,7 +101,7 @@ async def fetch_url_info(session, bookmark):
 
     try:
         logger.info(f"Fetching URL info for: {url}")
-        async with session.get(url, timeout=5) as response:
+        async with session.get(url, timeout=10) as response:
             bookmark['etag'] = response.headers.get('ETag', 'N/A')
             bookmark['status_code'] = response.status
 
@@ -122,7 +122,11 @@ async def fetch_url_info(session, bookmark):
                 elif meta_description and meta_description.get('content'):
                     description = meta_description.get('content')
                 else:
-                    description = ''
+                    # If no description, extract visible text
+                    texts = soup.stripped_strings
+                    description = ' '.join(texts[:200])  # Limit to first 200 words
+                    # Generate summary using LLM
+                    description = generate_summary_with_llm(description)
 
                 bookmark['description'] = description
                 logger.info(f"Fetched description for {url}")
@@ -142,12 +146,12 @@ async def fetch_url_info(session, bookmark):
     return bookmark
 
 # Asynchronous processing of bookmarks
-async def process_bookmarks_async(bookmarks):
+async def process_bookmarks_async(bookmarks_list):
     logger.info("Processing bookmarks asynchronously")
     try:
         async with aiohttp.ClientSession() as session:
             tasks = []
-            for bookmark in bookmarks:
+            for bookmark in bookmarks_list:
                 task = asyncio.ensure_future(fetch_url_info(session, bookmark))
                 tasks.append(task)
             await asyncio.gather(*tasks)
@@ -156,12 +160,34 @@ async def process_bookmarks_async(bookmarks):
         logger.error(f"Error in asynchronous processing of bookmarks: {e}")
         raise
 
+# Generate summary for a bookmark using LLM
+def generate_summary_with_llm(text):
+    logger.info("Generating summary with LLM")
+    try:
+        prompt = f"Summarize the following content in a concise manner:\n\n{text}"
+        response = openai.ChatCompletion.create(
+            model='gpt-3.5-turbo',  # Use appropriate model
+            messages=[
+                {"role": "system", "content": "You are a helpful assistant that summarizes text."},
+                {"role": "user", "content": prompt}
+            ],
+            max_tokens=150,
+            temperature=0.5,
+        )
+        summary = response['choices'][0]['message']['content'].strip()
+        logger.info("Summary generated successfully")
+        return summary
+    except Exception as e:
+        logger.error(f"Error generating summary with LLM: {e}")
+        return "No summary available."
+
 # Generate summary for a bookmark
 def generate_summary(bookmark):
     description = bookmark.get('description', '')
     if description:
         bookmark['summary'] = description
     else:
+        # Fallback summary generation
         title = bookmark.get('title', '')
         if title:
             bookmark['summary'] = title
@@ -170,6 +196,33 @@ def generate_summary(bookmark):
     logger.info(f"Generated summary for bookmark: {bookmark.get('url')}")
     return bookmark
 
+# Assign category to a bookmark using LLM
+def assign_category_with_llm(summary):
+    logger.info("Assigning category with LLM")
+    try:
+        categories_str = ', '.join(CATEGORIES)
+        prompt = f"Assign the most appropriate category to the following summary from the list of categories.\n\nSummary: {summary}\n\nCategories: {categories_str}\n\nCategory:"
+        response = openai.ChatCompletion.create(
+            model='gpt-3.5-turbo',  # Use appropriate model
+            messages=[
+                {"role": "system", "content": "You are a helpful assistant that assigns categories."},
+                {"role": "user", "content": prompt}
+            ],
+            max_tokens=10,
+            temperature=0.3,
+        )
+        category = response['choices'][0]['message']['content'].strip()
+        # Ensure the category is valid
+        if category in CATEGORIES:
+            logger.info(f"Assigned category '{category}' successfully")
+            return category
+        else:
+            logger.warning(f"Received invalid category '{category}' from LLM. Defaulting to 'Uncategorized'.")
+            return "Uncategorized"
+    except Exception as e:
+        logger.error(f"Error assigning category with LLM: {e}")
+        return "Uncategorized"
+
 # Assign category to a bookmark
 def assign_category(bookmark):
     if bookmark.get('dead_link'):
@@ -177,62 +230,40 @@ def assign_category(bookmark):
         logger.info(f"Assigned category 'Dead Link' to bookmark: {bookmark.get('url')}")
         return bookmark
 
-    summary = bookmark.get('summary', '').lower()
-    assigned_category = 'Uncategorized'
-
-    # Keywords associated with each category
-    category_keywords = {
-        "Social Media": ["social media", "networking", "friends", "connect", "posts", "profile"],
-        "News and Media": ["news", "journalism", "media", "headlines", "breaking news"],
-        "Education and Learning": ["education", "learning", "courses", "tutorial", "university", "academy", "study"],
-        "Entertainment": ["entertainment", "movies", "tv shows", "games", "comics", "fun"],
-        "Shopping and E-commerce": ["shopping", "e-commerce", "buy", "sell", "marketplace", "deals", "store"],
-        "Finance and Banking": ["finance", "banking", "investment", "money", "economy", "stock", "trading"],
-        "Technology": ["technology", "tech", "gadgets", "software", "computers", "innovation"],
-        "Health and Fitness": ["health", "fitness", "medical", "wellness", "exercise", "diet"],
-        "Travel and Tourism": ["travel", "tourism", "destinations", "hotels", "flights", "vacation"],
-        "Food and Recipes": ["food", "recipes", "cooking", "cuisine", "restaurant", "dining"],
-        "Sports": ["sports", "scores", "teams", "athletics", "matches", "leagues"],
-        "Arts and Culture": ["arts", "culture", "museum", "gallery", "exhibition", "artistic"],
-        "Government and Politics": ["government", "politics", "policy", "election", "public service"],
-        "Business and Economy": ["business", "corporate", "industry", "economy", "markets"],
-        "Science and Research": ["science", "research", "experiment", "laboratory", "study", "scientific"],
-        "Personal Blogs and Journals": ["blog", "journal", "personal", "diary", "thoughts", "opinions"],
-        "Job Search and Careers": ["jobs", "careers", "recruitment", "resume", "employment", "hiring"],
-        "Music and Audio": ["music", "audio", "songs", "albums", "artists", "bands"],
-        "Videos and Movies": ["video", "movies", "film", "clips", "trailers", "cinema"],
-        "Reference and Knowledge Bases": ["reference", "encyclopedia", "dictionary", "wiki", "knowledge", "information"],
-    }
-
-    for category, keywords in category_keywords.items():
-        for keyword in keywords:
-            if re.search(r'\b' + re.escape(keyword) + r'\b', summary):
-                assigned_category = category
-                logger.info(f"Assigned category '{assigned_category}' to bookmark: {bookmark.get('url')}")
-                break
-        if assigned_category != 'Uncategorized':
-            break
-
-    bookmark['category'] = assigned_category
-    if assigned_category == 'Uncategorized':
-        logger.info(f"No matching category found for bookmark: {bookmark.get('url')}")
+    summary = bookmark.get('summary', '')
+    if summary:
+        category = assign_category_with_llm(summary)
+        bookmark['category'] = category
+    else:
+        bookmark['category'] = 'Uncategorized'
+        logger.info(f"No summary available to assign category for bookmark: {bookmark.get('url')}")
     return bookmark
 
 # Vectorize summaries and build FAISS index
-def vectorize_and_index(bookmarks):
-    logger.info("Vectorizing summaries and building FAISS index")
+def vectorize_and_index(bookmarks_list):
+    global faiss_index
+    logger.info("Vectorizing summaries and updating FAISS index")
     try:
-        summaries = [bookmark['summary'] for bookmark in bookmarks]
-        embeddings = embedding_model.encode(summaries)
-        dimension = embeddings.shape[1]
-        faiss_idx = faiss.IndexFlatL2(dimension)
-        faiss_idx.add(np.array(embeddings))
-        logger.info("FAISS index built successfully")
-        return faiss_idx, embeddings
+        summaries = [bookmark['summary'] for bookmark in bookmarks_list]
+        embeddings = embedding_model.encode(summaries).astype('float32')
+        ids = [uuid.uuid4().int & (1<<64)-1 for _ in bookmarks_list]  # Generate unique 64-bit integer IDs
+        faiss_index.add_with_ids(embeddings, np.array(ids))
+        logger.info("FAISS index updated successfully")
+        return embeddings, ids
     except Exception as e:
         logger.error(f"Error in vectorizing and indexing: {e}")
         raise
 
+# Remove vectors from FAISS index by IDs
+def remove_from_faiss(ids_to_remove):
+    global faiss_index
+    logger.info(f"Removing {len(ids_to_remove)} vectors from FAISS index")
+    try:
+        faiss_index.remove_ids(np.array(ids_to_remove))
+        logger.info("Vectors removed from FAISS index successfully")
+    except Exception as e:
+        logger.error(f"Error removing vectors from FAISS index: {e}")
+
 # Generate HTML display for bookmarks
 def display_bookmarks():
     logger.info("Generating HTML display for bookmarks")
@@ -270,34 +301,65 @@ def display_bookmarks():
     return cards
 
 # Process the uploaded file
-def process_uploaded_file(file):
+def process_uploaded_file(file, state_bookmarks):
     global bookmarks, faiss_index
     logger.info("Processing uploaded file")
     if file is None:
         logger.warning("No file uploaded")
-        return "Please upload a bookmarks HTML file.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ Please upload a bookmarks HTML file.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
+
     try:
         file_content = file.decode('utf-8')
     except UnicodeDecodeError as e:
         logger.error(f"Error decoding the file: {e}")
-        return "Error decoding the file. Please ensure it's a valid HTML file.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ Error decoding the file. Please ensure it's a valid HTML file.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
 
     try:
         bookmarks = parse_bookmarks(file_content)
     except Exception as e:
         logger.error(f"Error parsing bookmarks: {e}")
-        return "Error parsing the bookmarks HTML file.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ Error parsing the bookmarks HTML file.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
 
     if not bookmarks:
         logger.warning("No bookmarks found in the uploaded file")
-        return "No bookmarks found in the uploaded file.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ No bookmarks found in the uploaded file.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
 
     # Asynchronously fetch bookmark info
     try:
         asyncio.run(process_bookmarks_async(bookmarks))
     except Exception as e:
         logger.error(f"Error processing bookmarks asynchronously: {e}")
-        return "Error processing bookmarks.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ Error processing bookmarks.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
 
     # Generate summaries and assign categories
     for bookmark in bookmarks:
@@ -305,70 +367,127 @@ def process_uploaded_file(file):
         assign_category(bookmark)
 
     try:
-        faiss_index, embeddings = vectorize_and_index(bookmarks)
+        embeddings, ids = vectorize_and_index(bookmarks)
     except Exception as e:
         logger.error(f"Error building FAISS index: {e}")
-        return "Error building search index.", '', gr.update(choices=[]), display_bookmarks()
+        return (
+            "⚠️ Error building search index.",
+            "",
+            gr.update(choices=[]),
+            display_bookmarks(),
+            state_bookmarks  # Return the unchanged state
+        )
+
+    # Assign unique IDs to bookmarks
+    for bookmark, id_ in zip(bookmarks, ids):
+        bookmark['id'] = id_
 
     message = f"✅ Successfully processed {len(bookmarks)} bookmarks."
     logger.info(message)
     bookmark_html = display_bookmarks()
 
-    # Update bookmark_selector choices
+    # Prepare Manage Bookmarks tab outputs
     choices = [f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)]
-    bookmark_selector_update = gr.update(choices=choices, value=[])
+    bookmarks_html_manage = display_bookmarks()
 
-    # Update bookmark_display_manage
-    bookmark_display_manage_update = display_bookmarks()
+    # Update the shared state
+    updated_state = bookmarks.copy()
 
-    return message, bookmark_html, bookmark_selector_update, bookmark_display_manage_update
+    return (
+        message,
+        bookmark_html,
+        gr.update(choices=choices, value=[]),
+        bookmarks_html_manage,
+        updated_state  # Return the updated state
+    )
 
 # Delete selected bookmarks
-def delete_selected_bookmarks(selected_indices):
-    global bookmarks, faiss_index
+def delete_selected_bookmarks(selected_indices, state_bookmarks):
     if not selected_indices:
-        return "⚠️ No bookmarks selected.", gr.update(choices=[]), display_bookmarks()
-    indices = [int(s.split('.')[0])-1 for s in selected_indices]
+        return "⚠️ No bookmarks selected.", gr.update(choices=[]), display_bookmarks(), state_bookmarks
+
+    bookmarks = state_bookmarks.copy()
+    ids_to_remove = []
+    indices = []
+    for s in selected_indices:
+        try:
+            idx = int(s.split('.')[0]) - 1
+            if 0 <= idx < len(bookmarks):
+                ids_to_remove.append(bookmarks[idx]['id'])
+                indices.append(idx)
+            else:
+                logger.warning(f"Index out of range: {idx + 1}")
+        except ValueError:
+            logger.error(f"Invalid selection format: {s}")
+
+    # Remove bookmarks from the list
     indices = sorted(indices, reverse=True)
     for idx in indices:
-        if 0 <= idx < len(bookmarks):
-            logger.info(f"Deleting bookmark at index {idx + 1}")
-            bookmarks.pop(idx)
-    if bookmarks:
-        faiss_index, embeddings = vectorize_and_index(bookmarks)
-    else:
-        faiss_index = None
+        logger.info(f"Deleting bookmark at index {idx + 1}")
+        bookmarks.pop(idx)
+
+    # Remove embeddings from FAISS index
+    remove_from_faiss(ids_to_remove)
+
     message = "🗑️ Selected bookmarks deleted successfully."
     logger.info(message)
-    # Update bookmark_selector choices
-    choices = [f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)]
-    bookmark_selector_update = gr.update(choices=choices, value=[])
-    # Update bookmarks display
+
+    # Regenerate HTML display
     bookmarks_html = display_bookmarks()
-    return message, bookmark_selector_update, bookmarks_html
+
+    # Update choices for selection
+    choices = [f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)]
+
+    # Update the shared state
+    updated_state = bookmarks.copy()
+
+    return message, gr.update(choices=choices, value=[]), bookmarks_html, updated_state
 
 # Edit category of selected bookmarks
-def edit_selected_bookmarks_category(selected_indices, new_category):
+def edit_selected_bookmarks_category(selected_indices, new_category, state_bookmarks):
     if not selected_indices:
-        return "⚠️ No bookmarks selected.", '', gr.update()
+        return (
+            "⚠️ No bookmarks selected.",
+            gr.update(choices=[f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(state_bookmarks)], value=[]),
+            display_bookmarks(),
+            state_bookmarks
+        )
+
     if not new_category:
-        return "⚠️ No new category selected.", '', gr.update()
-    indices = [int(s.split('.')[0])-1 for s in selected_indices]
-    for idx in indices:
-        if 0 <= idx < len(bookmarks):
-            bookmarks[idx]['category'] = new_category
-            logger.info(f"Updated category for bookmark {idx + 1} to {new_category}")
+        return (
+            "⚠️ No new category selected.",
+            gr.update(choices=[f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(state_bookmarks)], value=[]),
+            display_bookmarks(),
+            state_bookmarks
+        )
+
+    bookmarks = state_bookmarks.copy()
+    for s in selected_indices:
+        try:
+            idx = int(s.split('.')[0]) - 1
+            if 0 <= idx < len(bookmarks):
+                bookmarks[idx]['category'] = new_category
+                logger.info(f"Updated category for bookmark {idx + 1} to {new_category}")
+        except ValueError:
+            logger.error(f"Invalid selection format: {s}")
+
     message = "✏️ Category updated for selected bookmarks."
     logger.info(message)
-    # Update bookmark_selector choices
-    choices = [f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)]
-    bookmark_selector_update = gr.update(choices=choices, value=[])
-    # Update bookmarks display
+
+    # Regenerate HTML display
     bookmarks_html = display_bookmarks()
-    return message, bookmark_selector_update, bookmarks_html
+
+    # Update choices for selection
+    choices = [f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)]
+
+    # Update the shared state
+    updated_state = bookmarks.copy()
+
+    return message, gr.update(choices=choices, value=[]), bookmarks_html, updated_state
 
 # Export bookmarks to HTML
-def export_bookmarks():
+def export_bookmarks(state_bookmarks):
+    bookmarks = state_bookmarks
     if not bookmarks:
         logger.warning("No bookmarks to export")
         return "⚠️ No bookmarks to export."
@@ -394,25 +513,46 @@ def export_bookmarks():
         logger.error(f"Error exporting bookmarks: {e}")
         return "⚠️ Error exporting bookmarks."
 
-# Chatbot response using Groq Cloud API
-def chatbot_response(user_query):
+# Chatbot response using Groq Cloud API with FAISS search
+def chatbot_response(user_query, state_bookmarks):
     if not GROQ_API_KEY:
         logger.warning("GROQ_API_KEY not set.")
         return "⚠️ API key not set. Please set the GROQ_API_KEY environment variable in the Hugging Face Space settings."
 
+    bookmarks = state_bookmarks
     if not bookmarks:
         logger.warning("No bookmarks available for chatbot")
         return "⚠️ No bookmarks available. Please upload and process your bookmarks first."
 
     logger.info(f"Chatbot received query: {user_query}")
 
-    # Prepare the prompt for the LLM
+    # Prepare the prompt for the LLM using FAISS search
     try:
-        # Limit the number of bookmarks to prevent exceeding token limits
-        max_bookmarks = 50  # Adjust as needed
+        # Encode the user query
+        query_embedding = embedding_model.encode([user_query]).astype('float32')
+
+        # Perform FAISS search
+        k = 5  # Number of top results to retrieve
+        distances, indices = faiss_index.search(query_embedding, k)
+
+        # Fetch the corresponding bookmarks
+        relevant_bookmarks = []
+        for idx in indices[0]:
+            if idx == -1:
+                continue  # No more results
+            # Find the bookmark with matching ID
+            for bookmark in bookmarks:
+                if bookmark.get('id') == idx:
+                    relevant_bookmarks.append(bookmark)
+                    break
+
+        if not relevant_bookmarks:
+            return "🔍 No relevant bookmarks found for your query."
+
+        # Prepare the summary of relevant bookmarks
         bookmark_data = ""
-        for idx, bookmark in enumerate(bookmarks[:max_bookmarks]):
-            bookmark_data += f"{idx+1}. Title: {bookmark['title']}\nURL: {bookmark['url']}\nSummary: {bookmark['summary']}\n\n"
+        for bm in relevant_bookmarks:
+            bookmark_data += f"Title: {bm['title']}\nURL: {bm['url']}\nSummary: {bm['summary']}\n\n"
 
         # Construct the prompt
         prompt = f"""
@@ -421,15 +561,15 @@ You are an assistant that helps users find relevant bookmarks from their collect
 User Query:
 {user_query}
 
-Bookmarks:
+Relevant Bookmarks:
 {bookmark_data}
 
-Please identify the most relevant bookmarks that match the user's query. Provide a concise list including the index, title, URL, and a brief summary.
+Please provide a concise summary of the most relevant bookmarks that match the user's query.
 """
 
         # Call the Groq Cloud API via the OpenAI client
         response = openai.ChatCompletion.create(
-            model='llama3-8b-8192',  # Verify this model name with Groq Cloud API documentation
+            model='gpt-3.5-turbo',  # Use appropriate model
             messages=[
                 {"role": "system", "content": "You help users find relevant bookmarks based on their queries."},
                 {"role": "user", "content": prompt}
@@ -453,366 +593,216 @@ Please identify the most relevant bookmarks that match the user's query. Provide
 def build_app():
     try:
         logger.info("Building Gradio app")
-        with gr.Blocks() as demo:
-            # Embed the CSS and Theme Toggle Switch
-            gr.HTML(
-                """
-                <style>
-                    /* Define CSS Variables for Themes */
-                    :root {
-                        --background-color: #FFFFFF;
-                        --text-color: #000000;
-                        --success-color: #4CAF50;
-                        --error-color: #D32F2F;
-                        --card-shadow: rgba(0, 0, 0, 0.2);
-                    }
-
-                    .dark-theme {
-                        --background-color: #121212;
-                        --text-color: #FFFFFF;
-                        --success-color: #81C784;
-                        --error-color: #E57373;
-                        --card-shadow: rgba(255, 255, 255, 0.2);
-                    }
-
-                    /* Apply Background and Text Colors */
-                    body {
-                        background-color: var(--background-color);
-                        color: var(--text-color);
-                        transition: background-color 0.3s, color 0.3s;
-                    }
-
-                    /* Card Styles */
-                    .card {
-                        box-shadow: 0 4px 8px 0 var(--card-shadow);
-                        transition: box-shadow 0.3s, background-color 0.3s;
-                        background-color: var(--background-color);
-                        padding: 10px;
-                        margin: 10px;
-                        border-radius: 5px;
-                    }
-
-                    .card:hover {
-                        box-shadow: 0 8px 16px 0 var(--card-shadow);
-                    }
-
-                    /* Toggle Switch Styles */
-                    .theme-toggle {
-                        display: flex;
-                        align-items: center;
-                        justify-content: flex-end;
-                        padding: 10px;
-                    }
-
-                    .switch {
-                        position: relative;
-                        display: inline-block;
-                        width: 60px;
-                        height: 34px;
-                    }
-
-                    .switch input { 
-                        opacity: 0;
-                        width: 0;
-                        height: 0;
-                    }
-
-                    .slider {
-                        position: absolute;
-                        cursor: pointer;
-                        top: 0;
-                        left: 0;
-                        right: 0;
-                        bottom: 0;
-                        background-color: #ccc;
-                        transition: .4s;
-                        border-radius: 34px;
-                    }
-
-                    .slider:before {
-                        position: absolute;
-                        content: "";
-                        height: 26px;
-                        width: 26px;
-                        left: 4px;
-                        bottom: 4px;
-                        background-color: white;
-                        transition: .4s;
-                        border-radius: 50%;
-                    }
-
-                    input:checked + .slider {
-                        background-color: #2196F3;
-                    }
-
-                    input:checked + .slider:before {
-                        transform: translateX(26px);
-                    }
-
-                    /* Gradio Components Styling */
-                    .gradio-container {
-                        background-color: var(--background-color);
-                        color: var(--text-color);
-                        transition: background-color 0.3s, color 0.3s;
-                    }
-
-                    /* Ensure All Text Elements Use var(--text-color) */
-                    body, p, h1, h2, h3, h4, h5, h6, span, a, label, button, input, textarea, select {
-                        color: var(--text-color);
-                        transition: color 0.3s, background-color 0.3s;
-                    }
-
-                    /* Links Styling */
-                    a {
-                        color: var(--text-color);
-                        text-decoration: underline;
-                    }
-
-                    a:hover {
-                        color: var(--success-color);
-                    }
-
-                    /* Buttons Styling */
-                    button, .gr-button {
-                        background-color: var(--success-color);
-                        color: var(--background-color);
-                        border: none;
-                        padding: 10px 20px;
-                        text-align: center;
-                        text-decoration: none;
-                        display: inline-block;
-                        font-size: 16px;
-                        margin: 4px 2px;
-                        cursor: pointer;
-                        border-radius: 4px;
-                        transition: background-color 0.3s, color 0.3s;
-                    }
-
-                    button:hover, .gr-button:hover {
-                        background-color: var(--error-color);
-                    }
-
-                    /* Inputs and Selects Styling */
-                    input, textarea, select, .gr-textbox, .gr-dropdown, .gr-file {
-                        background-color: var(--background-color);
-                        color: var(--text-color);
-                        border: 1px solid var(--text-color);
-                        border-radius: 4px;
-                        padding: 8px;
-                        transition: background-color 0.3s, color 0.3s, border-color 0.3s;
-                    }
-
-                    /* Checkbox and Radio Buttons Styling */
-                    input[type="checkbox"], input[type="radio"] {
-                        accent-color: var(--success-color);
-                    }
-
-                    /* Gradio-specific Class Overrides */
-                    .gradio-container .gradio-block, 
-                    .gradio-container .gradio-row, 
-                    .gradio-container .gradio-column {
-                        background-color: var(--background-color);
-                        color: var(--text-color);
-                    }
-
-                    /* Ensure Gradio Tabs Respect the Theme */
-                    .gradio-container .tab-title {
-                        color: var(--text-color);
-                    }
-
-                    .gradio-container .tab-title.selected {
-                        border-bottom: 2px solid var(--success-color);
-                    }
-
-                    /* Additional Styling for HTML Components within Gradio */
-                    .gradio-container .markdown p,
-                    .gradio-container .markdown h1,
-                    .gradio-container .markdown h2,
-                    .gradio-container .markdown h3,
-                    .gradio-container .markdown h4,
-                    .gradio-container .markdown h5,
-                    .gradio-container .markdown h6 {
-                        color: var(--text-color);
-                    }
-
-                    .gradio-container .html-content a {
-                        color: var(--text-color);
-                    }
-
-                    .gradio-container .html-content a:hover {
-                        color: var(--success-color);
-                    }
-                </style>
-
-                <div class="theme-toggle">
-                    <label class="switch">
-                        <input type="checkbox" id="theme-checkbox">
-                        <span class="slider"></span>
-                    </label>
-                    <span style="margin-left: 10px;">Dark Mode</span>
-                </div>
-                <script>
-                    // Check for saved user preference on load
-                    if (localStorage.getItem('theme') === 'dark') {
-                        document.getElementById('theme-checkbox').checked = true;
-                        document.body.classList.add('dark-theme');
-                    }
-
-                    const toggleSwitch = document.getElementById('theme-checkbox');
-                    toggleSwitch.addEventListener('change', function() {
-                        if(this.checked) {
-                            document.body.classList.add('dark-theme');
-                            localStorage.setItem('theme', 'dark');
-                        } else {
-                            document.body.classList.remove('dark-theme');
-                            localStorage.setItem('theme', 'light');
-                        }
-                    });
-                </script>
-                """
-            )
+        with gr.Blocks(css="""
+        .card {
+            box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
+            transition: 0.3s;
+        }
+        .card:hover {
+            box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
+        }
+
+        /* Dynamic Theme Styling */
+        @media (prefers-color-scheme: dark) {
+            body {
+                color: white;
+                background-color: #121212;
+            }
+            .card {
+                background-color: #1e1e1e;
+            }
+            a {
+                color: #bb86fc;
+            }
+            h1, h2, h3, p, strong {
+                color: inherit;
+            }
+        }
+
+        @media (prefers-color-scheme: light) {
+            body {
+                color: black;
+                background-color: white;
+            }
+            .card {
+                background-color: #fff;
+            }
+            a {
+                color: #1a0dab;
+            }
+            h1, h2, h3, p, strong {
+                color: inherit;
+            }
+        }
+        """) as demo:
+            # Shared states
+            state_bookmarks = gr.State([])
+            chat_history = gr.State([])
 
             # General Overview
             gr.Markdown("""
-            # 📚 SmartMarks - AI Browser Bookmarks Manager
+    # 📚 SmartMarks - AI Browser Bookmarks Manager
+
+    Welcome to **SmartMarks**, your intelligent assistant for managing browser bookmarks. SmartMarks leverages AI to help you organize, search, and interact with your bookmarks seamlessly. Whether you're looking to categorize your links, retrieve information quickly, or maintain an updated list, SmartMarks has you covered.
 
-            Welcome to **SmartMarks**, your intelligent assistant for managing browser bookmarks. SmartMarks leverages AI to help you organize, search, and interact with your bookmarks seamlessly. Whether you're looking to categorize your links, retrieve information quickly, or maintain an updated list, SmartMarks has you covered.
+    ---
 
-            ---
+    ## 🚀 **How to Use SmartMarks**
 
-            ## 🚀 **How to Use SmartMarks**
+    SmartMarks is divided into three main sections:
 
-            SmartMarks is divided into three main sections:
+    1. **📂 Upload and Process Bookmarks:** Import your existing bookmarks and let SmartMarks analyze and categorize them for you.
+    2. **💬 Chat with Bookmarks:** Interact with your bookmarks using natural language queries to find relevant links effortlessly.
+    3. **🛠️ Manage Bookmarks:** View, edit, delete, and export your bookmarks with ease.
 
-            1. **📂 Upload and Process Bookmarks:** Import your existing bookmarks and let SmartMarks analyze and categorize them for you.
-            2. **💬 Chat with Bookmarks:** Interact with your bookmarks using natural language queries to find relevant links effortlessly.
-            3. **🛠️ Manage Bookmarks:** View, edit, delete, and export your bookmarks with ease.
+    Navigate through the tabs to explore each feature in detail.
+    """)
 
-            Navigate through the tabs to explore each feature in detail.
-            """)
+            # Define Manage Bookmarks components outside the tab for global access
+            bookmark_selector = gr.CheckboxGroup(label="✅ Select Bookmarks", choices=[])
+            bookmark_display_manage = gr.HTML(label="📄 Manage Bookmarks Display")
 
             # Upload and Process Bookmarks Tab
             with gr.Tab("Upload and Process Bookmarks"):
                 gr.Markdown("""
-                ## 📂 **Upload and Process Bookmarks**
+    ## 📂 **Upload and Process Bookmarks**
 
-                ### 📝 **Steps to Upload and Process:**
+    ### 📝 **Steps to Upload and Process:**
 
-                1. **🔽 Upload Bookmarks File:**
-                   - Click on the **"Upload Bookmarks HTML File"** button.
-                   - Select your browser's exported bookmarks HTML file from your device.
+    1. **🔽 Upload Bookmarks File:**
+       - Click on the **"📁 Upload Bookmarks HTML File"** button.
+       - Select your browser's exported bookmarks HTML file from your device.
 
-                2. **⚙️ Process Bookmarks:**
-                   - After uploading, click on the **"Process Bookmarks"** button.
-                   - SmartMarks will parse your bookmarks, fetch additional information, generate summaries, and categorize each link based on predefined categories.
+    2. **⚙️ Process Bookmarks:**
+       - After uploading, click on the **"⚙️ Process Bookmarks"** button.
+       - SmartMarks will parse your bookmarks, fetch additional information, generate summaries, and categorize each link based on predefined categories.
 
-                3. **📄 View Processed Bookmarks:**
-                   - Once processing is complete, your bookmarks will be displayed in an organized and visually appealing format below.
-                """)
+    3. **📄 View Processed Bookmarks:**
+       - Once processing is complete, your bookmarks will be displayed in an organized and visually appealing format below.
+    """)
 
                 upload = gr.File(label="📁 Upload Bookmarks HTML File", type='binary')
                 process_button = gr.Button("⚙️ Process Bookmarks")
                 output_text = gr.Textbox(label="✅ Output", interactive=False)
                 bookmark_display = gr.HTML(label="📄 Bookmarks")
 
-                # Initialize Manage Bookmarks components
-                bookmark_selector = gr.CheckboxGroup(label="✅ Select Bookmarks", choices=[])
-                bookmark_display_manage = gr.HTML(label="📄 Manage Bookmarks Display")
-
                 process_button.click(
                     process_uploaded_file,
-                    inputs=upload,
-                    outputs=[output_text, bookmark_display, bookmark_selector, bookmark_display_manage]
+                    inputs=[upload, state_bookmarks],
+                    outputs=[output_text, bookmark_display, bookmark_selector, bookmark_display_manage, state_bookmarks]
                 )
 
             # Chat with Bookmarks Tab
             with gr.Tab("Chat with Bookmarks"):
                 gr.Markdown("""
-                ## 💬 **Chat with Bookmarks**
+    ## 💬 **Chat with Bookmarks**
+
+    ### 🤖 **How to Interact:**
 
-                ### 🤖 **How to Interact:**
+    1. **✍️ Enter Your Query:**
+       - In the **"✍️ Ask about your bookmarks"** textbox, type your question or keyword related to your bookmarks. For example, "Do I have any bookmarks about GenerativeAI?"
 
-                1. **✍️ Enter Your Query:**
-                   - In the **"Ask about your bookmarks"** textbox, type your question or keyword related to your bookmarks. For example, "Do I have any bookmarks about GenerativeAI?"
+    2. **📨 Submit Your Query:**
+       - Click the **"📨 Send"** button to submit your query.
 
-                2. **📨 Submit Your Query:**
-                   - Click the **"Send"** button to submit your query.
+    3. **📈 Receive AI-Driven Responses:**
+       - SmartMarks will analyze your query and provide relevant bookmarks that match your request, making it easier to find specific links without manual searching.
 
-                3. **📈 Receive AI-Driven Responses:**
-                   - SmartMarks will analyze your query and provide relevant bookmarks that match your request, making it easier to find specific links without manual searching.
-                """)
+    4. **🗂️ View Chat History:**
+       - All your queries and the corresponding AI responses are displayed in the chat history for your reference.
+    """)
 
-                user_input = gr.Textbox(label="✍️ Ask about your bookmarks", placeholder="e.g., Do I have any bookmarks about GenerativeAI?")
-                chat_output = gr.Textbox(label="💬 Chatbot Response", interactive=False)
-                chat_button = gr.Button("📨 Send")
+                with gr.Row():
+                    chat_history_display = gr.Chatbot(label="🗨️ Chat History")
+                    with gr.Column(scale=1):
+                        chat_input = gr.Textbox(
+                            label="✍️ Ask about your bookmarks",
+                            placeholder="e.g., Do I have any bookmarks about GenerativeAI?",
+                            lines=1,
+                            interactive=True
+                        )
+                        chat_button = gr.Button("📨 Send")
+
+                # When user presses Enter in chat_input
+                chat_input.submit(
+                    chatbot_response,
+                    inputs=[chat_input, state_bookmarks],
+                    outputs=chat_history_display
+                )
 
+                # When user clicks Send button
                 chat_button.click(
                     chatbot_response,
-                    inputs=user_input,
-                    outputs=chat_output
+                    inputs=[chat_input, state_bookmarks],
+                    outputs=chat_history_display
                 )
 
             # Manage Bookmarks Tab
             with gr.Tab("Manage Bookmarks"):
                 gr.Markdown("""
-                ## 🛠️ **Manage Bookmarks**
+    ## 🛠️ **Manage Bookmarks**
 
-                ### 🗂️ **Features:**
+    ### 🗂️ **Features:**
 
-                1. **👁️ View Bookmarks:**
-                   - All your processed bookmarks are displayed here with their respective categories and summaries.
+    1. **👁️ View Bookmarks:**
+       - All your processed bookmarks are displayed here with their respective categories and summaries.
 
-                2. **✅ Select Bookmarks:**
-                   - Use the checkboxes next to each bookmark to select one, multiple, or all bookmarks you wish to manage.
+    2. **✅ Select Bookmarks:**
+       - Use the checkboxes next to each bookmark to select one, multiple, or all bookmarks you wish to manage.
 
-                3. **🗑️ Delete Selected Bookmarks:**
-                   - After selecting the desired bookmarks, click the **"Delete Selected Bookmarks"** button to remove them from your list.
+    3. **🗑️ Delete Selected Bookmarks:**
+       - After selecting the desired bookmarks, click the **"🗑️ Delete Selected Bookmarks"** button to remove them from your list.
 
-                4. **✏️ Edit Categories:**
-                   - Select the bookmarks you want to re-categorize.
-                   - Choose a new category from the dropdown menu labeled **"New Category"**.
-                   - Click the **"Edit Category of Selected Bookmarks"** button to update their categories.
+    4. **✏️ Edit Categories:**
+       - Select the bookmarks you want to re-categorize.
+       - Choose a new category from the dropdown menu labeled **"🆕 New Category"**.
+       - Click the **"✏️ Edit Category of Selected Bookmarks"** button to update their categories.
 
-                5. **💾 Export Bookmarks:**
-                   - Click the **"Export Bookmarks"** button to download your updated bookmarks as an HTML file.
-                   - This file can be uploaded back to your browser to reflect the changes made within SmartMarks.
-                """)
+    5. **💾 Export Bookmarks:**
+       - Click the **"💾 Export Bookmarks"** button to download your updated bookmarks as an HTML file.
+       - This file can be uploaded back to your browser to reflect the changes made within SmartMarks.
 
-                manage_output = gr.Textbox(label="🔄 Manage Output", interactive=False)
-                bookmark_display_manage = gr.HTML(label="📄 Manage Bookmarks Display")
-                bookmark_selector = gr.CheckboxGroup(label="✅ Select Bookmarks", choices=[])
+    6. **🔄 Refresh Bookmarks:**
+       - Click the **"🔄 Refresh Bookmarks"** button to ensure the latest state is reflected in the display.
+    """)
 
+                manage_output = gr.Textbox(label="🔄 Manage Output", interactive=False)
                 new_category_input = gr.Dropdown(label="🆕 New Category", choices=CATEGORIES, value="Uncategorized")
                 with gr.Row():
                     delete_button = gr.Button("🗑️ Delete Selected Bookmarks")
                     edit_category_button = gr.Button("✏️ Edit Category of Selected Bookmarks")
                     export_button = gr.Button("💾 Export Bookmarks")
                 download_link = gr.HTML(label="📥 Download Exported Bookmarks")
+                refresh_button = gr.Button("🔄 Refresh Bookmarks")
 
                 # Define button actions
                 delete_button.click(
                     delete_selected_bookmarks,
-                    inputs=bookmark_selector,
-                    outputs=[manage_output, bookmark_selector, bookmark_display_manage]
+                    inputs=[bookmark_selector, state_bookmarks],
+                    outputs=[manage_output, bookmark_selector, bookmark_display_manage, state_bookmarks]
                 )
 
                 edit_category_button.click(
                     edit_selected_bookmarks_category,
-                    inputs=[bookmark_selector, new_category_input],
-                    outputs=[manage_output, bookmark_selector, bookmark_display_manage]
+                    inputs=[bookmark_selector, new_category_input, state_bookmarks],
+                    outputs=[manage_output, bookmark_selector, bookmark_display_manage, state_bookmarks]
                 )
 
                 export_button.click(
                     export_bookmarks,
-                    inputs=None,
+                    inputs=[state_bookmarks],
                     outputs=download_link
                 )
 
-                # Initialize display after processing bookmarks
-                process_button.click(
-                    process_uploaded_file,
-                    inputs=upload,
-                    outputs=[output_text, bookmark_display, bookmark_selector, bookmark_display_manage]
+                refresh_button.click(
+                    lambda bookmarks: (
+                        [
+                            f"{i+1}. {bookmark['title']} (Category: {bookmark['category']})" for i, bookmark in enumerate(bookmarks)
+                        ],
+                        display_bookmarks()
+                    ),
+                    inputs=[state_bookmarks],
+                    outputs=[bookmark_selector, bookmark_display_manage]
                 )
 
         logger.info("Launching Gradio app")