diff --git a/Cargo.lock b/Cargo.lock index 0c9f123..9ce979e 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -1839,6 +1839,7 @@ dependencies = [ "lex-store", "serde", "serde_json", + "soft-agent", "tempfile", "tiny_http", "ureq 2.12.1", diff --git a/crates/soft-trace-viewer/Cargo.toml b/crates/soft-trace-viewer/Cargo.toml index ec9b27d..c4b2789 100644 --- a/crates/soft-trace-viewer/Cargo.toml +++ b/crates/soft-trace-viewer/Cargo.toml @@ -20,5 +20,7 @@ serde_json = { workspace = true } tiny_http = { workspace = true } [dev-dependencies] -tempfile = "3" -ureq = { workspace = true } +tempfile = "3" +ureq = { workspace = true } +# End-to-end search test produces a real trace via soft-agent's runner. +soft-agent = { path = "../soft-agent" } diff --git a/crates/soft-trace-viewer/src/index.html b/crates/soft-trace-viewer/src/index.html index 1b6491a..566113f 100644 --- a/crates/soft-trace-viewer/src/index.html +++ b/crates/soft-trace-viewer/src/index.html @@ -20,6 +20,12 @@ display: flex; align-items: baseline; gap: 12px; } header h1 { font-size: 14px; margin: 0; font-weight: 600; } header .meta { color: var(--muted); font-size: 12px; } + header input.search { margin-left: auto; min-width: 240px; padding: 4px 8px; + font-size: 12px; background: var(--bg); color: var(--fg); + border: 1px solid var(--border); border-radius: 3px; + font-family: monospace; } + header input.search:focus { outline: none; border-color: var(--accent); } + header .search-count { color: var(--muted); font-size: 11px; min-width: 60px; } main { display: grid; grid-template-columns: 280px 1fr; height: calc(100vh - 38px); } #sidebar { border-right: 1px solid var(--border); overflow-y: auto; padding: 8px 0; background: var(--panel); } @@ -28,6 +34,11 @@ #sidebar .trace:hover { color: var(--fg); background: rgba(88, 166, 255, 0.05); } #sidebar .trace.active { color: var(--accent); border-left-color: var(--accent); background: rgba(88, 166, 255, 0.08); } + #sidebar .trace.dimmed { opacity: 0.25; } + #sidebar .trace .snippet { display: block; font-size: 10px; color: var(--muted); + margin-top: 2px; word-break: break-all; } + #sidebar .trace .snippet mark { background: rgba(88, 166, 255, 0.25); + color: var(--fg); padding: 0; } #content { overflow-y: auto; padding: 16px 24px; } .placeholder { color: var(--muted); font-style: italic; } .node { margin: 4px 0; } @@ -56,12 +67,19 @@

soft trace viewer

click a run id to load its trace + +
Select a trace from the sidebar.