@clemrig/flow-ui 0.11.0 → 0.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/page/app.js +2 -2
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@clemrig/flow-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0",
|
|
4
4
|
"description": "A local read-only dashboard of the runs of @clemrig/flow workflows",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"prepack": "npm run build"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@clemrig/flow": "0.
|
|
38
|
+
"@clemrig/flow": "0.12.0"
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"@testing-library/dom": "10.4.2",
|
package/page/app.js
CHANGED
|
@@ -12,9 +12,9 @@ Error generating stack: `+e.message+`
|
|
|
12
12
|
|
|
13
13
|
Workflow request:
|
|
14
14
|
|
|
15
|
-
`);if(t<0)return{instructions:e};try{let{context:n,outputSchema:r}=JSON.parse(e.slice(t+21));return{instructions:e.slice(0,t),context:n,schema:r}}catch{return{instructions:e}}}function Be(e){let t=e=>/^[\w@%+=:,./‹›-]+$/.test(e)?e:`'${e.replaceAll(`'`,`'\\''`)}'`;return[...Object.entries(e.env).map(([e,n])=>`${e}=${t(n)}`),t(e.executable),...e.args.map(t)].join(` `)}function Ve(e){try{let t=JSON.parse(e.join(`
|
|
15
|
+
`);if(t<0)return{instructions:e};try{let{context:n,outputSchema:r}=JSON.parse(e.slice(t+21));return{instructions:e.slice(0,t),context:n,schema:r}}catch{return{instructions:e}}}function Be(e){let t=e=>/^[\w@%+=:,./‹›-]+$/.test(e)?e:`'${e.replaceAll(`'`,`'\\''`)}'`;return[...(e.given??[]).map(e=>`${e}=${t(`‹from the workflow›`)}`),...Object.entries(e.env).map(([e,n])=>`${e}=${t(n)}`),t(e.executable),...e.args.map(t)].join(` `)}function Ve(e){try{let t=JSON.parse(e.join(`
|
|
16
16
|
`));return typeof t==`object`&&t&&!Array.isArray(t)?t:void 0}catch{return}}function He(e){return e<1e3?`${e} B`:e<1e6?`${(e/1e3).toFixed(1)} KB`:`${(e/1e6).toFixed(1)} MB`}function Ue(e){let t=new Map;for(let n of e){let e=t.get(n.name)??{name:n.name,count:0,durationMs:0,failed:0};e.count++,e.durationMs+=n.durationMs??0,n.status===`failed`&&e.failed++,t.set(n.name,e)}return[...t.values()].sort((e,t)=>t.count-e.count||e.name.localeCompare(t.name))}var We={hour:`2-digit`,minute:`2-digit`,second:`2-digit`,hourCycle:`h23`},Ge=e=>new Date(e).toLocaleTimeString(void 0,We),Ke=e=>new Date(e).toLocaleTimeString(void 0,{hour:`2-digit`,minute:`2-digit`,hourCycle:`h23`});function qe(e){let t=new Date(e);return new Date().toDateString()===t.toDateString()?`today`:t.toLocaleDateString(void 0,{day:`numeric`,month:`short`})}function Je(e){return e?qe(e)===`today`?Ge(e):`${qe(e)} ${Ge(e)}`:`—`}var Ye=e((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),k=e(((e,t)=>{t.exports=Ye()}))(),Xe=e=>[e.id,e.workflow,e.stage,e.error,JSON.stringify(e.input??{})].join(` `).toLowerCase();function Ze({runs:e,selected:t,select:n,search:r}){let[i,a]=(0,l.useState)(``),[o,s]=(0,l.useState)(`all`),c=[[`all`,`All`],[`status:running`,`running`],[`status:failed`,`failed`],...[...new Set((e??[]).flatMap(({workflow:e})=>e??[]))].map(e=>[`workflow:${e}`,e])],u=i.trim().toLowerCase(),d=(e??[]).filter(e=>(o===`all`||o===`status:${e.status}`||o===`workflow:${e.workflow}`)&&(!u||Xe(e).includes(u))),f=[];for(let e of d){let t=e.updatedAt?qe(e.updatedAt):`unreadable`,n=f.at(-1);n?.[0]===t?n[1].push(e):f.push([t,[e]])}return(0,k.jsxs)(`aside`,{className:`rail`,children:[(0,k.jsx)(`input`,{ref:r,type:`search`,className:`rail-search`,placeholder:`Search runs /`,"aria-label":`Search runs`,value:i,onChange:e=>a(e.target.value)}),(0,k.jsx)(`div`,{className:`filters`,children:c.map(([e,t])=>(0,k.jsx)(`button`,{type:`button`,className:`chip`,"aria-pressed":o===e,onClick:()=>s(e),children:t},e))}),e?.length===0&&(0,k.jsx)(`p`,{className:`empty`,children:`No run yet.`}),e&&e.length>0&&d.length===0&&(0,k.jsx)(`p`,{className:`empty`,children:`No run matches.`}),f.map(([e,r])=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`p`,{className:`rail-group`,children:e}),(0,k.jsx)(`ol`,{className:`rail-runs`,children:r.map(e=>(0,k.jsx)(`li`,{children:(0,k.jsxs)(`button`,{type:`button`,title:e.id,"aria-current":e.id===t?`true`:void 0,onClick:()=>n(e.id),children:[(0,k.jsx)(`span`,{className:`dot`,"data-state":e.error===void 0?e.status:`failed`}),(0,k.jsx)(`span`,{className:`name`,children:e.error===void 0?ke(e.input)??e.workflow:e.id}),(0,k.jsx)(`span`,{className:`cost`,children:e.error===void 0&&e.costUsd!=null?me(e.costUsd,e.partial??!1):``}),(0,k.jsx)(`span`,{className:e.error===void 0?`meta`:`meta bad`,children:e.error??[e.workflow,e.status===`running`?e.stage:e.status,w(e.durationMs??null)].join(` · `)})]})},e.id))})]},e))]})}function Qe({id:e,title:t,className:n,folds:r,children:i}){return(0,k.jsxs)(`details`,{className:n,open:r.opened.has(e),onToggle:t=>r.toggle(e,t.currentTarget.open),children:[(0,k.jsx)(`summary`,{children:t}),r.opened.has(e)&&i]})}function $e(e,t,n){if(e.has(t)===n)return e;let r=new Set(e);return n?r.add(t):r.delete(t),r}function et({facts:e}){return(0,k.jsx)(`dl`,{className:`sheet`,children:e.map(([e,t,n])=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`dt`,{children:e}),(0,k.jsx)(`dd`,{className:n,children:t})]},e))})}function tt({parts:e}){return(0,k.jsx)(k.Fragment,{children:e.map(({text:e,href:t},n)=>t?(0,k.jsx)(`a`,{href:t,target:`_blank`,rel:`noreferrer`,children:e},n):(0,k.jsx)(l.Fragment,{children:e},n))})}function nt({value:e,path:t,folds:n}){if(typeof e!=`object`||!e)return(0,k.jsx)(`pre`,{className:`frame text`,children:String(e)});let r=Array.isArray(e)?e.map((e,t)=>[String(t),e]):Object.entries(e);return(0,k.jsx)(`ul`,{className:`tree`,children:r.map(([r,i])=>(0,k.jsx)(rt,{name:r,label:Array.isArray(e)?Re(i):void 0,value:i,path:`${t}/${r}`,folds:n},r))})}function rt({name:e,label:t,value:n,path:r,folds:i}){if(Le(n))return(0,k.jsxs)(`li`,{className:`leaf`,children:[(0,k.jsx)(`span`,{className:`key`,children:e}),(0,k.jsx)(`span`,{className:`inline ${n===null?`null`:typeof n}`,children:(0,k.jsx)(tt,{parts:O(String(n))})})]});let{type:a,size:o}=Me(n);return(0,k.jsx)(`li`,{children:(0,k.jsx)(Qe,{id:`data${r}`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`key`,children:e}),t&&(0,k.jsx)(`span`,{className:`label`,children:t}),(0,k.jsx)(`span`,{className:`type`,children:a}),(0,k.jsx)(`span`,{className:`size`,children:He(o)})]}),className:`data-key`,folds:i,children:(0,k.jsx)(nt,{value:n,path:r,folds:i})})})}function it({data:e,folds:t}){return(0,k.jsxs)(`div`,{className:`data`,children:[(0,k.jsxs)(`div`,{className:`data-head`,children:[(0,k.jsx)(`h4`,{children:`Data · ${He(Me(e).size)}`}),(0,k.jsx)(`button`,{type:`button`,className:`link`,onClick:()=>void navigator.clipboard?.writeText(JSON.stringify(e,null,2)),children:`Copy JSON`})]}),(0,k.jsx)(nt,{value:e,path:``,folds:t})]})}var at=36,ot=16,st=24,ct={passed:`✓`,correction:`↻`,failed:`✕`,running:`…`};function lt({launch:e,found:t}){if(!e.facts)return(0,k.jsx)(`p`,{className:`empty launch-detail`,children:`#${e.number}: not recorded, this launch predates launch records.`});let n=t.slice(0,e.number-1).findLast(({facts:e})=>e)?.facts;return(0,k.jsx)(`dl`,{className:`launch-detail`,children:Fe(e.facts,n).map(({label:e,value:t,changed:n})=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`dt`,{children:e}),(0,k.jsxs)(`dd`,{children:[t,n&&(0,k.jsx)(`span`,{className:`changed`,children:`changed`})]})]},e))})}function ut({found:e,now:t}){let[n,r]=(0,l.useState)(null);if(!e.length)return null;let i=e.map(e=>be(e,t)),a=e.find(({number:e})=>e===n),o=i.reduce((e,t)=>e+t,0)||1,s=e.filter(e=>e.cause);return(0,k.jsxs)(`div`,{className:`launches`,children:[(0,k.jsx)(`div`,{className:`launch-bar`,children:e.map((t,a)=>{let s=i[a]??0,c=e[a-1],u=e[a+1],d=u&&t.endedAt?Date.parse(u.startedAt)-Date.parse(t.endedAt):null;return(0,k.jsxs)(l.Fragment,{children:[(0,k.jsxs)(`div`,{className:`launch`,style:{flexGrow:Math.max(s,o/100)},children:[(0,k.jsx)(`span`,{className:`launch-day`,children:c&&qe(c.startedAt)===qe(t.startedAt)?``:qe(t.startedAt)}),(0,k.jsxs)(`button`,{type:`button`,className:`launch-span`,"data-state":t.status,title:`#${t.number} · ${t.status} · ${w(s)} · click for what it ran with`,"aria-expanded":n===t.number,onClick:()=>r(n===t.number?null:t.number),children:[`#${t.number}`,(0,k.jsx)(`small`,{children:Ce(s)})]}),(0,k.jsx)(`span`,{className:`launch-at`,children:Ke(t.startedAt)})]}),u&&t.endedAt&&d!==null&&(0,k.jsx)(`div`,{className:`launch-pause`,title:`paused ${w(d)}`,children:(0,k.jsx)(`span`,{children:`${we(t.endedAt,u.startedAt)?`☾ `:``}${Ce(d)}`})})]},t.number)})}),s.length>0&&(0,k.jsx)(`ol`,{className:`launch-causes`,children:s.map(e=>(0,k.jsxs)(`li`,{children:[(0,k.jsx)(`strong`,{children:`#${e.number}`}),(0,k.jsx)(`span`,{className:`launch-cause`,children:e.cause})]},e.number))}),a&&(0,k.jsx)(lt,{launch:a,found:e})]})}function dt(e,t){let n=T(e/t);return Array.from({length:Math.floor(e/n)},(e,t)=>(t+1)*n)}function ft({blocks:e,found:t,selected:n,select:r,now:i,zoom:a=1,setZoom:o}){let s=(0,l.useRef)(null),c=(0,l.useRef)(null),[u,d]=(0,l.useState)(0),f=(0,l.useRef)(null),p=(0,l.useCallback)(e=>{if(c.current=e,f.current?.disconnect(),!e)return;let t=()=>d(e.getBoundingClientRect().width);t(),f.current=new ResizeObserver(t),f.current.observe(e)},[]),m=(0,l.useRef)(a);m.current=a;let h=(0,l.useRef)(null),g=(0,l.useCallback)(e=>{if(s.current=e,!e||!o)return;let t=t=>{if(!t.ctrlKey&&!t.metaKey)return;t.preventDefault();let n=Te(m.current,t.deltaY);if(n===m.current)return;let r=t.clientX-e.getBoundingClientRect().left,i=c.current?.offsetWidth??0;h.current={share:i?(e.scrollLeft+r-(c.current?.offsetLeft??0))/i:0,offset:r},o(n)};return e.addEventListener(`wheel`,t,{passive:!1}),()=>e.removeEventListener(`wheel`,t)},[o]);(0,l.useLayoutEffect)(()=>{let e=h.current,t=s.current;e&&t&&c.current&&(h.current=null,t.scrollLeft=c.current.offsetLeft+e.share*c.current.offsetWidth-e.offset)},[a]);let _=xe(e,t,i);if(!_.bars.length)return null;let v=_.total||1,y=new Map(t.map(({number:e,cause:t})=>[e,t])),b=e=>ot+e*at+at/2,{marks:x,at:ee,narrowest:te}=Se(_,e,u),ne=new Map;for(let{index:e,round:t}of _.bars){let n=x.get(e);if(!n)continue;let r=ne.get(t);ne.set(t,{left:Math.min(r?.left??n.x,n.x),right:Math.max(r?.right??0,n.x+n.width)})}let S=-1/0,re=-1/0;return(0,k.jsxs)(`div`,{className:`lanes`,children:[(0,k.jsx)(`div`,{className:`lane-names`,children:_.lanes.map(({name:e,count:t,spent:n})=>(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`strong`,{children:e}),(0,k.jsx)(`span`,{children:`×${t} · ${Ce(n)}`})]},e))}),(0,k.jsx)(`div`,{ref:g,className:a>1||u>0&&te>u-1?`lane-scroll zoomed`:`lane-scroll`,children:(0,k.jsxs)(`div`,{ref:p,className:`lane-canvas`,style:{width:`${a*100}%`,minWidth:`max(100%, ${te}px)`},children:[(0,k.jsxs)(`div`,{className:`lane-area`,style:{height:ot+_.lanes.length*at},children:[[...ne].filter(([e])=>e%2==0).map(([e,{left:t,right:n}])=>(0,k.jsx)(`div`,{className:`round-band`,style:{left:t-3/2,width:n-t+3}},e)),_.resumptions.map(({number:e})=>{let n=t[e-1]?.stages[0]?.index,r=Math.round((x.get(n??-1)?.x??0)-3/2),i=r-S>=28;return i&&(S=r),(0,k.jsx)(`div`,{className:`resumption`,style:{left:r},title:`#${e-1} stopped: ${y.get(e-1)??`no cause recorded`}`,children:i&&(0,k.jsx)(`span`,{children:`#${e}`})},e)}),_.corrections.map(({from:e,to:t})=>{let n=_.bars[e],r=_.bars[t];if(!n||!r||n.lane===r.lane)return null;let i=x.get(e),a=x.get(t);if(!i||!a)return null;let o=r.lane<n.lane,s=b(r.lane)+(o?15:-15),c=i.x+i.width;return(0,k.jsx)(`div`,{className:`sent-back`,"data-direction":o?`up`:`down`,style:{left:c,width:Math.max(0,a.x+6-c),top:Math.min(s,b(n.lane)),height:Math.abs(s-b(n.lane))}},e)}),_.bars.map(({index:t,lane:i,length:a,round:o})=>{let s=e[t],c=x.get(t);if(!s||!c)return null;let l=he(s),u=s.kind===`GATE`,d=s.decision?.reason.split(`
|
|
17
17
|
`)[0];return(0,k.jsx)(`button`,{type:`button`,className:u?`gate`:`bar`,"data-state":l,"data-kind":s.kind,title:`${s.stage} · round ${o} · ${l} · ${u?d??`no reason recorded`:w(a)}`,"aria-current":n===t?`true`:void 0,style:{left:c.x,width:c.width,top:b(i)-(u?18:st)/2},onClick:()=>r(t),children:u?(0,k.jsx)(`span`,{"aria-hidden":`true`,children:ct[l]}):c.width>=44?Ce(a):null},t)})]}),(0,k.jsxs)(`div`,{className:`lane-axis`,children:[[...ne].map(([e,{left:t,right:n}])=>ne.size>1&&n-t>=20&&(0,k.jsx)(`span`,{className:`round-label`,style:{left:(t+n)/2},title:`round ${e}`,children:`R${e}`},`round-${e}`)),dt(v,a).map(e=>{let t=ee(e);return t-re<40?null:(re=t,(0,k.jsx)(`span`,{className:`tick`,style:{left:t},children:Ce(e)},e))})]})]})})]})}var pt=120;function mt({found:e,now:t,points:n,budgets:r}){let i=e.reduce((e,n)=>e+be(n,t),0)||1,a=n.at(-1)?.usd??0,o=Math.max(a,...r.map(e=>e??0))*1.1||1,s=e=>e/i*1e3,c=e=>pt-e/o*114,l=n.map(({at:e,usd:t},n)=>`${n?`L`:`M`}${s(e).toFixed(1)},${c(t).toFixed(1)}`).join(` `),u=0,d=e.map((e,n)=>{let i=u;return u+=be(e,t),{number:e.number,from:i,to:u,budget:r[n]}}),f=e=>`${e/i*100}%`;return(0,k.jsxs)(`div`,{className:`cost-curve`,children:[(0,k.jsxs)(`div`,{className:`cost-plot`,style:{height:pt},children:[(0,k.jsxs)(`svg`,{viewBox:`0 0 1000 ${pt}`,preserveAspectRatio:`none`,role:`img`,"aria-label":`The run's cost over its active time`,children:[d.map(({number:e,from:t,to:n,budget:r})=>r!=null&&(0,k.jsx)(`line`,{className:`budget`,x1:s(t),x2:s(n),y1:c(r),y2:c(r),vectorEffect:`non-scaling-stroke`},e)),(0,k.jsx)(`path`,{className:`spent`,d:l,vectorEffect:`non-scaling-stroke`})]}),d.slice(1).map(({number:e,from:t})=>(0,k.jsx)(`span`,{className:`cost-resumption`,style:{left:f(t)},title:`#${e} starts`},e)),d.map(({number:e,from:t,budget:n})=>n!=null&&(0,k.jsx)(`span`,{className:`budget-label`,style:t/i>.85?{right:0,top:c(n)-15}:{left:f(t),top:c(n)-15},title:`#${e}'s budget`,children:me(n,!1)},e)),(0,k.jsx)(`span`,{className:`cost-now`,style:{top:Math.max(0,c(a)-8)},children:me(a,!1)})]}),(0,k.jsx)(`div`,{className:`cost-axis`,children:dt(i,1).map(e=>(0,k.jsx)(`span`,{className:`tick`,style:{left:f(e)},children:Ce(e)},e))})]})}function ht({detail:e,found:t,now:n}){let{run:r}=e,i=new Map(ie(e.sessions).map(({label:e,value:t})=>[e,t])),a=Object.entries(e.sessions).map(([e,t])=>({key:e,usd:t.costUsd})).sort((e,t)=>(t.usd??-1)-(e.usd??-1)),o=Math.max(0,...a.map(({usd:e})=>e??0))||1,s=E(t,n);return(0,k.jsxs)(`section`,{className:`card`,children:[(0,k.jsxs)(`h2`,{children:[`Cost (${a.length} session${a.length===1?``:`s`})`,(0,k.jsx)(`span`,{className:`hint`,children:`announced by the runtimes`})]}),a.length?(0,k.jsxs)(`dl`,{className:`cost-bars`,children:[a.map(({key:e,usd:t})=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`dt`,{className:`mono`,title:e,children:e}),(0,k.jsx)(`dd`,{className:`cost-track`,title:i.get(e),children:t!==void 0&&(0,k.jsx)(`span`,{className:`cost-bar`,style:{width:`${t/o*100}%`}})}),(0,k.jsx)(`dd`,{className:`value`,children:t===void 0?`no cost`:me(t,!1)})]},e)),(0,k.jsx)(`dt`,{className:`total`,children:`run`}),(0,k.jsx)(`dd`,{className:`total muted`,children:`the sum of its sessions`}),(0,k.jsx)(`dd`,{className:`total value`,children:me(r.costUsd,r.partial)})]}):(0,k.jsx)(`p`,{className:`empty`,children:`No session has announced figures yet.`}),s.length>0&&(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`h4`,{children:`Over active time`}),(0,k.jsx)(mt,{found:t,now:n,points:s,budgets:Ee(t,e.maxCostUsd)})]})]})}function gt({detail:e,folds:t}){let n=e.data?void 0:Ve(e.result),r=e.data??n;return(0,k.jsxs)(`section`,{className:`card`,children:[(0,k.jsxs)(`h2`,{children:[`Result`,(0,k.jsx)(`span`,{className:`hint`,children:e.data?`rendered by the workflow`:`the run's data`})]}),!n&&(0,k.jsx)(`pre`,{className:`frame result`,children:e.result.map((e,t)=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(tt,{parts:O(e)}),`
|
|
18
|
-
`]},t))}),r&&(0,k.jsx)(it,{data:r,folds:t}),Object.entries(e.runtimes).map(([e,t])=>(0,k.jsx)(`p`,{className:`runtime`,children:`Runtime: ${t}`},e))]})}var _t=new Map;function vt(e,t){let n=t.record,r=t.status!==`running`,i=n===void 0?void 0:`${e}/${n}`,[a,o]=(0,l.useState)({});return(0,l.useEffect)(()=>{if(i===void 0)return;let t=_t.get(i);if(t){o({key:i,done:r,record:t});return}let a=!0;return _(`api/runs/${encodeURIComponent(e)}/calls/${n}`).then(e=>{r&&_t.set(i,e),a&&o({key:i,done:r,record:e})},e=>{a&&o({key:i,done:r,error:e instanceof Error?e.message:String(e)})}),()=>{a=!1}},[i,r,e,n]),a.key===i?a:{}}function yt({call:e,error:t}){return e.record===void 0?(0,k.jsx)(`p`,{className:`empty`,children:`Not recorded: the run predates the record of what flow sends.`}):t?(0,k.jsx)(`p`,{className:`callout bad`,children:t}):(0,k.jsx)(`p`,{className:`empty`,children:`Loading…`})}function bt({runId:e,call:t,id:n,folds:r}){let{record:i,error:a}=vt(e,t);if(!i)return(0,k.jsx)(yt,{call:t,error:a});let{instructions:o,context:s,schema:c}=ze(i.request),l=e=>He(new TextEncoder().encode(e).length);return(0,k.jsxs)(`div`,{className:`sent`,children:[(0,k.jsx)(Qe,{id:`${n}/prompt`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`System prompt`}),(0,k.jsx)(`span`,{className:`muted`,children:`${i.prompt.name} · appended to the runtime's · ${l(i.prompt.text)}`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame text`,children:i.prompt.text})}),(0,k.jsx)(Qe,{id:`${n}/instructions`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Instructions`}),(0,k.jsx)(`span`,{className:`muted`,children:o.includes(`# Resumed run`)?`response format · resumed run`:`response format`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame text`,children:o})}),s!==void 0&&(0,k.jsx)(Qe,{id:`${n}/context`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Context`}),(0,k.jsx)(`span`,{className:`muted`,children:typeof s==`object`&&s?`${Object.keys(s).join(`, `)} · ${He(Me(s).size)}`:He(Me(s).size)})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(nt,{value:s,path:`${n}/context`,folds:r})}),c!==void 0&&(0,k.jsx)(Qe,{id:`${n}/schema`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Output schema`}),(0,k.jsx)(`span`,{className:`muted`,children:He(Me(c).size)})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(nt,{value:c,path:`${n}/schema`,folds:r})}),(0,k.jsx)(Qe,{id:`${n}/request`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Whole request`}),(0,k.jsx)(`span`,{className:`muted`,children:`standard input · ${l(i.request)}`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame`,children:i.request})}),(0,k.jsx)(Qe,{id:`${n}/command`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Command`}),(0,k.jsx)(`span`,{className:`muted`,children:`
|
|
18
|
+
`]},t))}),r&&(0,k.jsx)(it,{data:r,folds:t}),Object.entries(e.runtimes).map(([e,t])=>(0,k.jsx)(`p`,{className:`runtime`,children:`Runtime: ${t}`},e))]})}var _t=new Map;function vt(e,t){let n=t.record,r=t.status!==`running`,i=n===void 0?void 0:`${e}/${n}`,[a,o]=(0,l.useState)({});return(0,l.useEffect)(()=>{if(i===void 0)return;let t=_t.get(i);if(t){o({key:i,done:r,record:t});return}let a=!0;return _(`api/runs/${encodeURIComponent(e)}/calls/${n}`).then(e=>{r&&_t.set(i,e),a&&o({key:i,done:r,record:e})},e=>{a&&o({key:i,done:r,error:e instanceof Error?e.message:String(e)})}),()=>{a=!1}},[i,r,e,n]),a.key===i?a:{}}function yt({call:e,error:t}){return e.record===void 0?(0,k.jsx)(`p`,{className:`empty`,children:`Not recorded: the run predates the record of what flow sends.`}):t?(0,k.jsx)(`p`,{className:`callout bad`,children:t}):(0,k.jsx)(`p`,{className:`empty`,children:`Loading…`})}function bt({runId:e,call:t,id:n,folds:r}){let{record:i,error:a}=vt(e,t);if(!i)return(0,k.jsx)(yt,{call:t,error:a});let{instructions:o,context:s,schema:c}=ze(i.request),l=e=>He(new TextEncoder().encode(e).length);return(0,k.jsxs)(`div`,{className:`sent`,children:[(0,k.jsx)(Qe,{id:`${n}/prompt`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`System prompt`}),(0,k.jsx)(`span`,{className:`muted`,children:`${i.prompt.name} · appended to the runtime's · ${l(i.prompt.text)}`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame text`,children:i.prompt.text})}),(0,k.jsx)(Qe,{id:`${n}/instructions`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Instructions`}),(0,k.jsx)(`span`,{className:`muted`,children:o.includes(`# Resumed run`)?`response format · resumed run`:`response format`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame text`,children:o})}),s!==void 0&&(0,k.jsx)(Qe,{id:`${n}/context`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Context`}),(0,k.jsx)(`span`,{className:`muted`,children:typeof s==`object`&&s?`${Object.keys(s).join(`, `)} · ${He(Me(s).size)}`:He(Me(s).size)})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(nt,{value:s,path:`${n}/context`,folds:r})}),c!==void 0&&(0,k.jsx)(Qe,{id:`${n}/schema`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Output schema`}),(0,k.jsx)(`span`,{className:`muted`,children:He(Me(c).size)})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(nt,{value:c,path:`${n}/schema`,folds:r})}),(0,k.jsx)(Qe,{id:`${n}/request`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Whole request`}),(0,k.jsx)(`span`,{className:`muted`,children:`standard input · ${l(i.request)}`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame`,children:i.request})}),(0,k.jsx)(Qe,{id:`${n}/command`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Command`}),(0,k.jsx)(`span`,{className:`muted`,children:`prompts and MCP configuration replaced by what names them`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame`,children:Be(i.command)})})]})}var xt={version:`Version`,model:`Model`,permissionMode:`Permission mode`,tools:`Tools`,mcpServers:`MCP servers`,plugins:`Plugins`,skills:`Skills`,agents:`Agents`,slashCommands:`Commands`,apiKeySource:`API key source`,outputStyle:`Output style`};function St(e){return Array.isArray(e)?e.length?e.map(e=>typeof e==`object`&&e&&`name`in e?`${String(e.name)}${`status`in e?` (${String(e.status)})`:``}`:String(e)).join(`, `):`none`:String(e)}function Ct({runId:e,call:t,id:n,folds:r}){let{record:i,error:a}=vt(e,t);if(t.runtime===`codex`)return(0,k.jsx)(`p`,{className:`empty`,children:`Codex does not announce the configuration it runs with.`});if(!i)return(0,k.jsx)(yt,{call:t,error:a});let{effective:o,stderr:s}=i,c=e=>(t.differences??[]).some(t=>t.toLowerCase().startsWith(e.toLowerCase())),u=[...typeof o?.content==`string`?[[`text`,o.content]]:[],...o?.sections&&typeof o.sections==`object`?Object.entries(o.sections):[]];return(0,k.jsxs)(`div`,{className:`sent`,children:[o?(0,k.jsx)(`dl`,{className:`sheet`,children:Object.entries(o).filter(([e,t])=>t!==void 0&&e!==`sections`&&e!==`content`).map(([e,t])=>{let n=xt[e]??e;return(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`dt`,{children:n}),(0,k.jsxs)(`dd`,{children:[St(t),c(n)&&(0,k.jsx)(`span`,{className:`changed`,children:`differs`})]})]},e)})}):(0,k.jsx)(`p`,{className:`empty`,children:t.differences===void 0?t.status===`running`?`Not announced yet.`:`Not recorded: the run predates it, or the session announced none.`:t.status===`running`?`Announced; the call's record keeps it once the call ends.`:`Announced, but the call's record could not keep it.`}),u.map(([e,t])=>(0,k.jsx)(Qe,{id:`${n}/section/${e}`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`System prompt · ${e}`}),(0,k.jsx)(`span`,{className:`muted`,children:`as the runtime built it`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame text`,children:String(t)})},e)),s&&(0,k.jsx)(Qe,{id:`${n}/stderr`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:`Error output`}),(0,k.jsx)(`span`,{className:`muted`,children:`its end, though the call succeeded`})]}),className:`sent-part`,folds:r,children:(0,k.jsx)(`pre`,{className:`frame`,children:s})})]})}function wt({runId:e,call:t,id:n,folds:r}){let{record:i,error:a}=vt(e,t);if(!i)return(0,k.jsx)(yt,{call:t,error:a});if(i.answer===void 0)return(0,k.jsx)(`p`,{className:`empty`,children:t.status===`running`?`Not answered yet.`:`No final answer.`});let o=Ve(i.answer.split(`
|
|
19
19
|
`));return o?(0,k.jsx)(nt,{value:o,path:`${n}/answer`,folds:r}):(0,k.jsx)(`pre`,{className:`frame`,children:i.answer})}function Tt(e){let{calls:t}=e,n=t.at(-1),r=[];if(n?.model&&(r.push([`Agent`,`${n.runtime} · ${n.model}`]),n.prompt&&r.push([`Prompt`,`${n.prompt}, in Input`]),n.session&&r.push([`Session`,t.length===1&&n.conversation?`${n.session} · ${ae(n.conversation)}`:n.session]),n.settings))for(let{label:e,value:t}of fe(n.settings,n.runtime))r.push([e,t]);return t.length>1&&r.push([`Calls`,`${t.length}, each in Activity · ${e.tools.length} tool calls`]),t.length===1&&n?.usage?(r.push([n.scope===`session`?`Tokens (session)`:`Tokens`,ce(n.usage,!1)]),r.push([`Cost`,pe(n.usage.costUsd??null,!1)])):t.length===1&&n?.tokens&&r.push([`Tokens so far`,ce(n.tokens,n.provisional)]),r}function Et(e){if(!e.decision)return[`Outcome`,e.status,e.status===`failed`?`bad`:``];let{verdict:t,destination:n}=e.decision,r=e.retry?` (${e.retry.key} ${e.retry.count}/${e.retry.max})`:``,i=t===`correction`&&ge(e);return[`Outcome`,i?`✕ not sent back to ${n}${r}`:t===`correction`?`↻ back to ${n}${r}`:`accepted → ${n??`end`}`,i?`bad`:t===`correction`?`warn`:``]}var Dt={call:`▶`,tool:`·`,hook:`↪`,journal:`✎`,warning:`!`,notice:`i`},Ot=[[`all`,`All`],[`call`,`Calls`],[`tool`,`Tools`],[`hook`,`Hooks`],[`journal`,`Journal`],[`notice`,`Runtime`],[`warning`,`Warnings`]];function kt({block:e,index:t,folds:n,now:r}){let[i,a]=(0,l.useState)(`all`),[o,s]=(0,l.useState)(``),c=Oe(e,r),u=o.trim().toLowerCase(),d=c.map((e,t)=>({item:e,position:t})).filter(({item:e})=>(i===`all`||e.kind===i)&&(!u||e.text.toLowerCase().includes(u)));return c.length?(0,k.jsxs)(k.Fragment,{children:[e.tools.length>0&&(0,k.jsx)(`div`,{className:`chips`,children:Ue(e.tools).map(({name:e,count:t,durationMs:n,failed:r})=>(0,k.jsx)(`span`,{className:r?`chip warn`:`chip`,children:`${e} ×${t} · ${w(n)}${r?` · ${r} failed`:``}`},e))}),(0,k.jsxs)(`div`,{className:`feed-bar`,children:[Ot.map(([e,t])=>{let n=e===`all`?c.length:c.filter(t=>t.kind===e).length;return n>0&&(0,k.jsx)(`button`,{type:`button`,className:`chip`,"aria-pressed":i===e,onClick:()=>a(e),children:`${t} ${n}`},e)}),(0,k.jsx)(`input`,{type:`search`,className:`feed-search`,placeholder:`Filter`,"aria-label":`Filter the activity`,value:o,onChange:e=>s(e.target.value)})]}),(0,k.jsx)(`ol`,{className:`feed`,children:d.map(({item:e,position:r})=>(0,k.jsxs)(`li`,{"data-kind":e.kind,className:e.failed?`bad`:void 0,children:[(0,k.jsx)(`span`,{className:`at`,children:Ge(e.at)}),(0,k.jsx)(`span`,{className:`icon`,children:Dt[e.kind]}),e.data?(0,k.jsxs)(`div`,{children:[e.text,(0,k.jsx)(Qe,{id:`activity-${t}-${r}`,title:`Data`,className:`entry-data`,folds:n,children:(0,k.jsx)(`pre`,{children:oe(e.data)})})]}):(0,k.jsx)(`span`,{className:`text`,children:`${e.text}${e.failed&&e.kind===`tool`?` — failed`:``}`}),(0,k.jsx)(`span`,{className:`took`,children:e.took??``})]},r))})]}):(0,k.jsx)(`p`,{className:`empty`,children:`No activity recorded.`})}function At({runId:e,block:t,index:n,count:r,round:i,launch:a,tab:o,following:s,choose:c,follow:u,folds:d,now:f}){let p=he(t),m=[...Object.hasOwn(t,`output`)?[[`Answer`,t.output]]:[],...t.feedback===void 0?[]:[[ge(t)?`Correction not sent, past its maximum`:`Correction sent`,t.feedback]]],h=t.received===void 0?void 0:typeof t.received==`string`?t.received.split(`
|
|
20
20
|
`)[0]??``:`see Input`,g=Oe(t,f).length,{calls:_}=t,v=(t.received===void 0?0:1)+_.length,b=m.length+(_.length>1?_.length:0),x=[[`overview`,`Overview`],[`input`,`Input`,v?String(v):void 0],[`output`,`Output`,b?String(b):void 0],[`activity`,`Activity`,g?String(g):void 0]];return(0,k.jsxs)(`div`,{className:`stage-panel`,children:[(0,k.jsxs)(`div`,{className:`panel-title`,children:[(0,k.jsx)(`span`,{className:`pill`,"data-state":p,children:p}),(0,k.jsx)(`h3`,{children:t.stage}),(0,k.jsx)(`span`,{className:`tag`,children:t.kind}),(0,k.jsx)(`span`,{className:`tag`,children:`R${i} · #${a}`}),(0,k.jsxs)(`span`,{className:`panel-nav`,children:[(0,k.jsx)(`button`,{type:`button`,"aria-label":`Previous stage`,title:`Previous stage (k)`,disabled:n===0,onClick:()=>c(n-1,o),children:`‹`}),(0,k.jsx)(`button`,{type:`button`,"aria-label":`Next stage`,title:`Next stage (j)`,disabled:n===r-1,onClick:()=>c(n+1,o),children:`›`})]})]}),(0,k.jsxs)(`p`,{className:`panel-meta`,children:[`#${n+1} of ${r} · ${Je(t.startedAt)} · ${t.durationMs===null?`running for `:``}${w(_e(t,f))}`,s?(0,k.jsx)(`span`,{className:`muted`,children:` · following the latest`}):(0,k.jsx)(`button`,{type:`button`,className:`link`,title:`Follow the latest stage (f)`,onClick:u,children:`Follow the latest`})]}),(0,k.jsx)(`div`,{className:`tabs`,role:`tablist`,children:x.map(([e,r,i])=>(0,k.jsxs)(`button`,{type:`button`,role:`tab`,"aria-selected":o===e,onClick:()=>c(n,e),children:[r,i&&(0,k.jsx)(`span`,{className:e===`input`&&t.received!==void 0||e===`activity`&&(t.notices.length+t.warnings.length>0||t.hooks.some(y))?`badge warn`:`badge`,children:i})]},e))}),(0,k.jsxs)(`div`,{className:`tab-body`,role:`tabpanel`,children:[o===`overview`&&(0,k.jsxs)(k.Fragment,{children:[h!==void 0&&(0,k.jsxs)(`p`,{className:`callout warn`,children:[(0,k.jsx)(`strong`,{children:`Correction received`}),` · ${h} `,(0,k.jsx)(`button`,{type:`button`,className:`link`,onClick:()=>c(n,`input`),children:`Open in Input →`})]}),t.detail?(0,k.jsx)(`pre`,{className:`callout bad`,children:t.detail}):t.decision?.verdict===`correction`&&(0,k.jsx)(`pre`,{className:`callout warn`,children:t.decision.reason}),_.some(({differences:e})=>e?.length)&&(0,k.jsx)(`p`,{className:`callout warn`,children:`The session differs from the profile: ${[...new Set(_.flatMap(({differences:e})=>e??[]))].join(`; `)}`}),t.warnings.map(({message:e},t)=>(0,k.jsx)(`p`,{className:`callout warn`,children:e},t)),(0,k.jsx)(et,{facts:[[`Started`,Je(t.startedAt)],[t.durationMs===null?`Running for`:`Duration`,w(_e(t,f))],Et(t),...Tt(t)]}),_.map((t,r)=>t.runtime&&(0,k.jsx)(Qe,{id:`effective/${n}/${r}`,title:(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`span`,{className:`part`,children:_.length>1?`Session · call #${r+1}`:`Session`}),(0,k.jsx)(`span`,{className:`muted`,children:`what the runtime confirmed it ran with`}),t.differences?.length?(0,k.jsx)(`span`,{className:`changed`,children:`differs`}):null]}),className:`sent-part`,folds:d,children:(0,k.jsx)(Ct,{runId:e,call:t,id:`effective/${n}/${r}`,folds:d})},r))]}),o===`input`&&(0,k.jsxs)(k.Fragment,{children:[t.received===void 0?(0,k.jsx)(`p`,{className:`empty`,children:`No correction in effect when this stage started.`}):(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`h4`,{children:`Correction received`}),(0,k.jsx)(`pre`,{className:`frame`,children:oe(t.received)})]}),_.map((t,r)=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`h4`,{children:_.length>1?`Sent to the agent · call #${r+1}`:`Sent to the agent`}),(0,k.jsx)(bt,{runId:e,call:t,id:`sent/${n}/${r}`,folds:d})]},r))]}),o===`output`&&(b?(0,k.jsxs)(k.Fragment,{children:[m.map(([e,t])=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`h4`,{children:e}),(0,k.jsx)(`pre`,{className:`frame`,children:oe(t)})]},e)),_.length>1&&_.map((t,r)=>(0,k.jsxs)(l.Fragment,{children:[(0,k.jsx)(`h4`,{children:`Call #${r+1}'s answer`}),(0,k.jsx)(wt,{runId:e,call:t,id:`answer/${n}/${r}`,folds:d})]},r))]}):(0,k.jsx)(`p`,{className:`empty`,children:`Nothing produced yet.`})),o===`activity`&&(0,k.jsx)(kt,{block:t,index:n,folds:d,now:f})]})]})}function jt({detail:e,found:t,rounds:n,executions:r}){let{run:i}=e,a=t.filter(({status:e})=>e===`failed`).length,o=De(t,e.maxCostUsd),s=o.find(({usd:e})=>e!==null)?.usd,c=o.at(-1)?.usd,l=c!=null&&i.costUsd!==null?Math.min(100,i.costUsd/c*100):null,u=(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`h5`,{children:`Budgets allotted`}),(0,k.jsx)(`table`,{children:(0,k.jsx)(`tbody`,{children:o.map(({launch:e,usd:t,origin:n})=>(0,k.jsxs)(`tr`,{children:[(0,k.jsx)(`td`,{children:`#${e}`}),(0,k.jsx)(`td`,{className:`amount`,children:t===null?`—`:me(t,!1)}),(0,k.jsx)(`td`,{className:`origin`,children:n})]},e))})}),c!=null&&(0,k.jsx)(`p`,{children:`In force: ${C(c,i.costUsd,i.partial)}`})]}),d=[{name:`Started`,value:Je(t[0]?.startedAt??null)},i.status===`running`?{name:`Stage`,value:i.stage}:{name:`Ended`,value:Je(t.at(-1)?.endedAt??null)},{name:`Active time`,value:w(i.durationMs)},{name:s==null?`Cost`:`Cost / budget`,value:me(i.costUsd,i.partial),...s==null?{}:{note:`/ ${me(s,!1)}${c!=null&&c!==s?` → ${me(c,!1)}`:``}`,more:u,gauge:l??void 0}},{name:`Launches`,value:String(t.length),...a?{note:`${a} stopped`}:{}},{name:`Rounds`,value:String(n)},{name:`Stage executions`,value:String(r)}];return(0,k.jsxs)(`header`,{className:`run-head`,children:[(0,k.jsxs)(`div`,{className:`run-title`,children:[(0,k.jsx)(`h2`,{children:D(i.workflow,e.input)}),(0,k.jsx)(`span`,{className:`pill`,"data-state":i.status,children:i.status}),(0,k.jsx)(`span`,{className:`mono muted`,children:i.id}),(0,k.jsx)(`span`,{className:`run-links`,children:(e.data?Ae(e.result):Ie(Ve(e.result)??{})).map(({label:e,href:t})=>(0,k.jsx)(`a`,{href:t,target:`_blank`,rel:`noreferrer`,children:`${e} ↗`},t))})]}),Object.keys(e.input).length>0&&(0,k.jsx)(`p`,{className:`run-input`,children:re(e.input)}),(0,k.jsx)(`dl`,{className:`figures`,children:d.map(({name:e,value:t,note:n,more:r,gauge:i})=>(0,k.jsxs)(`div`,{children:[(0,k.jsx)(`dt`,{children:e}),(0,k.jsxs)(`dd`,{children:[r?(0,k.jsxs)(`button`,{type:`button`,className:`figure-more`,children:[t,n&&(0,k.jsx)(`small`,{children:` ${n}`})]}):(0,k.jsxs)(k.Fragment,{children:[t,n&&(0,k.jsx)(`small`,{children:` ${n}`})]}),r&&(0,k.jsx)(`div`,{className:`popover`,role:`tooltip`,children:r}),i!==void 0&&(0,k.jsx)(`span`,{className:`gauge`,children:(0,k.jsx)(`span`,{style:{width:`${i}%`}})})]})]},e))}),e.error&&!t.at(-1)?.cause&&(0,k.jsx)(`pre`,{className:`callout bad`,children:e.error})]})}var Mt={timeline:`Timeline`,cost:`Cost`,result:`Result`},Nt=e=>e.metaKey||e.ctrlKey||e.altKey||e.target instanceof HTMLElement&&e.target.closest(`input, textarea, select, [contenteditable]`)!==null;function Pt({detail:e,events:t,route:n,navigate:r}){let i=(0,l.useMemo)(()=>ne(t),[t]),a=(0,l.useMemo)(()=>ye(i),[i]),[o,s]=(0,l.useState)(new Set),[c,u]=(0,l.useState)(1),p=(0,l.useRef)(null),m={opened:o,toggle:(e,t)=>s(n=>$e(n,e,t))},h=Date.now(),g=xe(i,a,h),_=n.stage!==null&&i[n.stage]?n.stage:null,v=_??ve(i),y=v===null?void 0:i[v],b=a.find(({stages:e})=>e.some(({index:e})=>e===v)),x=n.view===`timeline`;(0,l.useEffect)(()=>{let e=e=>{if(!Nt(e)&&x&&v!==null){if(e.key===`j`||e.key===`k`){let t=v+(e.key===`j`?1:-1);t>=0&&t<i.length&&r({stage:t})}else e.key===`f`?r({stage:null}):/^[1-4]$/.test(e.key)&&r({tab:f[Number(e.key)-1]??`overview`})}};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[i.length,v,x,r]);let ee=a.reduce((e,t)=>e+be(t,h),0),te=()=>requestAnimationFrame(()=>{let e=p.current?.getBoundingClientRect().top;e!==void 0&&e>window.innerHeight*.7&&window.scrollBy({top:e-60,behavior:`smooth`})});return(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(jt,{detail:e,found:a,rounds:g.rounds.length,executions:i.length}),(0,k.jsx)(`div`,{className:`tabs run-tabs`,role:`tablist`,"aria-label":`Run views`,children:d.map(e=>(0,k.jsx)(`button`,{type:`button`,role:`tab`,"aria-selected":n.view===e,onClick:()=>r({view:e}),children:Mt[e]},e))}),(0,k.jsxs)(`div`,{className:`run-view`,role:`tabpanel`,children:[(0,k.jsxs)(l.Activity,{mode:n.view===`timeline`?`visible`:`hidden`,children:[a.length>0&&(0,k.jsxs)(`section`,{className:`card`,children:[(0,k.jsxs)(`h2`,{children:[`Launches (${a.length})`,(0,k.jsx)(`span`,{className:`hint`,children:`${w(ee)} active · pauses not to scale`})]}),(0,k.jsx)(ut,{found:a,now:h})]}),i.length>0&&(0,k.jsxs)(`section`,{className:`card`,children:[(0,k.jsxs)(`h2`,{children:[`Active time`,(0,k.jsx)(`span`,{className:`hint`,children:`a lane per agent · a correction taken starts a round · click to open · pinch or ⌘/Ctrl + scroll to zoom`}),(0,k.jsxs)(`span`,{className:`zoom`,children:[![1,2,4].includes(c)&&(0,k.jsx)(`span`,{className:`zoom-level`,children:`${c.toFixed(1)}×`}),[1,2,4].map(e=>(0,k.jsx)(`button`,{type:`button`,className:`chip`,"aria-pressed":c===e,onClick:()=>u(e),children:e===1?`Fit`:`${e}×`},e))]})]}),(0,k.jsx)(ft,{blocks:i,found:a,selected:v,select:e=>{r({stage:e}),te()},now:h,zoom:c,setZoom:u}),e.corrections.length>0&&(0,k.jsxs)(`p`,{className:`corrections`,children:[(0,k.jsx)(`span`,{className:`muted`,children:`Corrections`}),e.corrections.map(({key:e,count:t,max:n})=>(0,k.jsx)(`span`,{className:n!=null&&t>n?`chip mono bad`:`chip mono`,children:`${e} ${t}/${n??`?`}`},e))]})]}),(0,k.jsx)(`div`,{className:`drawer`,ref:p,children:y&&v!==null?(0,k.jsx)(At,{runId:e.run.id,block:y,index:v,count:i.length,round:g.bars[v]?.round??1,launch:b?.number??1,tab:n.tab,following:_===null,choose:(e,t)=>r({stage:e,tab:t}),follow:()=>r({stage:null}),folds:m,now:h}):(0,k.jsx)(`p`,{className:`empty`,children:`No stage yet.`})})]}),n.view===`cost`&&(0,k.jsx)(ht,{detail:e,found:a,now:h}),n.view===`result`&&(0,k.jsx)(gt,{detail:e,folds:m})]})]})}var Ft=2e3,It=1e3,Lt=`flow-ui.rail-folded`,Rt=e=>e instanceof Error?e.message:String(e),zt=e=>({placeholder:e?`Loading…`:`Select a run.`});function Bt(){try{return localStorage.getItem(Lt)===`true`}catch{return!1}}var Vt=class extends l.Component{state={error:void 0};static getDerivedStateFromError(e){return{error:e}}render(){return this.state.error?(0,k.jsx)(`p`,{className:`callout bad`,children:`This run cannot be shown: ${this.state.error.message}`}):this.props.children}},Ht=e=>e.metaKey||e.ctrlKey||e.altKey||e.target instanceof HTMLElement&&e.target.closest(`input, textarea, select, [contenteditable]`)!==null;function Ut(){let[e,t]=(0,l.useState)(()=>m(location.hash)),[n,r]=(0,l.useState)(null),[i,a]=(0,l.useState)(``),[o,s]=(0,l.useState)(()=>zt(m(location.hash).run)),[c,u]=(0,l.useState)(Bt),d=(0,l.useRef)(null),f=(0,l.useRef)(e);f.current=e;let p=(0,l.useMemo)(()=>v({load:e=>_(e),schedule:e=>setTimeout(e,It),cancel:e=>clearTimeout(e),show:(e,t)=>s({detail:e,events:[...t]}),fail:e=>{e instanceof g&&e.status===404?s({placeholder:`This run does not exist.`}):e instanceof g?s({placeholder:`This run cannot be read: ${e.message}`}):a(`Unavailable: ${Rt(e)}`)}}),[]),y=(0,l.useCallback)(e=>{e.run!==f.current.run&&(s(zt(e.run)),p.select(e.run)),f.current=e,t(e)},[p]),b=(0,l.useCallback)(e=>{if(e===f.current.run)return;let t={run:e,view:f.current.view,stage:null,tab:`overview`};y(t),location.hash=h(t)},[y]),x=(0,l.useCallback)(e=>{let t={...f.current,...e};y(t),history.replaceState(null,``,h(t)||location.pathname)},[y]);(0,l.useEffect)(()=>{p.select(f.current.run);let e=()=>y(m(location.hash));window.addEventListener(`hashchange`,e);let t=e=>{e.key!==`/`||Ht(e)||(e.preventDefault(),u(!1),d.current?.focus())};return window.addEventListener(`keydown`,t),()=>{window.removeEventListener(`hashchange`,e),window.removeEventListener(`keydown`,t),p.select(``)}},[p,y]),(0,l.useEffect)(()=>{let e,t=!1;async function n(){try{let e=await _(`api/runs`);if(t)return;r(e),document.title=e.title;let n=e.runs.find(e=>e.id===f.current.run);n?.updatedAt&&p.listed(n.id,n.updatedAt),a(`Updated ${new Date().toLocaleTimeString()}`)}catch(e){if(t)return;a(`Unavailable: ${Rt(e)}`)}e=setTimeout(n,Ft)}return n(),()=>{t=!0,clearTimeout(e)}},[p]);let ee=e=>{u(e);try{localStorage.setItem(Lt,String(e))}catch{}};return(0,k.jsxs)(`div`,{className:c?`shell folded`:`shell`,children:[(0,k.jsxs)(`header`,{className:`topbar`,children:[(0,k.jsx)(`button`,{type:`button`,className:`rail-toggle`,"aria-label":c?`Show the runs`:`Hide the runs`,"aria-expanded":!c,onClick:()=>ee(!c),children:`☰`}),(0,k.jsx)(`h1`,{children:n?.title??`runs`}),(0,k.jsx)(`span`,{className:`label`,children:n?.label}),(0,k.jsxs)(`nav`,{children:[n?.home&&(0,k.jsx)(`a`,{href:n.home.href,children:n.home.label}),(0,k.jsx)(`span`,{"aria-current":`page`,children:`Runs`})]}),(0,k.jsx)(`span`,{className:`updated`,title:i,children:i})]}),(0,k.jsxs)(`div`,{className:`app`,children:[(0,k.jsx)(Ze,{runs:n?.runs,selected:e.run,select:b,search:d}),(0,k.jsx)(`main`,{className:`run`,children:`detail`in o?(0,k.jsx)(Vt,{children:(0,k.jsx)(Pt,{detail:o.detail,events:o.events,route:e,navigate:x})},o.detail.run.id):(0,k.jsx)(`p`,{className:`empty`,children:o.placeholder})})]})]})}var Wt=document.getElementById(`root`);if(!Wt)throw Error(`Missing element #root`);(0,u.createRoot)(Wt).render((0,k.jsx)(Ut,{}));
|