@pingagent/sdk 0.1.11 → 0.1.13

package/dist/web-server.js

@@ -23,7 +23,7 @@ import {
   summarizeTrustPolicyAudit,
   updateStoredToken,
   upsertTrustPolicyRecommendation
-} from "./chunk-BLHMTUID.js";
+} from "./chunk-N2GCIMAW.js";
 
 // src/web-server.ts
 import * as fs from "fs";
@@ -153,6 +153,20 @@ function getHostPanelHtml() {
     }
     .empty { color: #94a3b8; font-size: 13px; }
     .link-row { display: flex; gap: 10px; margin-top: 20px; }
+    .toolbar-row { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
+    .toolbar-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
+    .mode-toggle { display: inline-flex; gap: 6px; padding: 4px; border-radius: 999px; border: 1px solid #334155; background: #020617; }
+    .mode-toggle button {
+      border: 0;
+      background: transparent;
+      color: #94a3b8;
+      border-radius: 999px;
+      padding: 6px 10px;
+      cursor: pointer;
+    }
+    .mode-toggle button.active { background: #0f766e; color: #ecfeff; }
+    .summary-pills { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
+    .summary-pills .pill { font-size: 11px; }
     @media (max-width: 1000px) {
       .layout { grid-template-columns: 1fr; }
       .sidebar { border-right: none; border-bottom: 1px solid #1e293b; }
@@ -196,7 +210,17 @@ function getHostPanelHtml() {
         <div class="grid stats" id="statsGrid"></div>
         <div class="grid runtime-layout" style="margin-top:16px">
           <div class="card">
-            <h2>Recent Sessions</h2>
+            <div class="toolbar-row">
+              <h2 style="margin:0">Recent Sessions</h2>
+              <div class="toolbar-actions">
+                <button class="secondary-btn" id="toggleUnreadBtn" style="width:auto">Unread only: off</button>
+                <button class="secondary-btn" id="nextUnreadBtn" style="width:auto">Next unread</button>
+                <div class="mode-toggle" aria-label="Runtime detail mode">
+                  <button id="detailModeBasicBtn" class="active" type="button">Basic</button>
+                  <button id="detailModeAdvancedBtn" type="button">Advanced</button>
+                </div>
+              </div>
+            </div>
             <div class="sessions" id="sessionList"></div>
           </div>
           <div class="grid">
@@ -325,14 +349,28 @@ function getHostPanelHtml() {
   </div>
 
   <script>
+    const initialQuery = (function () {
+      const params = new URLSearchParams(window.location.search);
+      const profile = params.get('profile');
+      const sessionKey = params.get('session_key');
+      const view = params.get('view');
+      return {
+        profile: profile && profile.trim() ? profile.trim() : null,
+        sessionKey: sessionKey && sessionKey.trim() ? sessionKey.trim() : null,
+        view: view === 'policy' ? 'policy' : 'runtime',
+      };
+    })();
+
     const state = {
-      selectedProfile: sessionStorage.getItem('pingagent_host_panel_profile') || null,
-      currentTab: 'runtime',
+      selectedProfile: initialQuery.profile || sessionStorage.getItem('pingagent_host_panel_profile') || null,
+      currentTab: initialQuery.view,
       profiles: [],
       overview: null,
       session: null,
       policy: null,
-      selectedSessionKey: null,
+      selectedSessionKey: initialQuery.sessionKey || null,
+      detailMode: sessionStorage.getItem('pingagent_host_panel_detail_mode') || 'basic',
+      showUnreadOnly: false,
     };
 
     function esc(value) {
@@ -356,6 +394,45 @@ function getHostPanelHtml() {
       try { return new Date(value).toLocaleString(); } catch { return String(value); }
     }
 
+    function syncUrlState() {
+      const url = new URL(window.location.href);
+      if (state.selectedProfile) url.searchParams.set('profile', state.selectedProfile);
+      else url.searchParams.delete('profile');
+      if (state.selectedSessionKey) url.searchParams.set('session_key', state.selectedSessionKey);
+      else url.searchParams.delete('session_key');
+      url.searchParams.set('view', state.currentTab === 'policy' ? 'policy' : 'runtime');
+      history.replaceState(null, '', url.pathname + (url.search ? url.search : ''));
+    }
+
+    function setDetailMode(mode) {
+      state.detailMode = mode === 'advanced' ? 'advanced' : 'basic';
+      sessionStorage.setItem('pingagent_host_panel_detail_mode', state.detailMode);
+      document.getElementById('detailModeBasicBtn').classList.toggle('active', state.detailMode === 'basic');
+      document.getElementById('detailModeAdvancedBtn').classList.toggle('active', state.detailMode === 'advanced');
+      if (state.overview) renderOverview();
+      if (state.session) renderSession();
+    }
+
+    function buildSessionLink(sessionKey) {
+      const url = new URL(window.location.href);
+      if (state.selectedProfile) url.searchParams.set('profile', state.selectedProfile);
+      else url.searchParams.delete('profile');
+      if (sessionKey) url.searchParams.set('session_key', sessionKey);
+      else url.searchParams.delete('session_key');
+      url.searchParams.set('view', 'runtime');
+      return url.toString();
+    }
+
+    async function copyText(text, fallbackLabel) {
+      try {
+        await navigator.clipboard.writeText(text);
+        window.alert((fallbackLabel || 'Copied') + ':
+' + text);
+      } catch {
+        window.prompt(fallbackLabel || 'Copy', text);
+      }
+    }
+
     async function api(path, opts) {
       let url = path;
       if (state.selectedProfile) {
@@ -405,6 +482,7 @@ function getHostPanelHtml() {
       document.getElementById('navPolicy').classList.toggle('active', tab === 'policy');
       document.getElementById('runtimePanel').classList.toggle('active', tab === 'runtime');
       document.getElementById('policyPanel').classList.toggle('active', tab === 'policy');
+      syncUrlState();
     }
 
     function renderHeader() {
@@ -494,9 +572,40 @@ function getHostPanelHtml() {
         '</div>';
     }
 
+    function getOverviewSessions() {
+      return state.overview && Array.isArray(state.overview.sessions) ? state.overview.sessions : [];
+    }
+
+    function getVisibleSessions() {
+      const sessions = getOverviewSessions();
+      return state.showUnreadOnly
+        ? sessions.filter(function (session) { return Number(session.unread_count || 0) > 0; })
+        : sessions;
+    }
+
+    function syncSelectedSessionFromOverview() {
+      const allSessions = getOverviewSessions();
+      const visibleSessions = getVisibleSessions();
+      if (!allSessions.length) {
+        state.selectedSessionKey = null;
+        state.session = null;
+        return;
+      }
+      const hasSelected = allSessions.some(function (session) { return session.session_key === state.selectedSessionKey; });
+      if (!hasSelected) {
+        state.selectedSessionKey = visibleSessions.length ? visibleSessions[0].session_key : allSessions[0].session_key;
+        return;
+      }
+      if (state.showUnreadOnly) {
+        const stillVisible = visibleSessions.some(function (session) { return session.session_key === state.selectedSessionKey; });
+        if (!stillVisible) state.selectedSessionKey = visibleSessions.length ? visibleSessions[0].session_key : null;
+      }
+    }
+
     function renderOverview() {
       const overview = state.overview;
       if (!overview) return;
+      syncSelectedSessionFromOverview();
       const ingressState = ingressStatusModel(overview);
       document.getElementById('activationCard').innerHTML =
         '<div class="status-strip">' +
@@ -536,24 +645,27 @@ function getHostPanelHtml() {
         return '<div class="card"><div class="label">' + esc(item.label) + '</div><div class="value">' + esc(item.value) + '</div><div class="muted small">' + esc(item.sub) + '</div></div>';
       }).join('');
 
-      const sessions = Array.isArray(overview.sessions) ? overview.sessions : [];
+      const toggleUnreadBtn = document.getElementById('toggleUnreadBtn');
+      if (toggleUnreadBtn) toggleUnreadBtn.textContent = 'Unread only: ' + (state.showUnreadOnly ? 'on' : 'off');
+      const sessions = getVisibleSessions();
       if (!sessions.length) {
-        document.getElementById('sessionList').innerHTML = '<div class="empty">No sessions yet.</div>';
+        document.getElementById('sessionList').innerHTML = '<div class="empty">' + (state.showUnreadOnly ? 'No unread sessions.' : 'No sessions yet.') + '</div>';
       } else {
-        if (!state.selectedSessionKey) state.selectedSessionKey = sessions[0].session_key;
         document.getElementById('sessionList').innerHTML = sessions.map(function (session) {
           const active = session.session_key === state.selectedSessionKey ? ' active' : '';
           const badges = [
             '<span class="badge ' + esc(session.trust_state) + '">' + esc(session.trust_state) + '</span>',
             session.binding_alert
-              ? '<button type="button" class="badge alert rebind-badge-btn" data-session="' + esc(session.session_key) + '" data-conversation="' + esc(session.conversation_id || '') + '" data-bound-session="' + esc(session.mapped_work_session || '') + '" data-remote-did="' + esc(session.remote_did || '') + '" title="' + esc(session.binding_alert.message || 'Rebind this conversation to the current chat session') + '">Needs rebind</button>'
+              ? '<button type="button" class="badge alert rebind-badge-btn" data-session="' + esc(session.session_key) + '" data-conversation="' + esc(session.conversation_id || '') + '" data-bound-session="' + esc(session.mapped_work_session || '') + '" data-remote-did="' + esc(session.remote_did || '') + '" title="OpenClaw chat link needs attention">Needs reconnect</button>'
               : '',
           ].filter(Boolean).join('');
           return '<div class="session-row' + active + '" data-session="' + esc(session.session_key) + '">' +
-            '<div class="top"><strong>' + esc(session.remote_did || session.conversation_id || 'unknown') + '</strong><div style="display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end">' + badges + '</div></div>' +
-            '<div class="muted small" style="margin-top:6px">conversation=' + esc(session.conversation_id || '(none)') + '</div>' +
+            '<div class="top"><strong>' + esc(session.remote_did || session.session_key || 'unknown') + '</strong><div style="display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end">' + badges + '</div></div>' +
             '<div class="muted small">unread=' + esc(session.unread_count) + ' \xB7 last=' + esc(fmtTs(session.last_remote_activity_at || session.updated_at)) + '</div>' +
-            '<div class="muted small">work_session=' + esc(session.mapped_work_session || '(unbound)') + (session.is_active_work_session ? ' \xB7 active_chat=true' : '') + '</div>' +
+            (state.detailMode === 'advanced'
+              ? '<div class="muted small" style="margin-top:6px">conversation=' + esc(session.conversation_id || '(none)') + '</div>' +
+                '<div class="muted small">work_session=' + esc(session.mapped_work_session || '(unbound)') + (session.is_active_work_session ? ' \xB7 active_chat=true' : '') + '</div>'
+              : '') +
             '<div class="muted small" style="margin-top:6px">' + esc(session.last_message_preview || '(no preview)') + '</div>' +
           '</div>';
         }).join('');
@@ -678,25 +790,47 @@ conversation=' + result.conversation_id));
       const bindingAlert = detail.bindingAlert || null;
       const activeWorkSession = detail.activeWorkSession || null;
       const summary = detail.sessionSummary || null;
+      const isAdvanced = state.detailMode === 'advanced';
+      const sessionLink = buildSessionLink(session.session_key);
+      const summaryPills = [];
+      if (contact && contact.action) summaryPills.push('<span class="pill">contact=' + esc(contact.action) + '</span>');
+      if (task && task.action) summaryPills.push('<span class="pill">task=' + esc(task.action) + '</span>');
+      if (session.trust_state) summaryPills.push('<span class="pill">trust=' + esc(session.trust_state) + '</span>');
+      if (Number(session.unread_count || 0) > 0) summaryPills.push('<span class="pill">unread=' + esc(session.unread_count) + '</span>');
+      if (binding && binding.session_key) summaryPills.push('<span class="pill">chat link attached</span>');
+      else if (activeWorkSession) summaryPills.push('<span class="pill">current OpenClaw chat available</span>');
+      const policyBlock = isAdvanced
+        ? '<pre style="margin-top:8px">[Contact]\\naction=' + esc(contact.action) + '\\nsource=' + esc(contact.source) + (contact.matched_rule ? '\\nmatched_rule=' + esc(contact.matched_rule) : '') + '\\n' + esc(contact.explanation) + '\\n\\n[Task]\\naction=' + esc(task.action) + '\\nsource=' + esc(task.source) + (task.matched_rule ? '\\nmatched_rule=' + esc(task.matched_rule) : '') + '\\n' + esc(task.explanation) + '</pre>'
+        : '<div class="summary-pills" style="margin-top:8px">' + summaryPills.join('') + '</div>' +
+          '<div class="muted small" style="margin-top:10px">' + esc(contact.explanation || '(no contact explanation)') + '</div>' +
+          '<div class="muted small" style="margin-top:6px">' + esc(task.explanation || '(no task explanation)') + '</div>';
 
       el.innerHTML = '' +
         '<div class="two-col">' +
           '<div>' +
             '<div class="label">Session</div>' +
             '<div style="margin-top:8px"><strong>' + esc(session.remote_did || '(unknown)') + '</strong></div>' +
-            '<div class="muted small">session=' + esc(session.session_key) + '</div>' +
-            '<div class="muted small">conversation=' + esc(session.conversation_id || '(none)') + '</div>' +
             '<div class="muted small">trust=' + esc(session.trust_state) + ' \xB7 unread=' + esc(session.unread_count) + '</div>' +
             '<div class="muted small">last activity=' + esc(fmtTs(session.last_remote_activity_at || session.updated_at)) + '</div>' +
-            '<div class="muted small" style="margin-top:8px">active_chat_session=' + esc(activeWorkSession || '(none)') + '</div>' +
-            '<div class="muted small">binding=' + esc(binding ? binding.session_key : '(unbound)') + '</div>' +
+            (isAdvanced
+              ? '<div style="margin-top:8px">' +
+                  '<div class="muted small">session=' + esc(session.session_key) + '</div>' +
+                  '<div class="muted small">conversation=' + esc(session.conversation_id || '(none)') + '</div>' +
+                  '<div class="muted small">active_chat_session=' + esc(activeWorkSession || '(none)') + '</div>' +
+                  '<div class="muted small">binding=' + esc(binding ? binding.session_key : '(unbound)') + '</div>' +
+                '</div>'
+              : '') +
             (openRecommendation
               ? '<div class="muted small" style="margin-top:8px">trust_action=' + esc(recommendationActionLabel(openRecommendation)) + '</div>'
               : (reopenRecommendation ? '<div class="muted small" style="margin-top:8px">trust_action=' + esc(recommendationActionLabel(reopenRecommendation)) + '</div>' : '')) +
+            (summaryPills.length ? '<div class="summary-pills">' + summaryPills.join('') + '</div>' : '') +
             (bindingAlert
-              ? '<div style="margin-top:10px;padding:10px 12px;border:1px solid #ef4444;border-radius:10px;background:rgba(127,29,29,0.25);color:#fecaca"><strong>Needs rebind</strong><div class="small" style="margin-top:6px">' + esc(bindingAlert.message || 'Bound work session is missing. Rebind this PingAgent conversation to the current chat session.') + '</div></div>'
+              ? '<div style="margin-top:10px;padding:10px 12px;border:1px solid #ef4444;border-radius:10px;background:rgba(127,29,29,0.25);color:#fecaca"><strong>Needs reconnect</strong><div class="small" style="margin-top:6px">' + esc(isAdvanced ? (bindingAlert.message || 'Bound work session is missing. Rebind this PingAgent conversation to the current chat session.') : 'OpenClaw chat link is stale. Attach this PingAgent session to the current OpenClaw chat.') + '</div></div>'
               : '') +
             '<div class="row-actions">' +
+              (session.trust_state === 'pending'
+                ? '<button class="action-btn approve-session-btn" data-session="' + esc(session.session_key) + '">Approve Contact</button>'
+                : '') +
               (openRecommendation
                 ? '<button class="action-btn apply-session-recommendation-btn" data-session="' + esc(session.session_key) + '">' + esc(recommendationActionLabel(openRecommendation)) + '</button>'
                 : '') +
@@ -706,13 +840,24 @@ conversation=' + result.conversation_id));
               (!openRecommendation && reopenRecommendation
                 ? '<button class="secondary-btn reopen-session-recommendation-btn" data-session="' + esc(session.session_key) + '">Reopen</button>'
                 : '') +
-              '<button class="action-btn bind-current-btn" data-conversation="' + esc(session.conversation_id || '') + '">Bind Current Chat</button>' +
-              '<button class="danger-btn clear-binding-btn" data-conversation="' + esc(session.conversation_id || '') + '">Clear Binding</button>' +
+              '<button class="action-btn bind-current-btn" data-conversation="' + esc(session.conversation_id || '') + '">Attach to Current Chat</button>' +
+              '<button class="secondary-btn mark-read-btn" data-session="' + esc(session.session_key) + '">Mark read</button>' +
+              '<button class="secondary-btn copy-session-link-btn" data-session="' + esc(session.session_key) + '">Copy Session Link</button>' +
+              '<button class="danger-btn clear-binding-btn" data-conversation="' + esc(session.conversation_id || '') + '">Detach Chat Link</button>' +
+            '</div>' +
+            '<div class="form-grid" style="margin-top:16px">' +
+              '<label class="label">Reply in this session</label>' +
+              '<textarea id="sessionReplyInput" placeholder="Send a text reply in this session"></textarea>' +
+              '<div class="row-actions"><button class="action-btn" id="sendSessionReplyBtn">Send Reply</button></div>' +
             '</div>' +
           '</div>' +
           '<div>' +
             '<div class="label">Policy Decisions</div>' +
-            '<pre style="margin-top:8px">[Contact]\\naction=' + esc(contact.action) + '\\nsource=' + esc(contact.source) + (contact.matched_rule ? '\\nmatched_rule=' + esc(contact.matched_rule) : '') + '\\n' + esc(contact.explanation) + '\\n\\n[Task]\\naction=' + esc(task.action) + '\\nsource=' + esc(task.source) + (task.matched_rule ? '\\nmatched_rule=' + esc(task.matched_rule) : '') + '\\n' + esc(task.explanation) + '</pre>' +
+            policyBlock +
+            (isAdvanced && recommendations.length
+              ? '<pre style="margin-top:12px">recommendations_debug=' + esc(JSON.stringify(recommendations.map(function (item) { return { id: item.id, status: item.status, policy: item.policy, action: item.action, current_action: item.current_action, match: item.match, confidence: item.confidence }; }), null, 2)) + '</pre>'
+              : '') +
+            (isAdvanced ? '<div class="muted small" style="margin-top:10px">permalink=' + esc(sessionLink) + '</div>' : '') +
           '</div>' +
         '</div>' +
         '<div class="grid two-col" style="margin-top:16px">' +
@@ -730,9 +875,7 @@ conversation=' + result.conversation_id));
               '<textarea id="sessionSummaryOpenQuestions" placeholder="Open questions">' + esc(summary && summary.open_questions ? summary.open_questions : '') + '</textarea>' +
               '<textarea id="sessionSummaryNextAction" placeholder="Next action">' + esc(summary && summary.next_action ? summary.next_action : '') + '</textarea>' +
               '<textarea id="sessionSummaryHandoff" placeholder="Handoff-ready summary">' + esc(summary && summary.handoff_ready_text ? summary.handoff_ready_text : '') + '</textarea>' +
-              '<div class="row-actions">' +
-                '<button class="action-btn" id="saveSessionSummaryBtn">Save Summary</button>' +
-              '</div>' +
+              '<div class="row-actions"><button class="action-btn" id="saveSessionSummaryBtn">Save Summary</button></div>' +
             '</div>' +
           '</div>' +
         '</div>' +
@@ -759,8 +902,8 @@ conversation=' + result.conversation_id));
                 ? '<button class="secondary-btn reopen-session-recommendation-btn" data-session="' + esc(session.session_key) + '">Reopen</button>'
                 : '';
               return '<div class="recommendation-row"><div class="top"><strong>' + esc(item.policy) + '</strong><span class="badge">' + esc(item.status + ' \xB7 ' + item.action) + '</span></div>' +
-                '<div class="muted small">current=' + esc(item.current_action) + ' \xB7 confidence=' + esc(item.confidence) + '</div>' +
-                '<div class="muted small">match=' + esc(item.match) + '</div>' +
+                (isAdvanced ? '<div class="muted small">current=' + esc(item.current_action) + ' \xB7 confidence=' + esc(item.confidence) + '</div>' : '') +
+                (isAdvanced ? '<div class="muted small">match=' + esc(item.match) + '</div>' : '') +
                 '<div style="margin-top:8px">' + esc(item.reason) + '</div>' +
                 '<div class="row-actions">' + actionButton + dismissButton + reopenButton + '</div>' +
               '</div>';
@@ -770,10 +913,10 @@ conversation=' + result.conversation_id));
         '<div class="grid two-col" style="margin-top:16px">' +
           '<div><div class="label">Recent Messages</div><div class="message-list" style="margin-top:8px">' +
             (messages.length ? messages.map(function (msg) {
-              const summary = msg.schema === 'pingagent.text@1' && msg.payload && msg.payload.text
+              const messageSummary = msg.schema === 'pingagent.text@1' && msg.payload && msg.payload.text
                 ? msg.payload.text
                 : JSON.stringify(msg.payload || {});
-              return '<div class="message-row"><div class="muted small">' + esc(fmtTs(msg.ts_ms)) + ' \xB7 ' + esc(msg.direction) + ' \xB7 ' + esc(msg.schema) + '</div><div style="margin-top:8px">' + esc(summary) + '</div></div>';
+              return '<div class="message-row"><div class="muted small">' + esc(fmtTs(msg.ts_ms)) + ' \xB7 ' + esc(msg.direction) + ' \xB7 ' + esc(msg.schema) + '</div><div style="margin-top:8px">' + esc(messageSummary) + '</div></div>';
             }).join('') : '<div class="empty">No local message history yet.</div>') +
           '</div></div>' +
           '<div><div class="label">Policy Audit</div><div class="audit-list" style="margin-top:8px">' +
@@ -786,6 +929,24 @@ conversation=' + result.conversation_id));
           '</div></div>' +
         '</div>';
 
+      el.querySelectorAll('.approve-session-btn').forEach(function (btn) {
+        btn.addEventListener('click', async function () {
+          const sessionKey = btn.getAttribute('data-session');
+          const result = await api('/api/runtime/session/approve', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ session_key: sessionKey }),
+          });
+          await refreshAll();
+          const promoted = result && result.dm_conversation_id
+            ? getOverviewSessions().find(function (item) { return item.conversation_id === result.dm_conversation_id; })
+            : null;
+          state.selectedSessionKey = promoted ? promoted.session_key : sessionKey;
+          renderOverview();
+          if (state.selectedSessionKey) await loadSession(state.selectedSessionKey);
+          setTab('runtime');
+        });
+      });
       el.querySelectorAll('.bind-current-btn').forEach(function (btn) {
         btn.addEventListener('click', async function () {
           const conversationId = btn.getAttribute('data-conversation');
@@ -793,6 +954,22 @@ conversation=' + result.conversation_id));
           await promptBindCurrentChat(conversationId);
         });
       });
+      el.querySelectorAll('.mark-read-btn').forEach(function (btn) {
+        btn.addEventListener('click', async function () {
+          await api('/api/runtime/session/mark-read', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ session_key: btn.getAttribute('data-session') }),
+          });
+          await refreshAll();
+          setTab('runtime');
+        });
+      });
+      el.querySelectorAll('.copy-session-link-btn').forEach(function (btn) {
+        btn.addEventListener('click', async function () {
+          await copyText(buildSessionLink(btn.getAttribute('data-session')), 'Session link');
+        });
+      });
       el.querySelectorAll('.clear-binding-btn').forEach(function (btn) {
         btn.addEventListener('click', async function () {
           await api('/api/runtime/session-bindings/clear', {
@@ -837,23 +1014,42 @@ conversation=' + result.conversation_id));
           setTab('runtime');
         });
       });
+      const sendSessionReplyBtn = document.getElementById('sendSessionReplyBtn');
+      if (sendSessionReplyBtn) {
+        sendSessionReplyBtn.addEventListener('click', async function () {
+          const input = document.getElementById('sessionReplyInput');
+          const message = input.value.trim();
+          if (!message) {
+            window.alert('Reply text is required.');
+            return;
+          }
+          await api('/api/runtime/session/reply', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ session_key: session.session_key, message: message }),
+          });
+          input.value = '';
+          await refreshAll();
+          setTab('runtime');
+        });
+      }
       const saveSessionSummaryBtn = document.getElementById('saveSessionSummaryBtn');
       if (saveSessionSummaryBtn) {
         saveSessionSummaryBtn.addEventListener('click', async function () {
           await api('/api/runtime/session-summary', {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
-              body: JSON.stringify({
-                session_key: session.session_key,
-                objective: document.getElementById('sessionSummaryObjective').value.trim(),
-                context: document.getElementById('sessionSummaryContext').value.trim(),
-                constraints: document.getElementById('sessionSummaryConstraints').value.trim(),
-                decisions: document.getElementById('sessionSummaryDecisions').value.trim(),
-                open_questions: document.getElementById('sessionSummaryOpenQuestions').value.trim(),
-                next_action: document.getElementById('sessionSummaryNextAction').value.trim(),
-                handoff_ready_text: document.getElementById('sessionSummaryHandoff').value.trim(),
-              }),
-            });
+            body: JSON.stringify({
+              session_key: session.session_key,
+              objective: document.getElementById('sessionSummaryObjective').value.trim(),
+              context: document.getElementById('sessionSummaryContext').value.trim(),
+              constraints: document.getElementById('sessionSummaryConstraints').value.trim(),
+              decisions: document.getElementById('sessionSummaryDecisions').value.trim(),
+              open_questions: document.getElementById('sessionSummaryOpenQuestions').value.trim(),
+              next_action: document.getElementById('sessionSummaryNextAction').value.trim(),
+              handoff_ready_text: document.getElementById('sessionSummaryHandoff').value.trim(),
+            }),
+          });
           await refreshAll();
           setTab('runtime');
         });
@@ -867,7 +1063,7 @@ conversation=' + result.conversation_id));
       const previous = previousBinding || (state.session && state.session.binding ? state.session.binding.session_key : null) || '(unbound)';
       const targetRemoteDid = remoteDid || (state.session && state.session.session ? state.session.session.remote_did : null) || '(unknown)';
       const confirmed = window.confirm(
-        'Rebind this PingAgent conversation to the current chat session?' +
+        'Attach this PingAgent session to the current OpenClaw chat?' +
         '
 
 Conversation: ' + conversationId +
@@ -875,9 +1071,9 @@ Conversation: ' + conversationId +
 Remote DID: ' + targetRemoteDid +
         '
 
-Current chat: ' + (current || '(none)') +
+Current OpenClaw chat: ' + (current || '(none)') +
         '
-Previous binding: ' + previous
+Previous chat link: ' + previous
       );
       if (!confirmed) return;
       await api('/api/runtime/session-bindings/bind-current', {
@@ -1061,14 +1257,15 @@ Previous binding: ' + previous
 
     async function loadOverview() {
       state.overview = await api('/api/runtime/overview');
+      syncSelectedSessionFromOverview();
       renderHeader();
       renderOverview();
-      const sessions = state.overview && Array.isArray(state.overview.sessions) ? state.overview.sessions : [];
-      if (!state.selectedSessionKey && sessions.length) {
-        state.selectedSessionKey = sessions[0].session_key;
-      }
       if (state.selectedSessionKey) {
         await loadSession(state.selectedSessionKey);
+      } else {
+        state.session = null;
+        renderSession();
+        syncUrlState();
       }
     }
 
@@ -1076,6 +1273,7 @@ Previous binding: ' + previous
       if (!sessionKey) return;
       state.selectedSessionKey = sessionKey;
       state.session = await api('/api/runtime/session?session_key=' + encodeURIComponent(sessionKey));
+      syncUrlState();
       renderSession();
     }
 
@@ -1096,6 +1294,30 @@ Previous binding: ' + previous
 
     document.getElementById('navRuntime').addEventListener('click', function () { setTab('runtime'); });
     document.getElementById('navPolicy').addEventListener('click', function () { setTab('policy'); });
+    document.getElementById('toggleUnreadBtn').addEventListener('click', async function () {
+      state.showUnreadOnly = !state.showUnreadOnly;
+      syncSelectedSessionFromOverview();
+      renderOverview();
+      if (state.selectedSessionKey) await loadSession(state.selectedSessionKey);
+      else {
+        syncUrlState();
+        renderSession();
+      }
+    });
+    document.getElementById('nextUnreadBtn').addEventListener('click', async function () {
+      const unreadSessions = getOverviewSessions().filter(function (session) { return Number(session.unread_count || 0) > 0; });
+      if (!unreadSessions.length) {
+        window.alert('No unread sessions.');
+        return;
+      }
+      const currentIndex = unreadSessions.findIndex(function (session) { return session.session_key === state.selectedSessionKey; });
+      const next = unreadSessions[(currentIndex + 1 + unreadSessions.length) % unreadSessions.length];
+      state.selectedSessionKey = next.session_key;
+      renderOverview();
+      await loadSession(state.selectedSessionKey);
+    });
+    document.getElementById('detailModeBasicBtn').addEventListener('click', function () { setDetailMode('basic'); });
+    document.getElementById('detailModeAdvancedBtn').addEventListener('click', function () { setDetailMode('advanced'); });
     document.getElementById('rulePolicy').addEventListener('change', updateRuleActionOptions);
     document.getElementById('saveDefaultsBtn').addEventListener('click', async function () {
       await api('/api/runtime/policy/defaults', {
@@ -1178,9 +1400,12 @@ Previous binding: ' + previous
     });
 
     async function init() {
+      setTab(state.currentTab);
+      setDetailMode(state.detailMode);
       await loadProfiles();
       updateRuleActionOptions();
       await refreshAll();
+      syncUrlState();
     }
 
     init().catch(function (error) {
@@ -1679,6 +1904,18 @@ async function buildSessionOverviewPayload(ctx, sessionKey) {
     }))
   };
 }
+function resolveSessionForInput(sessionManager, input) {
+  if (!sessionManager) return null;
+  const sessionKey = String(input.session_key ?? "").trim();
+  const conversationId = String(input.conversation_id ?? "").trim();
+  const remoteDid = String(input.remote_did ?? "").trim();
+  let session = sessionKey ? sessionManager.get(sessionKey) : null;
+  if (!session && conversationId) session = sessionManager.getByConversationId(conversationId);
+  if (!session && remoteDid) {
+    session = sessionManager.listRecentSessions(100).find((item) => item.remote_did === remoteDid) ?? null;
+  }
+  return session ?? sessionManager.getActiveSession() ?? sessionManager.listRecentSessions(1)[0] ?? null;
+}
 async function handleApi(pathname, req, ctx) {
   const client = ctx.client;
   const contactManager = ctx.contactManager;
@@ -1780,6 +2017,48 @@ async function handleApi(pathname, req, ctx) {
       };
     }
     if (parts[1] === "session") {
+      const sessionManager = ctx.client.getSessionManager();
+      if (!sessionManager) throw new Error("Session actions require a writable local store");
+      if (parts[2] === "reply" && req.method === "POST") {
+        const body = await readBody(req);
+        const session = resolveSessionForInput(sessionManager, body);
+        if (!session?.conversation_id) throw new Error("No session selected");
+        const text = String(body?.message ?? "").trim();
+        if (!text) throw new Error("Missing message");
+        const sendRes = await client.sendMessage(session.conversation_id, SCHEMA_TEXT, { text });
+        if (!sendRes.ok) throw new Error(sendRes.error?.message ?? "Failed to send");
+        sessionManager.focusSession(session.session_key);
+        return {
+          ok: true,
+          session: sessionManager.get(session.session_key),
+          message_id: sendRes.data?.message_id ?? null
+        };
+      }
+      if (parts[2] === "approve" && req.method === "POST") {
+        const body = await readBody(req);
+        const session = resolveSessionForInput(sessionManager, body);
+        if (!session?.conversation_id) throw new Error("No session selected");
+        const approveRes = await client.approveContact(session.conversation_id);
+        if (!approveRes.ok) throw new Error(approveRes.error?.message ?? "Failed to approve contact");
+        sessionManager.focusSession(session.session_key);
+        return {
+          ok: true,
+          session: sessionManager.get(session.session_key),
+          trusted: approveRes.data?.trusted ?? true,
+          dm_conversation_id: approveRes.data?.dm_conversation_id ?? session.conversation_id
+        };
+      }
+      if (parts[2] === "mark-read" && req.method === "POST") {
+        const body = await readBody(req);
+        const session = resolveSessionForInput(sessionManager, body);
+        if (!session?.session_key) throw new Error("No session selected");
+        const updated = sessionManager.markRead(session.session_key);
+        if (!updated) throw new Error("Failed to mark session as read");
+        return {
+          ok: true,
+          session: updated
+        };
+      }
       const url = new URL(req.url || "", "http://x");
       const sessionKey = url.searchParams.get("session_key");
       return buildSessionOverviewPayload(ctx, sessionKey);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingagent/sdk",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -35,7 +35,7 @@
     "uuid": "^11.0.0",
     "ws": "^8.0.0",
     "@pingagent/protocol": "0.1.1",
-    "@pingagent/schemas": "0.1.2",
+    "@pingagent/schemas": "0.1.3",
     "@pingagent/a2a": "0.1.1"
   },
   "devDependencies": {