@localstack/appinspector-ui 1.0.186 → 1.0.187

package/dist/index.js

@@ -16632,6 +16632,94 @@ var StatusMessage = ({
   return /* @__PURE__ */ jsx130(Fragment6, {});
 };
 
+// src/utils/span-parents.ts
+var resolveParents = (spans) => {
+  const byId = new Map(spans.map((span) => [span.span_id, span]));
+  const parentOf = /* @__PURE__ */ new Map();
+  for (const span of spans) {
+    const parent = span.parent_span_id === null ? void 0 : byId.get(span.parent_span_id);
+    if (parent && parent.span_id !== span.span_id && parent.trace_id === span.trace_id) {
+      parentOf.set(span.span_id, parent.span_id);
+    }
+  }
+  const causes = /* @__PURE__ */ new Map();
+  const addCause = (spanId, causeId) => {
+    const list = causes.get(spanId);
+    if (list) list.push(causeId);
+    else causes.set(spanId, [causeId]);
+  };
+  for (const span of spans) {
+    for (const causeId of span.outgoing_link_span_ids ?? []) addCause(span.span_id, causeId);
+    for (const effectId of span.incoming_link_span_ids ?? []) addCause(effectId, span.span_id);
+  }
+  const isAncestorOrSelf = (candidateId, spanId) => {
+    let current = spanId;
+    for (let hops = 0; current !== void 0 && hops <= spans.length; hops++) {
+      if (current === candidateId) return true;
+      current = parentOf.get(current);
+    }
+    return false;
+  };
+  for (const span of spans) {
+    if (parentOf.has(span.span_id)) continue;
+    const cause = causes.get(span.span_id)?.find((causeId) => byId.has(causeId) && !isAncestorOrSelf(span.span_id, causeId));
+    if (cause !== void 0) parentOf.set(span.span_id, cause);
+  }
+  return parentOf;
+};
+
+// src/components/trace-panel/timeline-tree.ts
+var compareNano = (left, right) => {
+  const difference = BigInt(left) - BigInt(right);
+  if (difference === 0n) return 0;
+  return difference < 0n ? -1 : 1;
+};
+var buildTraceTree = (spans) => {
+  const nodes2 = new Map(spans.map((span) => [span.span_id, { children: [], span }]));
+  const parentOf = resolveParents(spans);
+  const roots = [];
+  for (const [spanId, node] of nodes2) {
+    const parent = parentOf.get(spanId);
+    if (parent === void 0) roots.push(node);
+    else nodes2.get(parent)?.children.push(node);
+  }
+  const byStart = (left, right) => compareNano(left.span.start_time_unix_nano, right.span.start_time_unix_nano);
+  roots.sort(byStart);
+  for (const node of nodes2.values()) node.children.sort(byStart);
+  return { parentOf, roots };
+};
+var findRootSpan = (spans, parentOf, spanId) => {
+  let current = spanId;
+  for (let hops = 0; hops <= spans.length; hops++) {
+    const parent = parentOf.get(current);
+    if (parent === void 0) break;
+    current = parent;
+  }
+  return spans.find((span) => span.span_id === current);
+};
+var findFirstSpan = (nodes2, predicate) => {
+  for (const node of nodes2) {
+    if (predicate(node.span.span_id)) return node.span;
+    const found = findFirstSpan(node.children, predicate);
+    if (found) return found;
+  }
+  return void 0;
+};
+var getTraceBounds = (spans) => {
+  let start;
+  let end;
+  for (const span of spans) {
+    const spanStart = BigInt(span.start_time_unix_nano);
+    const spanEnd = span.end_time_unix_nano ? BigInt(span.end_time_unix_nano) : spanStart;
+    if (start === void 0 || spanStart < start) start = spanStart;
+    if (end === void 0 || spanEnd > end) end = spanEnd;
+  }
+  if (start === void 0 || end === void 0) {
+    return { durationMs: 0, startNano: 0n };
+  }
+  return { durationMs: Number(end - start) / 1e6, startNano: start };
+};
+
 // src/components/trace-panel/trace-sidebar.tsx
 import { Close as Close4 } from "@mui/icons-material";
 import { Box as Box20, IconButton as IconButton8, ToggleButton as ToggleButton3, ToggleButtonGroup as ToggleButtonGroup3, Typography as Typography15 } from "@mui/material";
@@ -32149,86 +32237,6 @@ function useLocalStorage(key, initialValue) {
   return [storedValue, setValue];
 }
 
-// src/utils/span-parents.ts
-var resolveParents = (spans) => {
-  const byId = new Map(spans.map((span) => [span.span_id, span]));
-  const parentOf = /* @__PURE__ */ new Map();
-  for (const span of spans) {
-    const parent = span.parent_span_id === null ? void 0 : byId.get(span.parent_span_id);
-    if (parent && parent.span_id !== span.span_id && parent.trace_id === span.trace_id) {
-      parentOf.set(span.span_id, parent.span_id);
-    }
-  }
-  const causes = /* @__PURE__ */ new Map();
-  const addCause = (spanId, causeId) => {
-    const list = causes.get(spanId);
-    if (list) list.push(causeId);
-    else causes.set(spanId, [causeId]);
-  };
-  for (const span of spans) {
-    for (const causeId of span.outgoing_link_span_ids ?? []) addCause(span.span_id, causeId);
-    for (const effectId of span.incoming_link_span_ids ?? []) addCause(effectId, span.span_id);
-  }
-  const isAncestorOrSelf = (candidateId, spanId) => {
-    let current = spanId;
-    for (let hops = 0; current !== void 0 && hops <= spans.length; hops++) {
-      if (current === candidateId) return true;
-      current = parentOf.get(current);
-    }
-    return false;
-  };
-  for (const span of spans) {
-    if (parentOf.has(span.span_id)) continue;
-    const cause = causes.get(span.span_id)?.find((causeId) => byId.has(causeId) && !isAncestorOrSelf(span.span_id, causeId));
-    if (cause !== void 0) parentOf.set(span.span_id, cause);
-  }
-  return parentOf;
-};
-
-// src/components/trace-panel/timeline-tree.ts
-var compareNano = (left, right) => {
-  const difference = BigInt(left) - BigInt(right);
-  if (difference === 0n) return 0;
-  return difference < 0n ? -1 : 1;
-};
-var buildTraceTree = (spans) => {
-  const nodes2 = new Map(spans.map((span) => [span.span_id, { children: [], span }]));
-  const parentOf = resolveParents(spans);
-  const roots = [];
-  for (const [spanId, node] of nodes2) {
-    const parent = parentOf.get(spanId);
-    if (parent === void 0) roots.push(node);
-    else nodes2.get(parent)?.children.push(node);
-  }
-  const byStart = (left, right) => compareNano(left.span.start_time_unix_nano, right.span.start_time_unix_nano);
-  roots.sort(byStart);
-  for (const node of nodes2.values()) node.children.sort(byStart);
-  return { parentOf, roots };
-};
-var findRootSpan = (spans, parentOf, spanId) => {
-  let current = spanId;
-  for (let hops = 0; hops <= spans.length; hops++) {
-    const parent = parentOf.get(current);
-    if (parent === void 0) break;
-    current = parent;
-  }
-  return spans.find((span) => span.span_id === current);
-};
-var getTraceBounds = (spans) => {
-  let start;
-  let end;
-  for (const span of spans) {
-    const spanStart = BigInt(span.start_time_unix_nano);
-    const spanEnd = span.end_time_unix_nano ? BigInt(span.end_time_unix_nano) : spanStart;
-    if (start === void 0 || spanStart < start) start = spanStart;
-    if (end === void 0 || spanEnd > end) end = spanEnd;
-  }
-  if (start === void 0 || end === void 0) {
-    return { durationMs: 0, startNano: 0n };
-  }
-  return { durationMs: Number(end - start) / 1e6, startNano: start };
-};
-
 // src/components/trace-panel/waterfall.tsx
 import { AccountTreeOutlined, Cancel as Cancel7, Error as ErrorIcon5, FormatListBulleted, KeyboardArrowDown as KeyboardArrowDown2, KeyboardArrowRight as KeyboardArrowRight2 } from "@mui/icons-material";
 import { Box as Box19, ButtonBase, ToggleButton as ToggleButton2, ToggleButtonGroup as ToggleButtonGroup2, Typography as Typography14 } from "@mui/material";
@@ -33528,17 +33536,22 @@ var SpansListPage = () => {
   const [bannerDismissed, setBannerDismissed] = useState22(false);
   const [order2, setOrder] = useLocalStorage("spans-order", "oldest_first");
   const [selectedSpanId, setSelectedSpanId] = useState22();
+  const getTreeSpans = useCallback12((rootSpanId2) => Object.entries(compute.rows).filter(([, row]) => row.rootSpanId === rootSpanId2).map(([spanId]) => getSpan(spanId)).filter((span) => span !== void 0), [compute.rows, getSpan]);
+  const latestRef = useRef19({ compute, getTreeSpans });
+  useEffect22(() => {
+    latestRef.current = { compute, getTreeSpans };
+  }, [compute, getTreeSpans]);
   const navigateToSpan = useCallback12((span) => {
-    setSelectedSpanId(span.span_id);
+    const { compute: { queryActive, rows }, getTreeSpans: getSpans } = latestRef.current;
+    const rootSpanId2 = rows[span.span_id]?.rootSpanId;
+    const firstMatch = queryActive && rootSpanId2 !== void 0 ? findFirstSpan(buildTraceTree(getSpans(rootSpanId2)).roots, (spanId) => rows[spanId]?.matches ?? false) : void 0;
+    setSelectedSpanId(firstMatch?.span_id ?? span.span_id);
   }, []);
   const closeSidebar = useCallback12(() => {
     setSelectedSpanId(void 0);
   }, []);
   const rootSpanId = selectedSpanId === void 0 ? void 0 : compute.rows[selectedSpanId]?.rootSpanId;
-  const treeSpans = useMemo13(() => {
-    if (rootSpanId === void 0) return [];
-    return Object.entries(compute.rows).filter(([, row]) => row.rootSpanId === rootSpanId).map(([spanId]) => getSpan(spanId)).filter((span) => span !== void 0);
-  }, [compute.rows, getSpan, rootSpanId]);
+  const treeSpans = useMemo13(() => rootSpanId === void 0 ? [] : getTreeSpans(rootSpanId), [getTreeSpans, rootSpanId]);
   const spanMatches = useMemo13(
     () => compute.queryActive ? (spanId) => compute.rows[spanId]?.matches ?? false : void 0,
     [compute]