Upload 3 files

.gitignore

@@ -0,0 +1,14 @@
+__pycache__/
+*.py[cod]
+*.pyo
+.env
+.env.*
+*.egg-info/
+dist/
+build/
+.venv/
+venv/
+env/
+.DS_Store
+*.log
+flagged/

app.py

@@ -7,328 +7,161 @@ from langgraph.graph.message import add_messages
 from langchain_groq import ChatGroq
 from langchain_core.messages import HumanMessage, AIMessage, SystemMessage
 
-# ── State ────────────────────────────────────────────────────────────────────
-
+# ── State ─────────────────────────────────────────────────────────────────────
 class State(TypedDict):
     messages: Annotated[list, add_messages]
 
-# ── LLM & Graph ──────────────────────────────────────────────────────────────
-
-SYSTEM_PROMPT = """You are a brilliant, friendly, and concise general-purpose AI assistant.
-You help users with anything they ask — questions, writing, analysis, coding, brainstorming, and more.
-Be warm, clear, and genuinely helpful. When you don't know something, say so honestly."""
-
+# ── LLM ───────────────────────────────────────────────────────────────────────
 def get_llm():
-    """Return the best available Groq model."""
-    api_key = os.environ.get("GROQ_API_KEY", "")
-    # Try models in order of preference
-    for model in [
-        "llama-3.3-70b-versatile",
-        "llama-3.1-70b-versatile",
-        "mixtral-8x7b-32768",
-        "llama-3.1-8b-instant",
-    ]:
-        try:
-            llm = ChatGroq(model=model, api_key=api_key, temperature=0.7)
-            return llm, model
-        except Exception:
-            continue
-    raise RuntimeError("No Groq model available. Check your GROQ_API_KEY.")
-
-llm, active_model = get_llm()
+    return ChatGroq(
+        model="llama-3.3-70b-versatile",
+        api_key=os.environ.get("GROQ_API_KEY", ""),
+        temperature=0.7,
+        max_tokens=1024,
+    )
 
-def chatbot_node(state: State):
-    """Core LangGraph node: calls the LLM with full message history."""
-    messages = [SystemMessage(content=SYSTEM_PROMPT)] + state["messages"]
-    response = llm.invoke(messages)
-    return {"messages": [response]}
+SYSTEM_PROMPT = SystemMessage(content=(
+    "You are NeuraChat — a brilliant, friendly general-purpose AI assistant. "
+    "Answer clearly and be concise yet thorough. Adapt your tone to the user: "
+    "casual for chat, precise for technical questions. "
+    "When asked to code, produce clean, well-commented examples. "
+    "Use markdown formatting where it helps readability."
+))
 
+# ── LangGraph ──────────────────────────────────────────────────────────────────
 def build_graph():
-    builder = StateGraph(State)
-    builder.add_node("chatbot", chatbot_node)
-    builder.add_edge(START, "chatbot")
-    builder.add_edge("chatbot", END)
-    return builder.compile()
+    llm = get_llm()
 
-graph = build_graph()
+    def chatbot_node(state: State) -> State:
+        response = llm.invoke([SYSTEM_PROMPT] + state["messages"])
+        return {"messages": [response]}
 
-# ── Chat logic ────────────────────────────────────────────────────────────────
+    g = StateGraph(State)
+    g.add_node("chatbot", chatbot_node)
+    g.add_edge(START, "chatbot")
+    g.add_edge("chatbot", END)
+    return g.compile()
 
+graph = build_graph()
+
+# ── Chat handler ───────────────────────────────────────────────────────────────
 def chat(user_message: str, history: list):
-    """Convert Gradio history → LangChain messages → run graph → return reply."""
     if not user_message.strip():
-        return "", history
-
-    # Build message list from history
+        return history, ""
     lc_messages = []
-    for human, assistant in history:
-        lc_messages.append(HumanMessage(content=human))
-        if assistant:
-            lc_messages.append(AIMessage(content=assistant))
+    for m in history:
+        cls = HumanMessage if m["role"] == "user" else AIMessage
+        lc_messages.append(cls(content=m["content"]))
     lc_messages.append(HumanMessage(content=user_message))
-
-    # Run through LangGraph
     result = graph.invoke({"messages": lc_messages})
     ai_reply = result["messages"][-1].content
-
-    history.append((user_message, ai_reply))
-    return "", history
+    return history + [
+        {"role": "user",      "content": user_message},
+        {"role": "assistant", "content": ai_reply},
+    ], ""
 
 def clear_chat():
-    return [], []
+    return [], ""
 
-# ── Gradio UI ─────────────────────────────────────────────────────────────────
+def use_example(ex):
+    return ex
 
+# ── CSS ────────────────────────────────────────────────────────────────────────
 CSS = """
-@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap');
-
-:root {
-    --bg-primary: #0a0a0f;
-    --bg-card: #111118;
-    --bg-input: #1a1a24;
-    --border: #2a2a3a;
-    --accent: #7c6af7;
-    --accent-soft: #9d91f8;
-    --accent-glow: rgba(124, 106, 247, 0.15);
-    --text-primary: #f0eff8;
-    --text-muted: #7a798a;
-    --user-bubble: linear-gradient(135deg, #7c6af7, #5b4fd4);
-    --bot-bubble: #1a1a24;
-    --success: #4ade80;
-    --radius: 16px;
-}
-
-* { box-sizing: border-box; }
-
-body, .gradio-container {
-    background: var(--bg-primary) !important;
-    font-family: 'DM Sans', sans-serif !important;
-    color: var(--text-primary) !important;
-}
-
-.gradio-container {
-    max-width: 860px !important;
-    margin: 0 auto !important;
-    padding: 0 !important;
-}
-
-/* Header */
-#header {
-    text-align: center;
-    padding: 48px 32px 24px;
-    position: relative;
-}
-
-#header::before {
-    content: '';
-    position: absolute;
-    top: 0; left: 50%;
-    transform: translateX(-50%);
-    width: 300px; height: 200px;
-    background: radial-gradient(ellipse, rgba(124,106,247,0.18) 0%, transparent 70%);
-    pointer-events: none;
-}
-
-#app-title {
-    font-family: 'Syne', sans-serif !important;
-    font-size: 2.6rem !important;
-    font-weight: 800 !important;
-    letter-spacing: -0.03em !important;
-    background: linear-gradient(135deg, #f0eff8 30%, #9d91f8) !important;
-    -webkit-background-clip: text !important;
-    -webkit-text-fill-color: transparent !important;
-    background-clip: text !important;
-    margin: 0 0 8px !important;
-    line-height: 1.1 !important;
-}
-
-#app-subtitle {
-    color: var(--text-muted) !important;
-    font-size: 1rem !important;
-    font-weight: 300 !important;
-    margin: 0 !important;
-}
-
-/* Model badge */
-#model-badge {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    background: var(--accent-glow);
-    border: 1px solid rgba(124,106,247,0.3);
-    border-radius: 100px;
-    padding: 4px 14px;
-    margin-top: 14px;
-    font-size: 0.78rem;
-    color: var(--accent-soft);
-    font-family: 'DM Sans', monospace;
-}
-
-/* Chat area */
-#chatbot-box {
-    background: var(--bg-card) !important;
-    border: 1px solid var(--border) !important;
-    border-radius: var(--radius) !important;
-    margin: 0 24px !important;
-    overflow: hidden !important;
-}
-
-#chatbot-box .wrap {
-    background: transparent !important;
-    padding: 16px !important;
-}
-
-/* Messages */
-.message {
-    border-radius: 14px !important;
-    padding: 14px 18px !important;
-    font-size: 0.97rem !important;
-    line-height: 1.65 !important;
-    max-width: 82% !important;
-    margin-bottom: 4px !important;
-}
-
-.message.user {
-    background: var(--user-bubble) !important;
-    color: #fff !important;
-    margin-left: auto !important;
-    box-shadow: 0 4px 20px rgba(124,106,247,0.3) !important;
-}
-
-.message.bot {
-    background: var(--bot-bubble) !important;
-    color: var(--text-primary) !important;
-    border: 1px solid var(--border) !important;
-}
-
-/* Input row */
-#input-row {
-    display: flex;
-    gap: 10px;
-    padding: 16px 24px 12px !important;
-    align-items: flex-end;
-}
-
-#msg-input textarea {
-    background: var(--bg-input) !important;
-    border: 1px solid var(--border) !important;
-    border-radius: 12px !important;
-    color: var(--text-primary) !important;
-    font-family: 'DM Sans', sans-serif !important;
-    font-size: 0.97rem !important;
-    padding: 14px 16px !important;
-    resize: none !important;
-    transition: border-color 0.2s !important;
-}
-
-#msg-input textarea:focus {
-    border-color: var(--accent) !important;
-    outline: none !important;
-    box-shadow: 0 0 0 3px var(--accent-glow) !important;
-}
-
-#msg-input textarea::placeholder { color: var(--text-muted) !important; }
-
-#msg-input label { display: none !important; }
-
-/* Buttons */
-#send-btn, #clear-btn {
-    border-radius: 12px !important;
-    font-family: 'Syne', sans-serif !important;
-    font-weight: 600 !important;
-    font-size: 0.9rem !important;
-    padding: 0 22px !important;
-    height: 50px !important;
-    transition: all 0.2s !important;
-    cursor: pointer !important;
-    white-space: nowrap !important;
-}
-
-#send-btn {
-    background: linear-gradient(135deg, #7c6af7, #5b4fd4) !important;
-    color: #fff !important;
-    border: none !important;
-    box-shadow: 0 4px 16px rgba(124,106,247,0.35) !important;
-}
-
-#send-btn:hover {
-    transform: translateY(-1px) !important;
-    box-shadow: 0 6px 22px rgba(124,106,247,0.5) !important;
-}
-
-#clear-btn {
-    background: transparent !important;
-    color: var(--text-muted) !important;
-    border: 1px solid var(--border) !important;
-}
-
-#clear-btn:hover {
-    border-color: #ff6b6b !important;
-    color: #ff6b6b !important;
-    background: rgba(255,107,107,0.07) !important;
-}
-
-/* Footer */
-#footer {
-    text-align: center;
-    padding: 16px 24px 32px;
-    color: var(--text-muted);
-    font-size: 0.78rem;
-}
-
-/* Scrollbar */
-::-webkit-scrollbar { width: 5px; }
-::-webkit-scrollbar-track { background: transparent; }
-::-webkit-scrollbar-thumb { background: var(--border); border-radius: 10px; }
+@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap');
+*{box-sizing:border-box}
+body,.gradio-container{background:#08080f!important;font-family:'DM Sans',sans-serif!important;color:#e8e6f0!important}
+.gradio-container{max-width:880px!important;margin:0 auto!important}
+.nc-header{text-align:center;padding:52px 24px 24px;position:relative}
+.nc-header::before{content:'';position:absolute;top:-60px;left:50%;transform:translateX(-50%);width:500px;height:300px;background:radial-gradient(ellipse,rgba(124,58,237,.22) 0%,transparent 70%);pointer-events:none}
+.nc-title{font-family:'Syne',sans-serif;font-size:3rem;font-weight:800;letter-spacing:-.04em;background:linear-gradient(135deg,#c084fc 0%,#818cf8 50%,#38bdf8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 6px;position:relative;z-index:1}
+.nc-sub{font-size:.82rem;color:#4b5563;letter-spacing:.1em;text-transform:uppercase;position:relative;z-index:1}
+.nc-tags{display:flex;justify-content:center;gap:8px;margin-bottom:20px;flex-wrap:wrap;padding:0 16px}
+.nc-tag{background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.22);color:#a78bfa;border-radius:100px;padding:4px 14px;font-size:.78rem;font-weight:500;letter-spacing:.04em}
+#nc-chatbot{border:1px solid rgba(255,255,255,.07)!important;border-radius:20px!important;background:rgba(255,255,255,.025)!important;margin:0 16px!important;box-shadow:0 0 80px rgba(124,58,237,.07),inset 0 1px 0 rgba(255,255,255,.05)!important}
+.message.user{background:linear-gradient(135deg,rgba(124,58,237,.32),rgba(99,102,241,.22))!important;border:1px solid rgba(124,58,237,.28)!important;color:#ede9fe!important;border-radius:16px 16px 4px 16px!important}
+.message.bot{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.08)!important;color:#d4d0e8!important;border-radius:16px 16px 16px 4px!important}
+.message{font-size:.94rem!important;line-height:1.7!important}
+.nc-chips{padding:14px 16px 4px;display:flex;gap:8px;flex-wrap:wrap}
+.nc-chips button{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:10px!important;color:#6b7280!important;font-family:'DM Sans',sans-serif!important;font-size:.81rem!important;padding:6px 14px!important;cursor:pointer!important;transition:all .18s!important;white-space:nowrap!important}
+.nc-chips button:hover{background:rgba(124,58,237,.15)!important;border-color:rgba(124,58,237,.35)!important;color:#c4b5fd!important}
+.nc-row{padding:12px 16px 28px!important;gap:10px!important;align-items:flex-end!important}
+.nc-row textarea{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:14px!important;color:#e8e6f0!important;font-family:'DM Sans',sans-serif!important;font-size:.94rem!important;padding:13px 16px!important;resize:none!important;transition:border-color .2s,box-shadow .2s!important}
+.nc-row textarea:focus{border-color:rgba(124,58,237,.55)!important;box-shadow:0 0 0 3px rgba(124,58,237,.1)!important;outline:none!important}
+.nc-row textarea::placeholder{color:#374151!important}
+#nc-send,#nc-clear{border-radius:12px!important;font-family:'Syne',sans-serif!important;font-weight:700!important;font-size:.86rem!important;border:none!important;height:46px!important;cursor:pointer!important;transition:all .2s!important}
+#nc-send{background:linear-gradient(135deg,#7c3aed,#6366f1)!important;color:#fff!important;min-width:90px!important;box-shadow:0 4px 18px rgba(124,58,237,.4)!important}
+#nc-send:hover{transform:translateY(-1px) scale(1.02)!important;box-shadow:0 6px 28px rgba(124,58,237,.55)!important}
+#nc-clear{background:transparent!important;color:#4b5563!important;border:1px solid rgba(255,255,255,.08)!important;min-width:74px!important}
+#nc-clear:hover{color:#6b7280!important}
+.nc-footer{text-align:center;padding:18px;font-size:.74rem;color:#1f2937;letter-spacing:.06em}
+::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(124,58,237,.25);border-radius:2px}
 """
 
-with gr.Blocks(css=CSS, title="AI Assistant", theme=gr.themes.Base()) as demo:
+EXAMPLES = [
+    "✨ What can you help me with?",
+    "🧠 Explain quantum entanglement simply",
+    "💻 Write a Python web scraper",
+    "📝 Draft a professional email",
+    "🎨 Give me a creative writing prompt",
+    "🔢 Integrate x² from 0 to 3",
+]
 
-    # ── Header ──────────────────────────────────────────────────────────────
-    with gr.Column(elem_id="header"):
-        gr.HTML(f"""
-            <h1 id="app-title">AI Assistant</h1>
-            <p id="app-subtitle">Powered by LangGraph &amp; Groq — fast, smart, always on.</p>
-            <div id="model-badge">
-                ⚡ {active_model}
-            </div>
-        """)
+# ── UI ─────────────────────────────────────────────────────────────────────────
+with gr.Blocks(css=CSS, title="NeuraChat", theme=gr.themes.Base()) as demo:
+
+    gr.HTML("""
+    <div class="nc-header">
+      <div class="nc-title">NeuraChat</div>
+      <div class="nc-sub">LangGraph &nbsp;·&nbsp; Groq &nbsp;·&nbsp; Llama 3.3 70B</div>
+    </div>
+    <div class="nc-tags">
+      <span class="nc-tag">⚡ Ultra-fast inference</span>
+      <span class="nc-tag">🔗 LangGraph state</span>
+      <span class="nc-tag">🦙 Llama 3.3 70B</span>
+      <span class="nc-tag">✨ Markdown support</span>
+    </div>
+    """)
 
-    # ── Chat window ──────────────────────────────────────────────────────────
     chatbot = gr.Chatbot(
-        value=[],
-        elem_id="chatbot-box",
-        label="",
+        elem_id="nc-chatbot",
+        type="messages",
         height=460,
-        bubble_full_width=False,
         show_label=False,
-        avatar_images=(None, "https://api.dicebear.com/7.x/bottts-neutral/svg?seed=langgraph&backgroundColor=7c6af7"),
+        avatar_images=(
+            None,
+            "https://api.dicebear.com/9.x/bottts-neutral/svg?seed=neurachat&backgroundColor=7c3aed&radius=50",
+        ),
+        bubble_full_width=False,
+        render_markdown=True,
+        placeholder=(
+            "<div style='text-align:center;padding:60px 20px;color:#374151'>"
+            "<div style='font-size:2.4rem;margin-bottom:10px'>🤖</div>"
+            "<div style='font-family:Syne,sans-serif;font-size:1.05rem;color:#4b5563'>Ask me anything</div>"
+            "</div>"
+        ),
     )
 
-    # ── Input row ────────────────────────────────────────────────────────────
-    with gr.Row(elem_id="input-row"):
+    with gr.Row(elem_classes=["nc-chips"]):
+        chips = [gr.Button(ex, size="sm") for ex in EXAMPLES]
+
+    with gr.Row(elem_classes=["nc-row"]):
         msg = gr.Textbox(
-            placeholder="Ask me anything…",
-            show_label=False,
-            lines=1,
-            max_lines=5,
-            elem_id="msg-input",
-            scale=8,
+            placeholder="Type a message…  (Enter to send)",
+            show_label=False, lines=1, max_lines=8,
+            scale=6, container=False,
         )
-        send_btn = gr.Button("Send ↑", elem_id="send-btn", scale=1)
-        clear_btn = gr.Button("Clear", elem_id="clear-btn", scale=1)
+        send_btn = gr.Button("Send ↑", elem_id="nc-send", variant="primary", scale=1)
+        clear_btn = gr.Button("Clear",  elem_id="nc-clear", scale=1)
 
-    # ── Footer ───────────────────────────────────────────────────────────────
-    gr.HTML("""
-        <div id="footer">
-            Built with LangGraph · Groq · Gradio &nbsp;|&nbsp; Deploy on 🤗 Hugging Face Spaces
-        </div>
-    """)
+    gr.HTML('<div class="nc-footer">NeuraChat &nbsp;·&nbsp; LangGraph + Groq + Gradio &nbsp;·&nbsp; Open Source</div>')
 
-    # ── Events ───────────────────────────────────────────────────────────────
-    send_btn.click(chat, [msg, chatbot], [msg, chatbot])
-    msg.submit(chat, [msg, chatbot], [msg, chatbot])
-    clear_btn.click(clear_chat, outputs=[msg, chatbot])
+    # Events
+    send_btn.click(chat, [msg, chatbot], [chatbot, msg])
+    msg.submit(chat, [msg, chatbot], [chatbot, msg])
+    clear_btn.click(clear_chat, outputs=[chatbot, msg])
+    for chip, ex in zip(chips, EXAMPLES):
+        chip.click(use_example, inputs=gr.State(ex), outputs=msg)
 
 if __name__ == "__main__":
     demo.launch(server_name="0.0.0.0", server_port=7860)

requirements.txt

@@ -2,3 +2,4 @@ gradio>=4.44.0
 langgraph>=0.2.0
 langchain-groq>=0.2.0
 langchain-core>=0.3.0
+typing-extensions>=4.8.0