@pingagent/sdk 0.1.0 → 0.1.2

package/dist/index.d.ts

@@ -151,6 +151,8 @@ interface ConversationEntry {
     target_did: string;
     trusted: boolean;
     created_at: number;
+    /** Server-side last message write time (ms). Omitted or null when unknown; client should fetch when missing. */
+    last_activity_at?: number | null;
 }
 interface ConversationListResponse {
     conversations: ConversationEntry[];
@@ -473,6 +475,8 @@ interface WsSubscriptionOptions {
     onMessage: (envelope: any, conversationId: string) => void;
     onControl?: (control: WsControlPayload, conversationId: string) => void;
     onError?: (err: Error) => void;
+    /** Called when a WebSocket opens or reopens; e.g. Skill can run catchUp to fill gaps. */
+    onOpen?: (conversationId: string) => void;
 }
 declare class WsSubscription {
     private opts;

package/dist/index.js

@@ -16,7 +16,7 @@ import {
   loadIdentity,
   saveIdentity,
   updateStoredToken
-} from "./chunk-4SRPVWK4.js";
+} from "./chunk-MDGELIR5.js";
 export {
   A2AAdapter,
   ContactManager,

package/dist/web-server.d.ts

@@ -9,6 +9,8 @@ import * as http from 'node:http';
 interface ProfileEntry {
     id: string;
     did?: string;
+    /** Server URL for this profile (from identity); used so local vs remote profiles work in one web session. */
+    serverUrl?: string;
     identityPath: string;
     storePath: string;
 }

package/dist/web-server.js

@@ -5,7 +5,7 @@ import {
   ensureTokenValid,
   loadIdentity,
   updateStoredToken
-} from "./chunk-4SRPVWK4.js";
+} from "./chunk-MDGELIR5.js";
 
 // src/web-server.ts
 import * as fs from "fs";
@@ -29,6 +29,7 @@ function listProfiles(rootDir) {
       profiles.push({
         id: "default",
         did: id.did,
+        serverUrl: id.serverUrl,
         identityPath: defaultIdentity,
         storePath: path.join(root, "store.db")
       });
@@ -45,7 +46,7 @@ function listProfiles(rootDir) {
       if (fs.existsSync(idPath)) {
         try {
           const id = loadIdentity(idPath);
-          profiles.push({ id: name, did: id.did, identityPath: idPath, storePath: path.join(sub, "store.db") });
+          profiles.push({ id: name, did: id.did, serverUrl: id.serverUrl, identityPath: idPath, storePath: path.join(sub, "store.db") });
         } catch {
           profiles.push({ id: name, identityPath: idPath, storePath: path.join(sub, "store.db") });
         }
@@ -66,7 +67,7 @@ function listProfiles(rootDir) {
     if (fs.existsSync(idPath) && !profiles.some((p) => p.id === name)) {
       try {
         const id = loadIdentity(idPath);
-        profiles.push({ id: name, did: id.did, identityPath: idPath, storePath: path.join(sub, "store.db") });
+        profiles.push({ id: name, did: id.did, serverUrl: id.serverUrl, identityPath: idPath, storePath: path.join(sub, "store.db") });
       } catch {
         profiles.push({ id: name, identityPath: idPath, storePath: path.join(sub, "store.db") });
       }
@@ -74,31 +75,34 @@ function listProfiles(rootDir) {
   }
   return profiles;
 }
-async function getContextForProfile(profile, serverUrl) {
-  await ensureTokenValid(profile.identityPath, serverUrl);
+var DEFAULT_SERVER_URL = "http://localhost:8787";
+async function getContextForProfile(profile, defaultServerUrl) {
   const identity = loadIdentity(profile.identityPath);
+  const serverUrl = identity.serverUrl ?? defaultServerUrl ?? DEFAULT_SERVER_URL;
+  await ensureTokenValid(profile.identityPath, serverUrl);
+  const identityAfter = loadIdentity(profile.identityPath);
   const store = new LocalStore(profile.storePath);
   const contactManager = new ContactManager(store);
   const client = new PingAgentClient({
     serverUrl,
-    identity,
-    accessToken: identity.accessToken ?? "",
+    identity: identityAfter,
+    accessToken: identityAfter.accessToken ?? "",
     store,
     onTokenRefreshed: (token, expiresAt) => updateStoredToken(token, expiresAt, profile.identityPath)
   });
-  return { client, contactManager, myDid: identity.did };
+  return { client, contactManager, myDid: identityAfter.did, serverUrl };
 }
 var clientCache = /* @__PURE__ */ new Map();
 async function startWebServer(opts) {
   const port = opts.port ?? DEFAULT_PORT;
-  const serverUrl = opts.serverUrl;
+  const defaultServerUrl = opts.serverUrl ?? DEFAULT_SERVER_URL;
   const rootDir = opts.rootDir ? resolvePath(opts.rootDir) : resolvePath(DEFAULT_ROOT);
   let profiles;
   let fixedContext = null;
   if (opts.fixedIdentityPath && opts.fixedStorePath) {
     const identityPath = resolvePath(opts.fixedIdentityPath);
     const storePath = resolvePath(opts.fixedStorePath);
-    fixedContext = await getContextForProfile({ id: "fixed", identityPath, storePath }, serverUrl);
+    fixedContext = await getContextForProfile({ id: "fixed", identityPath, storePath }, defaultServerUrl);
     profiles = [{ id: "fixed", did: fixedContext.myDid, identityPath, storePath }];
   } else {
     profiles = listProfiles(opts.rootDir ?? DEFAULT_ROOT);
@@ -106,7 +110,7 @@ async function startWebServer(opts) {
       throw new Error(`No identity found in ${rootDir}. Run: pingagent init`);
     }
   }
-  const html = getHtml(!!opts.fixedIdentityPath);
+  const html = getHtml();
   const server = http.createServer(async (req, res) => {
     const url = new URL(req.url || "/", `http://${req.headers.host}`);
     const pathname = url.pathname;
@@ -131,7 +135,7 @@ async function startWebServer(opts) {
       try {
         if (pathname === "/api/profiles" || pathname === "/api/profiles/") {
           res.writeHead(200, { "Content-Type": "application/json; charset=utf-8" });
-          res.end(JSON.stringify({ profiles: profiles.map((p) => ({ id: p.id, did: p.did })) }));
+          res.end(JSON.stringify({ profiles: profiles.map((p) => ({ id: p.id, did: p.did, server: p.serverUrl })) }));
           return;
         }
         let ctx = fixedContext;
@@ -147,11 +151,11 @@ async function startWebServer(opts) {
           else {
             const p = profiles.find((x) => x.id === pid);
             if (!p) throw new Error(`Unknown profile: ${pid}`);
-            ctx = await getContextForProfile(p, serverUrl);
+            ctx = await getContextForProfile(p, defaultServerUrl);
             clientCache.set(pid, ctx);
           }
         }
-        const result = await handleApi(pathname, req, ctx.client, ctx.contactManager, ctx.myDid, serverUrl);
+        const result = await handleApi(pathname, req, ctx.client, ctx.contactManager, ctx.myDid, ctx.serverUrl);
         res.writeHead(200, { "Content-Type": "application/json; charset=utf-8" });
         res.end(JSON.stringify(result));
       } catch (err) {
@@ -167,10 +171,10 @@ async function startWebServer(opts) {
     console.log(`PingAgent Web: http://127.0.0.1:${port}`);
     if (fixedContext) {
       console.log(`  DID: ${fixedContext.myDid}`);
+      console.log(`  Server: ${fixedContext.serverUrl}`);
     } else {
-      console.log(`  Profiles: ${profiles.map((p) => p.id).join(", ")}`);
+      console.log(`  Profiles: ${profiles.map((p) => p.id).join(", ")} (each uses its identity server URL)`);
     }
-    console.log(`  Server: ${serverUrl}`);
   });
   return server;
 }
@@ -384,11 +388,11 @@ function readBody(req) {
     req.on("error", reject);
   });
 }
-function getHtml(fixedOnly) {
-  const profilePicker = fixedOnly ? "" : `
+function getHtml(_fixedOnly) {
+  const profilePicker = `
     <div class="profile-picker" id="profilePicker">
       <div class="profile-label">\u9009\u62E9 Profile \u767B\u5F55</div>
-      <div class="profile-list" id="profileList"></div>
+      <div class="profile-list" id="profileList"><p class="profile-loading">\u52A0\u8F7D\u4E2D...</p></div>
     </div>
     <div class="profile-current" id="profileCurrent" style="display:none">
       <span>\u5F53\u524D: <strong id="currentProfileName"></strong></span>
@@ -433,8 +437,11 @@ function getHtml(fixedOnly) {
     .error { color: #f87171; font-size: 13px; padding: 8px 0; }
     .profile-picker { padding: 12px 16px; border-bottom: 1px solid #27272a; }
     .profile-label { font-size: 12px; color: #71717a; margin-bottom: 8px; }
+    .profile-list { min-height: 160px; }
+    .profile-loading { font-size: 12px; color: #71717a; margin: 0; }
     .profile-list .profile-btn { display: block; width: 100%; padding: 8px 12px; margin-bottom: 4px; background: #27272a; color: #e4e4e7; border: none; border-radius: 6px; cursor: pointer; font-size: 13px; text-align: left; }
     .profile-list .profile-btn:hover { background: #3f3f46; }
+    .profile-list .profile-btn.selected { border: 1px solid #3b82f6; background: #1e3a5f; }
     .profile-list .profile-btn .sub { font-size: 11px; color: #71717a; }
     .profile-current { padding: 12px 16px; border-bottom: 1px solid #27272a; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
     .profile-current span { font-size: 13px; color: #a1a1aa; }
@@ -563,41 +570,72 @@ function getHtml(fixedOnly) {
     let profilesCache = null;
 
     function showProfileCurrent() {
-      if (profileCurrentEl && profilePickerEl) {
+      if (profileCurrentEl) {
         profileCurrentEl.style.display = 'flex';
-        profilePickerEl.style.display = 'none';
         const nameEl = document.getElementById('currentProfileName');
         if (nameEl) nameEl.textContent = selectedProfile || '';
       }
+      if (profilePickerEl) profilePickerEl.style.display = '';
+      highlightSelectedProfile();
     }
 
     function showProfilePicker() {
-      if (profileCurrentEl && profilePickerEl) {
-        profileCurrentEl.style.display = 'none';
-        profilePickerEl.style.display = '';
-        currentConv = null;
-        document.getElementById('inputArea').style.display = 'none';
-        document.getElementById('messages').innerHTML = '';
-        document.getElementById('mainHeader').innerHTML = '<strong>\u9009\u62E9 Profile \u767B\u5F55</strong>';
-      }
+      if (profileCurrentEl) profileCurrentEl.style.display = 'none';
+      if (profilePickerEl) profilePickerEl.style.display = '';
+      currentConv = null;
+      document.getElementById('inputArea').style.display = 'none';
+      document.getElementById('messages').innerHTML = '';
+      document.getElementById('mainHeader').innerHTML = '<strong>\u9009\u62E9 Profile \u767B\u5F55</strong>';
+    }
+
+    function highlightSelectedProfile() {
+      const listEl = document.getElementById('profileList');
+      if (!listEl) return;
+      listEl.querySelectorAll('.profile-btn').forEach(btn => {
+        btn.classList.toggle('selected', btn.dataset.id === selectedProfile);
+      });
     }
 
     async function loadProfiles() {
-      if (!profilePickerEl) return [];
+      const listEl = document.getElementById('profileList');
+      if (!profilePickerEl || !listEl) return [];
       if (profilesCache) return profilesCache;
-      const { profiles } = await fetch(API + '/api/profiles')
-        .then(r => r.json())
-        .catch(() => ({ profiles: [] }));
-      profilesCache = Array.isArray(profiles) ? profiles : [];
-      return profilesCache;
+      try {
+        const ctrl = new AbortController();
+        const t = setTimeout(() => ctrl.abort(), 8000);
+        const r = await fetch('/api/profiles', { signal: ctrl.signal });
+        clearTimeout(t);
+        if (!r.ok) {
+          listEl.innerHTML = '<p class="profile-loading">\u8BF7\u6C42\u5931\u8D25 ' + r.status + '</p>';
+          return [];
+        }
+        const data = await r.json().catch(() => ({}));
+        const list = Array.isArray(data.profiles) ? data.profiles : [];
+        profilesCache = list;
+        if (list.length === 0) listEl.innerHTML = '<p class="profile-loading">\u672A\u627E\u5230 profile</p>';
+        return profilesCache;
+      } catch (e) {
+        const msg = (e && e.name === 'AbortError') ? '\u8BF7\u6C42\u8D85\u65F6' : '\u52A0\u8F7D\u5931\u8D25\uFF0C\u8BF7\u5237\u65B0';
+        listEl.innerHTML = '<p class="profile-loading">' + msg + '</p>';
+        return [];
+      }
     }
 
     function renderProfileList(profiles) {
       const listEl = document.getElementById('profileList');
       if (!listEl) return;
-      listEl.innerHTML = (profiles || []).map(p =>
-        '<button class="profile-btn" data-id="' + p.id + '">' + p.id + '<div class="sub">' + (p.did || '').slice(0, 32) + '...</div></button>'
-      ).join('');
+      const list = profiles || [];
+      if (list.length === 0) {
+        listEl.innerHTML = '<p class="profile-loading">\u672A\u627E\u5230 profile</p>';
+        return;
+      }
+      listEl.innerHTML = list.map(p => {
+        var s = (p.server && typeof p.server === 'string') ? p.server : '';
+        var serverLabel = s.indexOf('://') >= 0 ? s.split('://')[1].split('/')[0] : (s || 'local');
+        var didShort = (p.did && typeof p.did === 'string') ? p.did.slice(0, 24) + '...' : '';
+        var sel = p.id === selectedProfile ? ' selected' : '';
+        return '<button class="profile-btn' + sel + '" data-id="' + p.id + '">' + p.id + '<div class="sub">' + serverLabel + ' \xB7 ' + didShort + '<' + '/div><' + '/button>';
+      }).join('');
       listEl.querySelectorAll('.profile-btn').forEach(btn => {
         btn.addEventListener('click', async () => {
           selectedProfile = btn.dataset.id || null;
@@ -1011,19 +1049,21 @@ function getHtml(fixedOnly) {
       }
       const profiles = await loadProfiles();
       if (profiles.length === 0) {
-        document.getElementById('mainHeader').innerHTML = '<strong>\u65E0\u53EF\u7528 Profile\uFF0C\u8BF7\u5148 pingagent init</strong>';
+        const header = document.getElementById('mainHeader');
+        if (header) header.innerHTML = '<strong>\u65E0\u53EF\u7528 Profile\uFF0C\u8BF7\u5148 pingagent init</strong>';
+        renderProfileList([]);
         return;
       }
       if (profiles.length === 1 && !selectedProfile) {
         selectedProfile = profiles[0].id;
         sessionStorage.setItem('pingagent_web_profile', selectedProfile);
       }
+      renderProfileList(profiles);
       if (selectedProfile && profiles.some(p => p.id === selectedProfile)) {
         showProfileCurrent();
         await loadDataForProfile();
         return;
       }
-      renderProfileList(profiles);
       showProfilePicker();
     }
     init();

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@pingagent/sdk",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/pingagent-chat/PingAgent.git"
+    "url": "https://github.com/PingAgent/PingAgent.git"
   },
   "type": "module",
   "main": "dist/index.js",
@@ -26,9 +26,9 @@
     "commander": "^13.0.0",
     "uuid": "^11.0.0",
     "ws": "^8.0.0",
-    "@pingagent/protocol": "0.1.0",
-    "@pingagent/a2a": "0.1.0",
-    "@pingagent/schemas": "0.1.0"
+    "@pingagent/protocol": "0.1.1",
+    "@pingagent/a2a": "0.1.1",
+    "@pingagent/schemas": "0.1.1"
   },
   "devDependencies": {
     "@types/better-sqlite3": "^7.6.0",

package/src/client.ts

@@ -62,6 +62,8 @@ export interface ConversationEntry {
   target_did: string;
   trusted: boolean;
   created_at: number;
+  /** Server-side last message write time (ms). Omitted or null when unknown; client should fetch when missing. */
+  last_activity_at?: number | null;
 }
 
 export interface ConversationListResponse {

package/src/web-server.ts

@@ -28,6 +28,8 @@ function resolvePath(p: string): string {
 export interface ProfileEntry {
   id: string;
   did?: string;
+  /** Server URL for this profile (from identity); used so local vs remote profiles work in one web session. */
+  serverUrl?: string;
   identityPath: string;
   storePath: string;
 }
@@ -55,6 +57,7 @@ function listProfiles(rootDir: string): ProfileEntry[] {
       profiles.push({
         id: 'default',
         did: id.did,
+        serverUrl: id.serverUrl,
         identityPath: defaultIdentity,
         storePath: path.join(root, 'store.db'),
       });
@@ -73,7 +76,7 @@ function listProfiles(rootDir: string): ProfileEntry[] {
       if (fs.existsSync(idPath)) {
         try {
           const id = loadIdentity(idPath);
-          profiles.push({ id: name, did: id.did, identityPath: idPath, storePath: path.join(sub, 'store.db') });
+          profiles.push({ id: name, did: id.did, serverUrl: id.serverUrl, identityPath: idPath, storePath: path.join(sub, 'store.db') });
         } catch {
           profiles.push({ id: name, identityPath: idPath, storePath: path.join(sub, 'store.db') });
         }
@@ -81,7 +84,7 @@ function listProfiles(rootDir: string): ProfileEntry[] {
     }
   }
 
-  // root/<dir>/identity.json (e.g. receiver, agent1) - skip if profiles dir doesn't exist
+  // root/<dir>/identity.json (e.g. receiver, agent1, remote1c)
   let names: string[];
   try {
     names = fs.readdirSync(root);
@@ -96,7 +99,7 @@ function listProfiles(rootDir: string): ProfileEntry[] {
     if (fs.existsSync(idPath) && !profiles.some((p) => p.id === name)) {
       try {
         const id = loadIdentity(idPath);
-        profiles.push({ id: name, did: id.did, identityPath: idPath, storePath: path.join(sub, 'store.db') });
+        profiles.push({ id: name, did: id.did, serverUrl: id.serverUrl, identityPath: idPath, storePath: path.join(sub, 'store.db') });
       } catch {
         profiles.push({ id: name, identityPath: idPath, storePath: path.join(sub, 'store.db') });
       }
@@ -106,38 +109,43 @@ function listProfiles(rootDir: string): ProfileEntry[] {
   return profiles;
 }
 
+/** Default server URL when identity has none (e.g. legacy). */
+const DEFAULT_SERVER_URL = 'http://localhost:8787';
+
 async function getContextForProfile(
   profile: ProfileEntry,
-  serverUrl: string,
-): Promise<{ client: PingAgentClient; contactManager: ContactManager; myDid: string }> {
-  await ensureTokenValid(profile.identityPath, serverUrl);
+  defaultServerUrl: string,
+): Promise<{ client: PingAgentClient; contactManager: ContactManager; myDid: string; serverUrl: string }> {
   const identity = loadIdentity(profile.identityPath);
+  const serverUrl = identity.serverUrl ?? defaultServerUrl ?? DEFAULT_SERVER_URL;
+  await ensureTokenValid(profile.identityPath, serverUrl);
+  const identityAfter = loadIdentity(profile.identityPath);
   const store = new LocalStore(profile.storePath);
   const contactManager = new ContactManager(store);
   const client = new PingAgentClient({
     serverUrl,
-    identity,
-    accessToken: identity.accessToken ?? '',
+    identity: identityAfter,
+    accessToken: identityAfter.accessToken ?? '',
     store,
     onTokenRefreshed: (token, expiresAt) => updateStoredToken(token, expiresAt, profile.identityPath),
   });
-  return { client, contactManager, myDid: identity.did };
+  return { client, contactManager, myDid: identityAfter.did, serverUrl };
 }
 
-const clientCache = new Map<string, { client: PingAgentClient; contactManager: ContactManager; myDid: string }>();
+const clientCache = new Map<string, { client: PingAgentClient; contactManager: ContactManager; myDid: string; serverUrl: string }>();
 
 export async function startWebServer(opts: WebServerOptions): Promise<http.Server> {
   const port = opts.port ?? DEFAULT_PORT;
-  const serverUrl = opts.serverUrl;
+  const defaultServerUrl = opts.serverUrl ?? DEFAULT_SERVER_URL;
   const rootDir = opts.rootDir ? resolvePath(opts.rootDir) : resolvePath(DEFAULT_ROOT);
 
   let profiles: ProfileEntry[];
-  let fixedContext: { client: PingAgentClient; contactManager: ContactManager; myDid: string } | null = null;
+  let fixedContext: { client: PingAgentClient; contactManager: ContactManager; myDid: string; serverUrl: string } | null = null;
 
   if (opts.fixedIdentityPath && opts.fixedStorePath) {
     const identityPath = resolvePath(opts.fixedIdentityPath);
     const storePath = resolvePath(opts.fixedStorePath);
-    fixedContext = await getContextForProfile({ id: 'fixed', identityPath, storePath }, serverUrl);
+    fixedContext = await getContextForProfile({ id: 'fixed', identityPath, storePath }, defaultServerUrl);
     profiles = [{ id: 'fixed', did: fixedContext.myDid, identityPath, storePath }];
   } else {
     profiles = listProfiles(opts.rootDir ?? DEFAULT_ROOT);
@@ -146,7 +154,7 @@ export async function startWebServer(opts: WebServerOptions): Promise<http.Serve
     }
   }
 
-  const html = getHtml(!!opts.fixedIdentityPath);
+  const html = getHtml();
 
   const server = http.createServer(async (req, res) => {
     const url = new URL(req.url || '/', `http://${req.headers.host}`);
@@ -176,7 +184,7 @@ export async function startWebServer(opts: WebServerOptions): Promise<http.Serve
       try {
         if (pathname === '/api/profiles' || pathname === '/api/profiles/') {
           res.writeHead(200, { 'Content-Type': 'application/json; charset=utf-8' });
-          res.end(JSON.stringify({ profiles: profiles.map((p) => ({ id: p.id, did: p.did })) }));
+          res.end(JSON.stringify({ profiles: profiles.map((p) => ({ id: p.id, did: p.did, server: p.serverUrl })) }));
           return;
         }
         let ctx = fixedContext;
@@ -194,11 +202,11 @@ export async function startWebServer(opts: WebServerOptions): Promise<http.Serve
           else {
             const p = profiles.find((x) => x.id === pid);
             if (!p) throw new Error(`Unknown profile: ${pid}`);
-            ctx = await getContextForProfile(p, serverUrl);
+            ctx = await getContextForProfile(p, defaultServerUrl);
             clientCache.set(pid, ctx);
           }
         }
-        const result = await handleApi(pathname, req, ctx.client, ctx.contactManager, ctx.myDid, serverUrl);
+        const result = await handleApi(pathname, req, ctx.client, ctx.contactManager, ctx.myDid, ctx.serverUrl);
         res.writeHead(200, { 'Content-Type': 'application/json; charset=utf-8' });
         res.end(JSON.stringify(result));
       } catch (err: any) {
@@ -216,10 +224,10 @@ export async function startWebServer(opts: WebServerOptions): Promise<http.Serve
     console.log(`PingAgent Web: http://127.0.0.1:${port}`);
     if (fixedContext) {
       console.log(`  DID: ${fixedContext.myDid}`);
+      console.log(`  Server: ${fixedContext.serverUrl}`);
     } else {
-      console.log(`  Profiles: ${profiles.map((p) => p.id).join(', ')}`);
+      console.log(`  Profiles: ${profiles.map((p) => p.id).join(', ')} (each uses its identity server URL)`);
     }
-    console.log(`  Server: ${serverUrl}`);
   });
 
   return server;
@@ -455,13 +463,11 @@ function readBody(req: http.IncomingMessage): Promise<Record<string, unknown>> {
   });
 }
 
-function getHtml(fixedOnly: boolean): string {
-  const profilePicker = fixedOnly
-    ? ''
-    : `
+function getHtml(_fixedOnly?: boolean): string {
+  const profilePicker = `
     <div class="profile-picker" id="profilePicker">
       <div class="profile-label">选择 Profile 登录</div>
-      <div class="profile-list" id="profileList"></div>
+      <div class="profile-list" id="profileList"><p class="profile-loading">加载中...</p></div>
     </div>
     <div class="profile-current" id="profileCurrent" style="display:none">
       <span>当前: <strong id="currentProfileName"></strong></span>
@@ -506,8 +512,11 @@ function getHtml(fixedOnly: boolean): string {
     .error { color: #f87171; font-size: 13px; padding: 8px 0; }
     .profile-picker { padding: 12px 16px; border-bottom: 1px solid #27272a; }
     .profile-label { font-size: 12px; color: #71717a; margin-bottom: 8px; }
+    .profile-list { min-height: 160px; }
+    .profile-loading { font-size: 12px; color: #71717a; margin: 0; }
     .profile-list .profile-btn { display: block; width: 100%; padding: 8px 12px; margin-bottom: 4px; background: #27272a; color: #e4e4e7; border: none; border-radius: 6px; cursor: pointer; font-size: 13px; text-align: left; }
     .profile-list .profile-btn:hover { background: #3f3f46; }
+    .profile-list .profile-btn.selected { border: 1px solid #3b82f6; background: #1e3a5f; }
     .profile-list .profile-btn .sub { font-size: 11px; color: #71717a; }
     .profile-current { padding: 12px 16px; border-bottom: 1px solid #27272a; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
     .profile-current span { font-size: 13px; color: #a1a1aa; }
@@ -636,41 +645,72 @@ function getHtml(fixedOnly: boolean): string {
     let profilesCache = null;
 
     function showProfileCurrent() {
-      if (profileCurrentEl && profilePickerEl) {
+      if (profileCurrentEl) {
         profileCurrentEl.style.display = 'flex';
-        profilePickerEl.style.display = 'none';
         const nameEl = document.getElementById('currentProfileName');
         if (nameEl) nameEl.textContent = selectedProfile || '';
       }
+      if (profilePickerEl) profilePickerEl.style.display = '';
+      highlightSelectedProfile();
     }
 
     function showProfilePicker() {
-      if (profileCurrentEl && profilePickerEl) {
-        profileCurrentEl.style.display = 'none';
-        profilePickerEl.style.display = '';
-        currentConv = null;
-        document.getElementById('inputArea').style.display = 'none';
-        document.getElementById('messages').innerHTML = '';
-        document.getElementById('mainHeader').innerHTML = '<strong>选择 Profile 登录</strong>';
-      }
+      if (profileCurrentEl) profileCurrentEl.style.display = 'none';
+      if (profilePickerEl) profilePickerEl.style.display = '';
+      currentConv = null;
+      document.getElementById('inputArea').style.display = 'none';
+      document.getElementById('messages').innerHTML = '';
+      document.getElementById('mainHeader').innerHTML = '<strong>选择 Profile 登录</strong>';
+    }
+
+    function highlightSelectedProfile() {
+      const listEl = document.getElementById('profileList');
+      if (!listEl) return;
+      listEl.querySelectorAll('.profile-btn').forEach(btn => {
+        btn.classList.toggle('selected', btn.dataset.id === selectedProfile);
+      });
     }
 
     async function loadProfiles() {
-      if (!profilePickerEl) return [];
+      const listEl = document.getElementById('profileList');
+      if (!profilePickerEl || !listEl) return [];
       if (profilesCache) return profilesCache;
-      const { profiles } = await fetch(API + '/api/profiles')
-        .then(r => r.json())
-        .catch(() => ({ profiles: [] }));
-      profilesCache = Array.isArray(profiles) ? profiles : [];
-      return profilesCache;
+      try {
+        const ctrl = new AbortController();
+        const t = setTimeout(() => ctrl.abort(), 8000);
+        const r = await fetch('/api/profiles', { signal: ctrl.signal });
+        clearTimeout(t);
+        if (!r.ok) {
+          listEl.innerHTML = '<p class="profile-loading">请求失败 ' + r.status + '</p>';
+          return [];
+        }
+        const data = await r.json().catch(() => ({}));
+        const list = Array.isArray(data.profiles) ? data.profiles : [];
+        profilesCache = list;
+        if (list.length === 0) listEl.innerHTML = '<p class="profile-loading">未找到 profile</p>';
+        return profilesCache;
+      } catch (e) {
+        const msg = (e && e.name === 'AbortError') ? '请求超时' : '加载失败，请刷新';
+        listEl.innerHTML = '<p class="profile-loading">' + msg + '</p>';
+        return [];
+      }
     }
 
     function renderProfileList(profiles) {
       const listEl = document.getElementById('profileList');
       if (!listEl) return;
-      listEl.innerHTML = (profiles || []).map(p =>
-        '<button class="profile-btn" data-id="' + p.id + '">' + p.id + '<div class="sub">' + (p.did || '').slice(0, 32) + '...</div></button>'
-      ).join('');
+      const list = profiles || [];
+      if (list.length === 0) {
+        listEl.innerHTML = '<p class="profile-loading">未找到 profile</p>';
+        return;
+      }
+      listEl.innerHTML = list.map(p => {
+        var s = (p.server && typeof p.server === 'string') ? p.server : '';
+        var serverLabel = s.indexOf('://') >= 0 ? s.split('://')[1].split('/')[0] : (s || 'local');
+        var didShort = (p.did && typeof p.did === 'string') ? p.did.slice(0, 24) + '...' : '';
+        var sel = p.id === selectedProfile ? ' selected' : '';
+        return '<button class="profile-btn' + sel + '" data-id="' + p.id + '">' + p.id + '<div class="sub">' + serverLabel + ' \u00B7 ' + didShort + '<' + '/div><' + '/button>';
+      }).join('');
       listEl.querySelectorAll('.profile-btn').forEach(btn => {
         btn.addEventListener('click', async () => {
           selectedProfile = btn.dataset.id || null;
@@ -1084,19 +1124,21 @@ function getHtml(fixedOnly: boolean): string {
       }
       const profiles = await loadProfiles();
       if (profiles.length === 0) {
-        document.getElementById('mainHeader').innerHTML = '<strong>无可用 Profile，请先 pingagent init</strong>';
+        const header = document.getElementById('mainHeader');
+        if (header) header.innerHTML = '<strong>无可用 Profile，请先 pingagent init</strong>';
+        renderProfileList([]);
         return;
       }
       if (profiles.length === 1 && !selectedProfile) {
         selectedProfile = profiles[0].id;
         sessionStorage.setItem('pingagent_web_profile', selectedProfile);
       }
+      renderProfileList(profiles);
       if (selectedProfile && profiles.some(p => p.id === selectedProfile)) {
         showProfileCurrent();
         await loadDataForProfile();
         return;
       }
-      renderProfileList(profiles);
       showProfilePicker();
     }
     init();

package/src/ws-subscription.ts

@@ -19,6 +19,8 @@ export interface WsSubscriptionOptions {
   onMessage: (envelope: any, conversationId: string) => void;
   onControl?: (control: WsControlPayload, conversationId: string) => void;
   onError?: (err: Error) => void;
+  /** Called when a WebSocket opens or reopens; e.g. Skill can run catchUp to fill gaps. */
+  onOpen?: (conversationId: string) => void;
 }
 
 const RECONNECT_BASE_MS = 1000;
@@ -106,6 +108,7 @@ export class WsSubscription {
 
     ws.on('open', () => {
       this.reconnectAttempts.set(conversationId, 0);
+      this.opts.onOpen?.(conversationId);
       // ws_connected will arrive as first message
     });