fix chat escalation and sidebar

web/app/chat/page.js

@@ -82,6 +82,7 @@ function ChatPage() {
   const [error, setError] = useState(null);
   const [conversations, setConversations] = useState([]);
   const [convsLoading, setConvsLoading] = useState(false);
+  const [closedExpanded, setClosedExpanded] = useState(false);
   const [selectedFile, setSelectedFile] = useState(null);
 
   const messagesEndRef = useRef(null);
@@ -478,7 +479,7 @@ function ChatPage() {
               <p style={s.sidebarEmpty}>No conversations yet.</p>
             )}
             <div style={{ overflowY: "auto", flex: 1 }}>
-              {conversations.map((conv) => (
+              {conversations.filter(c => c.status !== "CLOSED").map((conv) => (
                 <button
                   key={conv.id}
                   style={{ ...s.convItem, ...(conv.id === conversation?.id ? s.convItemActive : {}) }}
@@ -486,9 +487,7 @@ function ChatPage() {
                 >
                   <div style={s.convItemTop}>
                     <span style={s.convItemSubject}>{conv.subject || `Conversation #${conv.id}`}</span>
-                    <span style={{ ...s.convStatusBadge, ...(conv.status === "OPEN" ? s.convStatusOpen : s.convStatusClosed) }}>
-                      {conv.status}
-                    </span>
+                    <span style={{ ...s.convStatusBadge, ...s.convStatusOpen }}>{conv.status}</span>
                   </div>
                   <div style={s.convItemBottom}>
                     <span style={s.convItemMode}>{conv.mode === "HUMAN" ? "👤 Live" : "🤖 AI"}</span>
@@ -496,6 +495,33 @@ function ChatPage() {
                   </div>
                 </button>
               ))}
+              {conversations.some(c => c.status === "CLOSED") && (
+                <>
+                  <button
+                    style={s.closedSectionToggle}
+                    onClick={() => setClosedExpanded(p => !p)}
+                  >
+                    <span>Closed ({conversations.filter(c => c.status === "CLOSED").length})</span>
+                    <span>{closedExpanded ? "▲" : "▼"}</span>
+                  </button>
+                  {closedExpanded && conversations.filter(c => c.status === "CLOSED").map((conv) => (
+                    <button
+                      key={conv.id}
+                      style={{ ...s.convItem, ...s.convItemClosed, ...(conv.id === conversation?.id ? s.convItemActive : {}) }}
+                      onClick={() => switchConversation(conv.id)}
+                    >
+                      <div style={s.convItemTop}>
+                        <span style={s.convItemSubject}>{conv.subject || `Conversation #${conv.id}`}</span>
+                        <span style={{ ...s.convStatusBadge, ...s.convStatusClosed }}>CLOSED</span>
+                      </div>
+                      <div style={s.convItemBottom}>
+                        <span style={s.convItemMode}>{conv.mode === "HUMAN" ? "👤 Live" : "🤖 AI"}</span>
+                        <span style={s.convItemDate}>{conv.createdAt ? new Date(conv.createdAt).toLocaleDateString() : ""}</span>
+                      </div>
+                    </button>
+                  ))}
+                </>
+              )}
             </div>
             <button style={s.newConvSidebarBtn} onClick={() => handleNewConversation()}>
               + New Conversation
@@ -540,13 +566,15 @@ function ChatPage() {
                     Close Chat
                   </button>
                 )}
-                <button
-                  style={s.aiBtn}
-                  onClick={() => router.push("/ai-chat")}
-                  title="Back to AI Assistant"
-                >
-                  AI Assistant
-                </button>
+                {!isHuman && (
+                  <button
+                    style={s.aiBtn}
+                    onClick={() => router.push("/ai-chat")}
+                    title="Back to AI Assistant"
+                  >
+                    AI Assistant
+                  </button>
+                )}
               </div>
             </div>
 
@@ -1145,6 +1173,21 @@ const s = {
   },
   convStatusOpen: { background: "#e6f9ee", color: "#1a7a3c" },
   convStatusClosed: { background: "#f0f0f0", color: "#888" },
+  convItemClosed: { opacity: 0.7 },
+  closedSectionToggle: {
+    width: "100%",
+    background: "#f5f5f5",
+    border: "none",
+    borderTop: "1px solid #e8e8e8",
+    padding: "0.5rem 1rem",
+    fontSize: "0.78rem",
+    fontWeight: 600,
+    color: "#666",
+    cursor: "pointer",
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+  },
   newConvSidebarBtn: {
     margin: "0.65rem 1rem",
     background: "#333",