wu-sheng opened a new pull request, #70: URL: https://github.com/apache/skywalking-horizon-ui/pull/70
## Why The Zipkin trace view (mesh / k8s / Envoy-ALS layers) looked and behaved like a second-class citizen next to the SkyWalking-native trace view — a different waterfall, a side-panel span detail, browser `<datalist>` filters that wouldn't reopen, and no duration distribution. It also used a separate `?openZipkinTraceId=` share param even though `/layer/<layer>/trace` already implies the source. ## What **Zipkin trace detail + popout now mirror the native trace experience** (copy-and-adapted, since the wire fields differ): - KPI strip (started / duration / spans / services) + service legend. - **Duration-distribution scatter** — drag to filter the list, click a dot to open the trace (ported from native, adapted to Zipkin's µs units). - Time-positioned **waterfall bars** with the service · operation + kind/status affordances *inside* the bar, a time axis, and the duration flipped inside near-full-width bars (no stray x-scrollbar). - **Centered span-detail modal** (was a cramped side panel). - Zipkin annotation codes (`cr` / `cs` / `sr` / `ss` …) get an inline plain-language hint; the raw OAP value is kept verbatim. **Unified shareable links** — both native and Zipkin open from a single `?traceId=` under the layer's trace tab. The two globally-mounted popouts self-select by trace-ID shape (native is dotted `x.y.z`, Zipkin is bare 16/32-hex), so `/layer/<layer>/trace?traceId=…` always opens the right viewer. The separate `?openZipkinTraceId=` param is gone. **Searchable, on-theme filter dropdowns** — native Instance/Endpoint and Zipkin Service/Remote/Span name now use the shared `TypeaheadSelect` (dark, type-to-filter, reopens after a pick); small enums (status/order/limit) stay plain `<select>`. ## Validation - `type-check`, `lint`, `build` all green. - Reviewed live against the demo OAP via HMR through the whole iteration (waterfall, span modal, scatter, copy id/url, the `?traceId=` open flow). - UI-only — no OAP query / wire / BFF changes. ## Notes The duration scatter was ported by an assistant agent and validated here; the side-by-side filter/distribution strip matches native's `4fr 1fr` layout. -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
