Update app.py

app.py

@@ -1,106 +1,134 @@
-import gradio as gr
 import os
+import gradio as gr
 from groq import Groq
 
-# Initialize Groq client
-api_key = os.getenv("GROQ_API_KEY")
-client = Groq(api_key=api_key)
+# -------------------------------
+# Initialize Groq Client
+# -------------------------------
+client = Groq(api_key=os.getenv("GROQ_API_KEY"))
 
-# Initialize conversation history
-conversation_history = []
+# -------------------------------
+# Conversation Memory
+# -------------------------------
+conversation_history = [
+    {
+        "role": "system",
+        "content": (
+            "You are an expert in storyboarding. "
+            "Provide structured, visual, and insightful guidance "
+            "for creating and refining storyboards."
+        )
+    }
+]
 
-def chat_with_bot_stream(user_input):
+# -------------------------------
+# Chatbot (Streaming)
+# -------------------------------
+def chat_with_bot(user_input):
     global conversation_history
-    conversation_history.append({"role": "user", "content": user_input})
-    
-    if len(conversation_history) == 1:
-        conversation_history.insert(0, {
-            "role": "system",
-            "content": "You are an expert in storyboarding. Provide structured and insightful responses to queries about creating and refining storyboards."
-        })
-    
+
+    conversation_history.append(
+        {"role": "user", "content": user_input}
+    )
+
     completion = client.chat.completions.create(
-        model="llama3-70b-8192",
+        model="llama-3.3-70b-versatile",
         messages=conversation_history,
         temperature=1,
-        max_tokens=1024,
+        max_completion_tokens=1024,
         top_p=1,
         stream=True,
-        stop=None,
     )
-    
-    response_content = ""
+
+    response = ""
     for chunk in completion:
-        response_content += chunk.choices[0].delta.content or ""
-    
-    conversation_history.append({"role": "assistant", "content": response_content})
-    
-    return [(msg["content"] if msg["role"] == "user" else None, 
-             msg["content"] if msg["role"] == "assistant" else None) 
-            for msg in conversation_history]
-
-# Function to generate a storyboard
+        delta = chunk.choices[0].delta.content
+        if delta:
+            response += delta
+
+    conversation_history.append(
+        {"role": "assistant", "content": response}
+    )
+
+    return [
+        (
+            msg["content"] if msg["role"] == "user" else None,
+            msg["content"] if msg["role"] == "assistant" else None
+        )
+        for msg in conversation_history
+        if msg["role"] != "system"
+    ]
+
+# -------------------------------
+# Storyboard Generator
+# -------------------------------
 def generate_storyboard(scenario):
     if not scenario.strip():
-        return "Please provide a scenario to generate the storyboard."
-    
+        return "Please provide a scenario."
+
     messages = [
-        {"role": "system", "content": """You are an AI storyteller. Generate a storyboard in a structured table with six scenes. For each scene you provide
-   1) A Scenario text describing what problem a pesona is trying to resolve and by using what product or feature.
-   2) Storyline text for each scene, descriptive visual information and the purpose of the scene.
-   You must provide the output in structured format like table.
-        """},
-        {"role": "user", "content": f"Generate a 6-scene storyboard for: {scenario}"}
+        {
+            "role": "system",
+            "content": (
+                "You are an AI storyteller. Generate a storyboard "
+                "as a table with exactly six scenes.\n\n"
+                "Each scene must include:\n"
+                "1) Scenario: the user problem and product/feature used\n"
+                "2) Storyline: visual description and purpose\n\n"
+                "Output ONLY a markdown table."
+            )
+        },
+        {
+            "role": "user",
+            "content": f"Generate a 6-scene storyboard for: {scenario}"
+        }
     ]
-    
+
     completion = client.chat.completions.create(
-        model="llama3-70b-8192",
+        model="llama-3.3-70b-versatile",
         messages=messages,
         temperature=1,
-        max_tokens=1024,
+        max_completion_tokens=1024,
         top_p=1,
         stream=False,
-        stop=None,
     )
+
     return completion.choices[0].message.content
 
-TITLE = """
-<style>
-h1 { text-align: center; font-size: 24px; margin-bottom: 10px; }
-</style>
-<h1>📖 Storyboard Assistant</h1>
-"""
+# -------------------------------
+# UI
+# -------------------------------
+with gr.Blocks(theme=gr.themes.Glass()) as demo:
+    gr.Markdown("# 📖 Storyboard Assistant")
 
-with gr.Blocks(theme=gr.themes.Glass(primary_hue="violet", secondary_hue="violet", neutral_hue="stone")) as demo:
     with gr.Tabs():
-        with gr.TabItem("💬Chat"):
-            gr.HTML(TITLE)
-            chatbot = gr.Chatbot(label="Storyboard Chatbot")
+        with gr.TabItem("💬 Chat"):
+            chatbot = gr.Chatbot(height=400)
             with gr.Row():
                 user_input = gr.Textbox(
-                    label="Your Message",
-                    placeholder="Type your question here...",
-                    lines=1
+                    placeholder="Ask about storyboarding...",
+                    scale=4
                 )
-                send_button = gr.Button("✋Ask Question")
-            
-            # Chatbot functionality
-            send_button.click(
-                fn=chat_with_bot_stream,
+                send_btn = gr.Button("Ask")
+
+            send_btn.click(
+                fn=chat_with_bot,
                 inputs=user_input,
                 outputs=chatbot,
-                queue=True
-            ).then(
-                fn=lambda: "",
-                inputs=None,
-                outputs=user_input
-            )
-        
+            ).then(lambda: "", outputs=user_input)
+
         with gr.TabItem("📖 Generate Storyboard"):
-            gr.Markdown("## Generate a Storyboard")
-            scenario_input = gr.Textbox(label="Enter your scenario")
+            scenario_input = gr.Textbox(
+                label="Scenario",
+                placeholder="e.g., A student using an AI planner app"
+            )
             generate_btn = gr.Button("Generate Storyboard")
-            storyboard_output = gr.Textbox(label="Generated Storyboard", interactive=False)
-            generate_btn.click(generate_storyboard, inputs=scenario_input, outputs=storyboard_output)
+            storyboard_output = gr.Markdown()
+
+            generate_btn.click(
+                generate_storyboard,
+                inputs=scenario_input,
+                outputs=storyboard_output
+            )
 
 demo.launch()