@localstack/appinspector-ui 1.0.186 → 1.0.187
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/dist/index.cjs +98 -85
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +98 -85
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -16606,6 +16606,94 @@ var StatusMessage = ({
|
|
|
16606
16606
|
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_jsx_runtime130.Fragment, {});
|
|
16607
16607
|
};
|
|
16608
16608
|
|
|
16609
|
+
// src/utils/span-parents.ts
|
|
16610
|
+
var resolveParents = (spans) => {
|
|
16611
|
+
const byId = new Map(spans.map((span) => [span.span_id, span]));
|
|
16612
|
+
const parentOf = /* @__PURE__ */ new Map();
|
|
16613
|
+
for (const span of spans) {
|
|
16614
|
+
const parent = span.parent_span_id === null ? void 0 : byId.get(span.parent_span_id);
|
|
16615
|
+
if (parent && parent.span_id !== span.span_id && parent.trace_id === span.trace_id) {
|
|
16616
|
+
parentOf.set(span.span_id, parent.span_id);
|
|
16617
|
+
}
|
|
16618
|
+
}
|
|
16619
|
+
const causes = /* @__PURE__ */ new Map();
|
|
16620
|
+
const addCause = (spanId, causeId) => {
|
|
16621
|
+
const list = causes.get(spanId);
|
|
16622
|
+
if (list) list.push(causeId);
|
|
16623
|
+
else causes.set(spanId, [causeId]);
|
|
16624
|
+
};
|
|
16625
|
+
for (const span of spans) {
|
|
16626
|
+
for (const causeId of span.outgoing_link_span_ids ?? []) addCause(span.span_id, causeId);
|
|
16627
|
+
for (const effectId of span.incoming_link_span_ids ?? []) addCause(effectId, span.span_id);
|
|
16628
|
+
}
|
|
16629
|
+
const isAncestorOrSelf = (candidateId, spanId) => {
|
|
16630
|
+
let current = spanId;
|
|
16631
|
+
for (let hops = 0; current !== void 0 && hops <= spans.length; hops++) {
|
|
16632
|
+
if (current === candidateId) return true;
|
|
16633
|
+
current = parentOf.get(current);
|
|
16634
|
+
}
|
|
16635
|
+
return false;
|
|
16636
|
+
};
|
|
16637
|
+
for (const span of spans) {
|
|
16638
|
+
if (parentOf.has(span.span_id)) continue;
|
|
16639
|
+
const cause = causes.get(span.span_id)?.find((causeId) => byId.has(causeId) && !isAncestorOrSelf(span.span_id, causeId));
|
|
16640
|
+
if (cause !== void 0) parentOf.set(span.span_id, cause);
|
|
16641
|
+
}
|
|
16642
|
+
return parentOf;
|
|
16643
|
+
};
|
|
16644
|
+
|
|
16645
|
+
// src/components/trace-panel/timeline-tree.ts
|
|
16646
|
+
var compareNano = (left, right) => {
|
|
16647
|
+
const difference = BigInt(left) - BigInt(right);
|
|
16648
|
+
if (difference === 0n) return 0;
|
|
16649
|
+
return difference < 0n ? -1 : 1;
|
|
16650
|
+
};
|
|
16651
|
+
var buildTraceTree = (spans) => {
|
|
16652
|
+
const nodes2 = new Map(spans.map((span) => [span.span_id, { children: [], span }]));
|
|
16653
|
+
const parentOf = resolveParents(spans);
|
|
16654
|
+
const roots = [];
|
|
16655
|
+
for (const [spanId, node] of nodes2) {
|
|
16656
|
+
const parent = parentOf.get(spanId);
|
|
16657
|
+
if (parent === void 0) roots.push(node);
|
|
16658
|
+
else nodes2.get(parent)?.children.push(node);
|
|
16659
|
+
}
|
|
16660
|
+
const byStart = (left, right) => compareNano(left.span.start_time_unix_nano, right.span.start_time_unix_nano);
|
|
16661
|
+
roots.sort(byStart);
|
|
16662
|
+
for (const node of nodes2.values()) node.children.sort(byStart);
|
|
16663
|
+
return { parentOf, roots };
|
|
16664
|
+
};
|
|
16665
|
+
var findRootSpan = (spans, parentOf, spanId) => {
|
|
16666
|
+
let current = spanId;
|
|
16667
|
+
for (let hops = 0; hops <= spans.length; hops++) {
|
|
16668
|
+
const parent = parentOf.get(current);
|
|
16669
|
+
if (parent === void 0) break;
|
|
16670
|
+
current = parent;
|
|
16671
|
+
}
|
|
16672
|
+
return spans.find((span) => span.span_id === current);
|
|
16673
|
+
};
|
|
16674
|
+
var findFirstSpan = (nodes2, predicate) => {
|
|
16675
|
+
for (const node of nodes2) {
|
|
16676
|
+
if (predicate(node.span.span_id)) return node.span;
|
|
16677
|
+
const found = findFirstSpan(node.children, predicate);
|
|
16678
|
+
if (found) return found;
|
|
16679
|
+
}
|
|
16680
|
+
return void 0;
|
|
16681
|
+
};
|
|
16682
|
+
var getTraceBounds = (spans) => {
|
|
16683
|
+
let start;
|
|
16684
|
+
let end;
|
|
16685
|
+
for (const span of spans) {
|
|
16686
|
+
const spanStart = BigInt(span.start_time_unix_nano);
|
|
16687
|
+
const spanEnd = span.end_time_unix_nano ? BigInt(span.end_time_unix_nano) : spanStart;
|
|
16688
|
+
if (start === void 0 || spanStart < start) start = spanStart;
|
|
16689
|
+
if (end === void 0 || spanEnd > end) end = spanEnd;
|
|
16690
|
+
}
|
|
16691
|
+
if (start === void 0 || end === void 0) {
|
|
16692
|
+
return { durationMs: 0, startNano: 0n };
|
|
16693
|
+
}
|
|
16694
|
+
return { durationMs: Number(end - start) / 1e6, startNano: start };
|
|
16695
|
+
};
|
|
16696
|
+
|
|
16609
16697
|
// src/components/trace-panel/trace-sidebar.tsx
|
|
16610
16698
|
var import_icons_material15 = require("@mui/icons-material");
|
|
16611
16699
|
var import_material25 = require("@mui/material");
|
|
@@ -32123,86 +32211,6 @@ function useLocalStorage(key, initialValue) {
|
|
|
32123
32211
|
return [storedValue, setValue];
|
|
32124
32212
|
}
|
|
32125
32213
|
|
|
32126
|
-
// src/utils/span-parents.ts
|
|
32127
|
-
var resolveParents = (spans) => {
|
|
32128
|
-
const byId = new Map(spans.map((span) => [span.span_id, span]));
|
|
32129
|
-
const parentOf = /* @__PURE__ */ new Map();
|
|
32130
|
-
for (const span of spans) {
|
|
32131
|
-
const parent = span.parent_span_id === null ? void 0 : byId.get(span.parent_span_id);
|
|
32132
|
-
if (parent && parent.span_id !== span.span_id && parent.trace_id === span.trace_id) {
|
|
32133
|
-
parentOf.set(span.span_id, parent.span_id);
|
|
32134
|
-
}
|
|
32135
|
-
}
|
|
32136
|
-
const causes = /* @__PURE__ */ new Map();
|
|
32137
|
-
const addCause = (spanId, causeId) => {
|
|
32138
|
-
const list = causes.get(spanId);
|
|
32139
|
-
if (list) list.push(causeId);
|
|
32140
|
-
else causes.set(spanId, [causeId]);
|
|
32141
|
-
};
|
|
32142
|
-
for (const span of spans) {
|
|
32143
|
-
for (const causeId of span.outgoing_link_span_ids ?? []) addCause(span.span_id, causeId);
|
|
32144
|
-
for (const effectId of span.incoming_link_span_ids ?? []) addCause(effectId, span.span_id);
|
|
32145
|
-
}
|
|
32146
|
-
const isAncestorOrSelf = (candidateId, spanId) => {
|
|
32147
|
-
let current = spanId;
|
|
32148
|
-
for (let hops = 0; current !== void 0 && hops <= spans.length; hops++) {
|
|
32149
|
-
if (current === candidateId) return true;
|
|
32150
|
-
current = parentOf.get(current);
|
|
32151
|
-
}
|
|
32152
|
-
return false;
|
|
32153
|
-
};
|
|
32154
|
-
for (const span of spans) {
|
|
32155
|
-
if (parentOf.has(span.span_id)) continue;
|
|
32156
|
-
const cause = causes.get(span.span_id)?.find((causeId) => byId.has(causeId) && !isAncestorOrSelf(span.span_id, causeId));
|
|
32157
|
-
if (cause !== void 0) parentOf.set(span.span_id, cause);
|
|
32158
|
-
}
|
|
32159
|
-
return parentOf;
|
|
32160
|
-
};
|
|
32161
|
-
|
|
32162
|
-
// src/components/trace-panel/timeline-tree.ts
|
|
32163
|
-
var compareNano = (left, right) => {
|
|
32164
|
-
const difference = BigInt(left) - BigInt(right);
|
|
32165
|
-
if (difference === 0n) return 0;
|
|
32166
|
-
return difference < 0n ? -1 : 1;
|
|
32167
|
-
};
|
|
32168
|
-
var buildTraceTree = (spans) => {
|
|
32169
|
-
const nodes2 = new Map(spans.map((span) => [span.span_id, { children: [], span }]));
|
|
32170
|
-
const parentOf = resolveParents(spans);
|
|
32171
|
-
const roots = [];
|
|
32172
|
-
for (const [spanId, node] of nodes2) {
|
|
32173
|
-
const parent = parentOf.get(spanId);
|
|
32174
|
-
if (parent === void 0) roots.push(node);
|
|
32175
|
-
else nodes2.get(parent)?.children.push(node);
|
|
32176
|
-
}
|
|
32177
|
-
const byStart = (left, right) => compareNano(left.span.start_time_unix_nano, right.span.start_time_unix_nano);
|
|
32178
|
-
roots.sort(byStart);
|
|
32179
|
-
for (const node of nodes2.values()) node.children.sort(byStart);
|
|
32180
|
-
return { parentOf, roots };
|
|
32181
|
-
};
|
|
32182
|
-
var findRootSpan = (spans, parentOf, spanId) => {
|
|
32183
|
-
let current = spanId;
|
|
32184
|
-
for (let hops = 0; hops <= spans.length; hops++) {
|
|
32185
|
-
const parent = parentOf.get(current);
|
|
32186
|
-
if (parent === void 0) break;
|
|
32187
|
-
current = parent;
|
|
32188
|
-
}
|
|
32189
|
-
return spans.find((span) => span.span_id === current);
|
|
32190
|
-
};
|
|
32191
|
-
var getTraceBounds = (spans) => {
|
|
32192
|
-
let start;
|
|
32193
|
-
let end;
|
|
32194
|
-
for (const span of spans) {
|
|
32195
|
-
const spanStart = BigInt(span.start_time_unix_nano);
|
|
32196
|
-
const spanEnd = span.end_time_unix_nano ? BigInt(span.end_time_unix_nano) : spanStart;
|
|
32197
|
-
if (start === void 0 || spanStart < start) start = spanStart;
|
|
32198
|
-
if (end === void 0 || spanEnd > end) end = spanEnd;
|
|
32199
|
-
}
|
|
32200
|
-
if (start === void 0 || end === void 0) {
|
|
32201
|
-
return { durationMs: 0, startNano: 0n };
|
|
32202
|
-
}
|
|
32203
|
-
return { durationMs: Number(end - start) / 1e6, startNano: start };
|
|
32204
|
-
};
|
|
32205
|
-
|
|
32206
32214
|
// src/components/trace-panel/waterfall.tsx
|
|
32207
32215
|
var import_icons_material14 = require("@mui/icons-material");
|
|
32208
32216
|
var import_material24 = require("@mui/material");
|
|
@@ -33502,17 +33510,22 @@ var SpansListPage = () => {
|
|
|
33502
33510
|
const [bannerDismissed, setBannerDismissed] = (0, import_react65.useState)(false);
|
|
33503
33511
|
const [order2, setOrder] = useLocalStorage("spans-order", "oldest_first");
|
|
33504
33512
|
const [selectedSpanId, setSelectedSpanId] = (0, import_react65.useState)();
|
|
33513
|
+
const getTreeSpans = (0, import_react65.useCallback)((rootSpanId2) => Object.entries(compute.rows).filter(([, row]) => row.rootSpanId === rootSpanId2).map(([spanId]) => getSpan(spanId)).filter((span) => span !== void 0), [compute.rows, getSpan]);
|
|
33514
|
+
const latestRef = (0, import_react65.useRef)({ compute, getTreeSpans });
|
|
33515
|
+
(0, import_react65.useEffect)(() => {
|
|
33516
|
+
latestRef.current = { compute, getTreeSpans };
|
|
33517
|
+
}, [compute, getTreeSpans]);
|
|
33505
33518
|
const navigateToSpan = (0, import_react65.useCallback)((span) => {
|
|
33506
|
-
|
|
33519
|
+
const { compute: { queryActive, rows }, getTreeSpans: getSpans } = latestRef.current;
|
|
33520
|
+
const rootSpanId2 = rows[span.span_id]?.rootSpanId;
|
|
33521
|
+
const firstMatch = queryActive && rootSpanId2 !== void 0 ? findFirstSpan(buildTraceTree(getSpans(rootSpanId2)).roots, (spanId) => rows[spanId]?.matches ?? false) : void 0;
|
|
33522
|
+
setSelectedSpanId(firstMatch?.span_id ?? span.span_id);
|
|
33507
33523
|
}, []);
|
|
33508
33524
|
const closeSidebar = (0, import_react65.useCallback)(() => {
|
|
33509
33525
|
setSelectedSpanId(void 0);
|
|
33510
33526
|
}, []);
|
|
33511
33527
|
const rootSpanId = selectedSpanId === void 0 ? void 0 : compute.rows[selectedSpanId]?.rootSpanId;
|
|
33512
|
-
const treeSpans = (0, import_react65.useMemo)(() =>
|
|
33513
|
-
if (rootSpanId === void 0) return [];
|
|
33514
|
-
return Object.entries(compute.rows).filter(([, row]) => row.rootSpanId === rootSpanId).map(([spanId]) => getSpan(spanId)).filter((span) => span !== void 0);
|
|
33515
|
-
}, [compute.rows, getSpan, rootSpanId]);
|
|
33528
|
+
const treeSpans = (0, import_react65.useMemo)(() => rootSpanId === void 0 ? [] : getTreeSpans(rootSpanId), [getTreeSpans, rootSpanId]);
|
|
33516
33529
|
const spanMatches = (0, import_react65.useMemo)(
|
|
33517
33530
|
() => compute.queryActive ? (spanId) => compute.rows[spanId]?.matches ?? false : void 0,
|
|
33518
33531
|
[compute]
|