Keep the composer pill fixed-height and show Logicizing immediately on submit

app.py

@@ -250,22 +250,44 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
   color: var(--weba-fg) !important;
 }
 
-#twil-input textarea {
+#twil-input textarea, #twil-input input {
   background: var(--weba-composer) !important;
   color: var(--weba-fg) !important;
   border: 1px solid var(--weba-border) !important;
   border-radius: 999px !important;
   padding: 16px 18px !important;
   font-size: 16px !important;
-  box-shadow: none !important;
+  line-height: 20px !important;
+  height: 52px !important;
+  min-height: 52px !important;
+  max-height: 52px !important;
+  overflow-y: auto !important;
+  overflow-x: hidden !important;
   resize: none !important;
+  box-shadow: none !important;
+  white-space: pre-wrap !important;
+  field-sizing: fixed !important;
 }
 #twil-input, #twil-input > .wrap, #composer-row .form,
-#composer-row .block, #composer-row .padded {
+#composer-row .block, #composer-row .padded, #twil-input .input-container {
   background: transparent !important;
   border: none !important;
   box-shadow: none !important;
   padding: 0 !important;
+  height: 52px !important;
+  max-height: 52px !important;
+}
+#twil-input button, #twil-input .show-count, #twil-input .icon-button,
+#composer-row label {
+  display: none !important;
+}
+
+@keyframes twil-pulse {
+  0%, 100% { opacity: 0.4; }
+  50% { opacity: 1; }
+}
+#twil-chat .pending, #twil-chat [data-status="pending"] {
+  animation: twil-pulse 1.1s ease-in-out infinite;
 }
 
 #send-btn {
@@ -378,7 +400,7 @@ def _parse_think(raw: str) -> tuple[str, str, bool]:
     return think, answer, False
 
 
-def _gpu_seconds(message, history, max_new_tokens=2048, *args, **kwargs):
+def _gpu_seconds(history, max_new_tokens=2048, *args, **kwargs):
     tokens = int(max_new_tokens or 2048)
     return min(180, max(45, 25 + tokens // 18))
 
@@ -456,20 +478,49 @@ def _stream_tokens(conversation: list[dict], max_new_tokens: int, temperature: f
         yield acc
 
 
-def _generate(message, history, max_new_tokens, temperature, top_p, enable_thinking):
+def queue_message(message, history):
+    """Paint the user turn immediately so the GPU wait is not a blank screen."""
+    message = (message or "").strip()
+    if not message:
+        return "", history, gr.skip()
     history = [dict(m) if isinstance(m, dict) else m for m in (history or [])]
     history.append({"role": "user", "content": message})
+    history.append(
+        {
+            "role": "assistant",
+            "content": "",
+            "metadata": {"title": "Logicizing…", "status": "pending"},
+        }
+    )
+    return "", history, gr.update(visible=False)
+
+
+@spaces.GPU(duration=_gpu_seconds)
+def generate_reply(history, max_new_tokens, temperature, top_p, enable_thinking):
+    history = [dict(m) if isinstance(m, dict) else m for m in (history or [])]
+    if not any(m.get("role") == "user" for m in history):
+        yield history
+        return
     conversation = _history_for_model(history)
 
-    think_msg = {
-        "role": "assistant",
-        "content": "",
-        "metadata": {"title": "Logicizing…", "status": "pending"},
-    }
-    answer_msg = {"role": "assistant", "content": ""}
-    history.append(think_msg)
+    think_msg = None
+    for msg in reversed(history):
+        if msg.get("role") == "assistant" and isinstance(msg.get("metadata"), dict):
+            think_msg = msg
+            break
+    if think_msg is None:
+        think_msg = {
+            "role": "assistant",
+            "content": "",
+            "metadata": {"title": "Logicizing…", "status": "pending"},
+        }
+        history.append(think_msg)
+    else:
+        think_msg["metadata"] = {"title": "Logicizing…", "status": "pending"}
     yield history
 
+    answer_msg = {"role": "assistant", "content": ""}
+
     for raw in _stream_tokens(
         conversation, max_new_tokens, temperature, top_p, enable_thinking
     ):
@@ -493,28 +544,11 @@ def _generate(message, history, max_new_tokens, temperature, top_p, enable_think
     if think_msg["content"]:
         think_msg["metadata"] = {"title": "Logic", "status": "done"}
         yield history
-    elif think_msg in history:
+    elif think_msg in history and not think_msg["content"]:
         history.remove(think_msg)
         yield history
 
 
-@spaces.GPU(duration=_gpu_seconds)
-def submit(message, history, max_new_tokens, temperature, top_p, enable_thinking):
-    message = (message or "").strip()
-    if not message:
-        yield "", history, gr.skip()
-        return
-    first = True
-    for updated in _generate(
-        message, history, max_new_tokens, temperature, top_p, enable_thinking
-    ):
-        if first:
-            yield "", updated, gr.update(visible=False)
-            first = False
-        else:
-            yield gr.skip(), updated, gr.skip()
-
-
 with gr.Blocks(fill_height=True, fill_width=True, elem_id="app-root") as demo:
     with gr.Column(elem_id="app-shell"):
         gr.HTML(HEADER)
@@ -544,8 +578,8 @@ with gr.Blocks(fill_height=True, fill_width=True, elem_id="app-root") as demo:
                 placeholder="Ask webAI anything…",
                 show_label=False,
                 container=False,
-                lines=1,
-                max_lines=6,
+                lines=2,
+                max_lines=2,
                 elem_id="twil-input",
                 scale=8,
             )
@@ -557,9 +591,30 @@ with gr.Blocks(fill_height=True, fill_width=True, elem_id="app-root") as demo:
             enable_thinking = gr.Checkbox(value=True, label="Enable thinking")
         gr.HTML('<p class="twil-disclaimer">This is AI and it can make mistakes</p>')
 
-    inputs = [prompt, chatbot, max_new_tokens, temperature, top_p, enable_thinking]
-    send.click(submit, inputs, [prompt, chatbot, chips_row], concurrency_limit=1)
-    prompt.submit(submit, inputs, [prompt, chatbot, chips_row], concurrency_limit=1)
+    send.click(
+        queue_message,
+        [prompt, chatbot],
+        [prompt, chatbot, chips_row],
+        show_progress="hidden",
+    ).then(
+        generate_reply,
+        [chatbot, max_new_tokens, temperature, top_p, enable_thinking],
+        chatbot,
+        concurrency_limit=1,
+        show_progress="minimal",
+    )
+    prompt.submit(
+        queue_message,
+        [prompt, chatbot],
+        [prompt, chatbot, chips_row],
+        show_progress="hidden",
+    ).then(
+        generate_reply,
+        [chatbot, max_new_tokens, temperature, top_p, enable_thinking],
+        chatbot,
+        concurrency_limit=1,
+        show_progress="minimal",
+    )
     for btn, (_, template) in zip(chip_btns, CHIPS):
         btn.click(lambda t=template: t, outputs=prompt)