total-recall-brain 3.41.4 → 3.41.6

package/frontend/src/pages/MemoryPage.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect, useCallback } from "react"
 import { useSearchParams } from "react-router-dom"
-import { listMemory, searchMemory, readMemory, fetchConflicts, resolveConflict, saveMemory, createMemory, deleteMemory, fetchSessions, deleteSession } from "../api"
+import { listMemory, searchMemory, readMemory, fetchConflicts, resolveConflict, saveMemory, createMemory, deleteMemory, fetchSessions, deleteSession, getApiBase } from "../api"
 import type { MemoryNode, Conflict } from "../types"
 import type { SessionSummary } from "../api"
 
@@ -297,9 +297,10 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
     }
   }, [urlSlug, activeBrainId, nodes])
 
-  // Wire SSE Live Agent Monitor Streaming (Port 9111)
+  // Wire SSE Live Agent Monitor Streaming
   useEffect(() => {
-    const sseUrl = "http://localhost:9111/stream"
+    const base = getApiBase() || window.location.origin
+    const sseUrl = `${base.replace(/\/+$/, '')}/stream`
     const eventSource = new EventSource(sseUrl)
 
     eventSource.onmessage = (event) => {
@@ -529,9 +530,9 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
 
         {/* Action Buttons */}
         <div style={{ display: "flex", justifyContent: "flex-end", gap: 12, marginTop: 12 }}>
-          <button className="btn btn-ghost" type="button" onClick={onCancel} style={{ fontSize: 13 }}>Cancel</button>
-          <button className="btn btn-purple" type="button" onClick={onSubmit} style={{ fontSize: 13 }}>
-            {isNew ? "🚀 Create Memory Node" : "💾 Save Changes"}
+          <button className="btn btn-ghost" type="button" onClick={onCancel} style={{ fontSize: 13, minHeight: 44, padding: "0 18px", borderRadius: "var(--radius-md, 10px)" }}>Cancel</button>
+          <button className="btn btn-purple" type="button" onClick={onSubmit} style={{ fontSize: 13, minHeight: 44, padding: "0 18px", borderRadius: "var(--radius-md, 10px)" }}>
+            {isNew ? "Create Memory Node" : "Save Changes"}
           </button>
         </div>
       </div>
@@ -552,20 +553,20 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
         </div>
         
         {/* Tab Selection */}
-        <div style={{ display: "flex", background: "rgba(255,255,255,0.03)", padding: 4, borderRadius: 8, border: "1px solid var(--border)" }}>
+        <div style={{ display: "flex", background: "rgba(12, 18, 32, 0.72)", backdropFilter: "blur(16px)", padding: 4, borderRadius: "var(--radius-md, 10px)", border: "1px solid var(--border)" }}>
           <button 
             className={`btn btn-sm ${activeTab === "vault" ? "btn-purple" : "btn-ghost"}`}
             onClick={() => { setActiveTab("vault"); setSelected(null); setSearchParams({}); }}
-            style={{ borderRadius: 6, fontSize: 12, padding: "6px 12px" }}
+            style={{ borderRadius: 6, fontSize: 12, minHeight: 36, padding: "6px 14px", fontWeight: 600 }}
           >
-            🧠 Active Nodes
+            Active Nodes
           </button>
           <button 
             className={`btn btn-sm ${activeTab === "conflicts" ? "btn-cyan" : "btn-ghost"}`}
             onClick={() => { setActiveTab("conflicts"); setSelected(null); setSearchParams({}); }}
-            style={{ borderRadius: 6, fontSize: 12, padding: "6px 12px", display: "flex", alignItems: "center", gap: 6 }}
+            style={{ borderRadius: 6, fontSize: 12, minHeight: 36, padding: "6px 14px", fontWeight: 600, display: "flex", alignItems: "center", gap: 6 }}
           >
-            ⚠️ Quarantined Conflicts
+            Quarantined Conflicts
             {conflicts.length > 0 && (
               <span style={{ background: "#ef4444", color: "#fff", fontSize: 9, padding: "1px 5px", borderRadius: 10, fontWeight: 700 }}>
                 {conflicts.length}
@@ -575,9 +576,9 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
           <button 
             className={`btn btn-sm ${activeTab === "sessions" ? "btn-purple" : "btn-ghost"}`}
             onClick={() => { setActiveTab("sessions"); setSelected(null); setSearchParams({}); }}
-            style={{ borderRadius: 6, fontSize: 12, padding: "6px 12px" }}
+            style={{ borderRadius: 6, fontSize: 12, minHeight: 36, padding: "6px 14px", fontWeight: 600 }}
           >
-            📝 Sessions
+            Sessions
             {sessionsTotal > 0 && (
               <span style={{ background: "rgba(139,92,246,0.3)", color: "#a78bfa", fontSize: 9, padding: "1px 5px", borderRadius: 10, fontWeight: 700, marginLeft: 4 }}>
                 {sessionsTotal}
@@ -587,7 +588,7 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
         </div>
       </div>
 
-      {error && <div className="badge badge-error" style={{ alignSelf: "flex-start", marginBottom: 15 }}>⚠️ {error}</div>}
+      {error && <div className="badge badge-error" style={{ alignSelf: "flex-start", marginBottom: 15 }}>{error}</div>}
 
       {activeTab === "vault" ? (
         <div className="memory-layout">
@@ -599,7 +600,7 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                 className={`category-btn ${category === c ? "active" : ""}`}
                 onClick={() => { setCategory(c); setSearchParams({}); setIsCreating(false); setIsEditing(false); }}
               >
-                <span>{c === "all" ? "📋 All Nodes" : c}</span>
+                <span>{c === "all" ? "All Nodes" : c}</span>
                 {c === "all"
                   ? <span className="category-count">{nodes.length}</span>
                   : categoryCounts[c]
@@ -611,7 +612,7 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
             
             <button
               className="btn btn-purple"
-              style={{ width: "100%", marginTop: 20, display: "flex", alignItems: "center", justifyContent: "center", gap: 8, fontSize: 13 }}
+              style={{ width: "100%", marginTop: 20, display: "flex", alignItems: "center", justifyContent: "center", gap: 8, fontSize: 13, minHeight: 44, borderRadius: "var(--radius-md, 10px)", fontWeight: 600 }}
               onClick={() => {
                 setSelected(null);
                 setSearchParams({});
@@ -632,7 +633,7 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                 setEditSupersedes("");
               }}
             >
-              ➕ Create New Node
+              Create New Node
             </button>
           </div>
           <div className="memory-main">
@@ -710,14 +711,14 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                       }} 
                       style={{ fontSize: 12, border: "1px solid var(--border)" }}
                     >
-                      ✏️ Edit Node
+                      Edit Node
                     </button>
                     <button 
                       className="btn btn-ghost btn-sm" 
                       onClick={() => handleDelete(selected.slug)} 
-                      style={{ fontSize: 12, borderColor: "rgba(239,68,68,0.2)", color: "#fca5a5" }}
+                      style={{ fontSize: 12, minHeight: 36, padding: "0 12px", borderColor: "rgba(239,68,68,0.2)", color: "#fca5a5" }}
                     >
-                      🗑️ Delete
+                      Delete
                     </button>
                   </div>
                 </div>
@@ -900,13 +901,13 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                         )}
                       </div>
                       <div style={{ display: "flex", flexWrap: "wrap", gap: 16, fontSize: 11, color: "var(--text-tertiary)", marginTop: 8 }}>
-                        <span>📂 {n.category}</span>
+                        <span>{n.category}</span>
                         {n.importance !== undefined && (
                           <span style={{ color: "#fbbf24" }}>★ {n.importance}/5</span>
                         )}
                         {n.confidence !== undefined && (
                           <span style={{ display: "flex", alignItems: "center", gap: 4 }}>
-                            🧠 {Math.round(n.confidence * 100)}%
+                            {Math.round(n.confidence * 100)}%
                           </span>
                         )}
                       </div>
@@ -929,8 +930,7 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
 
           {conflicts.length === 0 ? (
             <div style={{ textAlign: "center", padding: 60, background: "rgba(255,255,255,0.02)", borderRadius: 12, border: "1px dashed var(--border)", color: "var(--text-tertiary)" }}>
-              <span style={{ fontSize: 32, display: "block", marginBottom: 12 }}>🛡️</span>
-              <h4 style={{ color: "#fff", marginBottom: 6 }}>All Clear!</h4>
+              <h4 style={{ color: "#fff", marginBottom: 6 }}>All Clear</h4>
               No memory conflicts enqueued or quarantined in `.agent/memory-inbox/conflicts/`.
             </div>
           ) : (
@@ -1040,8 +1040,8 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
       {activeTab === "sessions" && (
         <div className="health-log" style={{ background: "rgba(15,23,42,0.45)", backdropFilter: "blur(12px)", border: "1px solid var(--border)", borderRadius: 12, padding: 24 }}>
           <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 }}>
-            <h2 style={{ margin: 0, color: "#fff", fontSize: 16 }}>📝 IDE Sessions ({sessionsTotal})</h2>
-            <button className="btn btn-ghost btn-sm" onClick={loadSessions} style={{ fontSize: 12 }}>🔄 Refresh</button>
+            <h2 style={{ margin: 0, color: "#fff", fontSize: 16 }}>IDE Sessions ({sessionsTotal})</h2>
+            <button className="btn btn-ghost btn-sm" onClick={loadSessions} style={{ fontSize: 12, minHeight: 36, padding: "0 12px" }}>Refresh</button>
           </div>
 
           {sessionsLoading ? (
@@ -1050,7 +1050,6 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
             </div>
           ) : sessionsList.length === 0 ? (
             <div style={{ textAlign: "center", padding: 40, color: "var(--text-tertiary)" }}>
-              <span style={{ fontSize: 32, display: "block", marginBottom: 8 }}>📝</span>
               No sessions ingested yet. Sessions appear here when the relay ships IDE conversation data.
             </div>
           ) : (
@@ -1072,7 +1071,6 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                     codex: "#10b981",
                     vscode: "#3b82f6",
                     cursor: "#06b6d4",
-                    "gemini-cli": "#ec4899",
                   }
                   const color = sourceColors[s.source || ""] || "var(--text-secondary)"
                   return (
@@ -1106,9 +1104,9 @@ export default function MemoryPage({ activeBrainId }: { activeBrainId?: string }
                         <button
                           className="btn btn-ghost btn-sm"
                           onClick={() => handleDeleteSession(s.id)}
-                          style={{ fontSize: 10, padding: "2px 6px", color: "#fca5a5", borderColor: "rgba(239,68,68,0.2)" }}
+                          style={{ fontSize: 11, padding: "4px 8px", color: "#fca5a5", borderColor: "rgba(239,68,68,0.2)" }}
                         >
-                          🗑️
+                          Delete
                         </button>
                       </td>
                     </tr>

package/frontend/src/pages/NetworkPage.tsx

@@ -199,7 +199,7 @@ export default function NetworkPage() {
         {/* Firewall Blocklist */}
         <div className="card">
           <div className="section-title">
-            🛡️ Firewall Blocklist
+            Firewall Blocklist
             <span className="badge badge-warning">{policy?.blocked_domains?.length ?? 0}</span>
           </div>
 
@@ -247,7 +247,7 @@ export default function NetworkPage() {
 
         {/* Global Limits Editor */}
         <div className="card">
-          <div className="section-title">⚙️ Global Limits</div>
+          <div className="section-title">Global Limits</div>
           <div className="limits-form">
             <div className="limits-row">
               <span className="limits-label">Max Global Concurrency</span>
@@ -302,7 +302,7 @@ export default function NetworkPage() {
 
       {/* Audit Log */}
       <div className="card network-section-full">
-        <div className="section-title">📋 Audit Log</div>
+        <div className="section-title">Audit Log</div>
 
         <div className="audit-filters">
           <input

package/frontend/src/pages/PluginsPage.tsx

@@ -632,17 +632,18 @@ export default function PluginsPage({ activeBrainId }: PluginsPageProps) {
 
   const closeDetail = () => {
     setDetail(null)
-    if (searchParams.has("id")) {
+    if (searchParams.has("id") || searchParams.has("plugin")) {
       const next = new URLSearchParams(searchParams)
       next.delete("id")
+      next.delete("plugin")
       setSearchParams(next)
     }
   }
 
   useEffect(() => {
-    const id = searchParams.get("id")
+    const id = searchParams.get("id") || searchParams.get("plugin")
     if (!id || detail?.id === id) return
-    const match = installed.find((p) => p.id === id)
+    const match = installed.find((p) => p.id === id || p.id === `tr-plugin-${id}` || p.name === id)
     if (match) openDetail(match)
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [searchParams, installed])
@@ -1331,14 +1332,14 @@ export default function PluginsPage({ activeBrainId }: PluginsPageProps) {
 
               <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: "12px" }}>
                 <div style={{ background: "var(--bg-tertiary)", padding: "12px", borderRadius: "8px", border: "1px solid var(--border)" }}>
-                  <div style={{ fontWeight: 600, color: "#38bdf8", marginBottom: "4px" }}>🔒 Private Plugins</div>
+                  <div style={{ fontWeight: 600, color: "#38bdf8", marginBottom: "4px" }}>Private Plugins</div>
                   <div style={{ ...muted, fontSize: "12px", lineHeight: 1.4 }}>
                     Store directly inside <code style={mono}>.agent/skills/total-recall/plugins/&lt;id&gt;</code> or link locally. Never shared outside this machine or project. Zero cloud exposure.
                   </div>
                 </div>
 
                 <div style={{ background: "var(--bg-tertiary)", padding: "12px", borderRadius: "8px", border: "1px solid var(--border)" }}>
-                  <div style={{ fontWeight: 600, color: "#a855f7", marginBottom: "4px" }}>🌐 Plugin Store Distribution</div>
+                  <div style={{ fontWeight: 600, color: "#a855f7", marginBottom: "4px" }}>Plugin Store Distribution</div>
                   <div style={{ ...muted, fontSize: "12px", lineHeight: 1.4 }}>
                     Deploy to the store via <code style={mono}>total-recall deploy-store &lt;id&gt;</code>. Cryptographically signed and distributed across the mesh for team consumption.
                   </div>

package/frontend/src/pages/RulesPage.tsx

@@ -81,21 +81,25 @@ export default function RulesPage({ activeBrainId }: { activeBrainId: string })
         key={`${rule.scope}:${rule.slug}`}
         data-testid="rule-card"
         style={{
-          border: `1px solid ${isArchived ? 'var(--border)' : colorCode}`,
+          border: `1px solid ${isArchived ? 'rgba(148, 163, 184, 0.12)' : colorCode}`,
           opacity: isArchived ? 0.6 : 1,
-          borderRadius: 8,
-          padding: 16,
-          marginBottom: 12,
-          background: 'var(--bg-secondary)',
+          borderRadius: 12,
+          padding: 18,
+          marginBottom: 14,
+          background: 'rgba(12, 18, 32, 0.72)',
+          backdropFilter: 'blur(16px)',
+          WebkitBackdropFilter: 'blur(16px)',
+          boxShadow: '0 4px 16px rgba(0, 0, 0, 0.25)',
           display: 'flex',
           flexDirection: 'column',
-          gap: 8,
+          gap: 10,
+          transition: 'all var(--transition-fast)',
         }}
       >
         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-          <h4 style={{ margin: 0, fontSize: 16, color: 'var(--text-primary)' }}>{rule.title}</h4>
+          <h4 style={{ margin: 0, fontSize: 16, fontWeight: 600, color: 'var(--text-primary)' }}>{rule.title}</h4>
           <div style={{ display: 'flex', gap: 8, alignItems: 'center' }}>
-            <span style={{ fontSize: 12, color: 'var(--text-tertiary)', background: 'var(--bg-primary)', padding: '2px 6px', borderRadius: 4 }}>
+            <span style={{ fontSize: 11, fontWeight: 500, color: 'var(--text-secondary)', background: 'rgba(148, 163, 184, 0.12)', border: '1px solid rgba(148, 163, 184, 0.15)', padding: '2px 8px', borderRadius: 6 }}>
               {rule.scope} brain
             </span>
             <span style={{ fontSize: 12, color: 'gold' }} aria-label={`Importance ${stars} of 5`}>
@@ -103,21 +107,21 @@ export default function RulesPage({ activeBrainId }: { activeBrainId: string })
             </span>
           </div>
         </div>
-        <div style={{ fontSize: 14, color: 'var(--text-secondary)', whiteSpace: 'pre-wrap' }}>
+        <div style={{ fontSize: 13.5, lineHeight: 1.6, color: 'var(--text-secondary)', whiteSpace: 'pre-wrap' }}>
           {rule.body || '(no body)'}
         </div>
-        <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: 8 }}>
+        <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: 6 }}>
           {isArchived ? (
             <button
               onClick={() => handleRestore(rule)}
-              style={{ padding: '4px 8px', borderRadius: 4, background: 'var(--bg-primary)', border: '1px solid var(--border)', cursor: 'pointer', color: 'var(--text-primary)' }}
+              style={{ padding: '6px 12px', borderRadius: 6, background: 'rgba(148, 163, 184, 0.1)', border: '1px solid var(--border)', cursor: 'pointer', color: 'var(--text-primary)', fontSize: 12, fontWeight: 500 }}
             >
               Restore
             </button>
           ) : (
             <button
               onClick={() => handleArchive(rule)}
-              style={{ padding: '4px 8px', borderRadius: 4, background: 'var(--bg-primary)', border: '1px solid var(--border)', cursor: 'pointer', color: 'var(--text-primary)' }}
+              style={{ padding: '6px 12px', borderRadius: 6, background: 'rgba(148, 163, 184, 0.1)', border: '1px solid var(--border)', cursor: 'pointer', color: 'var(--text-primary)', fontSize: 12, fontWeight: 500 }}
             >
               Archive
             </button>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "total-recall-brain",
-  "version": "3.41.4",
+  "version": "3.41.6",
   "description": "The Vibe Coding Brain & Autonomous Software Factory: memory, rules, secrets, and 33 visual plugins automatically managed across all your devices.",
   "type": "module",
   "bin": {
@@ -77,7 +77,7 @@
   "homepage": "https://github.com/gregiteen/total-recall#readme",
   "dependencies": {
     "@simplewebauthn/server": "^13.3.2",
-    "@ssss/cli": "npm:@gregiteen/ssss-cli@0.14.3",
+    "@ssss/cli": "npm:@gregiteen/ssss-cli@0.14.4",
     "bcrypt": "^6.0.0",
     "better-sqlite3": "^12.11.1",
     "cookie-parser": "^1.4.7",
@@ -121,6 +121,7 @@
   },
   "overrides": {
     "proxy-addr": "2.0.8",
-    "argparse": "2.0.1"
+    "argparse": "2.0.1",
+    "minimatch": "^11.0.4"
   }
 }