web: open Agent at recent history and load older pages on demand

web/src/App.tsx

@@ -3554,7 +3554,7 @@ export default function App() {
               type="button"
               data-testid="agent-sidebar-item"
               aria-current={isAgentMode ? "page" : undefined}
-              aria-label={`Sybil Agent${agentRoom.unreadCount ? `, ${agentRoom.unreadCount} unread messages` : ""}${isAgentBusy ? ", working" : ""}`}
+              aria-label={`Sybil Agent${agentRoom.unreadCount ? `, ${agentRoom.unreadCount}${agentRoom.unreadCountIsPartial ? " or more" : ""} unread messages` : agentRoom.unreadCountIsPartial ? ", earlier messages may be unread" : ""}${isAgentBusy ? ", working" : ""}`}
               onClick={() => {
                 setContextMenu(null);
                 setError(null);
@@ -3580,9 +3580,9 @@ export default function App() {
                 <span className="block truncate text-sm font-semibold">Sybil Agent</span>
               </span>
               {isAgentBusy ? <LoaderCircle className="h-4 w-4 shrink-0 animate-spin text-cyan-200" aria-label="Agent working" /> : null}
-              {agentRoom.unreadCount > 0 ? (
+              {agentRoom.unreadCount > 0 || agentRoom.unreadCountIsPartial ? (
                 <span data-testid="agent-unread-badge" className="flex h-5 min-w-5 shrink-0 items-center justify-center rounded-full bg-cyan-200 px-1.5 text-[11px] font-bold tabular-nums text-slate-950">
-                  {agentRoom.unreadCount}
+                  {agentRoom.unreadCount ? `${agentRoom.unreadCount}${agentRoom.unreadCountIsPartial ? "+" : ""}` : "•"}
                 </span>
               ) : null}
             </button>