Update app.py

app.py

@@ -161,14 +161,16 @@ def activate_agent(name: str, prompt: str, in_coll: bool):
 # ── Load from collection signal (JS → Python) ─────────────────────────────────
 
 def _load_signal(signal: str):
-    """Parse the JSON signal emitted by agentForgeLoad() in JS."""
+    """Parse the JSON signal emitted by agentForgeLoad() in JS and activate the agent."""
     if not signal or signal.strip() == "":
-        return gr.update(), gr.update()
+        return gr.update(), gr.update(), gr.update(), gr.update()
     try:
         data = json.loads(signal)
-        return data.get("name", ""), data.get("prompt", "")
+        name = data.get("name", "")
+        prompt = data.get("prompt", "")
+        return name, prompt, prompt, name
     except Exception:
-        return gr.update(), gr.update()
+        return gr.update(), gr.update(), gr.update(), gr.update()
 
 # ── Status HTML ───────────────────────────────────────────────────────────────
 
@@ -220,7 +222,7 @@ def _render_collection() -> str:
     for i, agent in enumerate(reversed(agents)):
         name    = agent.get("name", "Unnamed Agent")
         prompt  = agent.get("system_prompt", "")
-        preview = (prompt[:200] + "…") if len(prompt) > 200 else prompt
+        preview = (prompt[:100] + "…") if len(prompt) > 100 else prompt
         date    = agent.get("timestamp", "")[:10]
         color   = _agent_color(i)
         chars   = len(prompt)
@@ -252,8 +254,8 @@ def _render_collection() -> str:
             </span>
             <span style="font-size:.68rem;color:#6b6b88;white-space:nowrap;">{date}</span>
           </div>
-          <div style="font-size:.74rem;color:#555;line-height:1.5;font-family:'JetBrains Mono',monospace;
-                      white-space:pre-wrap;max-height:54px;overflow:hidden;">
+          <div style="font-size:.74rem;color:#aaa;line-height:1.5;font-family:'JetBrains Mono',monospace;
+                      white-space:pre-wrap;max-height:42px;overflow:hidden;">
             {preview.replace('<','&lt;').replace('>','&gt;')}
           </div>
           <div style="margin-top:10px;display:flex;align-items:center;gap:8px;">
@@ -561,25 +563,15 @@ button.secondary:hover {
 .chatbot-wrap { border-color: var(--border2) !important; }
 .message-bubble-border { border-color: var(--border2) !important; }
 
-/* Gradio 6: fix vertical letter stacking in assistant messages */
-[class*="message"] p,
-[class*="message"] span,
-[class*="message"] div,
-[class*="bot"] p,
-[class*="assistant"] p {
-    word-break: break-word !important;
+/* Gradio 6: ensure chat messages use full available width */
+.chatbot .message-wrap {
+    max-width: 85% !important;
+    min-width: 120px !important;
+}
+.chatbot .message-wrap p {
     white-space: pre-wrap !important;
+    word-break: break-word !important;
     overflow-wrap: break-word !important;
-    min-width: 0 !important;
-    width: auto !important;
-    writing-mode: horizontal-tb !important;
-    text-orientation: mixed !important;
-}
-/* Ensure message container has proper width */
-.message-wrap, [class*="message-wrap"], [class*="bubble"] {
-    max-width: 85% !important;
-    min-width: 60px !important;
-    width: auto !important;
 }
 
 /* ── Accordion ── */
@@ -835,11 +827,15 @@ from community-forged prompts.
     # 4. Clear chat
     clear_btn.click(fn=lambda: [], outputs=[chatbot])
 
-    # 5. Load agent from JS signal (collection card click)
+    # 5. Load agent from JS signal (collection card click) → also activates
     agent_load_signal.change(
         fn=_load_signal,
         inputs=[agent_load_signal],
-        outputs=[agent_name_box, prompt_box],
+        outputs=[agent_name_box, prompt_box, system_prompt_state, active_name_state],
+    ).then(
+        fn=_render_active_badge,
+        inputs=[active_name_state],
+        outputs=[active_badge_html],
     )
 
     # 6. Refresh collection (triggered by hidden button from JS)