Update ui.py

ui.py

@@ -1,164 +1,38 @@
-# ui.py - FIXED (replace previous ui.py with this file)
+# ui.py - UPDATED (replace original)
 import gradio as gr
-import html
-import re
-from typing import List, Tuple, Generator
-
-def _detect_status_from_text(text: str) -> Tuple[str, str, str]:
-    """
-    Return (status_text, emoji_icon, css_class)
-    """
-    if not text:
-        return ("Responding...", "🌐", "status-general")
-    t = text.lower()
-
-    # heuristics for "code" detection
-    code_kw = ["code", "html", "css", "javascript", "python", "java", "c++",
-               "function", "def ", "class ", "console.log", "npm", "react", "vue", "sql", "query"]
-    if any(k in t for k in code_kw) or re.search(r"[<>]{1}\/?[a-zA-Z]+", t) or re.search(r"\bdef\b|\bfunction\b|\breturn\b", t):
-        return ("Generating code...", "🧩", "status-code")
-
-    search_kw = ["search", "find", "look up", "google", "who is", "what is", "wiki", "latest", "news", "open link"]
-    if any(k in t for k in search_kw):
-        return ("Searching the web...", "🔎", "status-search")
-
-    time_kw = ["time", "date", "what time", "timezone", "clock", "current time"]
-    if any(k in t for k in time_kw):
-        return ("Checking time...", "⏱️", "status-time")
-
-    # default
-    return ("Responding...", "🌐", "status-general")
-
 
 def create_ui(generate_fn):
     """
-    Build a Blocks-based chat UI with a nicer, context-aware status indicator.
-
-    generate_fn(messages) -> reply string (synchronous) or may raise exceptions.
-    """
-
-    css = r"""
-    body { background-color: #0b0f19; color: #e8eef8; }
-    .gradio-container { font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; max-width: 980px !important; margin: auto; }
-    footer { visibility: hidden; display: none; }
-    .status-pill {
-        display:inline-flex;
-        align-items:center;
-        gap:10px;
-        padding:8px 14px;
-        border-radius:999px;
-        font-weight:600;
-        font-size:14px;
-        box-shadow: 0 6px 22px rgba(2,6,23,0.6), inset 0 1px 0 rgba(255,255,255,0.02);
-        transition: transform .18s ease, opacity .22s ease;
-        min-height:42px;
-        max-width: 92%;
-        white-space:nowrap;
-        overflow:hidden;
-        text-overflow:ellipsis;
-    }
-    .status-pill .dot {
-        display:inline-block;
-        width:8px;
-        height:8px;
-        border-radius:50%;
-        background:rgba(255,255,255,0.95);
-        box-shadow: 0 0 0 rgba(255,255,255,0.0);
-        margin-left:2px;
-        transform-origin:center;
-        animation: pulse 1.2s infinite;
-    }
-    @keyframes pulse {
-        0% { transform: scale(1); opacity: 0.9; }
-        50% { transform: scale(1.6); opacity: 0.45; }
-        100% { transform: scale(1); opacity: 0.9; }
-    }
-
-    .status-general { background: linear-gradient(180deg, rgba(34,40,55,0.9), rgba(10,12,18,0.95)); color: #E6F0FF; border: 1px solid rgba(255,255,255,0.04); }
-    .status-code    { background: linear-gradient(180deg, rgba(10,20,30,0.95), rgba(6,10,16,0.95)); color: #E2FFD9; border: 1px solid rgba(0,255,200,0.06); }
-    .status-search  { background: linear-gradient(180deg, rgba(18,12,36,0.95), rgba(6,6,12,0.95)); color: #FFF6D9; border: 1px solid rgba(255,220,50,0.06); }
-    .status-time    { background: linear-gradient(180deg, rgba(8,18,10,0.95), rgba(4,8,6,0.95)); color: #DFF0FF; border: 1px solid rgba(100,200,255,0.04); }
-
-    .status-small { font-size:13px; padding:6px 10px; min-height:36px; }
-    .status-hidden { opacity: 0; transform: translateY(6px) scale(0.98); pointer-events: none; }
-
-    @media (max-width:600px) {
-        .status-pill { font-size:13px; padding:7px 12px; gap:8px; min-height:40px; }
-    }
+    Build a Blocks-based chat UI that returns a gr.Blocks object.
+    generate_fn receives a list of messages (user/assistant pairs as dicts)
+    and should return a reply string (this wrapper uses it as a placeholder).
     """
-
-    def _set_status_component(text: str, icon: str, css_class: str) -> str:
-        # sanitize and build html content
-        safe_text = html.escape(text)
-        html_content = (
-            f'<div class="status-pill {css_class} status-small">'
-            f'<span style="font-size:16px;line-height:16px;margin-right:8px">{html.escape(icon)}</span>'
-            f'<span>{safe_text}</span>'
-            f'<span style="margin-left:8px" class="dot" id="nexari_dot"></span>'
-            f'</div>'
-        )
-        return html_content
-
-    def _finalize_status_done() -> str:
-        done_html = (
-            '<div class="status-pill status-general status-small">'
-            '<span style="font-size:16px;line-height:16px;margin-right:8px">✅</span>'
-            '<span>Done — Ready</span>'
-            '</div>'
-        )
-        return done_html
-
-    with gr.Blocks(css=css) as demo:
+    with gr.Blocks(css="""
+        body { background-color: #0b0f19; color: #e0e0e0; }
+        .gradio-container { font-family: 'Inter', sans-serif; max-width: 900px !important; margin: auto; }
+        footer { visibility: hidden; display: none; }
+    """) as demo:
         gr.Markdown("## Nexari AI — Research Backend")
-        with gr.Row():
-            chatbot = gr.Chatbot(elem_id="nexari_chatbot", label="Nexari").style(height=520)
-        with gr.Row():
-            # initial status HTML (will be replaced by generator yields)
-            status_html = gr.HTML(
-                """
-                <div class="status-pill status-general status-small">
-                  <span style="font-size:16px;line-height:16px;margin-right:8px">🌐</span>
-                  <span>Ready</span>
-                </div>
-                """
-            )
-        with gr.Row():
-            txt = gr.Textbox(show_label=False, placeholder="Ask Nexari-G1 (try: 'create a calculator in HTML')", lines=1)
-            send = gr.Button("Send", variant="primary")
-
+        chatbot = gr.Chatbot(elem_id="nexari_chatbot", label="Nexari").style(height=500)
+        txt = gr.Textbox(show_label=False, placeholder="Type your message and press Enter")
         state = gr.State([])
 
-        # Generator-based submit to allow immediate status update
-        def submit(message: str, history: List[tuple]) -> Generator:
-            # compute and yield working status immediately
-            status_text, icon, css_class = _detect_status_from_text(message)
-            working_html = _set_status_component(status_text, icon, css_class)
-
-            # yield current chat (unchanged), empty textbox, and working status so UI shows pill immediately
-            # Note: order of outputs must match the components we will update: [chatbot, txt, status_html]
-            yield history, "", working_html
-
-            # Now perform generation (blocking). This will happen after browser updated UI.
-            try:
-                messages = []
-                for human, ai in history:
-                    messages.append({"role": "user", "content": human})
-                    messages.append({"role": "assistant", "content": ai})
-                messages.append({"role": "user", "content": message})
-
-                reply = generate_fn(messages) or "Sorry, no response."
-
-            except Exception as e:
-                reply = f"Internal UI error: {e}"
-
-            new_history = history + [(message, reply)]
-            done_html = _finalize_status_done()
-
-            # final yield updates the chat (with reply), clears textbox, and shows Done badge
-            yield new_history, "", done_html
-
-        # wire submit to enter and button; queue=True ensures generator yields are processed
-        txt.submit(submit, [txt, state], [chatbot, txt, status_html], queue=True)
-        send.click(submit, [txt, state], [chatbot, txt, status_html], queue=True)
-
-    return demo
+        def submit(message, history):
+            # history is list of (human, ai) pairs in Gradio; convert to messages
+            messages = []
+            for human, ai in history:
+                messages.append({"role": "user", "content": human})
+                messages.append({"role": "assistant", "content": ai})
+            messages.append({"role": "user", "content": message})
+            # call generator wrapper (synchronous placeholder)
+            reply = generate_fn(messages)
+            # append to history
+            history = history + [(message, reply)]
+            return history, ""
+
+        txt.submit(submit, [txt, state], [chatbot, txt], queue=False)
+        # Also allow clicking a send button
+        send = gr.Button("Send")
+        send.click(submit, [txt, state], [chatbot, txt], queue=False)
+
+    return demo