Update app.py

app.py

@@ -8,14 +8,10 @@ Original file is located at
 """
 
 import os
-import gradio as gr
-import html
+from langchain import PromptTemplate, LLMChain
 from googleapiclient.discovery import build
-
-# ✅ Corrected LangChain Imports
-from langchain.schema.runnable import RunnablePassthrough
-from langchain_core.prompts import PromptTemplate
-from langchain_groq import ChatGroq
+import gradio as gr
+import html  # For sanitizing user input
 
 # Load API keys securely from Hugging Face Secrets
 GROQ_API_KEY = os.getenv("GROQ_API_KEY")
@@ -35,23 +31,19 @@ prompt_template = PromptTemplate(
         "The user's selected age range is: **{age_range}**.\n\n"
         "Use Chain-of-Thought (CoT) reasoning to analyze the situation in context with the age range, then provide "
         "clear, actionable safety advice structured as follows:\n\n"
-        "**### 1. 🛡️Safety Tips🛡️**\n"
+        "**### 1. Safety Tips:**\n"
         "- Offer **practical** and **actionable** steps to stay safe, tailored to the selected age range.\n"
         "- Ensure the advice is **easy to follow** and **relevant** to the situation described.\n\n"
-        "**### 2. 🛡️Self-Defense Techniques🛡️**\n"
+        "**### 2. Self-Defense Techniques:**\n"
         "- Provide simple, **age-appropriate self-defense methods** that are easy to implement.\n"
         "- Focus on **safe** and **effective** techniques that suit the user's age and physical abilities.\n\n"
-        "**### 3. 🛡️Resources🛡️**\n"
+        "**### 3. Resources:**\n"
         "- Recommend **relevant YouTube videos** for learning and practical demonstrations of safety measures."
     )
 )
 
-# Create a runnable sequence
-chain = (
-    {"user_input": RunnablePassthrough(), "age_range": RunnablePassthrough()} 
-    | prompt_template 
-    | llm
-)
+# Create the LLMChain
+chain = LLMChain(llm=llm, prompt=prompt_template)
 
 # Function to fetch YouTube videos with clickable links
 def search_youtube_videos(query, max_results=2):
@@ -62,7 +54,7 @@ def search_youtube_videos(query, max_results=2):
         )
         response = request.execute()
 
-        video_html = "<h3>🎥 Recommended Videos:</h3><ul>"
+        video_html = ""
         for item in response.get("items", []):
             video_id = item["id"].get("videoId")
             video_title = html.escape(item["snippet"].get("title", "Untitled"))
@@ -86,72 +78,19 @@ def get_youtube_links(age_range):
 # Safety Advice Function
 def safety_advice(user_input, age_range):
     if not user_input.strip():
-        return "<div class='output-box warning-box'>⚠️ Please enter a situation to receive advice.</div>"
-    
-    # Get the response from the language model
-    response_obj = chain.invoke({"user_input": user_input, "age_range": age_range})
-    
-    # Extract just the content from the response object
-    response_content = response_obj.content if hasattr(response_obj, 'content') else str(response_obj)
-    
+        return "⚠️ Please enter a situation to receive advice.", "<p></p>"  # Empty HTML for videos
+
+    response = chain.run(user_input=user_input, age_range=age_range)
     links_html = get_youtube_links(age_range)
-    
-    # Combine the advice and video links in a single HTML output with styling
-    combined_output = f"""
-    <div class='output-box'>
-        <div class='advice-section'>
-            {response_content}
-        </div>
-        <div class='video-section'>
-            {links_html}
-        </div>
-    </div>
-    """
-    
-    return combined_output
+
+    return f"{response}", links_html  # Markdown for text, HTML for videos
 
 # Function to clear fields
 def clear_fields():
-    return "", "30+ (Adult)", ""
-
-# Custom CSS for the output box
-custom_css = """
-.output-box {
-    border: 2px solid #4a90e2;
-    border-radius: 10px;
-    padding: 20px;
-    margin: 10px 0;
-    background-color: #f8f9fa;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-}
-
-.warning-box {
-    border-color: #e74c3c;
-    background-color: #fdeaea;
-}
-
-.advice-section {
-    margin-bottom: 20px;
-}
-
-.video-section {
-    border-top: 1px solid #e0e0e0;
-    padding-top: 15px;
-}
-
-.video-section a {
-    color: #4a90e2;
-    text-decoration: none;
-    font-weight: 500;
-}
-
-.video-section a:hover {
-    text-decoration: underline;
-}
-"""
+    return "", "30+ (Adult)", "", ""
 
 # Gradio Interface
-with gr.Blocks(css=custom_css) as app:
+with gr.Blocks() as app:
     gr.Markdown("# 🛡️ SheGuard: Personal Safety Advisor 🛡️\n\n💡 Enter a situation where you feel unsafe, and receive expert safety advice tailored to your age range.")
 
     with gr.Row():
@@ -160,14 +99,15 @@ with gr.Blocks(css=custom_css) as app:
             "0-6 (Toddler)", "7-13 (Child)", "15-30 (Teenager to Young Adult)", "30+ (Adult)"
         ], label="Select Your Age Range", value="30+ (Adult)")
 
-    # Using HTML component for the boxed output
-    output_html = gr.HTML()
-    
+    advice_output = gr.Markdown()
+    video_output = gr.HTML()  # Using HTML for active YouTube links
+
     with gr.Row():
         generate_button = gr.Button("Get Safety Advice")
         clear_button = gr.Button("Clear")
 
-    generate_button.click(safety_advice, inputs=[situation_input, age_range_input], outputs=[output_html])
-    clear_button.click(clear_fields, inputs=[], outputs=[situation_input, age_range_input, output_html])
+    generate_button.click(safety_advice, inputs=[situation_input, age_range_input], outputs=[advice_output, video_output])
+    clear_button.click(clear_fields, inputs=[], outputs=[situation_input, age_range_input, advice_output, video_output])
+
+app.launch(share = True)
 
-app.launch(share=True)