comisai 1.0.24 → 1.0.25

package/node_modules/@comis/web/dist/assets/{session-detail-SGEYNJ0M.js → session-detail-BpZ_8Yih.js}

@@ -1,296 +1,4 @@
-import{a as u,I as p,b as o,A as v,s as h,f as g,i as f,n as b,r as n,t as x}from"./index-CEcM1R_C.js";import{p as _,f as y,c as $}from"./session-key-parser-DPORMVyU.js";import{c as w}from"./ic-tool-call-7MaXSsCW.js";import"./ic-breadcrumb-CUMpp3BL.js";import"./ic-tag-CPPUnDLF.js";import"./ic-relative-time-3FqpjeAI.js";import"./ic-budget-segment-bar-BtJ6x5mN.js";import"./ic-layer-waterfall-COvEYMg5.js";import"./ic-chat-message-CFyDJd0z.js";import"./ic-confirm-dialog-CCDbB04e.js";import"./ic-empty-state-60l2ePhd.js";import"./ic-icon-xeGTVhVG.js";import"./directive-DoeGSK_T.js";var C=Object.defineProperty,S=Object.getOwnPropertyDescriptor,i=(t,e,r,s)=>{for(var c=s>1?void 0:s?S(e,r):e,l=t.length-1,m;l>=0;l--)(m=t[l])&&(c=(s?m(e,r,c):m(c))||c);return s&&c&&C(e,r,c),c};function d(t){if(t>=1e3){const e=t/1e3;return e>=100?`${Math.round(e)}K`:`${e.toFixed(1)}K`}return String(t)}function k(t){return new Intl.NumberFormat("en-US",{style:"currency",currency:"USD"}).format(t)}let a=class extends u{constructor(){super(...arguments),this.apiClient=null,this.rpcClient=null,this.sessionKey="",this._session=null,this._messages=[],this._loading=!1,this._error="",this._showConfirm=!1,this._confirmAction="",this._activeTab="conversation",this._contextLoaded=!1,this._metricsLoaded=!1,this._pipelineSnapshots=[],this._dagCompactions=[],this._selectedSnapshot=null,this._sessionBilling=null}connectedCallback(){super.connectedCallback()}updated(t){(t.has("apiClient")||t.has("sessionKey"))&&this.apiClient&&this.sessionKey&&this._loadSession()}async _loadSession(){if(!(!this.apiClient||!this.sessionKey)){this._loading=!0,this._error="";try{const t=await this.apiClient.getSessionDetail(this.sessionKey);this._session=t.session,this._messages=t.messages}catch{this._error="Failed to load session. Please try again."}finally{this._loading=!1}}}_switchTab(t){this._activeTab=t,t==="context"&&!this._contextLoaded&&this._loadContextData(),t==="metrics"&&!this._metricsLoaded&&this._loadMetricsData()}async _loadContextData(){if(!(!this.rpcClient||!this._session))try{const t=this._session.agentId,[e,r]=await Promise.all([this.rpcClient.call("obs.context.pipeline",{agentId:t,limit:100}),this.rpcClient.call("obs.context.dag",{agentId:t,limit:50})]),s=Array.isArray(e)?e:[];this._pipelineSnapshots=s.filter(l=>l.sessionKey===this.sessionKey);const c=Array.isArray(r)?r:[];this._dagCompactions=c.filter(l=>l.sessionKey===this.sessionKey),this._pipelineSnapshots.length>0&&(this._selectedSnapshot=this._pipelineSnapshots[0]),this._contextLoaded=!0}catch{this._contextLoaded=!0}}async _loadMetricsData(){if(!this.rpcClient){this._metricsLoaded=!0;return}try{const t=await this.rpcClient.call("obs.billing.bySession",{sessionKey:this.sessionKey});this._sessionBilling=t??null}catch{this._sessionBilling=null}this._metricsLoaded=!0}_handleBreadcrumbNavigate(t){window.location.hash=`#/${t.detail}`}_showActionConfirm(t){this._confirmAction=t,this._showConfirm=!0}_handleConfirmCancel(){this._showConfirm=!1,this._confirmAction=""}async _handleConfirm(){if(this._showConfirm=!1,!!this.apiClient){try{this._confirmAction==="reset"?(await this.apiClient.resetSession(this.sessionKey),p.show("Session reset","success"),await this._loadSession()):this._confirmAction==="compact"?(await this.apiClient.compactSession(this.sessionKey),p.show("Session compacted","success"),await this._loadSession()):this._confirmAction==="delete"&&(await this.apiClient.deleteSession(this.sessionKey),p.show("Session deleted","success"),window.location.hash="#/sessions")}catch{p.show("Operation failed. Please try again.","error")}this._confirmAction=""}}async _handleExport(){if(this.apiClient)try{const t=await this.apiClient.exportSession(this.sessionKey),e=new Blob([t],{type:"application/jsonl"}),r=URL.createObjectURL(e),s=document.createElement("a");s.href=r,s.download=`session-${this.sessionKey}.jsonl`,s.click(),URL.revokeObjectURL(r),p.show("Session exported","success")}catch{p.show("Export failed. Please try again.","error")}}_truncateKey(t){return t.length>20?t.slice(0,16)+"...":t}_getBreadcrumbLabel(){const t=_(this.sessionKey);return t?y(t):this._truncateKey(this.sessionKey)}_isCompactionBoundary(t){if(t.role!=="system")return!1;const e=t.content.toLowerCase();return e.includes("compacted")||e.includes("summary")||e.includes("[compacted]")}_getConfirmProps(){switch(this._confirmAction){case"delete":return{title:"Delete Session",message:"Are you sure you want to delete this session? This action cannot be undone.",variant:"danger",label:"Delete"};case"compact":return{title:"Compact Session",message:"Are you sure you want to compact this session? Older messages will be summarized.",variant:"default",label:"Compact"};default:return{title:"Reset Session",message:"Are you sure you want to reset this session? All conversation history will be cleared.",variant:"default",label:"Reset"}}}_renderConversation(){return o`
-      <div class="conversation">
-        ${this._messages.map(t=>{if(this._isCompactionBoundary(t))return o`
-              <div class="compaction-marker" data-testid="compaction-marker">
-                <hr />
-                <span>Context was compacted here</span>
-                <hr />
-              </div>
-            `;if(t.role==="tool"){let e=t.content;try{e=JSON.parse(t.content)}catch{}return o`
-              <ic-tool-call
-                .toolName=${t.toolName??"tool"}
-                .output=${e}
-                .status=${"success"}
-                .expanded=${!1}
-              ></ic-tool-call>
-            `}return o`
-            <ic-chat-message
-              .role=${t.role}
-              .content=${w(t.content,t.role)}
-              .timestamp=${t.timestamp}
-              .showActions=${!1}
-            ></ic-chat-message>
-          `})}
-      </div>
-    `}_renderContextState(){if(!this._contextLoaded)return o`<div class="loading-container"><ic-loading size="md"></ic-loading></div>`;if(this._pipelineSnapshots.length===0)return o`<ic-empty-state
-        icon="activity"
-        message="No pipeline data for this session"
-      ></ic-empty-state>`;const t=this._pipelineSnapshots[0],e=Math.max(0,t.tokensLoaded-t.tokensEvicted),r=[{label:"System",tokens:e,color:"var(--ic-accent)"},{label:"Evicted",tokens:t.tokensEvicted,color:"var(--ic-error)"},{label:"Masked",tokens:t.tokensMasked,color:"var(--ic-warning)"},{label:"Available",tokens:Math.max(0,Math.round((1-t.budgetUtilization)*(e+t.tokensEvicted+t.tokensMasked))),color:"var(--ic-surface-2, #1f2937)"}].filter(s=>s.tokens>0);return o`
-      <!-- Latest snapshot summary -->
-      <div class="context-summary">
-        <div class="context-badge">
-          Budget <span class="badge-value">${Math.round(t.budgetUtilization*100)}%</span>
-        </div>
-        <span class="cache-badge ${t.cacheHitTokens>0?"cache-badge--hit":"cache-badge--miss"}">
-          ${t.cacheHitTokens>0?"Cache HIT":"Cache MISS"}
-        </span>
-        <div class="context-badge">
-          Loaded <span class="badge-value">${d(t.tokensLoaded)}</span>
-        </div>
-        <div class="context-badge">
-          Evicted <span class="badge-value">${d(t.tokensEvicted)}</span>
-        </div>
-        <div class="context-badge">
-          Duration <span class="badge-value">${t.durationMs}ms</span>
-        </div>
-      </div>
-
-      <!-- Budget segment bar -->
-      <div class="budget-section">
-        <div class="budget-section-title">Token Budget</div>
-        <ic-budget-segment-bar .segments=${r}></ic-budget-segment-bar>
-      </div>
-
-      <!-- Execution list -->
-      <div class="budget-section-title">Pipeline Executions</div>
-      <div class="execution-list">
-        ${this._pipelineSnapshots.map(s=>o`
-            <button
-              class="execution-row ${this._selectedSnapshot===s?"selected":""}"
-              @click=${()=>{this._selectedSnapshot=s}}
-            >
-              <span class="exec-time">${new Date(s.timestamp).toLocaleTimeString(void 0,{hour:"2-digit",minute:"2-digit",second:"2-digit"})}</span>
-              <span class="exec-duration">${s.durationMs}ms</span>
-              <span class="cache-badge ${s.cacheHitTokens>0?"cache-badge--hit":"cache-badge--miss"}">
-                ${s.cacheHitTokens>0?"HIT":"MISS"}
-              </span>
-              <span class="exec-tokens">${d(s.tokensLoaded)} loaded</span>
-            </button>
-          `)}
-      </div>
-
-      <!-- Waterfall for selected snapshot -->
-      ${this._selectedSnapshot&&this._selectedSnapshot.layers.length>0?o`
-            <div class="waterfall-card">
-              <ic-layer-waterfall
-                .layers=${this._selectedSnapshot.layers.map(s=>({name:s.name,durationMs:s.durationMs,messagesIn:s.messagesIn,messagesOut:s.messagesOut}))}
-                .totalDurationMs=${this._selectedSnapshot.durationMs}
-              ></ic-layer-waterfall>
-            </div>
-          `:v}
-    `}_renderMetrics(){if(!this._session)return v;const t=this._session,e=$(t.lastActiveAt);return o`
-      <!-- Cost & Usage -->
-      <div class="metrics-section-title">Cost & Usage</div>
-      <div class="metrics-grid">
-        <ic-stat-card
-          label="Total Cost"
-          value=${this._sessionBilling?k(this._sessionBilling.totalCost):"--"}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Total Tokens"
-          value=${d(t.totalTokens)}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Input Tokens"
-          value=${d(t.inputTokens)}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Output Tokens"
-          value=${d(t.outputTokens)}
-        ></ic-stat-card>
-      </div>
-
-      <!-- Activity -->
-      <div class="metrics-section-title">Activity</div>
-      <div class="metrics-grid">
-        <ic-stat-card
-          label="Tool Calls"
-          value=${String(t.toolCalls)}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Compactions"
-          value=${String(t.compactions)}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Resets"
-          value=${String(t.resetCount)}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="API Calls"
-          value=${this._sessionBilling?String(this._sessionBilling.callCount):"--"}
-        ></ic-stat-card>
-      </div>
-
-      <!-- Session Health -->
-      <div class="metrics-section-title">Session Health</div>
-      <div class="metrics-grid">
-        <ic-stat-card
-          label="Created"
-          value=${new Date(t.createdAt).toLocaleDateString()}
-        ></ic-stat-card>
-        <ic-stat-card
-          label="Last Active"
-          value=${new Date(t.lastActiveAt).toLocaleString()}
-        ></ic-stat-card>
-        <ic-stat-card label="Status" .value=${""}>
-        </ic-stat-card>
-      </div>
-      <div style="margin-top: calc(-1 * var(--ic-space-md));">
-        <span class="status-badge status-badge--${e}" data-testid="session-status">${e}</span>
-      </div>
-    `}render(){const t=[{label:"Sessions",route:"sessions"},{label:this._getBreadcrumbLabel()}];if(this._loading)return o`
-        <div class="breadcrumb-area">
-          <ic-breadcrumb
-            .items=${t}
-            @navigate=${this._handleBreadcrumbNavigate}
-          ></ic-breadcrumb>
-        </div>
-        <ic-skeleton-view variant="detail"></ic-skeleton-view>
-      `;if(this._error)return o`
-        <div class="breadcrumb-area">
-          <ic-breadcrumb
-            .items=${t}
-            @navigate=${this._handleBreadcrumbNavigate}
-          ></ic-breadcrumb>
-        </div>
-        <div class="error-container">
-          <div class="error-message">${this._error}</div>
-          <button class="retry-btn" @click=${()=>this._loadSession()}>
-            Retry
-          </button>
-        </div>
-      `;if(!this._session)return o`
-        <div class="breadcrumb-area">
-          <ic-breadcrumb
-            .items=${t}
-            @navigate=${this._handleBreadcrumbNavigate}
-          ></ic-breadcrumb>
-        </div>
-        <div class="error-container">
-          <div class="error-message">Session not found</div>
-        </div>
-      `;const e=this._session,r=this._getConfirmProps();return o`
-      <div class="breadcrumb-area">
-        <ic-breadcrumb
-          .items=${t}
-          @navigate=${this._handleBreadcrumbNavigate}
-        ></ic-breadcrumb>
-      </div>
-
-      <div class="session-info">
-        <div class="info-item">
-          <span class="info-label">Agent</span>
-          <span class="info-value">${e.agentId}</span>
-        </div>
-        <div class="info-item">
-          <span class="info-label">Channel</span>
-          <span class="info-value"
-            ><ic-tag variant=${e.channelType}
-              >${e.channelType}</ic-tag
-            ></span
-          >
-        </div>
-        <div class="info-item">
-          <span class="info-label">Messages</span>
-          <span class="info-value">${e.messageCount}</span>
-        </div>
-        <div class="info-item">
-          <span class="info-label">Tokens</span>
-          <span class="info-value">${d(e.totalTokens)}</span>
-        </div>
-        <div class="info-item">
-          <span class="info-label">Created</span>
-          <span class="info-value"
-            >${new Date(e.createdAt).toLocaleDateString()}</span
-          >
-        </div>
-        ${e.label?o`
-              <div class="info-item">
-                <span class="info-label">Label</span>
-                <span class="info-value">${e.label}</span>
-              </div>
-            `:v}
-      </div>
-
-      <div class="actions-bar">
-        <button
-          class="btn btn-ghost"
-          @click=${()=>this._showActionConfirm("reset")}
-        >
-          Reset
-        </button>
-        <button
-          class="btn btn-ghost"
-          @click=${()=>this._showActionConfirm("compact")}
-        >
-          Compact
-        </button>
-        <button class="btn btn-ghost" @click=${this._handleExport}>
-          Export JSONL
-        </button>
-        <button
-          class="btn btn-danger"
-          @click=${()=>this._showActionConfirm("delete")}
-        >
-          Delete
-        </button>
-      </div>
-
-      <!-- Tab bar -->
-      <div class="tab-bar" role="tablist">
-        <button
-          class="tab ${this._activeTab==="conversation"?"tab--active":""}"
-          role="tab"
-          aria-selected=${this._activeTab==="conversation"}
-          @click=${()=>this._switchTab("conversation")}
-        >
-          Conversation
-        </button>
-        <button
-          class="tab ${this._activeTab==="context"?"tab--active":""}"
-          role="tab"
-          aria-selected=${this._activeTab==="context"}
-          @click=${()=>this._switchTab("context")}
-        >
-          Context State
-        </button>
-        <button
-          class="tab ${this._activeTab==="metrics"?"tab--active":""}"
-          role="tab"
-          aria-selected=${this._activeTab==="metrics"}
-          @click=${()=>this._switchTab("metrics")}
-        >
-          Metrics
-        </button>
-      </div>
-
-      <!-- Tab content: use display:none to preserve scroll position -->
-      <div
-        class="tab-content ${this._activeTab==="conversation"?"tab-content--active":""}"
-      >
-        ${this._renderConversation()}
-      </div>
-      <div
-        class="tab-content ${this._activeTab==="context"?"tab-content--active":""}"
-      >
-        ${this._renderContextState()}
-      </div>
-      <div
-        class="tab-content ${this._activeTab==="metrics"?"tab-content--active":""}"
-      >
-        ${this._renderMetrics()}
-      </div>
-
-      <ic-confirm-dialog
-        ?open=${this._showConfirm}
-        title=${r.title}
-        message=${r.message}
-        variant=${r.variant}
-        confirmLabel=${r.label}
-        @confirm=${this._handleConfirm}
-        @cancel=${this._handleConfirmCancel}
-      ></ic-confirm-dialog>
-    `}};a.styles=[h,g,f`
+import{c as e,f as t,h as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./decorate-BvWYovGE.js";import{a as u}from"./index-FLPhHz8p.js";import"./ic-breadcrumb-DqN6G3gc.js";import"./ic-tag-CvMVQFRR.js";import"./ic-confirm-dialog-DGlPbV1T.js";import"./ic-relative-time-B3UAnTqg.js";import"./ic-empty-state-CM3Wbj2f.js";import{n as d,r as f,t as p}from"./session-key-parser-Dkqcj2Ss.js";import{t as m}from"./ic-tool-call-DMPHsLyx.js";import"./ic-chat-message-FdQcZsSQ.js";import"./ic-budget-segment-bar-zLsMzjDO.js";import"./ic-layer-waterfall-WkaFyu-l.js";function h(e){if(e>=1e3){let t=e/1e3;return t>=100?`${Math.round(t)}K`:`${t.toFixed(1)}K`}return String(e)}function g(e){return new Intl.NumberFormat(`en-US`,{style:`currency`,currency:`USD`}).format(e)}var _=class extends r{constructor(...e){super(...e),this.apiClient=null,this.rpcClient=null,this.sessionKey=``,this._session=null,this._messages=[],this._loading=!1,this._error=``,this._showConfirm=!1,this._confirmAction=``,this._activeTab=`conversation`,this._contextLoaded=!1,this._metricsLoaded=!1,this._pipelineSnapshots=[],this._dagCompactions=[],this._selectedSnapshot=null,this._sessionBilling=null}static{this.styles=[o,i,n`
       :host {
         display: block;
       }
@@ -629,4 +337,296 @@ import{a as u,I as p,b as o,A as v,s as h,f as g,i as f,n as b,r as n,t as x}fro
       .retry-btn:hover {
         background: var(--ic-accent-hover);
       }
-    `];i([b({attribute:!1})],a.prototype,"apiClient",2);i([b({attribute:!1})],a.prototype,"rpcClient",2);i([b()],a.prototype,"sessionKey",2);i([n()],a.prototype,"_session",2);i([n()],a.prototype,"_messages",2);i([n()],a.prototype,"_loading",2);i([n()],a.prototype,"_error",2);i([n()],a.prototype,"_showConfirm",2);i([n()],a.prototype,"_confirmAction",2);i([n()],a.prototype,"_activeTab",2);i([n()],a.prototype,"_contextLoaded",2);i([n()],a.prototype,"_metricsLoaded",2);i([n()],a.prototype,"_pipelineSnapshots",2);i([n()],a.prototype,"_dagCompactions",2);i([n()],a.prototype,"_selectedSnapshot",2);i([n()],a.prototype,"_sessionBilling",2);a=i([x("ic-session-detail")],a);export{a as IcSessionDetail};
+    `]}connectedCallback(){super.connectedCallback()}updated(e){(e.has(`apiClient`)||e.has(`sessionKey`))&&this.apiClient&&this.sessionKey&&this._loadSession()}async _loadSession(){if(!(!this.apiClient||!this.sessionKey)){this._loading=!0,this._error=``;try{let e=await this.apiClient.getSessionDetail(this.sessionKey);this._session=e.session,this._messages=e.messages}catch{this._error=`Failed to load session. Please try again.`}finally{this._loading=!1}}}_switchTab(e){this._activeTab=e,e===`context`&&!this._contextLoaded&&this._loadContextData(),e===`metrics`&&!this._metricsLoaded&&this._loadMetricsData()}async _loadContextData(){if(!(!this.rpcClient||!this._session))try{let e=this._session.agentId,[t,n]=await Promise.all([this.rpcClient.call(`obs.context.pipeline`,{agentId:e,limit:100}),this.rpcClient.call(`obs.context.dag`,{agentId:e,limit:50})]),r=Array.isArray(t)?t:[];this._pipelineSnapshots=r.filter(e=>e.sessionKey===this.sessionKey);let i=Array.isArray(n)?n:[];this._dagCompactions=i.filter(e=>e.sessionKey===this.sessionKey),this._pipelineSnapshots.length>0&&(this._selectedSnapshot=this._pipelineSnapshots[0]),this._contextLoaded=!0}catch{this._contextLoaded=!0}}async _loadMetricsData(){if(!this.rpcClient){this._metricsLoaded=!0;return}try{let e=await this.rpcClient.call(`obs.billing.bySession`,{sessionKey:this.sessionKey});this._sessionBilling=e??null}catch{this._sessionBilling=null}this._metricsLoaded=!0}_handleBreadcrumbNavigate(e){window.location.hash=`#/${e.detail}`}_showActionConfirm(e){this._confirmAction=e,this._showConfirm=!0}_handleConfirmCancel(){this._showConfirm=!1,this._confirmAction=``}async _handleConfirm(){if(this._showConfirm=!1,this.apiClient){try{this._confirmAction===`reset`?(await this.apiClient.resetSession(this.sessionKey),u.show(`Session reset`,`success`),await this._loadSession()):this._confirmAction===`compact`?(await this.apiClient.compactSession(this.sessionKey),u.show(`Session compacted`,`success`),await this._loadSession()):this._confirmAction===`delete`&&(await this.apiClient.deleteSession(this.sessionKey),u.show(`Session deleted`,`success`),window.location.hash=`#/sessions`)}catch{u.show(`Operation failed. Please try again.`,`error`)}this._confirmAction=``}}async _handleExport(){if(this.apiClient)try{let e=await this.apiClient.exportSession(this.sessionKey),t=new Blob([e],{type:`application/jsonl`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`session-${this.sessionKey}.jsonl`,r.click(),URL.revokeObjectURL(n),u.show(`Session exported`,`success`)}catch{u.show(`Export failed. Please try again.`,`error`)}}_truncateKey(e){return e.length>20?e.slice(0,16)+`...`:e}_getBreadcrumbLabel(){let e=f(this.sessionKey);return e?d(e):this._truncateKey(this.sessionKey)}_isCompactionBoundary(e){if(e.role!==`system`)return!1;let t=e.content.toLowerCase();return t.includes(`compacted`)||t.includes(`summary`)||t.includes(`[compacted]`)}_getConfirmProps(){switch(this._confirmAction){case`delete`:return{title:`Delete Session`,message:`Are you sure you want to delete this session? This action cannot be undone.`,variant:`danger`,label:`Delete`};case`compact`:return{title:`Compact Session`,message:`Are you sure you want to compact this session? Older messages will be summarized.`,variant:`default`,label:`Compact`};default:return{title:`Reset Session`,message:`Are you sure you want to reset this session? All conversation history will be cleared.`,variant:`default`,label:`Reset`}}}_renderConversation(){return t`
+      <div class="conversation">
+        ${this._messages.map(e=>{if(this._isCompactionBoundary(e))return t`
+              <div class="compaction-marker" data-testid="compaction-marker">
+                <hr />
+                <span>Context was compacted here</span>
+                <hr />
+              </div>
+            `;if(e.role===`tool`){let n=e.content;try{n=JSON.parse(e.content)}catch{}return t`
+              <ic-tool-call
+                .toolName=${e.toolName??`tool`}
+                .output=${n}
+                .status=${`success`}
+                .expanded=${!1}
+              ></ic-tool-call>
+            `}return t`
+            <ic-chat-message
+              .role=${e.role}
+              .content=${m(e.content,e.role)}
+              .timestamp=${e.timestamp}
+              .showActions=${!1}
+            ></ic-chat-message>
+          `})}
+      </div>
+    `}_renderContextState(){if(!this._contextLoaded)return t`<div class="loading-container"><ic-loading size="md"></ic-loading></div>`;if(this._pipelineSnapshots.length===0)return t`<ic-empty-state
+        icon="activity"
+        message="No pipeline data for this session"
+      ></ic-empty-state>`;let e=this._pipelineSnapshots[0],n=Math.max(0,e.tokensLoaded-e.tokensEvicted),r=[{label:`System`,tokens:n,color:`var(--ic-accent)`},{label:`Evicted`,tokens:e.tokensEvicted,color:`var(--ic-error)`},{label:`Masked`,tokens:e.tokensMasked,color:`var(--ic-warning)`},{label:`Available`,tokens:Math.max(0,Math.round((1-e.budgetUtilization)*(n+e.tokensEvicted+e.tokensMasked))),color:`var(--ic-surface-2, #1f2937)`}].filter(e=>e.tokens>0);return t`
+      <!-- Latest snapshot summary -->
+      <div class="context-summary">
+        <div class="context-badge">
+          Budget <span class="badge-value">${Math.round(e.budgetUtilization*100)}%</span>
+        </div>
+        <span class="cache-badge ${e.cacheHitTokens>0?`cache-badge--hit`:`cache-badge--miss`}">
+          ${e.cacheHitTokens>0?`Cache HIT`:`Cache MISS`}
+        </span>
+        <div class="context-badge">
+          Loaded <span class="badge-value">${h(e.tokensLoaded)}</span>
+        </div>
+        <div class="context-badge">
+          Evicted <span class="badge-value">${h(e.tokensEvicted)}</span>
+        </div>
+        <div class="context-badge">
+          Duration <span class="badge-value">${e.durationMs}ms</span>
+        </div>
+      </div>
+
+      <!-- Budget segment bar -->
+      <div class="budget-section">
+        <div class="budget-section-title">Token Budget</div>
+        <ic-budget-segment-bar .segments=${r}></ic-budget-segment-bar>
+      </div>
+
+      <!-- Execution list -->
+      <div class="budget-section-title">Pipeline Executions</div>
+      <div class="execution-list">
+        ${this._pipelineSnapshots.map(e=>t`
+            <button
+              class="execution-row ${this._selectedSnapshot===e?`selected`:``}"
+              @click=${()=>{this._selectedSnapshot=e}}
+            >
+              <span class="exec-time">${new Date(e.timestamp).toLocaleTimeString(void 0,{hour:`2-digit`,minute:`2-digit`,second:`2-digit`})}</span>
+              <span class="exec-duration">${e.durationMs}ms</span>
+              <span class="cache-badge ${e.cacheHitTokens>0?`cache-badge--hit`:`cache-badge--miss`}">
+                ${e.cacheHitTokens>0?`HIT`:`MISS`}
+              </span>
+              <span class="exec-tokens">${h(e.tokensLoaded)} loaded</span>
+            </button>
+          `)}
+      </div>
+
+      <!-- Waterfall for selected snapshot -->
+      ${this._selectedSnapshot&&this._selectedSnapshot.layers.length>0?t`
+            <div class="waterfall-card">
+              <ic-layer-waterfall
+                .layers=${this._selectedSnapshot.layers.map(e=>({name:e.name,durationMs:e.durationMs,messagesIn:e.messagesIn,messagesOut:e.messagesOut}))}
+                .totalDurationMs=${this._selectedSnapshot.durationMs}
+              ></ic-layer-waterfall>
+            </div>
+          `:l}
+    `}_renderMetrics(){if(!this._session)return l;let e=this._session,n=p(e.lastActiveAt);return t`
+      <!-- Cost & Usage -->
+      <div class="metrics-section-title">Cost & Usage</div>
+      <div class="metrics-grid">
+        <ic-stat-card
+          label="Total Cost"
+          value=${this._sessionBilling?g(this._sessionBilling.totalCost):`--`}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Total Tokens"
+          value=${h(e.totalTokens)}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Input Tokens"
+          value=${h(e.inputTokens)}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Output Tokens"
+          value=${h(e.outputTokens)}
+        ></ic-stat-card>
+      </div>
+
+      <!-- Activity -->
+      <div class="metrics-section-title">Activity</div>
+      <div class="metrics-grid">
+        <ic-stat-card
+          label="Tool Calls"
+          value=${String(e.toolCalls)}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Compactions"
+          value=${String(e.compactions)}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Resets"
+          value=${String(e.resetCount)}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="API Calls"
+          value=${this._sessionBilling?String(this._sessionBilling.callCount):`--`}
+        ></ic-stat-card>
+      </div>
+
+      <!-- Session Health -->
+      <div class="metrics-section-title">Session Health</div>
+      <div class="metrics-grid">
+        <ic-stat-card
+          label="Created"
+          value=${new Date(e.createdAt).toLocaleDateString()}
+        ></ic-stat-card>
+        <ic-stat-card
+          label="Last Active"
+          value=${new Date(e.lastActiveAt).toLocaleString()}
+        ></ic-stat-card>
+        <ic-stat-card label="Status" .value=${``}>
+        </ic-stat-card>
+      </div>
+      <div style="margin-top: calc(-1 * var(--ic-space-md));">
+        <span class="status-badge status-badge--${n}" data-testid="session-status">${n}</span>
+      </div>
+    `}render(){let e=[{label:`Sessions`,route:`sessions`},{label:this._getBreadcrumbLabel()}];if(this._loading)return t`
+        <div class="breadcrumb-area">
+          <ic-breadcrumb
+            .items=${e}
+            @navigate=${this._handleBreadcrumbNavigate}
+          ></ic-breadcrumb>
+        </div>
+        <ic-skeleton-view variant="detail"></ic-skeleton-view>
+      `;if(this._error)return t`
+        <div class="breadcrumb-area">
+          <ic-breadcrumb
+            .items=${e}
+            @navigate=${this._handleBreadcrumbNavigate}
+          ></ic-breadcrumb>
+        </div>
+        <div class="error-container">
+          <div class="error-message">${this._error}</div>
+          <button class="retry-btn" @click=${()=>this._loadSession()}>
+            Retry
+          </button>
+        </div>
+      `;if(!this._session)return t`
+        <div class="breadcrumb-area">
+          <ic-breadcrumb
+            .items=${e}
+            @navigate=${this._handleBreadcrumbNavigate}
+          ></ic-breadcrumb>
+        </div>
+        <div class="error-container">
+          <div class="error-message">Session not found</div>
+        </div>
+      `;let n=this._session,r=this._getConfirmProps();return t`
+      <div class="breadcrumb-area">
+        <ic-breadcrumb
+          .items=${e}
+          @navigate=${this._handleBreadcrumbNavigate}
+        ></ic-breadcrumb>
+      </div>
+
+      <div class="session-info">
+        <div class="info-item">
+          <span class="info-label">Agent</span>
+          <span class="info-value">${n.agentId}</span>
+        </div>
+        <div class="info-item">
+          <span class="info-label">Channel</span>
+          <span class="info-value"
+            ><ic-tag variant=${n.channelType}
+              >${n.channelType}</ic-tag
+            ></span
+          >
+        </div>
+        <div class="info-item">
+          <span class="info-label">Messages</span>
+          <span class="info-value">${n.messageCount}</span>
+        </div>
+        <div class="info-item">
+          <span class="info-label">Tokens</span>
+          <span class="info-value">${h(n.totalTokens)}</span>
+        </div>
+        <div class="info-item">
+          <span class="info-label">Created</span>
+          <span class="info-value"
+            >${new Date(n.createdAt).toLocaleDateString()}</span
+          >
+        </div>
+        ${n.label?t`
+              <div class="info-item">
+                <span class="info-label">Label</span>
+                <span class="info-value">${n.label}</span>
+              </div>
+            `:l}
+      </div>
+
+      <div class="actions-bar">
+        <button
+          class="btn btn-ghost"
+          @click=${()=>this._showActionConfirm(`reset`)}
+        >
+          Reset
+        </button>
+        <button
+          class="btn btn-ghost"
+          @click=${()=>this._showActionConfirm(`compact`)}
+        >
+          Compact
+        </button>
+        <button class="btn btn-ghost" @click=${this._handleExport}>
+          Export JSONL
+        </button>
+        <button
+          class="btn btn-danger"
+          @click=${()=>this._showActionConfirm(`delete`)}
+        >
+          Delete
+        </button>
+      </div>
+
+      <!-- Tab bar -->
+      <div class="tab-bar" role="tablist">
+        <button
+          class="tab ${this._activeTab===`conversation`?`tab--active`:``}"
+          role="tab"
+          aria-selected=${this._activeTab===`conversation`}
+          @click=${()=>this._switchTab(`conversation`)}
+        >
+          Conversation
+        </button>
+        <button
+          class="tab ${this._activeTab===`context`?`tab--active`:``}"
+          role="tab"
+          aria-selected=${this._activeTab===`context`}
+          @click=${()=>this._switchTab(`context`)}
+        >
+          Context State
+        </button>
+        <button
+          class="tab ${this._activeTab===`metrics`?`tab--active`:``}"
+          role="tab"
+          aria-selected=${this._activeTab===`metrics`}
+          @click=${()=>this._switchTab(`metrics`)}
+        >
+          Metrics
+        </button>
+      </div>
+
+      <!-- Tab content: use display:none to preserve scroll position -->
+      <div
+        class="tab-content ${this._activeTab===`conversation`?`tab-content--active`:``}"
+      >
+        ${this._renderConversation()}
+      </div>
+      <div
+        class="tab-content ${this._activeTab===`context`?`tab-content--active`:``}"
+      >
+        ${this._renderContextState()}
+      </div>
+      <div
+        class="tab-content ${this._activeTab===`metrics`?`tab-content--active`:``}"
+      >
+        ${this._renderMetrics()}
+      </div>
+
+      <ic-confirm-dialog
+        ?open=${this._showConfirm}
+        title=${r.title}
+        message=${r.message}
+        variant=${r.variant}
+        confirmLabel=${r.label}
+        @confirm=${this._handleConfirm}
+        @cancel=${this._handleConfirmCancel}
+      ></ic-confirm-dialog>
+    `}};c([s({attribute:!1})],_.prototype,`apiClient`,void 0),c([s({attribute:!1})],_.prototype,`rpcClient`,void 0),c([s()],_.prototype,`sessionKey`,void 0),c([a()],_.prototype,`_session`,void 0),c([a()],_.prototype,`_messages`,void 0),c([a()],_.prototype,`_loading`,void 0),c([a()],_.prototype,`_error`,void 0),c([a()],_.prototype,`_showConfirm`,void 0),c([a()],_.prototype,`_confirmAction`,void 0),c([a()],_.prototype,`_activeTab`,void 0),c([a()],_.prototype,`_contextLoaded`,void 0),c([a()],_.prototype,`_metricsLoaded`,void 0),c([a()],_.prototype,`_pipelineSnapshots`,void 0),c([a()],_.prototype,`_dagCompactions`,void 0),c([a()],_.prototype,`_selectedSnapshot`,void 0),c([a()],_.prototype,`_sessionBilling`,void 0),_=c([e(`ic-session-detail`)],_);export{_ as IcSessionDetail};

package/node_modules/@comis/web/dist/assets/session-key-parser-Dkqcj2Ss.js

@@ -0,0 +1 @@
+var e=300*1e3,t=3600*1e3;function n(e){if(!e||typeof e!=`string`)return;let t=e.split(`:`),n;if(t[0]===`agent`&&t.length>=5&&(n=t[1],t=t.slice(2)),t.length<3)return;let r={tenantId:t[0],userId:t[1],channelId:t[2]};n!==void 0&&(r.agentId=n);for(let e=3;e<t.length;e++)t[e]===`peer`&&e+1<t.length?r.peerId=t[++e]:t[e]===`guild`&&e+1<t.length?r.guildId=t[++e]:t[e]===`thread`&&e+1<t.length&&(r.threadId=t[++e]);return r}function r(e){return e.userId.length>16?e.userId.slice(0,14)+`...`:e.userId}function i(n){let r=Date.now()-n;return r<e?`active`:r<t?`idle`:`expired`}export{r as n,n as r,i as t};