@localstack/appinspector-ui 1.0.72 → 1.0.73
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 +2754 -553
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +2748 -533
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
package/dist/index.cjs
CHANGED
|
@@ -8,6 +8,9 @@ var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
|
8
8
|
var __esm = (fn, res) => function __init() {
|
|
9
9
|
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
10
10
|
};
|
|
11
|
+
var __commonJS = (cb2, mod) => function __require() {
|
|
12
|
+
return mod || (0, cb2[__getOwnPropNames(cb2)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
13
|
+
};
|
|
11
14
|
var __export = (target, all) => {
|
|
12
15
|
for (var name in all)
|
|
13
16
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -67,6 +70,297 @@ var init_is_prop_valid_browser_esm = __esm({
|
|
|
67
70
|
}
|
|
68
71
|
});
|
|
69
72
|
|
|
73
|
+
// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js
|
|
74
|
+
var require_use_sync_external_store_shim_development = __commonJS({
|
|
75
|
+
"node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) {
|
|
76
|
+
"use strict";
|
|
77
|
+
(function() {
|
|
78
|
+
function is(x2, y) {
|
|
79
|
+
return x2 === y && (0 !== x2 || 1 / x2 === 1 / y) || x2 !== x2 && y !== y;
|
|
80
|
+
}
|
|
81
|
+
function useSyncExternalStore$2(subscribe, getSnapshot) {
|
|
82
|
+
didWarnOld18Alpha || void 0 === React124.startTransition || (didWarnOld18Alpha = true, console.error(
|
|
83
|
+
"You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
|
|
84
|
+
));
|
|
85
|
+
var value = getSnapshot();
|
|
86
|
+
if (!didWarnUncachedGetSnapshot) {
|
|
87
|
+
var cachedValue = getSnapshot();
|
|
88
|
+
objectIs(value, cachedValue) || (console.error(
|
|
89
|
+
"The result of getSnapshot should be cached to avoid an infinite loop"
|
|
90
|
+
), didWarnUncachedGetSnapshot = true);
|
|
91
|
+
}
|
|
92
|
+
cachedValue = useState16({
|
|
93
|
+
inst: { value, getSnapshot }
|
|
94
|
+
});
|
|
95
|
+
var inst = cachedValue[0].inst, forceUpdate = cachedValue[1];
|
|
96
|
+
useLayoutEffect2(
|
|
97
|
+
function() {
|
|
98
|
+
inst.value = value;
|
|
99
|
+
inst.getSnapshot = getSnapshot;
|
|
100
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
101
|
+
},
|
|
102
|
+
[subscribe, value, getSnapshot]
|
|
103
|
+
);
|
|
104
|
+
useEffect20(
|
|
105
|
+
function() {
|
|
106
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
107
|
+
return subscribe(function() {
|
|
108
|
+
checkIfSnapshotChanged(inst) && forceUpdate({ inst });
|
|
109
|
+
});
|
|
110
|
+
},
|
|
111
|
+
[subscribe]
|
|
112
|
+
);
|
|
113
|
+
useDebugValue2(value);
|
|
114
|
+
return value;
|
|
115
|
+
}
|
|
116
|
+
function checkIfSnapshotChanged(inst) {
|
|
117
|
+
var latestGetSnapshot = inst.getSnapshot;
|
|
118
|
+
inst = inst.value;
|
|
119
|
+
try {
|
|
120
|
+
var nextValue = latestGetSnapshot();
|
|
121
|
+
return !objectIs(inst, nextValue);
|
|
122
|
+
} catch (error) {
|
|
123
|
+
return true;
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
function useSyncExternalStore$1(subscribe, getSnapshot) {
|
|
127
|
+
return getSnapshot();
|
|
128
|
+
}
|
|
129
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
130
|
+
var React124 = require("react"), objectIs = "function" === typeof Object.is ? Object.is : is, useState16 = React124.useState, useEffect20 = React124.useEffect, useLayoutEffect2 = React124.useLayoutEffect, useDebugValue2 = React124.useDebugValue, didWarnOld18Alpha = false, didWarnUncachedGetSnapshot = false, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
|
|
131
|
+
exports.useSyncExternalStore = void 0 !== React124.useSyncExternalStore ? React124.useSyncExternalStore : shim;
|
|
132
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
133
|
+
})();
|
|
134
|
+
}
|
|
135
|
+
});
|
|
136
|
+
|
|
137
|
+
// node_modules/use-sync-external-store/shim/index.js
|
|
138
|
+
var require_shim = __commonJS({
|
|
139
|
+
"node_modules/use-sync-external-store/shim/index.js"(exports, module2) {
|
|
140
|
+
"use strict";
|
|
141
|
+
if (false) {
|
|
142
|
+
module2.exports = null;
|
|
143
|
+
} else {
|
|
144
|
+
module2.exports = require_use_sync_external_store_shim_development();
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
});
|
|
148
|
+
|
|
149
|
+
// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js
|
|
150
|
+
var require_with_selector_development = __commonJS({
|
|
151
|
+
"node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js"(exports) {
|
|
152
|
+
"use strict";
|
|
153
|
+
(function() {
|
|
154
|
+
function is(x2, y) {
|
|
155
|
+
return x2 === y && (0 !== x2 || 1 / x2 === 1 / y) || x2 !== x2 && y !== y;
|
|
156
|
+
}
|
|
157
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
|
|
158
|
+
var React124 = require("react"), shim = require_shim(), objectIs = "function" === typeof Object.is ? Object.is : is, useSyncExternalStore = shim.useSyncExternalStore, useRef15 = React124.useRef, useEffect20 = React124.useEffect, useMemo13 = React124.useMemo, useDebugValue2 = React124.useDebugValue;
|
|
159
|
+
exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector2, isEqual) {
|
|
160
|
+
var instRef = useRef15(null);
|
|
161
|
+
if (null === instRef.current) {
|
|
162
|
+
var inst = { hasValue: false, value: null };
|
|
163
|
+
instRef.current = inst;
|
|
164
|
+
} else inst = instRef.current;
|
|
165
|
+
instRef = useMemo13(
|
|
166
|
+
function() {
|
|
167
|
+
function memoizedSelector(nextSnapshot) {
|
|
168
|
+
if (!hasMemo) {
|
|
169
|
+
hasMemo = true;
|
|
170
|
+
memoizedSnapshot = nextSnapshot;
|
|
171
|
+
nextSnapshot = selector2(nextSnapshot);
|
|
172
|
+
if (void 0 !== isEqual && inst.hasValue) {
|
|
173
|
+
var currentSelection = inst.value;
|
|
174
|
+
if (isEqual(currentSelection, nextSnapshot))
|
|
175
|
+
return memoizedSelection = currentSelection;
|
|
176
|
+
}
|
|
177
|
+
return memoizedSelection = nextSnapshot;
|
|
178
|
+
}
|
|
179
|
+
currentSelection = memoizedSelection;
|
|
180
|
+
if (objectIs(memoizedSnapshot, nextSnapshot))
|
|
181
|
+
return currentSelection;
|
|
182
|
+
var nextSelection = selector2(nextSnapshot);
|
|
183
|
+
if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
|
|
184
|
+
return memoizedSnapshot = nextSnapshot, currentSelection;
|
|
185
|
+
memoizedSnapshot = nextSnapshot;
|
|
186
|
+
return memoizedSelection = nextSelection;
|
|
187
|
+
}
|
|
188
|
+
var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
|
|
189
|
+
return [
|
|
190
|
+
function() {
|
|
191
|
+
return memoizedSelector(getSnapshot());
|
|
192
|
+
},
|
|
193
|
+
null === maybeGetServerSnapshot ? void 0 : function() {
|
|
194
|
+
return memoizedSelector(maybeGetServerSnapshot());
|
|
195
|
+
}
|
|
196
|
+
];
|
|
197
|
+
},
|
|
198
|
+
[getSnapshot, getServerSnapshot, selector2, isEqual]
|
|
199
|
+
);
|
|
200
|
+
var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
|
|
201
|
+
useEffect20(
|
|
202
|
+
function() {
|
|
203
|
+
inst.hasValue = true;
|
|
204
|
+
inst.value = value;
|
|
205
|
+
},
|
|
206
|
+
[value]
|
|
207
|
+
);
|
|
208
|
+
useDebugValue2(value);
|
|
209
|
+
return value;
|
|
210
|
+
};
|
|
211
|
+
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
|
|
212
|
+
})();
|
|
213
|
+
}
|
|
214
|
+
});
|
|
215
|
+
|
|
216
|
+
// node_modules/use-sync-external-store/shim/with-selector.js
|
|
217
|
+
var require_with_selector = __commonJS({
|
|
218
|
+
"node_modules/use-sync-external-store/shim/with-selector.js"(exports, module2) {
|
|
219
|
+
"use strict";
|
|
220
|
+
if (false) {
|
|
221
|
+
module2.exports = null;
|
|
222
|
+
} else {
|
|
223
|
+
module2.exports = require_with_selector_development();
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
});
|
|
227
|
+
|
|
228
|
+
// node_modules/toggle-selection/index.js
|
|
229
|
+
var require_toggle_selection = __commonJS({
|
|
230
|
+
"node_modules/toggle-selection/index.js"(exports, module2) {
|
|
231
|
+
"use strict";
|
|
232
|
+
module2.exports = function() {
|
|
233
|
+
var selection = document.getSelection();
|
|
234
|
+
if (!selection.rangeCount) {
|
|
235
|
+
return function() {
|
|
236
|
+
};
|
|
237
|
+
}
|
|
238
|
+
var active = document.activeElement;
|
|
239
|
+
var ranges = [];
|
|
240
|
+
for (var i2 = 0; i2 < selection.rangeCount; i2++) {
|
|
241
|
+
ranges.push(selection.getRangeAt(i2));
|
|
242
|
+
}
|
|
243
|
+
switch (active.tagName.toUpperCase()) {
|
|
244
|
+
// .toUpperCase handles XHTML
|
|
245
|
+
case "INPUT":
|
|
246
|
+
case "TEXTAREA":
|
|
247
|
+
active.blur();
|
|
248
|
+
break;
|
|
249
|
+
default:
|
|
250
|
+
active = null;
|
|
251
|
+
break;
|
|
252
|
+
}
|
|
253
|
+
selection.removeAllRanges();
|
|
254
|
+
return function() {
|
|
255
|
+
selection.type === "Caret" && selection.removeAllRanges();
|
|
256
|
+
if (!selection.rangeCount) {
|
|
257
|
+
ranges.forEach(function(range) {
|
|
258
|
+
selection.addRange(range);
|
|
259
|
+
});
|
|
260
|
+
}
|
|
261
|
+
active && active.focus();
|
|
262
|
+
};
|
|
263
|
+
};
|
|
264
|
+
}
|
|
265
|
+
});
|
|
266
|
+
|
|
267
|
+
// node_modules/copy-to-clipboard/index.js
|
|
268
|
+
var require_copy_to_clipboard = __commonJS({
|
|
269
|
+
"node_modules/copy-to-clipboard/index.js"(exports, module2) {
|
|
270
|
+
"use strict";
|
|
271
|
+
var deselectCurrent = require_toggle_selection();
|
|
272
|
+
var clipboardToIE11Formatting = {
|
|
273
|
+
"text/plain": "Text",
|
|
274
|
+
"text/html": "Url",
|
|
275
|
+
"default": "Text"
|
|
276
|
+
};
|
|
277
|
+
var defaultMessage = "Copy to clipboard: #{key}, Enter";
|
|
278
|
+
function format2(message) {
|
|
279
|
+
var copyKey = (/mac os x/i.test(navigator.userAgent) ? "\u2318" : "Ctrl") + "+C";
|
|
280
|
+
return message.replace(/#{\s*key\s*}/g, copyKey);
|
|
281
|
+
}
|
|
282
|
+
function copy(text2, options) {
|
|
283
|
+
var debug2, message, reselectPrevious, range, selection, mark, success = false;
|
|
284
|
+
if (!options) {
|
|
285
|
+
options = {};
|
|
286
|
+
}
|
|
287
|
+
debug2 = options.debug || false;
|
|
288
|
+
try {
|
|
289
|
+
reselectPrevious = deselectCurrent();
|
|
290
|
+
range = document.createRange();
|
|
291
|
+
selection = document.getSelection();
|
|
292
|
+
mark = document.createElement("span");
|
|
293
|
+
mark.textContent = text2;
|
|
294
|
+
mark.ariaHidden = "true";
|
|
295
|
+
mark.style.all = "unset";
|
|
296
|
+
mark.style.position = "fixed";
|
|
297
|
+
mark.style.top = 0;
|
|
298
|
+
mark.style.clip = "rect(0, 0, 0, 0)";
|
|
299
|
+
mark.style.whiteSpace = "pre";
|
|
300
|
+
mark.style.webkitUserSelect = "text";
|
|
301
|
+
mark.style.MozUserSelect = "text";
|
|
302
|
+
mark.style.msUserSelect = "text";
|
|
303
|
+
mark.style.userSelect = "text";
|
|
304
|
+
mark.addEventListener("copy", function(e2) {
|
|
305
|
+
e2.stopPropagation();
|
|
306
|
+
if (options.format) {
|
|
307
|
+
e2.preventDefault();
|
|
308
|
+
if (typeof e2.clipboardData === "undefined") {
|
|
309
|
+
debug2 && console.warn("unable to use e.clipboardData");
|
|
310
|
+
debug2 && console.warn("trying IE specific stuff");
|
|
311
|
+
window.clipboardData.clearData();
|
|
312
|
+
var format3 = clipboardToIE11Formatting[options.format] || clipboardToIE11Formatting["default"];
|
|
313
|
+
window.clipboardData.setData(format3, text2);
|
|
314
|
+
} else {
|
|
315
|
+
e2.clipboardData.clearData();
|
|
316
|
+
e2.clipboardData.setData(options.format, text2);
|
|
317
|
+
}
|
|
318
|
+
}
|
|
319
|
+
if (options.onCopy) {
|
|
320
|
+
e2.preventDefault();
|
|
321
|
+
options.onCopy(e2.clipboardData);
|
|
322
|
+
}
|
|
323
|
+
});
|
|
324
|
+
document.body.appendChild(mark);
|
|
325
|
+
range.selectNodeContents(mark);
|
|
326
|
+
selection.addRange(range);
|
|
327
|
+
var successful = document.execCommand("copy");
|
|
328
|
+
if (!successful) {
|
|
329
|
+
throw new Error("copy command was unsuccessful");
|
|
330
|
+
}
|
|
331
|
+
success = true;
|
|
332
|
+
} catch (err) {
|
|
333
|
+
debug2 && console.error("unable to copy using execCommand: ", err);
|
|
334
|
+
debug2 && console.warn("trying IE specific stuff");
|
|
335
|
+
try {
|
|
336
|
+
window.clipboardData.setData(options.format || "text", text2);
|
|
337
|
+
options.onCopy && options.onCopy(window.clipboardData);
|
|
338
|
+
success = true;
|
|
339
|
+
} catch (err2) {
|
|
340
|
+
debug2 && console.error("unable to copy using clipboardData: ", err2);
|
|
341
|
+
debug2 && console.error("falling back to prompt");
|
|
342
|
+
message = format2("message" in options ? options.message : defaultMessage);
|
|
343
|
+
window.prompt(message, text2);
|
|
344
|
+
}
|
|
345
|
+
} finally {
|
|
346
|
+
if (selection) {
|
|
347
|
+
if (typeof selection.removeRange == "function") {
|
|
348
|
+
selection.removeRange(range);
|
|
349
|
+
} else {
|
|
350
|
+
selection.removeAllRanges();
|
|
351
|
+
}
|
|
352
|
+
}
|
|
353
|
+
if (mark) {
|
|
354
|
+
document.body.removeChild(mark);
|
|
355
|
+
}
|
|
356
|
+
reselectPrevious();
|
|
357
|
+
}
|
|
358
|
+
return success;
|
|
359
|
+
}
|
|
360
|
+
module2.exports = copy;
|
|
361
|
+
}
|
|
362
|
+
});
|
|
363
|
+
|
|
70
364
|
// node_modules/@smithy/util-utf8/dist-es/fromUtf8.browser.js
|
|
71
365
|
var fromUtf8;
|
|
72
366
|
var init_fromUtf8_browser = __esm({
|
|
@@ -385,8 +679,8 @@ __export(index_exports, {
|
|
|
385
679
|
module.exports = __toCommonJS(index_exports);
|
|
386
680
|
|
|
387
681
|
// src/pages/spans-list-page.tsx
|
|
388
|
-
var
|
|
389
|
-
var
|
|
682
|
+
var import_material20 = require("@mui/material");
|
|
683
|
+
var import_react64 = require("react");
|
|
390
684
|
|
|
391
685
|
// src/components/spans-list/spans-list.tsx
|
|
392
686
|
var import_material5 = require("@mui/material");
|
|
@@ -3230,14 +3524,14 @@ function __values(o2) {
|
|
|
3230
3524
|
function __read(o2, n2) {
|
|
3231
3525
|
var m2 = typeof Symbol === "function" && o2[Symbol.iterator];
|
|
3232
3526
|
if (!m2) return o2;
|
|
3233
|
-
var i2 = m2.call(o2),
|
|
3527
|
+
var i2 = m2.call(o2), r3, ar = [], e2;
|
|
3234
3528
|
try {
|
|
3235
|
-
while ((n2 === void 0 || n2-- > 0) && !(
|
|
3529
|
+
while ((n2 === void 0 || n2-- > 0) && !(r3 = i2.next()).done) ar.push(r3.value);
|
|
3236
3530
|
} catch (error) {
|
|
3237
3531
|
e2 = { error };
|
|
3238
3532
|
} finally {
|
|
3239
3533
|
try {
|
|
3240
|
-
if (
|
|
3534
|
+
if (r3 && !r3.done && (m2 = i2["return"])) m2.call(i2);
|
|
3241
3535
|
} finally {
|
|
3242
3536
|
if (e2) throw e2.error;
|
|
3243
3537
|
}
|
|
@@ -3953,27 +4247,27 @@ var rgba = {
|
|
|
3953
4247
|
|
|
3954
4248
|
// node_modules/style-value-types/dist/es/color/hex.mjs
|
|
3955
4249
|
function parseHex(v2) {
|
|
3956
|
-
let
|
|
4250
|
+
let r3 = "";
|
|
3957
4251
|
let g2 = "";
|
|
3958
4252
|
let b3 = "";
|
|
3959
4253
|
let a3 = "";
|
|
3960
4254
|
if (v2.length > 5) {
|
|
3961
|
-
|
|
4255
|
+
r3 = v2.substr(1, 2);
|
|
3962
4256
|
g2 = v2.substr(3, 2);
|
|
3963
4257
|
b3 = v2.substr(5, 2);
|
|
3964
4258
|
a3 = v2.substr(7, 2);
|
|
3965
4259
|
} else {
|
|
3966
|
-
|
|
4260
|
+
r3 = v2.substr(1, 1);
|
|
3967
4261
|
g2 = v2.substr(2, 1);
|
|
3968
4262
|
b3 = v2.substr(3, 1);
|
|
3969
4263
|
a3 = v2.substr(4, 1);
|
|
3970
|
-
|
|
4264
|
+
r3 += r3;
|
|
3971
4265
|
g2 += g2;
|
|
3972
4266
|
b3 += b3;
|
|
3973
4267
|
a3 += a3;
|
|
3974
4268
|
}
|
|
3975
4269
|
return {
|
|
3976
|
-
red: parseInt(
|
|
4270
|
+
red: parseInt(r3, 16),
|
|
3977
4271
|
green: parseInt(g2, 16),
|
|
3978
4272
|
blue: parseInt(b3, 16),
|
|
3979
4273
|
alpha: a3 ? parseInt(a3, 16) / 255 : 1
|
|
@@ -13845,143 +14139,2025 @@ var useSpans = () => {
|
|
|
13845
14139
|
|
|
13846
14140
|
// src/pages/trace-graph-page.tsx
|
|
13847
14141
|
var import_icons_material11 = require("@mui/icons-material");
|
|
13848
|
-
var
|
|
14142
|
+
var import_material19 = require("@mui/material");
|
|
13849
14143
|
var import_styles = require("@mui/material/styles");
|
|
13850
|
-
var
|
|
13851
|
-
var
|
|
14144
|
+
var import_react62 = require("@xyflow/react");
|
|
14145
|
+
var import_react63 = require("react");
|
|
13852
14146
|
|
|
13853
14147
|
// src/components/event-details/event-details.tsx
|
|
13854
|
-
var
|
|
13855
|
-
var
|
|
14148
|
+
var import_icons_material8 = require("@mui/icons-material");
|
|
14149
|
+
var import_material14 = require("@mui/material");
|
|
13856
14150
|
|
|
13857
|
-
//
|
|
13858
|
-
|
|
13859
|
-
|
|
13860
|
-
|
|
14151
|
+
// node_modules/@textea/json-viewer/dist/index.mjs
|
|
14152
|
+
var import_jsx_runtime129 = require("react/jsx-runtime");
|
|
14153
|
+
var import_material7 = require("@mui/material");
|
|
14154
|
+
var import_react49 = require("react");
|
|
14155
|
+
|
|
14156
|
+
// node_modules/zustand/esm/vanilla.mjs
|
|
14157
|
+
var import_meta = {};
|
|
14158
|
+
var createStoreImpl = (createState2) => {
|
|
14159
|
+
let state;
|
|
14160
|
+
const listeners = /* @__PURE__ */ new Set();
|
|
14161
|
+
const setState = (partial, replace) => {
|
|
14162
|
+
const nextState = typeof partial === "function" ? partial(state) : partial;
|
|
14163
|
+
if (!Object.is(nextState, state)) {
|
|
14164
|
+
const previousState = state;
|
|
14165
|
+
state = (replace != null ? replace : typeof nextState !== "object" || nextState === null) ? nextState : Object.assign({}, state, nextState);
|
|
14166
|
+
listeners.forEach((listener) => listener(state, previousState));
|
|
14167
|
+
}
|
|
14168
|
+
};
|
|
14169
|
+
const getState = () => state;
|
|
14170
|
+
const getInitialState = () => initialState;
|
|
14171
|
+
const subscribe = (listener) => {
|
|
14172
|
+
listeners.add(listener);
|
|
14173
|
+
return () => listeners.delete(listener);
|
|
14174
|
+
};
|
|
14175
|
+
const destroy = () => {
|
|
14176
|
+
if ((import_meta.env ? import_meta.env.MODE : void 0) !== "production") {
|
|
14177
|
+
console.warn(
|
|
14178
|
+
"[DEPRECATED] The `destroy` method will be unsupported in a future version. Instead use unsubscribe function returned by subscribe. Everything will be garbage-collected if store is garbage-collected."
|
|
14179
|
+
);
|
|
14180
|
+
}
|
|
14181
|
+
listeners.clear();
|
|
14182
|
+
};
|
|
14183
|
+
const api = { setState, getState, getInitialState, subscribe, destroy };
|
|
14184
|
+
const initialState = state = createState2(setState, getState, api);
|
|
14185
|
+
return api;
|
|
14186
|
+
};
|
|
14187
|
+
var createStore = (createState2) => createState2 ? createStoreImpl(createState2) : createStoreImpl;
|
|
14188
|
+
|
|
14189
|
+
// node_modules/zustand/esm/index.mjs
|
|
14190
|
+
var import_react48 = __toESM(require("react"), 1);
|
|
14191
|
+
var import_with_selector = __toESM(require_with_selector(), 1);
|
|
14192
|
+
var import_meta2 = {};
|
|
14193
|
+
var { useDebugValue } = import_react48.default;
|
|
14194
|
+
var { useSyncExternalStoreWithSelector } = import_with_selector.default;
|
|
14195
|
+
var didWarnAboutEqualityFn = false;
|
|
14196
|
+
var identity = (arg) => arg;
|
|
14197
|
+
function useStore(api, selector2 = identity, equalityFn) {
|
|
14198
|
+
if ((import_meta2.env ? import_meta2.env.MODE : void 0) !== "production" && equalityFn && !didWarnAboutEqualityFn) {
|
|
14199
|
+
console.warn(
|
|
14200
|
+
"[DEPRECATED] Use `createWithEqualityFn` instead of `create` or use `useStoreWithEqualityFn` instead of `useStore`. They can be imported from 'zustand/traditional'. https://github.com/pmndrs/zustand/discussions/1937"
|
|
14201
|
+
);
|
|
14202
|
+
didWarnAboutEqualityFn = true;
|
|
14203
|
+
}
|
|
14204
|
+
const slice = useSyncExternalStoreWithSelector(
|
|
14205
|
+
api.subscribe,
|
|
14206
|
+
api.getState,
|
|
14207
|
+
api.getServerState || api.getInitialState,
|
|
14208
|
+
selector2,
|
|
14209
|
+
equalityFn
|
|
14210
|
+
);
|
|
14211
|
+
useDebugValue(slice);
|
|
14212
|
+
return slice;
|
|
14213
|
+
}
|
|
14214
|
+
var createImpl = (createState2) => {
|
|
14215
|
+
if ((import_meta2.env ? import_meta2.env.MODE : void 0) !== "production" && typeof createState2 !== "function") {
|
|
14216
|
+
console.warn(
|
|
14217
|
+
"[DEPRECATED] Passing a vanilla store will be unsupported in a future version. Instead use `import { useStore } from 'zustand'`."
|
|
14218
|
+
);
|
|
13861
14219
|
}
|
|
13862
|
-
|
|
13863
|
-
|
|
14220
|
+
const api = typeof createState2 === "function" ? createStore(createState2) : createState2;
|
|
14221
|
+
const useBoundStore = (selector2, equalityFn) => useStore(api, selector2, equalityFn);
|
|
14222
|
+
Object.assign(useBoundStore, api);
|
|
14223
|
+
return useBoundStore;
|
|
14224
|
+
};
|
|
14225
|
+
var create = (createState2) => createState2 ? createImpl(createState2) : createImpl;
|
|
14226
|
+
|
|
14227
|
+
// node_modules/@textea/json-viewer/dist/index.mjs
|
|
14228
|
+
var import_copy_to_clipboard = __toESM(require_copy_to_clipboard(), 1);
|
|
14229
|
+
function r(e2) {
|
|
14230
|
+
var t2, f2, n2 = "";
|
|
14231
|
+
if ("string" == typeof e2 || "number" == typeof e2) n2 += e2;
|
|
14232
|
+
else if ("object" == typeof e2) if (Array.isArray(e2)) {
|
|
14233
|
+
var o2 = e2.length;
|
|
14234
|
+
for (t2 = 0; t2 < o2; t2++) e2[t2] && (f2 = r(e2[t2])) && (n2 && (n2 += " "), n2 += f2);
|
|
14235
|
+
} else for (f2 in e2) e2[f2] && (n2 && (n2 += " "), n2 += f2);
|
|
14236
|
+
return n2;
|
|
14237
|
+
}
|
|
14238
|
+
function clsx() {
|
|
14239
|
+
for (var e2, t2, f2 = 0, n2 = "", o2 = arguments.length; f2 < o2; f2++) (e2 = arguments[f2]) && (t2 = r(e2)) && (n2 && (n2 += " "), n2 += t2);
|
|
14240
|
+
return n2;
|
|
14241
|
+
}
|
|
14242
|
+
var lightColorspace = {
|
|
14243
|
+
scheme: "Light Theme",
|
|
14244
|
+
author: "mac gainor (https://github.com/mac-s-g)",
|
|
14245
|
+
base00: "rgba(0, 0, 0, 0)",
|
|
14246
|
+
base01: "rgb(245, 245, 245)",
|
|
14247
|
+
base02: "rgb(235, 235, 235)",
|
|
14248
|
+
base03: "#93a1a1",
|
|
14249
|
+
base04: "rgba(0, 0, 0, 0.3)",
|
|
14250
|
+
base05: "#586e75",
|
|
14251
|
+
base06: "#073642",
|
|
14252
|
+
base07: "#002b36",
|
|
14253
|
+
base08: "#d33682",
|
|
14254
|
+
base09: "#cb4b16",
|
|
14255
|
+
base0A: "#ffd500",
|
|
14256
|
+
base0B: "#859900",
|
|
14257
|
+
base0C: "#6c71c4",
|
|
14258
|
+
base0D: "#586e75",
|
|
14259
|
+
base0E: "#2aa198",
|
|
14260
|
+
base0F: "#268bd2"
|
|
14261
|
+
};
|
|
14262
|
+
var darkColorspace = {
|
|
14263
|
+
scheme: "Dark Theme",
|
|
14264
|
+
author: "Chris Kempson (http://chriskempson.com)",
|
|
14265
|
+
base00: "#181818",
|
|
14266
|
+
base01: "#282828",
|
|
14267
|
+
base02: "#383838",
|
|
14268
|
+
base03: "#585858",
|
|
14269
|
+
base04: "#b8b8b8",
|
|
14270
|
+
base05: "#d8d8d8",
|
|
14271
|
+
base06: "#e8e8e8",
|
|
14272
|
+
base07: "#f8f8f8",
|
|
14273
|
+
base08: "#ab4642",
|
|
14274
|
+
base09: "#dc9656",
|
|
14275
|
+
base0A: "#f7ca88",
|
|
14276
|
+
base0B: "#a1b56c",
|
|
14277
|
+
base0C: "#86c1b9",
|
|
14278
|
+
base0D: "#7cafc2",
|
|
14279
|
+
base0E: "#ba8baf",
|
|
14280
|
+
base0F: "#a16946"
|
|
14281
|
+
};
|
|
14282
|
+
var DefaultKeyRenderer = () => null;
|
|
14283
|
+
DefaultKeyRenderer.when = () => false;
|
|
14284
|
+
var createJsonViewerStore = (props) => {
|
|
14285
|
+
return create()((set, get) => {
|
|
14286
|
+
var _props_rootName, _props_indentWidth, _props_keyRenderer, _props_enableAdd, _props_enableDelete, _props_enableClipboard, _props_editable, _props_onChange, _props_onCopy, _props_onSelect, _props_onAdd, _props_onDelete, _props_defaultInspectDepth, _props_defaultInspectControl, _props_maxDisplayLength, _props_groupArraysAfterLength, _props_collapseStringsAfterLength, _props_objectSortKeys, _props_quotesOnKeys, _props_displayDataTypes, _props_displaySize, _props_displayComma, _props_highlightUpdates;
|
|
14287
|
+
return {
|
|
14288
|
+
// provided by user
|
|
14289
|
+
rootName: (_props_rootName = props.rootName) !== null && _props_rootName !== void 0 ? _props_rootName : "root",
|
|
14290
|
+
indentWidth: (_props_indentWidth = props.indentWidth) !== null && _props_indentWidth !== void 0 ? _props_indentWidth : 3,
|
|
14291
|
+
keyRenderer: (_props_keyRenderer = props.keyRenderer) !== null && _props_keyRenderer !== void 0 ? _props_keyRenderer : DefaultKeyRenderer,
|
|
14292
|
+
enableAdd: (_props_enableAdd = props.enableAdd) !== null && _props_enableAdd !== void 0 ? _props_enableAdd : false,
|
|
14293
|
+
enableDelete: (_props_enableDelete = props.enableDelete) !== null && _props_enableDelete !== void 0 ? _props_enableDelete : false,
|
|
14294
|
+
enableClipboard: (_props_enableClipboard = props.enableClipboard) !== null && _props_enableClipboard !== void 0 ? _props_enableClipboard : true,
|
|
14295
|
+
editable: (_props_editable = props.editable) !== null && _props_editable !== void 0 ? _props_editable : false,
|
|
14296
|
+
onChange: (_props_onChange = props.onChange) !== null && _props_onChange !== void 0 ? _props_onChange : () => {
|
|
14297
|
+
},
|
|
14298
|
+
onCopy: (_props_onCopy = props.onCopy) !== null && _props_onCopy !== void 0 ? _props_onCopy : void 0,
|
|
14299
|
+
onSelect: (_props_onSelect = props.onSelect) !== null && _props_onSelect !== void 0 ? _props_onSelect : void 0,
|
|
14300
|
+
onAdd: (_props_onAdd = props.onAdd) !== null && _props_onAdd !== void 0 ? _props_onAdd : void 0,
|
|
14301
|
+
onDelete: (_props_onDelete = props.onDelete) !== null && _props_onDelete !== void 0 ? _props_onDelete : void 0,
|
|
14302
|
+
defaultInspectDepth: (_props_defaultInspectDepth = props.defaultInspectDepth) !== null && _props_defaultInspectDepth !== void 0 ? _props_defaultInspectDepth : 5,
|
|
14303
|
+
defaultInspectControl: (_props_defaultInspectControl = props.defaultInspectControl) !== null && _props_defaultInspectControl !== void 0 ? _props_defaultInspectControl : void 0,
|
|
14304
|
+
maxDisplayLength: (_props_maxDisplayLength = props.maxDisplayLength) !== null && _props_maxDisplayLength !== void 0 ? _props_maxDisplayLength : 30,
|
|
14305
|
+
groupArraysAfterLength: (_props_groupArraysAfterLength = props.groupArraysAfterLength) !== null && _props_groupArraysAfterLength !== void 0 ? _props_groupArraysAfterLength : 100,
|
|
14306
|
+
collapseStringsAfterLength: props.collapseStringsAfterLength === false ? Number.MAX_VALUE : (_props_collapseStringsAfterLength = props.collapseStringsAfterLength) !== null && _props_collapseStringsAfterLength !== void 0 ? _props_collapseStringsAfterLength : 50,
|
|
14307
|
+
objectSortKeys: (_props_objectSortKeys = props.objectSortKeys) !== null && _props_objectSortKeys !== void 0 ? _props_objectSortKeys : false,
|
|
14308
|
+
quotesOnKeys: (_props_quotesOnKeys = props.quotesOnKeys) !== null && _props_quotesOnKeys !== void 0 ? _props_quotesOnKeys : true,
|
|
14309
|
+
displayDataTypes: (_props_displayDataTypes = props.displayDataTypes) !== null && _props_displayDataTypes !== void 0 ? _props_displayDataTypes : true,
|
|
14310
|
+
displaySize: (_props_displaySize = props.displaySize) !== null && _props_displaySize !== void 0 ? _props_displaySize : true,
|
|
14311
|
+
displayComma: (_props_displayComma = props.displayComma) !== null && _props_displayComma !== void 0 ? _props_displayComma : false,
|
|
14312
|
+
highlightUpdates: (_props_highlightUpdates = props.highlightUpdates) !== null && _props_highlightUpdates !== void 0 ? _props_highlightUpdates : false,
|
|
14313
|
+
// internal state
|
|
14314
|
+
inspectCache: {},
|
|
14315
|
+
hoverPath: null,
|
|
14316
|
+
colorspace: lightColorspace,
|
|
14317
|
+
value: props.value,
|
|
14318
|
+
prevValue: void 0,
|
|
14319
|
+
getInspectCache: (path, nestedIndex) => {
|
|
14320
|
+
const target = nestedIndex !== void 0 ? path.join(".") + "[".concat(nestedIndex, "]nt") : path.join(".");
|
|
14321
|
+
return get().inspectCache[target];
|
|
14322
|
+
},
|
|
14323
|
+
setInspectCache: (path, action, nestedIndex) => {
|
|
14324
|
+
const target = nestedIndex !== void 0 ? path.join(".") + "[".concat(nestedIndex, "]nt") : path.join(".");
|
|
14325
|
+
set((state) => ({
|
|
14326
|
+
inspectCache: {
|
|
14327
|
+
...state.inspectCache,
|
|
14328
|
+
[target]: typeof action === "function" ? action(state.inspectCache[target]) : action
|
|
14329
|
+
}
|
|
14330
|
+
}));
|
|
14331
|
+
},
|
|
14332
|
+
setHover: (path, nestedIndex) => {
|
|
14333
|
+
set({
|
|
14334
|
+
hoverPath: path ? {
|
|
14335
|
+
path,
|
|
14336
|
+
nestedIndex
|
|
14337
|
+
} : null
|
|
14338
|
+
});
|
|
14339
|
+
}
|
|
14340
|
+
};
|
|
14341
|
+
});
|
|
14342
|
+
};
|
|
14343
|
+
var JsonViewerStoreContext = (0, import_react49.createContext)(void 0);
|
|
14344
|
+
JsonViewerStoreContext.Provider;
|
|
14345
|
+
var useJsonViewerStore = (selector2, equalityFn) => {
|
|
14346
|
+
const store = (0, import_react49.useContext)(JsonViewerStoreContext);
|
|
14347
|
+
return useStore(store, selector2, equalityFn);
|
|
14348
|
+
};
|
|
14349
|
+
var useTextColor = () => {
|
|
14350
|
+
return useJsonViewerStore((store) => store.colorspace.base07);
|
|
14351
|
+
};
|
|
14352
|
+
var objectCtorString = Object.prototype.constructor.toString();
|
|
14353
|
+
function isPlainObject(value) {
|
|
14354
|
+
if (!value || typeof value !== "object") return false;
|
|
14355
|
+
const proto = Object.getPrototypeOf(value);
|
|
14356
|
+
if (proto === null) return true;
|
|
14357
|
+
const Ctor = Object.hasOwnProperty.call(proto, "constructor") && proto.constructor;
|
|
14358
|
+
if (Ctor === Object) return true;
|
|
14359
|
+
return typeof Ctor === "function" && Function.toString.call(Ctor) === objectCtorString;
|
|
14360
|
+
}
|
|
14361
|
+
var isCycleReference = (root, path, value) => {
|
|
14362
|
+
if (root === null || value === null) {
|
|
14363
|
+
return false;
|
|
13864
14364
|
}
|
|
13865
|
-
if (
|
|
13866
|
-
return
|
|
14365
|
+
if (typeof root !== "object") {
|
|
14366
|
+
return false;
|
|
13867
14367
|
}
|
|
13868
|
-
|
|
13869
|
-
|
|
13870
|
-
|
|
13871
|
-
|
|
13872
|
-
|
|
13873
|
-
|
|
13874
|
-
|
|
13875
|
-
|
|
13876
|
-
|
|
13877
|
-
|
|
13878
|
-
|
|
13879
|
-
|
|
14368
|
+
if (typeof value !== "object") {
|
|
14369
|
+
return false;
|
|
14370
|
+
}
|
|
14371
|
+
if (Object.is(root, value) && path.length !== 0) {
|
|
14372
|
+
return "";
|
|
14373
|
+
}
|
|
14374
|
+
const currentPath = [];
|
|
14375
|
+
const arr = [
|
|
14376
|
+
...path
|
|
14377
|
+
];
|
|
14378
|
+
let currentRoot = root;
|
|
14379
|
+
while (currentRoot !== value || arr.length !== 0) {
|
|
14380
|
+
if (typeof currentRoot !== "object" || currentRoot === null) {
|
|
14381
|
+
return false;
|
|
13880
14382
|
}
|
|
13881
|
-
|
|
13882
|
-
return
|
|
14383
|
+
if (Object.is(currentRoot, value)) {
|
|
14384
|
+
return currentPath.reduce((path2, value2, currentIndex) => {
|
|
14385
|
+
if (typeof value2 === "number") {
|
|
14386
|
+
return path2 + "[".concat(value2, "]");
|
|
14387
|
+
}
|
|
14388
|
+
return path2 + "".concat(currentIndex === 0 ? "" : ".").concat(value2);
|
|
14389
|
+
}, "");
|
|
13883
14390
|
}
|
|
14391
|
+
const target = arr.shift();
|
|
14392
|
+
currentPath.push(target);
|
|
14393
|
+
currentRoot = currentRoot[target];
|
|
13884
14394
|
}
|
|
14395
|
+
return false;
|
|
14396
|
+
};
|
|
14397
|
+
function getValueSize(value) {
|
|
14398
|
+
if (value === null || void 0) {
|
|
14399
|
+
return 0;
|
|
14400
|
+
} else if (Array.isArray(value)) {
|
|
14401
|
+
return value.length;
|
|
14402
|
+
} else if (value instanceof Map || value instanceof Set) {
|
|
14403
|
+
return value.size;
|
|
14404
|
+
} else if (value instanceof Date) {
|
|
14405
|
+
return 1;
|
|
14406
|
+
} else if (typeof value === "object") {
|
|
14407
|
+
return Object.keys(value).length;
|
|
14408
|
+
} else if (typeof value === "string") {
|
|
14409
|
+
return value.length;
|
|
14410
|
+
}
|
|
14411
|
+
return 1;
|
|
13885
14412
|
}
|
|
13886
|
-
function
|
|
13887
|
-
|
|
13888
|
-
|
|
13889
|
-
|
|
13890
|
-
|
|
13891
|
-
|
|
13892
|
-
case "explicitly_denied": {
|
|
13893
|
-
return "error.main";
|
|
13894
|
-
}
|
|
13895
|
-
case "implicitly_denied": {
|
|
13896
|
-
return "warning.main";
|
|
13897
|
-
}
|
|
14413
|
+
function segmentArray(arr, size) {
|
|
14414
|
+
const result = [];
|
|
14415
|
+
let index2 = 0;
|
|
14416
|
+
while (index2 < arr.length) {
|
|
14417
|
+
result.push(arr.slice(index2, index2 + size));
|
|
14418
|
+
index2 += size;
|
|
13898
14419
|
}
|
|
14420
|
+
return result;
|
|
13899
14421
|
}
|
|
13900
|
-
function
|
|
13901
|
-
|
|
13902
|
-
|
|
13903
|
-
|
|
13904
|
-
|
|
13905
|
-
|
|
13906
|
-
|
|
13907
|
-
|
|
13908
|
-
|
|
13909
|
-
|
|
14422
|
+
function safeStringify(obj, space) {
|
|
14423
|
+
const seenValues = [];
|
|
14424
|
+
function replacer(key, value) {
|
|
14425
|
+
if (typeof value === "bigint") return value.toString();
|
|
14426
|
+
if (value instanceof Map) {
|
|
14427
|
+
if ("toJSON" in value && typeof value.toJSON === "function") return value.toJSON();
|
|
14428
|
+
if (value.size === 0) return {};
|
|
14429
|
+
if (seenValues.includes(value)) return "[Circular]";
|
|
14430
|
+
seenValues.push(value);
|
|
14431
|
+
const entries = Array.from(value.entries());
|
|
14432
|
+
if (entries.every((param) => {
|
|
14433
|
+
let [key2] = param;
|
|
14434
|
+
return typeof key2 === "string" || typeof key2 === "number";
|
|
14435
|
+
})) {
|
|
14436
|
+
return Object.fromEntries(entries);
|
|
13910
14437
|
}
|
|
14438
|
+
return {};
|
|
13911
14439
|
}
|
|
13912
|
-
if (
|
|
13913
|
-
|
|
13914
|
-
|
|
13915
|
-
|
|
14440
|
+
if (value instanceof Set) {
|
|
14441
|
+
if ("toJSON" in value && typeof value.toJSON === "function") return value.toJSON();
|
|
14442
|
+
if (seenValues.includes(value)) return "[Circular]";
|
|
14443
|
+
seenValues.push(value);
|
|
14444
|
+
return Array.from(value.values());
|
|
14445
|
+
}
|
|
14446
|
+
if (typeof value === "object" && value !== null && Object.keys(value).length) {
|
|
14447
|
+
const stackSize = seenValues.length;
|
|
14448
|
+
if (stackSize) {
|
|
14449
|
+
for (let n2 = stackSize - 1; n2 >= 0 && seenValues[n2][key] !== value; --n2) {
|
|
14450
|
+
seenValues.pop();
|
|
14451
|
+
}
|
|
14452
|
+
if (seenValues.includes(value)) return "[Circular]";
|
|
13916
14453
|
}
|
|
14454
|
+
seenValues.push(value);
|
|
13917
14455
|
}
|
|
13918
|
-
|
|
13919
|
-
|
|
13920
|
-
|
|
13921
|
-
|
|
13922
|
-
|
|
14456
|
+
return value;
|
|
14457
|
+
}
|
|
14458
|
+
return JSON.stringify(obj, replacer, space);
|
|
14459
|
+
}
|
|
14460
|
+
async function copyString(value) {
|
|
14461
|
+
if ("clipboard" in navigator) {
|
|
14462
|
+
try {
|
|
14463
|
+
await navigator.clipboard.writeText(value);
|
|
14464
|
+
} catch {
|
|
13923
14465
|
}
|
|
13924
|
-
return {
|
|
13925
|
-
details: {
|
|
13926
|
-
actions,
|
|
13927
|
-
explicitAllows: payload.explicit_allow_count,
|
|
13928
|
-
explicitDenies: payload.explicit_deny_count,
|
|
13929
|
-
implicitDenies: payload.implicit_deny_count,
|
|
13930
|
-
resources
|
|
13931
|
-
},
|
|
13932
|
-
operation: payload.operation,
|
|
13933
|
-
permission,
|
|
13934
|
-
principal: payload.principal_arn,
|
|
13935
|
-
service: payload.service
|
|
13936
|
-
};
|
|
13937
|
-
} catch (error) {
|
|
13938
|
-
console.error("Error parsing IAM event payload:", error);
|
|
13939
|
-
return void 0;
|
|
13940
14466
|
}
|
|
14467
|
+
(0, import_copy_to_clipboard.default)(value);
|
|
13941
14468
|
}
|
|
13942
|
-
|
|
13943
|
-
|
|
13944
|
-
|
|
13945
|
-
|
|
13946
|
-
|
|
13947
|
-
|
|
13948
|
-
|
|
13949
|
-
|
|
13950
|
-
|
|
13951
|
-
|
|
13952
|
-
|
|
13953
|
-
|
|
13954
|
-
|
|
13955
|
-
|
|
13956
|
-
|
|
13957
|
-
|
|
13958
|
-
|
|
13959
|
-
|
|
13960
|
-
|
|
13961
|
-
|
|
14469
|
+
function useClipboard() {
|
|
14470
|
+
let { timeout = 2e3 } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
|
|
14471
|
+
const [copied, setCopied] = (0, import_react49.useState)(false);
|
|
14472
|
+
const copyTimeout = (0, import_react49.useRef)(null);
|
|
14473
|
+
const handleCopyResult = (0, import_react49.useCallback)((value) => {
|
|
14474
|
+
const current = copyTimeout.current;
|
|
14475
|
+
if (current) {
|
|
14476
|
+
window.clearTimeout(current);
|
|
14477
|
+
}
|
|
14478
|
+
copyTimeout.current = window.setTimeout(() => setCopied(false), timeout);
|
|
14479
|
+
setCopied(value);
|
|
14480
|
+
}, [
|
|
14481
|
+
timeout
|
|
14482
|
+
]);
|
|
14483
|
+
const onCopy = useJsonViewerStore((store) => store.onCopy);
|
|
14484
|
+
const copy = (0, import_react49.useCallback)(async (path, value) => {
|
|
14485
|
+
if (typeof onCopy === "function") {
|
|
14486
|
+
try {
|
|
14487
|
+
await onCopy(path, value, copyString);
|
|
14488
|
+
handleCopyResult(true);
|
|
14489
|
+
} catch (error) {
|
|
14490
|
+
console.error("error when copy ".concat(path.length === 0 ? "src" : "src[".concat(path.join(".")), "]"), error);
|
|
13962
14491
|
}
|
|
13963
|
-
|
|
13964
|
-
|
|
14492
|
+
} else {
|
|
14493
|
+
try {
|
|
14494
|
+
const valueToCopy = safeStringify(typeof value === "function" ? value.toString() : value, " ");
|
|
14495
|
+
await copyString(valueToCopy);
|
|
14496
|
+
handleCopyResult(true);
|
|
14497
|
+
} catch (error) {
|
|
14498
|
+
console.error("error when copy ".concat(path.length === 0 ? "src" : "src[".concat(path.join(".")), "]"), error);
|
|
13965
14499
|
}
|
|
13966
|
-
return {
|
|
13967
|
-
details: detailsParts.join("\n"),
|
|
13968
|
-
headline: headline2,
|
|
13969
|
-
message: messageParts.join("\n")
|
|
13970
|
-
};
|
|
13971
14500
|
}
|
|
13972
|
-
}
|
|
13973
|
-
|
|
13974
|
-
|
|
13975
|
-
|
|
13976
|
-
|
|
13977
|
-
|
|
13978
|
-
|
|
13979
|
-
|
|
13980
|
-
|
|
13981
|
-
|
|
13982
|
-
return {
|
|
13983
|
-
|
|
13984
|
-
|
|
14501
|
+
}, [
|
|
14502
|
+
handleCopyResult,
|
|
14503
|
+
onCopy
|
|
14504
|
+
]);
|
|
14505
|
+
const reset = (0, import_react49.useCallback)(() => {
|
|
14506
|
+
setCopied(false);
|
|
14507
|
+
if (copyTimeout.current) {
|
|
14508
|
+
clearTimeout(copyTimeout.current);
|
|
14509
|
+
}
|
|
14510
|
+
}, []);
|
|
14511
|
+
return {
|
|
14512
|
+
copy,
|
|
14513
|
+
reset,
|
|
14514
|
+
copied
|
|
14515
|
+
};
|
|
14516
|
+
}
|
|
14517
|
+
function useIsCycleReference(path, value) {
|
|
14518
|
+
const rootValue = useJsonViewerStore((store) => store.value);
|
|
14519
|
+
return (0, import_react49.useMemo)(() => isCycleReference(rootValue, path, value), [
|
|
14520
|
+
path,
|
|
14521
|
+
value,
|
|
14522
|
+
rootValue
|
|
14523
|
+
]);
|
|
14524
|
+
}
|
|
14525
|
+
function useInspect(path, value, nestedIndex) {
|
|
14526
|
+
const depth = path.length;
|
|
14527
|
+
const isTrap = useIsCycleReference(path, value);
|
|
14528
|
+
const getInspectCache = useJsonViewerStore((store) => store.getInspectCache);
|
|
14529
|
+
const setInspectCache = useJsonViewerStore((store) => store.setInspectCache);
|
|
14530
|
+
const defaultInspectDepth = useJsonViewerStore((store) => store.defaultInspectDepth);
|
|
14531
|
+
const defaultInspectControl = useJsonViewerStore((store) => store.defaultInspectControl);
|
|
14532
|
+
(0, import_react49.useEffect)(() => {
|
|
14533
|
+
const inspect2 = getInspectCache(path, nestedIndex);
|
|
14534
|
+
if (inspect2 !== void 0) {
|
|
14535
|
+
return;
|
|
14536
|
+
}
|
|
14537
|
+
if (nestedIndex !== void 0) {
|
|
14538
|
+
setInspectCache(path, false, nestedIndex);
|
|
14539
|
+
return;
|
|
14540
|
+
}
|
|
14541
|
+
const shouldInspect = isTrap ? false : typeof defaultInspectControl === "function" ? defaultInspectControl(path, value) : depth < defaultInspectDepth;
|
|
14542
|
+
setInspectCache(path, shouldInspect);
|
|
14543
|
+
}, [
|
|
14544
|
+
defaultInspectDepth,
|
|
14545
|
+
defaultInspectControl,
|
|
14546
|
+
depth,
|
|
14547
|
+
getInspectCache,
|
|
14548
|
+
isTrap,
|
|
14549
|
+
nestedIndex,
|
|
14550
|
+
path,
|
|
14551
|
+
value,
|
|
14552
|
+
setInspectCache
|
|
14553
|
+
]);
|
|
14554
|
+
const [inspect, set] = (0, import_react49.useState)(() => {
|
|
14555
|
+
const shouldInspect = getInspectCache(path, nestedIndex);
|
|
14556
|
+
if (shouldInspect !== void 0) {
|
|
14557
|
+
return shouldInspect;
|
|
14558
|
+
}
|
|
14559
|
+
if (nestedIndex !== void 0) {
|
|
14560
|
+
return false;
|
|
14561
|
+
}
|
|
14562
|
+
return isTrap ? false : typeof defaultInspectControl === "function" ? defaultInspectControl(path, value) : depth < defaultInspectDepth;
|
|
14563
|
+
});
|
|
14564
|
+
const setInspect = (0, import_react49.useCallback)((apply) => {
|
|
14565
|
+
set((oldState) => {
|
|
14566
|
+
const newState = typeof apply === "boolean" ? apply : apply(oldState);
|
|
14567
|
+
setInspectCache(path, newState, nestedIndex);
|
|
14568
|
+
return newState;
|
|
14569
|
+
});
|
|
14570
|
+
}, [
|
|
14571
|
+
nestedIndex,
|
|
14572
|
+
path,
|
|
14573
|
+
setInspectCache
|
|
14574
|
+
]);
|
|
14575
|
+
return [
|
|
14576
|
+
inspect,
|
|
14577
|
+
setInspect
|
|
14578
|
+
];
|
|
14579
|
+
}
|
|
14580
|
+
var DataBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14581
|
+
component: "div",
|
|
14582
|
+
...props,
|
|
14583
|
+
sx: {
|
|
14584
|
+
display: "inline-block",
|
|
14585
|
+
...props.sx
|
|
14586
|
+
}
|
|
14587
|
+
});
|
|
14588
|
+
var DataTypeLabel = (param) => {
|
|
14589
|
+
let { dataType, enable = true } = param;
|
|
14590
|
+
if (!enable) return null;
|
|
14591
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
14592
|
+
className: "data-type-label",
|
|
14593
|
+
sx: {
|
|
14594
|
+
mx: 0.5,
|
|
14595
|
+
fontSize: "0.7rem",
|
|
14596
|
+
opacity: 0.8,
|
|
14597
|
+
userSelect: "none"
|
|
14598
|
+
},
|
|
14599
|
+
children: dataType
|
|
14600
|
+
});
|
|
14601
|
+
};
|
|
14602
|
+
function defineEasyType(param) {
|
|
14603
|
+
let { is, serialize, deserialize, type, colorKey, displayTypeLabel = true, Renderer } = param;
|
|
14604
|
+
const Render = /* @__PURE__ */ (0, import_react49.memo)(Renderer);
|
|
14605
|
+
const EasyType = (props) => {
|
|
14606
|
+
const storeDisplayDataTypes = useJsonViewerStore((store) => store.displayDataTypes);
|
|
14607
|
+
const color2 = useJsonViewerStore((store) => store.colorspace[colorKey]);
|
|
14608
|
+
const onSelect = useJsonViewerStore((store) => store.onSelect);
|
|
14609
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(DataBox, {
|
|
14610
|
+
onClick: () => onSelect === null || onSelect === void 0 ? void 0 : onSelect(props.path, props.value),
|
|
14611
|
+
sx: {
|
|
14612
|
+
color: color2
|
|
14613
|
+
},
|
|
14614
|
+
children: [
|
|
14615
|
+
displayTypeLabel && storeDisplayDataTypes && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataTypeLabel, {
|
|
14616
|
+
dataType: type
|
|
14617
|
+
}),
|
|
14618
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
14619
|
+
className: "".concat(type, "-value"),
|
|
14620
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Render, {
|
|
14621
|
+
path: props.path,
|
|
14622
|
+
inspect: props.inspect,
|
|
14623
|
+
setInspect: props.setInspect,
|
|
14624
|
+
value: props.value,
|
|
14625
|
+
prevValue: props.prevValue
|
|
14626
|
+
})
|
|
14627
|
+
})
|
|
14628
|
+
]
|
|
14629
|
+
});
|
|
14630
|
+
};
|
|
14631
|
+
EasyType.displayName = "easy-".concat(type, "-type");
|
|
14632
|
+
if (!serialize || !deserialize) {
|
|
14633
|
+
return {
|
|
14634
|
+
is,
|
|
14635
|
+
Component: EasyType
|
|
14636
|
+
};
|
|
14637
|
+
}
|
|
14638
|
+
const EasyTypeEditor = (param2) => {
|
|
14639
|
+
let { value, setValue, abortEditing, commitEditing } = param2;
|
|
14640
|
+
const color2 = useJsonViewerStore((store) => store.colorspace[colorKey]);
|
|
14641
|
+
const handleKeyDown = (0, import_react49.useCallback)((event) => {
|
|
14642
|
+
if (event.key === "Enter") {
|
|
14643
|
+
event.preventDefault();
|
|
14644
|
+
commitEditing(value);
|
|
14645
|
+
}
|
|
14646
|
+
if (event.key === "Escape") {
|
|
14647
|
+
event.preventDefault();
|
|
14648
|
+
abortEditing();
|
|
14649
|
+
}
|
|
14650
|
+
}, [
|
|
14651
|
+
abortEditing,
|
|
14652
|
+
commitEditing,
|
|
14653
|
+
value
|
|
14654
|
+
]);
|
|
14655
|
+
const handleChange = (0, import_react49.useCallback)((event) => {
|
|
14656
|
+
setValue(event.target.value);
|
|
14657
|
+
}, [
|
|
14658
|
+
setValue
|
|
14659
|
+
]);
|
|
14660
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.InputBase, {
|
|
14661
|
+
autoFocus: true,
|
|
14662
|
+
value,
|
|
14663
|
+
onChange: handleChange,
|
|
14664
|
+
onKeyDown: handleKeyDown,
|
|
14665
|
+
size: "small",
|
|
14666
|
+
multiline: true,
|
|
14667
|
+
sx: {
|
|
14668
|
+
color: color2,
|
|
14669
|
+
padding: 0.5,
|
|
14670
|
+
borderStyle: "solid",
|
|
14671
|
+
borderColor: "black",
|
|
14672
|
+
borderWidth: 1,
|
|
14673
|
+
fontSize: "0.8rem",
|
|
14674
|
+
fontFamily: "monospace",
|
|
14675
|
+
display: "inline-flex"
|
|
14676
|
+
}
|
|
14677
|
+
});
|
|
14678
|
+
};
|
|
14679
|
+
EasyTypeEditor.displayName = "easy-".concat(type, "-type-editor");
|
|
14680
|
+
return {
|
|
14681
|
+
is,
|
|
14682
|
+
serialize,
|
|
14683
|
+
deserialize,
|
|
14684
|
+
Component: EasyType,
|
|
14685
|
+
Editor: EasyTypeEditor
|
|
14686
|
+
};
|
|
14687
|
+
}
|
|
14688
|
+
var booleanType = defineEasyType({
|
|
14689
|
+
is: (value) => typeof value === "boolean",
|
|
14690
|
+
type: "bool",
|
|
14691
|
+
colorKey: "base0E",
|
|
14692
|
+
serialize: (value) => value.toString(),
|
|
14693
|
+
deserialize: (value) => {
|
|
14694
|
+
if (value === "true") return true;
|
|
14695
|
+
if (value === "false") return false;
|
|
14696
|
+
throw new Error("Invalid boolean value");
|
|
14697
|
+
},
|
|
14698
|
+
Renderer: (param) => {
|
|
14699
|
+
let { value } = param;
|
|
14700
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
14701
|
+
children: value ? "true" : "false"
|
|
14702
|
+
});
|
|
14703
|
+
}
|
|
14704
|
+
});
|
|
14705
|
+
var displayOptions = {
|
|
14706
|
+
weekday: "short",
|
|
14707
|
+
year: "numeric",
|
|
14708
|
+
month: "short",
|
|
14709
|
+
day: "numeric",
|
|
14710
|
+
hour: "2-digit",
|
|
14711
|
+
minute: "2-digit"
|
|
14712
|
+
};
|
|
14713
|
+
var dateType = defineEasyType({
|
|
14714
|
+
is: (value) => value instanceof Date,
|
|
14715
|
+
type: "date",
|
|
14716
|
+
colorKey: "base0D",
|
|
14717
|
+
Renderer: (param) => {
|
|
14718
|
+
let { value } = param;
|
|
14719
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
14720
|
+
children: value.toLocaleTimeString("en-us", displayOptions)
|
|
14721
|
+
});
|
|
14722
|
+
}
|
|
14723
|
+
});
|
|
14724
|
+
var functionBody = (func) => {
|
|
14725
|
+
const funcString = func.toString();
|
|
14726
|
+
let isUsualFunction = true;
|
|
14727
|
+
const parenthesisPos = funcString.indexOf(")");
|
|
14728
|
+
const arrowPos = funcString.indexOf("=>");
|
|
14729
|
+
if (arrowPos !== -1 && arrowPos > parenthesisPos) {
|
|
14730
|
+
isUsualFunction = false;
|
|
14731
|
+
}
|
|
14732
|
+
if (isUsualFunction) {
|
|
14733
|
+
return funcString.substring(funcString.indexOf("{", parenthesisPos) + 1, funcString.lastIndexOf("}"));
|
|
14734
|
+
}
|
|
14735
|
+
return funcString.substring(funcString.indexOf("=>") + 2);
|
|
14736
|
+
};
|
|
14737
|
+
var functionName = (func) => {
|
|
14738
|
+
const funcString = func.toString();
|
|
14739
|
+
const isUsualFunction = funcString.indexOf("function") !== -1;
|
|
14740
|
+
if (isUsualFunction) {
|
|
14741
|
+
return funcString.substring(8, funcString.indexOf("{")).trim();
|
|
14742
|
+
}
|
|
14743
|
+
return funcString.substring(0, funcString.indexOf("=>") + 2).trim();
|
|
14744
|
+
};
|
|
14745
|
+
var lb = "{";
|
|
14746
|
+
var rb = "}";
|
|
14747
|
+
var PreFunctionType = (props) => {
|
|
14748
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.NoSsr, {
|
|
14749
|
+
children: [
|
|
14750
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataTypeLabel, {
|
|
14751
|
+
dataType: "function"
|
|
14752
|
+
}),
|
|
14753
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, {
|
|
14754
|
+
component: "span",
|
|
14755
|
+
className: "data-function-start",
|
|
14756
|
+
sx: {
|
|
14757
|
+
letterSpacing: 0.5
|
|
14758
|
+
},
|
|
14759
|
+
children: [
|
|
14760
|
+
functionName(props.value),
|
|
14761
|
+
" ",
|
|
14762
|
+
lb
|
|
14763
|
+
]
|
|
14764
|
+
})
|
|
14765
|
+
]
|
|
14766
|
+
});
|
|
14767
|
+
};
|
|
14768
|
+
var PostFunctionType = () => {
|
|
14769
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.NoSsr, {
|
|
14770
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14771
|
+
component: "span",
|
|
14772
|
+
className: "data-function-end",
|
|
14773
|
+
children: rb
|
|
14774
|
+
})
|
|
14775
|
+
});
|
|
14776
|
+
};
|
|
14777
|
+
var FunctionType = (props) => {
|
|
14778
|
+
const functionColor = useJsonViewerStore((store) => store.colorspace.base05);
|
|
14779
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.NoSsr, {
|
|
14780
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14781
|
+
className: "data-function",
|
|
14782
|
+
sx: {
|
|
14783
|
+
display: props.inspect ? "block" : "inline-block",
|
|
14784
|
+
pl: props.inspect ? 2 : 0,
|
|
14785
|
+
color: functionColor
|
|
14786
|
+
},
|
|
14787
|
+
children: props.inspect ? functionBody(props.value) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14788
|
+
component: "span",
|
|
14789
|
+
className: "data-function-body",
|
|
14790
|
+
onClick: () => props.setInspect(true),
|
|
14791
|
+
sx: {
|
|
14792
|
+
"&:hover": {
|
|
14793
|
+
cursor: "pointer"
|
|
14794
|
+
},
|
|
14795
|
+
padding: 0.5
|
|
14796
|
+
},
|
|
14797
|
+
children: "\u2026"
|
|
14798
|
+
})
|
|
14799
|
+
})
|
|
14800
|
+
});
|
|
14801
|
+
};
|
|
14802
|
+
var functionType = {
|
|
14803
|
+
is: (value) => typeof value === "function",
|
|
14804
|
+
Component: FunctionType,
|
|
14805
|
+
PreComponent: PreFunctionType,
|
|
14806
|
+
PostComponent: PostFunctionType
|
|
14807
|
+
};
|
|
14808
|
+
var nullType = defineEasyType({
|
|
14809
|
+
is: (value) => value === null,
|
|
14810
|
+
type: "null",
|
|
14811
|
+
colorKey: "base08",
|
|
14812
|
+
displayTypeLabel: false,
|
|
14813
|
+
Renderer: () => {
|
|
14814
|
+
const backgroundColor = useJsonViewerStore((store) => store.colorspace.base02);
|
|
14815
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14816
|
+
sx: {
|
|
14817
|
+
fontSize: "0.8rem",
|
|
14818
|
+
backgroundColor,
|
|
14819
|
+
fontWeight: "bold",
|
|
14820
|
+
borderRadius: "3px",
|
|
14821
|
+
padding: "0.5px 2px"
|
|
14822
|
+
},
|
|
14823
|
+
children: "NULL"
|
|
14824
|
+
});
|
|
14825
|
+
}
|
|
14826
|
+
});
|
|
14827
|
+
var isInt = (n2) => n2 % 1 === 0;
|
|
14828
|
+
var nanType = defineEasyType({
|
|
14829
|
+
is: (value) => typeof value === "number" && isNaN(value),
|
|
14830
|
+
type: "NaN",
|
|
14831
|
+
colorKey: "base08",
|
|
14832
|
+
displayTypeLabel: false,
|
|
14833
|
+
serialize: () => "NaN",
|
|
14834
|
+
// allow deserialize the value back to number
|
|
14835
|
+
deserialize: (value) => parseFloat(value),
|
|
14836
|
+
Renderer: () => {
|
|
14837
|
+
const backgroundColor = useJsonViewerStore((store) => store.colorspace.base02);
|
|
14838
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
14839
|
+
sx: {
|
|
14840
|
+
backgroundColor,
|
|
14841
|
+
fontSize: "0.8rem",
|
|
14842
|
+
fontWeight: "bold",
|
|
14843
|
+
borderRadius: "3px",
|
|
14844
|
+
padding: "0.5px 2px"
|
|
14845
|
+
},
|
|
14846
|
+
children: "NaN"
|
|
14847
|
+
});
|
|
14848
|
+
}
|
|
14849
|
+
});
|
|
14850
|
+
var floatType = defineEasyType({
|
|
14851
|
+
is: (value) => typeof value === "number" && !isInt(value) && !isNaN(value),
|
|
14852
|
+
type: "float",
|
|
14853
|
+
colorKey: "base0B",
|
|
14854
|
+
serialize: (value) => value.toString(),
|
|
14855
|
+
deserialize: (value) => parseFloat(value),
|
|
14856
|
+
Renderer: (param) => {
|
|
14857
|
+
let { value } = param;
|
|
14858
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
14859
|
+
children: value
|
|
14860
|
+
});
|
|
14861
|
+
}
|
|
14862
|
+
});
|
|
14863
|
+
var intType = defineEasyType({
|
|
14864
|
+
is: (value) => typeof value === "number" && isInt(value),
|
|
14865
|
+
type: "int",
|
|
14866
|
+
colorKey: "base0F",
|
|
14867
|
+
serialize: (value) => value.toString(),
|
|
14868
|
+
// allow deserialize the value to float
|
|
14869
|
+
deserialize: (value) => parseFloat(value),
|
|
14870
|
+
Renderer: (param) => {
|
|
14871
|
+
let { value } = param;
|
|
14872
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
14873
|
+
children: value
|
|
14874
|
+
});
|
|
14875
|
+
}
|
|
14876
|
+
});
|
|
14877
|
+
var bigIntType = defineEasyType({
|
|
14878
|
+
is: (value) => typeof value === "bigint",
|
|
14879
|
+
type: "bigint",
|
|
14880
|
+
colorKey: "base0F",
|
|
14881
|
+
serialize: (value) => value.toString(),
|
|
14882
|
+
deserialize: (value) => BigInt(value.replace(/\D/g, "")),
|
|
14883
|
+
Renderer: (param) => {
|
|
14884
|
+
let { value } = param;
|
|
14885
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
14886
|
+
children: "".concat(value, "n")
|
|
14887
|
+
});
|
|
14888
|
+
}
|
|
14889
|
+
});
|
|
14890
|
+
var BaseIcon = (param) => {
|
|
14891
|
+
let { d: d2, ...props } = param;
|
|
14892
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.SvgIcon, {
|
|
14893
|
+
...props,
|
|
14894
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("path", {
|
|
14895
|
+
d: d2
|
|
14896
|
+
})
|
|
14897
|
+
});
|
|
14898
|
+
};
|
|
14899
|
+
var AddBox = "M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m0 16H5V5h14zm-8-2h2v-4h4v-2h-4V7h-2v4H7v2h4z";
|
|
14900
|
+
var Check = "M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z";
|
|
14901
|
+
var ChevronRight = "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z";
|
|
14902
|
+
var CircularArrows = "M 12 2 C 10.615 1.998 9.214625 2.2867656 7.890625 2.8847656 L 8.9003906 4.6328125 C 9.9043906 4.2098125 10.957 3.998 12 4 C 15.080783 4 17.738521 5.7633175 19.074219 8.3222656 L 17.125 9 L 21.25 11 L 22.875 7 L 20.998047 7.6523438 C 19.377701 4.3110398 15.95585 2 12 2 z M 6.5097656 4.4882812 L 2.2324219 5.0820312 L 3.734375 6.3808594 C 1.6515335 9.4550558 1.3615962 13.574578 3.3398438 17 C 4.0308437 18.201 4.9801562 19.268234 6.1601562 20.115234 L 7.1699219 18.367188 C 6.3019219 17.710187 5.5922656 16.904 5.0722656 16 C 3.5320014 13.332354 3.729203 10.148679 5.2773438 7.7128906 L 6.8398438 9.0625 L 6.5097656 4.4882812 z M 19.929688 13 C 19.794687 14.08 19.450734 15.098 18.927734 16 C 17.386985 18.668487 14.531361 20.090637 11.646484 19.966797 L 12.035156 17.9375 L 8.2402344 20.511719 L 10.892578 23.917969 L 11.265625 21.966797 C 14.968963 22.233766 18.681899 20.426323 20.660156 17 C 21.355156 15.801 21.805219 14.445 21.949219 13 L 19.929688 13 z";
|
|
14903
|
+
var Close = "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z";
|
|
14904
|
+
var ContentCopy = "M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z";
|
|
14905
|
+
var Edit = "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 0 0-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z";
|
|
14906
|
+
var ExpandMore = "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z";
|
|
14907
|
+
var Delete = "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM8 9h8v10H8zm7.5-5l-1-1h-5l-1 1H5v2h14V4z";
|
|
14908
|
+
var AddBoxIcon = (props) => {
|
|
14909
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14910
|
+
d: AddBox,
|
|
14911
|
+
...props
|
|
14912
|
+
});
|
|
14913
|
+
};
|
|
14914
|
+
var CheckIcon = (props) => {
|
|
14915
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14916
|
+
d: Check,
|
|
14917
|
+
...props
|
|
14918
|
+
});
|
|
14919
|
+
};
|
|
14920
|
+
var ChevronRightIcon = (props) => {
|
|
14921
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14922
|
+
d: ChevronRight,
|
|
14923
|
+
...props
|
|
14924
|
+
});
|
|
14925
|
+
};
|
|
14926
|
+
var CircularArrowsIcon = (props) => {
|
|
14927
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14928
|
+
d: CircularArrows,
|
|
14929
|
+
...props
|
|
14930
|
+
});
|
|
14931
|
+
};
|
|
14932
|
+
var CloseIcon = (props) => {
|
|
14933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14934
|
+
d: Close,
|
|
14935
|
+
...props
|
|
14936
|
+
});
|
|
14937
|
+
};
|
|
14938
|
+
var ContentCopyIcon = (props) => {
|
|
14939
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14940
|
+
d: ContentCopy,
|
|
14941
|
+
...props
|
|
14942
|
+
});
|
|
14943
|
+
};
|
|
14944
|
+
var EditIcon = (props) => {
|
|
14945
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14946
|
+
d: Edit,
|
|
14947
|
+
...props
|
|
14948
|
+
});
|
|
14949
|
+
};
|
|
14950
|
+
var ExpandMoreIcon = (props) => {
|
|
14951
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14952
|
+
d: ExpandMore,
|
|
14953
|
+
...props
|
|
14954
|
+
});
|
|
14955
|
+
};
|
|
14956
|
+
var DeleteIcon = (props) => {
|
|
14957
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(BaseIcon, {
|
|
14958
|
+
d: Delete,
|
|
14959
|
+
...props
|
|
14960
|
+
});
|
|
14961
|
+
};
|
|
14962
|
+
var objectLb = "{";
|
|
14963
|
+
var arrayLb = "[";
|
|
14964
|
+
var objectRb = "}";
|
|
14965
|
+
var arrayRb = "]";
|
|
14966
|
+
function inspectMetadata(value) {
|
|
14967
|
+
const length = getValueSize(value);
|
|
14968
|
+
let name = "";
|
|
14969
|
+
if (value instanceof Map || value instanceof Set) {
|
|
14970
|
+
name = value[Symbol.toStringTag];
|
|
14971
|
+
}
|
|
14972
|
+
if (Object.prototype.hasOwnProperty.call(value, Symbol.toStringTag)) {
|
|
14973
|
+
name = value[Symbol.toStringTag];
|
|
14974
|
+
}
|
|
14975
|
+
return "".concat(length, " Items").concat(name ? " (".concat(name, ")") : "");
|
|
14976
|
+
}
|
|
14977
|
+
var PreObjectType = (props) => {
|
|
14978
|
+
const metadataColor = useJsonViewerStore((store) => store.colorspace.base04);
|
|
14979
|
+
const textColor = useTextColor();
|
|
14980
|
+
const isArrayLike = (0, import_react49.useMemo)(() => Array.isArray(props.value) || props.value instanceof Set, [
|
|
14981
|
+
props.value
|
|
14982
|
+
]);
|
|
14983
|
+
const isEmptyValue = (0, import_react49.useMemo)(() => getValueSize(props.value) === 0, [
|
|
14984
|
+
props.value
|
|
14985
|
+
]);
|
|
14986
|
+
const sizeOfValue = (0, import_react49.useMemo)(() => inspectMetadata(props.value), [
|
|
14987
|
+
props.value
|
|
14988
|
+
]);
|
|
14989
|
+
const displaySize = useJsonViewerStore((store) => store.displaySize);
|
|
14990
|
+
const shouldDisplaySize = (0, import_react49.useMemo)(() => typeof displaySize === "function" ? displaySize(props.path, props.value) : displaySize, [
|
|
14991
|
+
displaySize,
|
|
14992
|
+
props.path,
|
|
14993
|
+
props.value
|
|
14994
|
+
]);
|
|
14995
|
+
const isTrap = useIsCycleReference(props.path, props.value);
|
|
14996
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, {
|
|
14997
|
+
component: "span",
|
|
14998
|
+
className: "data-object-start",
|
|
14999
|
+
sx: {
|
|
15000
|
+
letterSpacing: 0.5
|
|
15001
|
+
},
|
|
15002
|
+
children: [
|
|
15003
|
+
isArrayLike ? arrayLb : objectLb,
|
|
15004
|
+
shouldDisplaySize && props.inspect && !isEmptyValue && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15005
|
+
component: "span",
|
|
15006
|
+
sx: {
|
|
15007
|
+
pl: 0.5,
|
|
15008
|
+
fontStyle: "italic",
|
|
15009
|
+
color: metadataColor,
|
|
15010
|
+
userSelect: "none"
|
|
15011
|
+
},
|
|
15012
|
+
children: sizeOfValue
|
|
15013
|
+
}),
|
|
15014
|
+
isTrap && !props.inspect && /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, {
|
|
15015
|
+
children: [
|
|
15016
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(CircularArrowsIcon, {
|
|
15017
|
+
sx: {
|
|
15018
|
+
fontSize: 12,
|
|
15019
|
+
color: textColor,
|
|
15020
|
+
mx: 0.5
|
|
15021
|
+
}
|
|
15022
|
+
}),
|
|
15023
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
15024
|
+
sx: {
|
|
15025
|
+
cursor: "pointer",
|
|
15026
|
+
userSelect: "none"
|
|
15027
|
+
},
|
|
15028
|
+
children: isTrap
|
|
15029
|
+
})
|
|
15030
|
+
]
|
|
15031
|
+
})
|
|
15032
|
+
]
|
|
15033
|
+
});
|
|
15034
|
+
};
|
|
15035
|
+
var PostObjectType = (props) => {
|
|
15036
|
+
const metadataColor = useJsonViewerStore((store) => store.colorspace.base04);
|
|
15037
|
+
const textColor = useTextColor();
|
|
15038
|
+
const isArrayLike = (0, import_react49.useMemo)(() => Array.isArray(props.value) || props.value instanceof Set, [
|
|
15039
|
+
props.value
|
|
15040
|
+
]);
|
|
15041
|
+
const isEmptyValue = (0, import_react49.useMemo)(() => getValueSize(props.value) === 0, [
|
|
15042
|
+
props.value
|
|
15043
|
+
]);
|
|
15044
|
+
const sizeOfValue = (0, import_react49.useMemo)(() => inspectMetadata(props.value), [
|
|
15045
|
+
props.value
|
|
15046
|
+
]);
|
|
15047
|
+
const displaySize = useJsonViewerStore((store) => store.displaySize);
|
|
15048
|
+
const shouldDisplaySize = (0, import_react49.useMemo)(() => typeof displaySize === "function" ? displaySize(props.path, props.value) : displaySize, [
|
|
15049
|
+
displaySize,
|
|
15050
|
+
props.path,
|
|
15051
|
+
props.value
|
|
15052
|
+
]);
|
|
15053
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, {
|
|
15054
|
+
component: "span",
|
|
15055
|
+
className: "data-object-end",
|
|
15056
|
+
sx: {
|
|
15057
|
+
lineHeight: 1.5,
|
|
15058
|
+
color: textColor,
|
|
15059
|
+
letterSpacing: 0.5,
|
|
15060
|
+
opacity: 0.8
|
|
15061
|
+
},
|
|
15062
|
+
children: [
|
|
15063
|
+
isArrayLike ? arrayRb : objectRb,
|
|
15064
|
+
shouldDisplaySize && (isEmptyValue || !props.inspect) ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15065
|
+
component: "span",
|
|
15066
|
+
sx: {
|
|
15067
|
+
pl: 0.5,
|
|
15068
|
+
fontStyle: "italic",
|
|
15069
|
+
color: metadataColor,
|
|
15070
|
+
userSelect: "none"
|
|
15071
|
+
},
|
|
15072
|
+
children: sizeOfValue
|
|
15073
|
+
}) : null
|
|
15074
|
+
]
|
|
15075
|
+
});
|
|
15076
|
+
};
|
|
15077
|
+
function getIterator(value) {
|
|
15078
|
+
return typeof (value === null || value === void 0 ? void 0 : value[Symbol.iterator]) === "function";
|
|
15079
|
+
}
|
|
15080
|
+
var ObjectType = (props) => {
|
|
15081
|
+
const keyColor = useTextColor();
|
|
15082
|
+
const borderColor = useJsonViewerStore((store) => store.colorspace.base02);
|
|
15083
|
+
const groupArraysAfterLength = useJsonViewerStore((store) => store.groupArraysAfterLength);
|
|
15084
|
+
const isTrap = useIsCycleReference(props.path, props.value);
|
|
15085
|
+
const [displayLength, setDisplayLength] = (0, import_react49.useState)(useJsonViewerStore((store) => store.maxDisplayLength));
|
|
15086
|
+
const objectSortKeys = useJsonViewerStore((store) => store.objectSortKeys);
|
|
15087
|
+
const elements = (0, import_react49.useMemo)(() => {
|
|
15088
|
+
if (!props.inspect) {
|
|
15089
|
+
return null;
|
|
15090
|
+
}
|
|
15091
|
+
const value = props.value;
|
|
15092
|
+
const iterator = getIterator(value);
|
|
15093
|
+
if (iterator && !Array.isArray(value)) {
|
|
15094
|
+
const elements3 = [];
|
|
15095
|
+
if (value instanceof Map) {
|
|
15096
|
+
const lastIndex2 = value.size - 1;
|
|
15097
|
+
let index2 = 0;
|
|
15098
|
+
value.forEach((value2, k2) => {
|
|
15099
|
+
const key = k2.toString();
|
|
15100
|
+
const path = [
|
|
15101
|
+
...props.path,
|
|
15102
|
+
key
|
|
15103
|
+
];
|
|
15104
|
+
elements3.push(/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15105
|
+
path,
|
|
15106
|
+
value: value2,
|
|
15107
|
+
prevValue: props.prevValue instanceof Map ? props.prevValue.get(k2) : void 0,
|
|
15108
|
+
editable: false,
|
|
15109
|
+
last: index2 === lastIndex2
|
|
15110
|
+
}, key));
|
|
15111
|
+
index2++;
|
|
15112
|
+
});
|
|
15113
|
+
} else {
|
|
15114
|
+
const iterator2 = value[Symbol.iterator]();
|
|
15115
|
+
let result = iterator2.next();
|
|
15116
|
+
let count2 = 0;
|
|
15117
|
+
while (true) {
|
|
15118
|
+
const nextResult = iterator2.next();
|
|
15119
|
+
var _nextResult_done;
|
|
15120
|
+
elements3.push(/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15121
|
+
path: [
|
|
15122
|
+
...props.path,
|
|
15123
|
+
"iterator:".concat(count2)
|
|
15124
|
+
],
|
|
15125
|
+
value: result.value,
|
|
15126
|
+
nestedIndex: count2,
|
|
15127
|
+
editable: false,
|
|
15128
|
+
last: (_nextResult_done = nextResult.done) !== null && _nextResult_done !== void 0 ? _nextResult_done : false
|
|
15129
|
+
}, count2));
|
|
15130
|
+
if (nextResult.done) {
|
|
15131
|
+
break;
|
|
15132
|
+
}
|
|
15133
|
+
count2++;
|
|
15134
|
+
result = nextResult;
|
|
15135
|
+
}
|
|
15136
|
+
}
|
|
15137
|
+
return elements3;
|
|
15138
|
+
}
|
|
15139
|
+
if (Array.isArray(value)) {
|
|
15140
|
+
const lastIndex2 = value.length - 1;
|
|
15141
|
+
if (value.length <= groupArraysAfterLength) {
|
|
15142
|
+
const elements4 = value.slice(0, displayLength).map((value2, _index) => {
|
|
15143
|
+
const index2 = props.nestedIndex ? props.nestedIndex * groupArraysAfterLength + _index : _index;
|
|
15144
|
+
const path = [
|
|
15145
|
+
...props.path,
|
|
15146
|
+
index2
|
|
15147
|
+
];
|
|
15148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15149
|
+
path,
|
|
15150
|
+
value: value2,
|
|
15151
|
+
prevValue: Array.isArray(props.prevValue) ? props.prevValue[index2] : void 0,
|
|
15152
|
+
last: _index === lastIndex2
|
|
15153
|
+
}, index2);
|
|
15154
|
+
});
|
|
15155
|
+
if (value.length > displayLength) {
|
|
15156
|
+
const rest = value.length - displayLength;
|
|
15157
|
+
elements4.push(/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(DataBox, {
|
|
15158
|
+
sx: {
|
|
15159
|
+
cursor: "pointer",
|
|
15160
|
+
lineHeight: 1.5,
|
|
15161
|
+
color: keyColor,
|
|
15162
|
+
letterSpacing: 0.5,
|
|
15163
|
+
opacity: 0.8,
|
|
15164
|
+
userSelect: "none"
|
|
15165
|
+
},
|
|
15166
|
+
onClick: () => setDisplayLength((length) => length * 2),
|
|
15167
|
+
children: [
|
|
15168
|
+
"hidden ",
|
|
15169
|
+
rest,
|
|
15170
|
+
" items\u2026"
|
|
15171
|
+
]
|
|
15172
|
+
}, "last"));
|
|
15173
|
+
}
|
|
15174
|
+
return elements4;
|
|
15175
|
+
}
|
|
15176
|
+
const elements3 = segmentArray(value, groupArraysAfterLength);
|
|
15177
|
+
const prevElements = Array.isArray(props.prevValue) ? segmentArray(props.prevValue, groupArraysAfterLength) : void 0;
|
|
15178
|
+
const elementsLastIndex = elements3.length - 1;
|
|
15179
|
+
return elements3.map((list, index2) => {
|
|
15180
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15181
|
+
path: props.path,
|
|
15182
|
+
value: list,
|
|
15183
|
+
nestedIndex: index2,
|
|
15184
|
+
prevValue: prevElements === null || prevElements === void 0 ? void 0 : prevElements[index2],
|
|
15185
|
+
last: index2 === elementsLastIndex
|
|
15186
|
+
}, index2);
|
|
15187
|
+
});
|
|
15188
|
+
}
|
|
15189
|
+
let entries = Object.entries(value);
|
|
15190
|
+
if (objectSortKeys) {
|
|
15191
|
+
entries = objectSortKeys === true ? entries.sort((param, param1) => {
|
|
15192
|
+
let [a3] = param, [b3] = param1;
|
|
15193
|
+
return a3.localeCompare(b3);
|
|
15194
|
+
}) : entries.sort((param, param1) => {
|
|
15195
|
+
let [a3] = param, [b3] = param1;
|
|
15196
|
+
return objectSortKeys(a3, b3);
|
|
15197
|
+
});
|
|
15198
|
+
}
|
|
15199
|
+
const lastIndex = entries.length - 1;
|
|
15200
|
+
const elements2 = entries.slice(0, displayLength).map((param, index2) => {
|
|
15201
|
+
let [key, value2] = param;
|
|
15202
|
+
var _props_prevValue;
|
|
15203
|
+
const path = [
|
|
15204
|
+
...props.path,
|
|
15205
|
+
key
|
|
15206
|
+
];
|
|
15207
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15208
|
+
path,
|
|
15209
|
+
value: value2,
|
|
15210
|
+
prevValue: (_props_prevValue = props.prevValue) === null || _props_prevValue === void 0 ? void 0 : _props_prevValue[key],
|
|
15211
|
+
last: index2 === lastIndex
|
|
15212
|
+
}, key);
|
|
15213
|
+
});
|
|
15214
|
+
if (entries.length > displayLength) {
|
|
15215
|
+
const rest = entries.length - displayLength;
|
|
15216
|
+
elements2.push(/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(DataBox, {
|
|
15217
|
+
sx: {
|
|
15218
|
+
cursor: "pointer",
|
|
15219
|
+
lineHeight: 1.5,
|
|
15220
|
+
color: keyColor,
|
|
15221
|
+
letterSpacing: 0.5,
|
|
15222
|
+
opacity: 0.8,
|
|
15223
|
+
userSelect: "none"
|
|
15224
|
+
},
|
|
15225
|
+
onClick: () => setDisplayLength((length) => length * 2),
|
|
15226
|
+
children: [
|
|
15227
|
+
"hidden ",
|
|
15228
|
+
rest,
|
|
15229
|
+
" items\u2026"
|
|
15230
|
+
]
|
|
15231
|
+
}, "last"));
|
|
15232
|
+
}
|
|
15233
|
+
return elements2;
|
|
15234
|
+
}, [
|
|
15235
|
+
props.inspect,
|
|
15236
|
+
props.value,
|
|
15237
|
+
props.prevValue,
|
|
15238
|
+
props.path,
|
|
15239
|
+
props.nestedIndex,
|
|
15240
|
+
groupArraysAfterLength,
|
|
15241
|
+
displayLength,
|
|
15242
|
+
keyColor,
|
|
15243
|
+
objectSortKeys
|
|
15244
|
+
]);
|
|
15245
|
+
const marginLeft = props.inspect ? 0.6 : 0;
|
|
15246
|
+
const width = useJsonViewerStore((store) => store.indentWidth);
|
|
15247
|
+
const indentWidth = props.inspect ? width - marginLeft : width;
|
|
15248
|
+
const isEmptyValue = (0, import_react49.useMemo)(() => getValueSize(props.value) === 0, [
|
|
15249
|
+
props.value
|
|
15250
|
+
]);
|
|
15251
|
+
if (isEmptyValue) {
|
|
15252
|
+
return null;
|
|
15253
|
+
}
|
|
15254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15255
|
+
className: "data-object",
|
|
15256
|
+
sx: {
|
|
15257
|
+
display: props.inspect ? "block" : "inline-block",
|
|
15258
|
+
pl: props.inspect ? indentWidth - 0.6 : 0,
|
|
15259
|
+
marginLeft,
|
|
15260
|
+
color: keyColor,
|
|
15261
|
+
borderLeft: props.inspect ? "1px solid ".concat(borderColor) : "none"
|
|
15262
|
+
},
|
|
15263
|
+
children: props.inspect ? elements : !isTrap && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15264
|
+
component: "span",
|
|
15265
|
+
className: "data-object-body",
|
|
15266
|
+
onClick: () => props.setInspect(true),
|
|
15267
|
+
sx: {
|
|
15268
|
+
"&:hover": {
|
|
15269
|
+
cursor: "pointer"
|
|
15270
|
+
},
|
|
15271
|
+
padding: 0.5,
|
|
15272
|
+
userSelect: "none"
|
|
15273
|
+
},
|
|
15274
|
+
children: "\u2026"
|
|
15275
|
+
})
|
|
15276
|
+
});
|
|
15277
|
+
};
|
|
15278
|
+
var objectType = {
|
|
15279
|
+
is: (value) => typeof value === "object",
|
|
15280
|
+
Component: ObjectType,
|
|
15281
|
+
PreComponent: PreObjectType,
|
|
15282
|
+
PostComponent: PostObjectType
|
|
15283
|
+
};
|
|
15284
|
+
var stringType = defineEasyType({
|
|
15285
|
+
is: (value) => typeof value === "string",
|
|
15286
|
+
type: "string",
|
|
15287
|
+
colorKey: "base09",
|
|
15288
|
+
serialize: (value) => value,
|
|
15289
|
+
deserialize: (value) => value,
|
|
15290
|
+
Renderer: (props) => {
|
|
15291
|
+
const [showRest, setShowRest] = (0, import_react49.useState)(false);
|
|
15292
|
+
const collapseStringsAfterLength = useJsonViewerStore((store) => store.collapseStringsAfterLength);
|
|
15293
|
+
const value = showRest ? props.value : props.value.slice(0, collapseStringsAfterLength);
|
|
15294
|
+
const hasRest = props.value.length > collapseStringsAfterLength;
|
|
15295
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, {
|
|
15296
|
+
component: "span",
|
|
15297
|
+
sx: {
|
|
15298
|
+
overflowWrap: "anywhere",
|
|
15299
|
+
cursor: hasRest ? "pointer" : "inherit"
|
|
15300
|
+
},
|
|
15301
|
+
onClick: () => {
|
|
15302
|
+
var _window_getSelection;
|
|
15303
|
+
if (((_window_getSelection = window.getSelection()) === null || _window_getSelection === void 0 ? void 0 : _window_getSelection.type) === "Range") {
|
|
15304
|
+
return;
|
|
15305
|
+
}
|
|
15306
|
+
if (hasRest) {
|
|
15307
|
+
setShowRest((value2) => !value2);
|
|
15308
|
+
}
|
|
15309
|
+
},
|
|
15310
|
+
children: [
|
|
15311
|
+
'"',
|
|
15312
|
+
value,
|
|
15313
|
+
hasRest && !showRest && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15314
|
+
component: "span",
|
|
15315
|
+
sx: {
|
|
15316
|
+
padding: 0.5
|
|
15317
|
+
},
|
|
15318
|
+
children: "\u2026"
|
|
15319
|
+
}),
|
|
15320
|
+
'"'
|
|
15321
|
+
]
|
|
15322
|
+
});
|
|
15323
|
+
}
|
|
15324
|
+
});
|
|
15325
|
+
var undefinedType = defineEasyType({
|
|
15326
|
+
is: (value) => value === void 0,
|
|
15327
|
+
type: "undefined",
|
|
15328
|
+
colorKey: "base05",
|
|
15329
|
+
displayTypeLabel: false,
|
|
15330
|
+
Renderer: () => {
|
|
15331
|
+
const backgroundColor = useJsonViewerStore((store) => store.colorspace.base02);
|
|
15332
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15333
|
+
sx: {
|
|
15334
|
+
fontSize: "0.7rem",
|
|
15335
|
+
backgroundColor,
|
|
15336
|
+
borderRadius: "3px",
|
|
15337
|
+
padding: "0.5px 2px"
|
|
15338
|
+
},
|
|
15339
|
+
children: "undefined"
|
|
15340
|
+
});
|
|
15341
|
+
}
|
|
15342
|
+
});
|
|
15343
|
+
function memorizeDataType(dataType) {
|
|
15344
|
+
function compare(prevProps, nextProps) {
|
|
15345
|
+
var _prevProps_path, _nextProps_path;
|
|
15346
|
+
return Object.is(prevProps.value, nextProps.value) && prevProps.inspect && nextProps.inspect && ((_prevProps_path = prevProps.path) === null || _prevProps_path === void 0 ? void 0 : _prevProps_path.join(".")) === ((_nextProps_path = nextProps.path) === null || _nextProps_path === void 0 ? void 0 : _nextProps_path.join("."));
|
|
15347
|
+
}
|
|
15348
|
+
dataType.Component = /* @__PURE__ */ (0, import_react49.memo)(dataType.Component, compare);
|
|
15349
|
+
if (dataType.Editor) {
|
|
15350
|
+
dataType.Editor = /* @__PURE__ */ (0, import_react49.memo)(dataType.Editor, function compare2(prevProps, nextProps) {
|
|
15351
|
+
return Object.is(prevProps.value, nextProps.value);
|
|
15352
|
+
});
|
|
15353
|
+
}
|
|
15354
|
+
if (dataType.PreComponent) {
|
|
15355
|
+
dataType.PreComponent = /* @__PURE__ */ (0, import_react49.memo)(dataType.PreComponent, compare);
|
|
15356
|
+
}
|
|
15357
|
+
if (dataType.PostComponent) {
|
|
15358
|
+
dataType.PostComponent = /* @__PURE__ */ (0, import_react49.memo)(dataType.PostComponent, compare);
|
|
15359
|
+
}
|
|
15360
|
+
return dataType;
|
|
15361
|
+
}
|
|
15362
|
+
var predefinedTypes = [
|
|
15363
|
+
memorizeDataType(booleanType),
|
|
15364
|
+
memorizeDataType(dateType),
|
|
15365
|
+
memorizeDataType(nullType),
|
|
15366
|
+
memorizeDataType(undefinedType),
|
|
15367
|
+
memorizeDataType(stringType),
|
|
15368
|
+
memorizeDataType(functionType),
|
|
15369
|
+
memorizeDataType(nanType),
|
|
15370
|
+
memorizeDataType(intType),
|
|
15371
|
+
memorizeDataType(floatType),
|
|
15372
|
+
memorizeDataType(bigIntType)
|
|
15373
|
+
];
|
|
15374
|
+
var createTypeRegistryStore = () => {
|
|
15375
|
+
return createStore()((set) => ({
|
|
15376
|
+
registry: predefinedTypes,
|
|
15377
|
+
registerTypes: (setState) => {
|
|
15378
|
+
set((state) => ({
|
|
15379
|
+
registry: typeof setState === "function" ? setState(state.registry) : setState
|
|
15380
|
+
}));
|
|
15381
|
+
}
|
|
15382
|
+
}));
|
|
15383
|
+
};
|
|
15384
|
+
var TypeRegistryStoreContext = /* @__PURE__ */ (0, import_react49.createContext)(void 0);
|
|
15385
|
+
TypeRegistryStoreContext.Provider;
|
|
15386
|
+
var useTypeRegistryStore = (selector2, equalityFn) => {
|
|
15387
|
+
const store = (0, import_react49.useContext)(TypeRegistryStoreContext);
|
|
15388
|
+
return useStore(store, selector2, equalityFn);
|
|
15389
|
+
};
|
|
15390
|
+
function matchTypeComponents(value, path, registry) {
|
|
15391
|
+
let potential;
|
|
15392
|
+
for (const T of registry) {
|
|
15393
|
+
if (T.is(value, path)) {
|
|
15394
|
+
potential = T;
|
|
15395
|
+
}
|
|
15396
|
+
}
|
|
15397
|
+
if (potential === void 0) {
|
|
15398
|
+
if (typeof value === "object") {
|
|
15399
|
+
return objectType;
|
|
15400
|
+
}
|
|
15401
|
+
throw new Error("No type matched for value: ".concat(value));
|
|
15402
|
+
}
|
|
15403
|
+
return potential;
|
|
15404
|
+
}
|
|
15405
|
+
function useTypeComponents(value, path) {
|
|
15406
|
+
const registry = useTypeRegistryStore((store) => store.registry);
|
|
15407
|
+
return (0, import_react49.useMemo)(() => matchTypeComponents(value, path, registry), [
|
|
15408
|
+
value,
|
|
15409
|
+
path,
|
|
15410
|
+
registry
|
|
15411
|
+
]);
|
|
15412
|
+
}
|
|
15413
|
+
var IconBox = (props) => /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15414
|
+
component: "span",
|
|
15415
|
+
...props,
|
|
15416
|
+
sx: {
|
|
15417
|
+
cursor: "pointer",
|
|
15418
|
+
paddingLeft: "0.7rem",
|
|
15419
|
+
...props.sx
|
|
15420
|
+
}
|
|
15421
|
+
});
|
|
15422
|
+
var DataKeyPair = (props) => {
|
|
15423
|
+
const { value, prevValue, path, nestedIndex, last } = props;
|
|
15424
|
+
const { Component, PreComponent, PostComponent, Editor, serialize, deserialize } = useTypeComponents(value, path);
|
|
15425
|
+
var _props_editable;
|
|
15426
|
+
const propsEditable = (_props_editable = props.editable) !== null && _props_editable !== void 0 ? _props_editable : void 0;
|
|
15427
|
+
const storeEditable = useJsonViewerStore((store) => store.editable);
|
|
15428
|
+
const editable = (0, import_react49.useMemo)(() => {
|
|
15429
|
+
if (storeEditable === false) {
|
|
15430
|
+
return false;
|
|
15431
|
+
}
|
|
15432
|
+
if (propsEditable === false) {
|
|
15433
|
+
return false;
|
|
15434
|
+
}
|
|
15435
|
+
if (typeof storeEditable === "function") {
|
|
15436
|
+
return !!storeEditable(path, value);
|
|
15437
|
+
}
|
|
15438
|
+
return storeEditable;
|
|
15439
|
+
}, [
|
|
15440
|
+
path,
|
|
15441
|
+
propsEditable,
|
|
15442
|
+
storeEditable,
|
|
15443
|
+
value
|
|
15444
|
+
]);
|
|
15445
|
+
const [tempValue, setTempValue] = (0, import_react49.useState)("");
|
|
15446
|
+
const depth = path.length;
|
|
15447
|
+
const key = path[depth - 1];
|
|
15448
|
+
const hoverPath = useJsonViewerStore((store) => store.hoverPath);
|
|
15449
|
+
const isHover = (0, import_react49.useMemo)(() => {
|
|
15450
|
+
return hoverPath && path.every((value2, index2) => value2 === hoverPath.path[index2] && nestedIndex === hoverPath.nestedIndex);
|
|
15451
|
+
}, [
|
|
15452
|
+
hoverPath,
|
|
15453
|
+
path,
|
|
15454
|
+
nestedIndex
|
|
15455
|
+
]);
|
|
15456
|
+
const setHover = useJsonViewerStore((store) => store.setHover);
|
|
15457
|
+
const root = useJsonViewerStore((store) => store.value);
|
|
15458
|
+
const [inspect, setInspect] = useInspect(path, value, nestedIndex);
|
|
15459
|
+
const [editing, setEditing] = (0, import_react49.useState)(false);
|
|
15460
|
+
const onChange = useJsonViewerStore((store) => store.onChange);
|
|
15461
|
+
const keyColor = useTextColor();
|
|
15462
|
+
const numberKeyColor = useJsonViewerStore((store) => store.colorspace.base0C);
|
|
15463
|
+
const highlightColor = useJsonViewerStore((store) => store.colorspace.base0A);
|
|
15464
|
+
const displayComma = useJsonViewerStore((store) => store.displayComma);
|
|
15465
|
+
const quotesOnKeys = useJsonViewerStore((store) => store.quotesOnKeys);
|
|
15466
|
+
const rootName = useJsonViewerStore((store) => store.rootName);
|
|
15467
|
+
const isRoot = root === value;
|
|
15468
|
+
const isNumberKey = Number.isInteger(Number(key));
|
|
15469
|
+
const storeEnableAdd = useJsonViewerStore((store) => store.enableAdd);
|
|
15470
|
+
const onAdd = useJsonViewerStore((store) => store.onAdd);
|
|
15471
|
+
const enableAdd = (0, import_react49.useMemo)(() => {
|
|
15472
|
+
if (!onAdd || nestedIndex !== void 0) return false;
|
|
15473
|
+
if (storeEnableAdd === false) {
|
|
15474
|
+
return false;
|
|
15475
|
+
}
|
|
15476
|
+
if (propsEditable === false) {
|
|
15477
|
+
return false;
|
|
15478
|
+
}
|
|
15479
|
+
if (typeof storeEnableAdd === "function") {
|
|
15480
|
+
return !!storeEnableAdd(path, value);
|
|
15481
|
+
}
|
|
15482
|
+
if (Array.isArray(value) || isPlainObject(value)) {
|
|
15483
|
+
return true;
|
|
15484
|
+
}
|
|
15485
|
+
return false;
|
|
15486
|
+
}, [
|
|
15487
|
+
onAdd,
|
|
15488
|
+
nestedIndex,
|
|
15489
|
+
path,
|
|
15490
|
+
storeEnableAdd,
|
|
15491
|
+
propsEditable,
|
|
15492
|
+
value
|
|
15493
|
+
]);
|
|
15494
|
+
const storeEnableDelete = useJsonViewerStore((store) => store.enableDelete);
|
|
15495
|
+
const onDelete = useJsonViewerStore((store) => store.onDelete);
|
|
15496
|
+
const enableDelete = (0, import_react49.useMemo)(() => {
|
|
15497
|
+
if (!onDelete || nestedIndex !== void 0) return false;
|
|
15498
|
+
if (isRoot) {
|
|
15499
|
+
return false;
|
|
15500
|
+
}
|
|
15501
|
+
if (storeEnableDelete === false) {
|
|
15502
|
+
return false;
|
|
15503
|
+
}
|
|
15504
|
+
if (propsEditable === false) {
|
|
15505
|
+
return false;
|
|
15506
|
+
}
|
|
15507
|
+
if (typeof storeEnableDelete === "function") {
|
|
15508
|
+
return !!storeEnableDelete(path, value);
|
|
15509
|
+
}
|
|
15510
|
+
return storeEnableDelete;
|
|
15511
|
+
}, [
|
|
15512
|
+
onDelete,
|
|
15513
|
+
nestedIndex,
|
|
15514
|
+
isRoot,
|
|
15515
|
+
path,
|
|
15516
|
+
storeEnableDelete,
|
|
15517
|
+
propsEditable,
|
|
15518
|
+
value
|
|
15519
|
+
]);
|
|
15520
|
+
const enableClipboard = useJsonViewerStore((store) => store.enableClipboard);
|
|
15521
|
+
const { copy, copied } = useClipboard();
|
|
15522
|
+
const highlightUpdates = useJsonViewerStore((store) => store.highlightUpdates);
|
|
15523
|
+
const isHighlight = (0, import_react49.useMemo)(() => {
|
|
15524
|
+
if (!highlightUpdates || prevValue === void 0) return false;
|
|
15525
|
+
if (typeof value !== typeof prevValue) {
|
|
15526
|
+
return true;
|
|
15527
|
+
}
|
|
15528
|
+
if (typeof value === "number") {
|
|
15529
|
+
if (isNaN(value) && isNaN(prevValue)) return false;
|
|
15530
|
+
return value !== prevValue;
|
|
15531
|
+
}
|
|
15532
|
+
if (Array.isArray(value) !== Array.isArray(prevValue)) {
|
|
15533
|
+
return true;
|
|
15534
|
+
}
|
|
15535
|
+
if (typeof value === "object" || typeof value === "function") {
|
|
15536
|
+
return false;
|
|
15537
|
+
}
|
|
15538
|
+
if (value !== prevValue) {
|
|
15539
|
+
return true;
|
|
15540
|
+
}
|
|
15541
|
+
return false;
|
|
15542
|
+
}, [
|
|
15543
|
+
highlightUpdates,
|
|
15544
|
+
prevValue,
|
|
15545
|
+
value
|
|
15546
|
+
]);
|
|
15547
|
+
const highlightContainer = (0, import_react49.useRef)();
|
|
15548
|
+
(0, import_react49.useEffect)(() => {
|
|
15549
|
+
if (highlightContainer.current && isHighlight && "animate" in highlightContainer.current) {
|
|
15550
|
+
highlightContainer.current.animate([
|
|
15551
|
+
{
|
|
15552
|
+
backgroundColor: highlightColor
|
|
15553
|
+
},
|
|
15554
|
+
{
|
|
15555
|
+
backgroundColor: ""
|
|
15556
|
+
}
|
|
15557
|
+
], {
|
|
15558
|
+
duration: 1e3,
|
|
15559
|
+
easing: "ease-in"
|
|
15560
|
+
});
|
|
15561
|
+
}
|
|
15562
|
+
}, [
|
|
15563
|
+
highlightColor,
|
|
15564
|
+
isHighlight,
|
|
15565
|
+
prevValue,
|
|
15566
|
+
value
|
|
15567
|
+
]);
|
|
15568
|
+
const startEditing = (0, import_react49.useCallback)((event) => {
|
|
15569
|
+
event.preventDefault();
|
|
15570
|
+
if (serialize) setTempValue(serialize(value));
|
|
15571
|
+
setEditing(true);
|
|
15572
|
+
}, [
|
|
15573
|
+
serialize,
|
|
15574
|
+
value
|
|
15575
|
+
]);
|
|
15576
|
+
const abortEditing = (0, import_react49.useCallback)(() => {
|
|
15577
|
+
setEditing(false);
|
|
15578
|
+
setTempValue("");
|
|
15579
|
+
}, [
|
|
15580
|
+
setEditing,
|
|
15581
|
+
setTempValue
|
|
15582
|
+
]);
|
|
15583
|
+
const commitEditing = (0, import_react49.useCallback)((newValue) => {
|
|
15584
|
+
setEditing(false);
|
|
15585
|
+
if (!deserialize) return;
|
|
15586
|
+
try {
|
|
15587
|
+
onChange(path, value, deserialize(newValue));
|
|
15588
|
+
} catch (e2) {
|
|
15589
|
+
}
|
|
15590
|
+
}, [
|
|
15591
|
+
setEditing,
|
|
15592
|
+
deserialize,
|
|
15593
|
+
onChange,
|
|
15594
|
+
path,
|
|
15595
|
+
value
|
|
15596
|
+
]);
|
|
15597
|
+
const actionIcons = (0, import_react49.useMemo)(() => {
|
|
15598
|
+
if (editing) {
|
|
15599
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, {
|
|
15600
|
+
children: [
|
|
15601
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15602
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(CloseIcon, {
|
|
15603
|
+
sx: {
|
|
15604
|
+
fontSize: ".8rem"
|
|
15605
|
+
},
|
|
15606
|
+
onClick: abortEditing
|
|
15607
|
+
})
|
|
15608
|
+
}),
|
|
15609
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15610
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(CheckIcon, {
|
|
15611
|
+
sx: {
|
|
15612
|
+
fontSize: ".8rem"
|
|
15613
|
+
},
|
|
15614
|
+
onClick: () => commitEditing(tempValue)
|
|
15615
|
+
})
|
|
15616
|
+
})
|
|
15617
|
+
]
|
|
15618
|
+
});
|
|
15619
|
+
}
|
|
15620
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, {
|
|
15621
|
+
children: [
|
|
15622
|
+
enableClipboard && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15623
|
+
onClick: (event) => {
|
|
15624
|
+
event.preventDefault();
|
|
15625
|
+
try {
|
|
15626
|
+
copy(path, value, copyString);
|
|
15627
|
+
} catch (e2) {
|
|
15628
|
+
console.error(e2);
|
|
15629
|
+
}
|
|
15630
|
+
},
|
|
15631
|
+
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(CheckIcon, {
|
|
15632
|
+
sx: {
|
|
15633
|
+
fontSize: ".8rem"
|
|
15634
|
+
}
|
|
15635
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(ContentCopyIcon, {
|
|
15636
|
+
sx: {
|
|
15637
|
+
fontSize: ".8rem"
|
|
15638
|
+
}
|
|
15639
|
+
})
|
|
15640
|
+
}),
|
|
15641
|
+
Editor && editable && serialize && deserialize && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15642
|
+
onClick: startEditing,
|
|
15643
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(EditIcon, {
|
|
15644
|
+
sx: {
|
|
15645
|
+
fontSize: ".8rem"
|
|
15646
|
+
}
|
|
15647
|
+
})
|
|
15648
|
+
}),
|
|
15649
|
+
enableAdd && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15650
|
+
onClick: (event) => {
|
|
15651
|
+
event.preventDefault();
|
|
15652
|
+
onAdd === null || onAdd === void 0 ? void 0 : onAdd(path);
|
|
15653
|
+
},
|
|
15654
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(AddBoxIcon, {
|
|
15655
|
+
sx: {
|
|
15656
|
+
fontSize: ".8rem"
|
|
15657
|
+
}
|
|
15658
|
+
})
|
|
15659
|
+
}),
|
|
15660
|
+
enableDelete && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(IconBox, {
|
|
15661
|
+
onClick: (event) => {
|
|
15662
|
+
event.preventDefault();
|
|
15663
|
+
onDelete === null || onDelete === void 0 ? void 0 : onDelete(path, value);
|
|
15664
|
+
},
|
|
15665
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DeleteIcon, {
|
|
15666
|
+
sx: {
|
|
15667
|
+
fontSize: ".9rem"
|
|
15668
|
+
}
|
|
15669
|
+
})
|
|
15670
|
+
})
|
|
15671
|
+
]
|
|
15672
|
+
});
|
|
15673
|
+
}, [
|
|
15674
|
+
Editor,
|
|
15675
|
+
serialize,
|
|
15676
|
+
deserialize,
|
|
15677
|
+
copied,
|
|
15678
|
+
copy,
|
|
15679
|
+
editable,
|
|
15680
|
+
editing,
|
|
15681
|
+
enableClipboard,
|
|
15682
|
+
enableAdd,
|
|
15683
|
+
enableDelete,
|
|
15684
|
+
tempValue,
|
|
15685
|
+
path,
|
|
15686
|
+
value,
|
|
15687
|
+
onAdd,
|
|
15688
|
+
onDelete,
|
|
15689
|
+
startEditing,
|
|
15690
|
+
abortEditing,
|
|
15691
|
+
commitEditing
|
|
15692
|
+
]);
|
|
15693
|
+
const isEmptyValue = (0, import_react49.useMemo)(() => getValueSize(value) === 0, [
|
|
15694
|
+
value
|
|
15695
|
+
]);
|
|
15696
|
+
const expandable = !isEmptyValue && !!(PreComponent && PostComponent);
|
|
15697
|
+
const KeyRenderer = useJsonViewerStore((store) => store.keyRenderer);
|
|
15698
|
+
const downstreamProps = (0, import_react49.useMemo)(() => ({
|
|
15699
|
+
path,
|
|
15700
|
+
inspect,
|
|
15701
|
+
setInspect,
|
|
15702
|
+
value,
|
|
15703
|
+
prevValue,
|
|
15704
|
+
nestedIndex
|
|
15705
|
+
}), [
|
|
15706
|
+
inspect,
|
|
15707
|
+
path,
|
|
15708
|
+
setInspect,
|
|
15709
|
+
value,
|
|
15710
|
+
prevValue,
|
|
15711
|
+
nestedIndex
|
|
15712
|
+
]);
|
|
15713
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, {
|
|
15714
|
+
className: "data-key-pair",
|
|
15715
|
+
"data-testid": "data-key-pair" + path.join("."),
|
|
15716
|
+
sx: {
|
|
15717
|
+
userSelect: "text"
|
|
15718
|
+
},
|
|
15719
|
+
onMouseEnter: (0, import_react49.useCallback)(() => setHover(path, nestedIndex), [
|
|
15720
|
+
setHover,
|
|
15721
|
+
path,
|
|
15722
|
+
nestedIndex
|
|
15723
|
+
]),
|
|
15724
|
+
children: [
|
|
15725
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(DataBox, {
|
|
15726
|
+
component: "span",
|
|
15727
|
+
className: "data-key",
|
|
15728
|
+
sx: {
|
|
15729
|
+
lineHeight: 1.5,
|
|
15730
|
+
color: keyColor,
|
|
15731
|
+
letterSpacing: 0.5,
|
|
15732
|
+
opacity: 0.8
|
|
15733
|
+
},
|
|
15734
|
+
onClick: (0, import_react49.useCallback)((event) => {
|
|
15735
|
+
if (event.isDefaultPrevented()) {
|
|
15736
|
+
return;
|
|
15737
|
+
}
|
|
15738
|
+
if (!isEmptyValue) {
|
|
15739
|
+
setInspect((state) => !state);
|
|
15740
|
+
}
|
|
15741
|
+
}, [
|
|
15742
|
+
isEmptyValue,
|
|
15743
|
+
setInspect
|
|
15744
|
+
]),
|
|
15745
|
+
children: [
|
|
15746
|
+
expandable ? inspect ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(ExpandMoreIcon, {
|
|
15747
|
+
className: "data-key-toggle-expanded",
|
|
15748
|
+
sx: {
|
|
15749
|
+
fontSize: ".8rem",
|
|
15750
|
+
"&:hover": {
|
|
15751
|
+
cursor: "pointer"
|
|
15752
|
+
}
|
|
15753
|
+
}
|
|
15754
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(ChevronRightIcon, {
|
|
15755
|
+
className: "data-key-toggle-collapsed",
|
|
15756
|
+
sx: {
|
|
15757
|
+
fontSize: ".8rem",
|
|
15758
|
+
"&:hover": {
|
|
15759
|
+
cursor: "pointer"
|
|
15760
|
+
}
|
|
15761
|
+
}
|
|
15762
|
+
}) : null,
|
|
15763
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15764
|
+
ref: highlightContainer,
|
|
15765
|
+
className: "data-key-key",
|
|
15766
|
+
component: "span",
|
|
15767
|
+
children: isRoot && depth === 0 ? rootName !== false ? quotesOnKeys ? /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, {
|
|
15768
|
+
children: [
|
|
15769
|
+
'"',
|
|
15770
|
+
rootName,
|
|
15771
|
+
'"'
|
|
15772
|
+
]
|
|
15773
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
15774
|
+
children: rootName
|
|
15775
|
+
}) : null : KeyRenderer.when(downstreamProps) ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(KeyRenderer, {
|
|
15776
|
+
...downstreamProps
|
|
15777
|
+
}) : nestedIndex === void 0 && (isNumberKey ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15778
|
+
component: "span",
|
|
15779
|
+
style: {
|
|
15780
|
+
color: numberKeyColor,
|
|
15781
|
+
userSelect: isNumberKey ? "none" : "auto"
|
|
15782
|
+
},
|
|
15783
|
+
children: key
|
|
15784
|
+
}) : quotesOnKeys ? /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_jsx_runtime129.Fragment, {
|
|
15785
|
+
children: [
|
|
15786
|
+
'"',
|
|
15787
|
+
key,
|
|
15788
|
+
'"'
|
|
15789
|
+
]
|
|
15790
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_jsx_runtime129.Fragment, {
|
|
15791
|
+
children: key
|
|
15792
|
+
}))
|
|
15793
|
+
}),
|
|
15794
|
+
isRoot ? rootName !== false && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
15795
|
+
className: "data-key-colon",
|
|
15796
|
+
sx: {
|
|
15797
|
+
mr: 0.5
|
|
15798
|
+
},
|
|
15799
|
+
children: ":"
|
|
15800
|
+
}) : nestedIndex === void 0 && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
15801
|
+
className: "data-key-colon",
|
|
15802
|
+
sx: {
|
|
15803
|
+
mr: 0.5,
|
|
15804
|
+
".data-key-key:empty + &": {
|
|
15805
|
+
display: "none"
|
|
15806
|
+
},
|
|
15807
|
+
userSelect: isNumberKey ? "none" : "auto"
|
|
15808
|
+
},
|
|
15809
|
+
children: ":"
|
|
15810
|
+
}),
|
|
15811
|
+
PreComponent && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(PreComponent, {
|
|
15812
|
+
...downstreamProps
|
|
15813
|
+
}),
|
|
15814
|
+
isHover && expandable && inspect && actionIcons
|
|
15815
|
+
]
|
|
15816
|
+
}),
|
|
15817
|
+
editing && editable ? Editor && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Editor, {
|
|
15818
|
+
path,
|
|
15819
|
+
value: tempValue,
|
|
15820
|
+
setValue: setTempValue,
|
|
15821
|
+
abortEditing,
|
|
15822
|
+
commitEditing
|
|
15823
|
+
}) : Component ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Component, {
|
|
15824
|
+
...downstreamProps
|
|
15825
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Box, {
|
|
15826
|
+
component: "span",
|
|
15827
|
+
className: "data-value-fallback",
|
|
15828
|
+
children: "fallback: ".concat(value)
|
|
15829
|
+
}),
|
|
15830
|
+
PostComponent && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(PostComponent, {
|
|
15831
|
+
...downstreamProps
|
|
15832
|
+
}),
|
|
15833
|
+
!last && displayComma && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataBox, {
|
|
15834
|
+
children: ","
|
|
15835
|
+
}),
|
|
15836
|
+
isHover && expandable && !inspect && actionIcons,
|
|
15837
|
+
isHover && !expandable && actionIcons,
|
|
15838
|
+
!isHover && editing && actionIcons
|
|
15839
|
+
]
|
|
15840
|
+
});
|
|
15841
|
+
};
|
|
15842
|
+
var query = "(prefers-color-scheme: dark)";
|
|
15843
|
+
function useThemeDetector() {
|
|
15844
|
+
const [isDark, setIsDark] = (0, import_react49.useState)(false);
|
|
15845
|
+
(0, import_react49.useEffect)(() => {
|
|
15846
|
+
const listener = (e2) => setIsDark(e2.matches);
|
|
15847
|
+
setIsDark(window.matchMedia(query).matches);
|
|
15848
|
+
const queryMedia = window.matchMedia(query);
|
|
15849
|
+
queryMedia.addEventListener("change", listener);
|
|
15850
|
+
return () => queryMedia.removeEventListener("change", listener);
|
|
15851
|
+
}, []);
|
|
15852
|
+
return isDark;
|
|
15853
|
+
}
|
|
15854
|
+
function useSetIfNotUndefinedEffect(key, value) {
|
|
15855
|
+
const { setState } = (0, import_react49.useContext)(JsonViewerStoreContext);
|
|
15856
|
+
(0, import_react49.useEffect)(() => {
|
|
15857
|
+
if (value !== void 0) {
|
|
15858
|
+
setState({
|
|
15859
|
+
[key]: value
|
|
15860
|
+
});
|
|
15861
|
+
}
|
|
15862
|
+
}, [
|
|
15863
|
+
key,
|
|
15864
|
+
value,
|
|
15865
|
+
setState
|
|
15866
|
+
]);
|
|
15867
|
+
}
|
|
15868
|
+
var JsonViewerInner = (props) => {
|
|
15869
|
+
const { setState } = (0, import_react49.useContext)(JsonViewerStoreContext);
|
|
15870
|
+
(0, import_react49.useEffect)(() => {
|
|
15871
|
+
setState((state) => ({
|
|
15872
|
+
prevValue: state.value,
|
|
15873
|
+
value: props.value
|
|
15874
|
+
}));
|
|
15875
|
+
}, [
|
|
15876
|
+
props.value,
|
|
15877
|
+
setState
|
|
15878
|
+
]);
|
|
15879
|
+
useSetIfNotUndefinedEffect("rootName", props.rootName);
|
|
15880
|
+
useSetIfNotUndefinedEffect("indentWidth", props.indentWidth);
|
|
15881
|
+
useSetIfNotUndefinedEffect("keyRenderer", props.keyRenderer);
|
|
15882
|
+
useSetIfNotUndefinedEffect("enableAdd", props.enableAdd);
|
|
15883
|
+
useSetIfNotUndefinedEffect("enableDelete", props.enableDelete);
|
|
15884
|
+
useSetIfNotUndefinedEffect("enableClipboard", props.enableClipboard);
|
|
15885
|
+
useSetIfNotUndefinedEffect("editable", props.editable);
|
|
15886
|
+
useSetIfNotUndefinedEffect("onChange", props.onChange);
|
|
15887
|
+
useSetIfNotUndefinedEffect("onCopy", props.onCopy);
|
|
15888
|
+
useSetIfNotUndefinedEffect("onSelect", props.onSelect);
|
|
15889
|
+
useSetIfNotUndefinedEffect("onAdd", props.onAdd);
|
|
15890
|
+
useSetIfNotUndefinedEffect("onDelete", props.onDelete);
|
|
15891
|
+
useSetIfNotUndefinedEffect("maxDisplayLength", props.maxDisplayLength);
|
|
15892
|
+
useSetIfNotUndefinedEffect("groupArraysAfterLength", props.groupArraysAfterLength);
|
|
15893
|
+
useSetIfNotUndefinedEffect("quotesOnKeys", props.quotesOnKeys);
|
|
15894
|
+
useSetIfNotUndefinedEffect("displayDataTypes", props.displayDataTypes);
|
|
15895
|
+
useSetIfNotUndefinedEffect("displaySize", props.displaySize);
|
|
15896
|
+
useSetIfNotUndefinedEffect("displayComma", props.displayComma);
|
|
15897
|
+
useSetIfNotUndefinedEffect("highlightUpdates", props.highlightUpdates);
|
|
15898
|
+
(0, import_react49.useEffect)(() => {
|
|
15899
|
+
if (props.theme === "light") {
|
|
15900
|
+
setState({
|
|
15901
|
+
colorspace: lightColorspace
|
|
15902
|
+
});
|
|
15903
|
+
} else if (props.theme === "dark") {
|
|
15904
|
+
setState({
|
|
15905
|
+
colorspace: darkColorspace
|
|
15906
|
+
});
|
|
15907
|
+
} else if (typeof props.theme === "object") {
|
|
15908
|
+
setState({
|
|
15909
|
+
colorspace: props.theme
|
|
15910
|
+
});
|
|
15911
|
+
}
|
|
15912
|
+
}, [
|
|
15913
|
+
setState,
|
|
15914
|
+
props.theme
|
|
15915
|
+
]);
|
|
15916
|
+
const themeCls = (0, import_react49.useMemo)(() => {
|
|
15917
|
+
if (typeof props.theme === "object") return "json-viewer-theme-custom";
|
|
15918
|
+
return props.theme === "dark" ? "json-viewer-theme-dark" : "json-viewer-theme-light";
|
|
15919
|
+
}, [
|
|
15920
|
+
props.theme
|
|
15921
|
+
]);
|
|
15922
|
+
const onceRef = (0, import_react49.useRef)(true);
|
|
15923
|
+
const registerTypes = useTypeRegistryStore((store) => store.registerTypes);
|
|
15924
|
+
if (onceRef.current) {
|
|
15925
|
+
const allTypes = props.valueTypes ? [
|
|
15926
|
+
...predefinedTypes,
|
|
15927
|
+
...props.valueTypes
|
|
15928
|
+
] : [
|
|
15929
|
+
...predefinedTypes
|
|
15930
|
+
];
|
|
15931
|
+
registerTypes(allTypes);
|
|
15932
|
+
onceRef.current = false;
|
|
15933
|
+
}
|
|
15934
|
+
(0, import_react49.useEffect)(() => {
|
|
15935
|
+
const allTypes = props.valueTypes ? [
|
|
15936
|
+
...predefinedTypes,
|
|
15937
|
+
...props.valueTypes
|
|
15938
|
+
] : [
|
|
15939
|
+
...predefinedTypes
|
|
15940
|
+
];
|
|
15941
|
+
registerTypes(allTypes);
|
|
15942
|
+
}, [
|
|
15943
|
+
props.valueTypes,
|
|
15944
|
+
registerTypes
|
|
15945
|
+
]);
|
|
15946
|
+
const value = useJsonViewerStore((store) => store.value);
|
|
15947
|
+
const prevValue = useJsonViewerStore((store) => store.prevValue);
|
|
15948
|
+
const emptyPath = (0, import_react49.useMemo)(() => [], []);
|
|
15949
|
+
const setHover = useJsonViewerStore((store) => store.setHover);
|
|
15950
|
+
const onMouseLeave = (0, import_react49.useCallback)(() => setHover(null), [
|
|
15951
|
+
setHover
|
|
15952
|
+
]);
|
|
15953
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Paper, {
|
|
15954
|
+
elevation: 0,
|
|
15955
|
+
className: clsx(themeCls, props.className),
|
|
15956
|
+
style: props.style,
|
|
15957
|
+
sx: {
|
|
15958
|
+
fontFamily: "monospace",
|
|
15959
|
+
userSelect: "none",
|
|
15960
|
+
contentVisibility: "auto",
|
|
15961
|
+
...props.sx
|
|
15962
|
+
},
|
|
15963
|
+
onMouseLeave,
|
|
15964
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DataKeyPair, {
|
|
15965
|
+
value,
|
|
15966
|
+
prevValue,
|
|
15967
|
+
path: emptyPath,
|
|
15968
|
+
last: true
|
|
15969
|
+
})
|
|
15970
|
+
});
|
|
15971
|
+
};
|
|
15972
|
+
var JsonViewer = function JsonViewer2(props) {
|
|
15973
|
+
if (true) {
|
|
15974
|
+
if ("displayObjectSize" in props) {
|
|
15975
|
+
console.error("`displayObjectSize` is deprecated. Use `displaySize` instead.\nSee https://viewer.textea.io/migration/migration-v3#raname-displayobjectsize-to-displaysize for more information.");
|
|
15976
|
+
}
|
|
15977
|
+
}
|
|
15978
|
+
const isAutoDarkTheme = useThemeDetector();
|
|
15979
|
+
const themeType = (0, import_react49.useMemo)(() => {
|
|
15980
|
+
var _props_theme;
|
|
15981
|
+
return props.theme === "auto" ? isAutoDarkTheme ? "dark" : "light" : (_props_theme = props.theme) !== null && _props_theme !== void 0 ? _props_theme : "light";
|
|
15982
|
+
}, [
|
|
15983
|
+
isAutoDarkTheme,
|
|
15984
|
+
props.theme
|
|
15985
|
+
]);
|
|
15986
|
+
const theme = (0, import_react49.useMemo)(() => {
|
|
15987
|
+
const backgroundColor = typeof themeType === "object" ? themeType.base00 : themeType === "dark" ? darkColorspace.base00 : lightColorspace.base00;
|
|
15988
|
+
const foregroundColor = typeof themeType === "object" ? themeType.base07 : themeType === "dark" ? darkColorspace.base07 : lightColorspace.base07;
|
|
15989
|
+
return (0, import_material7.createTheme)({
|
|
15990
|
+
components: {
|
|
15991
|
+
MuiPaper: {
|
|
15992
|
+
styleOverrides: {
|
|
15993
|
+
root: {
|
|
15994
|
+
backgroundColor,
|
|
15995
|
+
color: foregroundColor
|
|
15996
|
+
}
|
|
15997
|
+
}
|
|
15998
|
+
}
|
|
15999
|
+
},
|
|
16000
|
+
palette: {
|
|
16001
|
+
mode: themeType === "dark" ? "dark" : "light",
|
|
16002
|
+
background: {
|
|
16003
|
+
default: backgroundColor
|
|
16004
|
+
}
|
|
16005
|
+
}
|
|
16006
|
+
});
|
|
16007
|
+
}, [
|
|
16008
|
+
themeType
|
|
16009
|
+
]);
|
|
16010
|
+
const mixedProps = {
|
|
16011
|
+
...props,
|
|
16012
|
+
theme: themeType
|
|
16013
|
+
};
|
|
16014
|
+
const jsonViewerStore = (0, import_react49.useMemo)(() => createJsonViewerStore(props), []);
|
|
16015
|
+
const typeRegistryStore = (0, import_react49.useMemo)(() => createTypeRegistryStore(), []);
|
|
16016
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.ThemeProvider, {
|
|
16017
|
+
theme,
|
|
16018
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(TypeRegistryStoreContext.Provider, {
|
|
16019
|
+
value: typeRegistryStore,
|
|
16020
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(JsonViewerStoreContext.Provider, {
|
|
16021
|
+
value: jsonViewerStore,
|
|
16022
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(JsonViewerInner, {
|
|
16023
|
+
...mixedProps
|
|
16024
|
+
})
|
|
16025
|
+
})
|
|
16026
|
+
})
|
|
16027
|
+
});
|
|
16028
|
+
};
|
|
16029
|
+
|
|
16030
|
+
// src/components/event-details/event-details.tsx
|
|
16031
|
+
var import_react54 = require("react");
|
|
16032
|
+
|
|
16033
|
+
// src/utils/iam-utils.ts
|
|
16034
|
+
function determinePermissionStatus(payload) {
|
|
16035
|
+
if (payload.explicit_deny_count && payload.explicit_deny_count > 0) {
|
|
16036
|
+
return "explicitly_denied";
|
|
16037
|
+
}
|
|
16038
|
+
if (payload.is_allowed && payload.explicit_allow_count && payload.explicit_allow_count > 0) {
|
|
16039
|
+
return "explicitly_allowed";
|
|
16040
|
+
}
|
|
16041
|
+
if (payload.is_allowed) {
|
|
16042
|
+
return "implicitly_allowed";
|
|
16043
|
+
}
|
|
16044
|
+
return "implicitly_denied";
|
|
16045
|
+
}
|
|
16046
|
+
function formatPermissionStatus(status) {
|
|
16047
|
+
switch (status) {
|
|
16048
|
+
case "explicitly_allowed": {
|
|
16049
|
+
return "Explicitly Allowed";
|
|
16050
|
+
}
|
|
16051
|
+
case "explicitly_denied": {
|
|
16052
|
+
return "Explicitly Denied";
|
|
16053
|
+
}
|
|
16054
|
+
case "implicitly_allowed": {
|
|
16055
|
+
return "Implicitly Allowed";
|
|
16056
|
+
}
|
|
16057
|
+
case "implicitly_denied": {
|
|
16058
|
+
return "Implicitly Denied";
|
|
16059
|
+
}
|
|
16060
|
+
}
|
|
16061
|
+
}
|
|
16062
|
+
function getPermissionStatusColor(status) {
|
|
16063
|
+
switch (status) {
|
|
16064
|
+
case "explicitly_allowed":
|
|
16065
|
+
case "implicitly_allowed": {
|
|
16066
|
+
return "success.main";
|
|
16067
|
+
}
|
|
16068
|
+
case "explicitly_denied": {
|
|
16069
|
+
return "error.main";
|
|
16070
|
+
}
|
|
16071
|
+
case "implicitly_denied": {
|
|
16072
|
+
return "warning.main";
|
|
16073
|
+
}
|
|
16074
|
+
}
|
|
16075
|
+
}
|
|
16076
|
+
function parseIAMEvent(payloadString) {
|
|
16077
|
+
try {
|
|
16078
|
+
const payload = JSON.parse(payloadString);
|
|
16079
|
+
const permission = determinePermissionStatus(payload);
|
|
16080
|
+
const actions = [];
|
|
16081
|
+
const resources = [];
|
|
16082
|
+
if (payload.explicit_allows) {
|
|
16083
|
+
for (const allow of payload.explicit_allows) {
|
|
16084
|
+
if (!actions.includes(allow.action)) actions.push(allow.action);
|
|
16085
|
+
if (!resources.includes(allow.resource)) resources.push(allow.resource);
|
|
16086
|
+
}
|
|
16087
|
+
}
|
|
16088
|
+
if (payload.explicit_denies) {
|
|
16089
|
+
for (const deny of payload.explicit_denies) {
|
|
16090
|
+
if (!actions.includes(deny.action)) actions.push(deny.action);
|
|
16091
|
+
if (!resources.includes(deny.resource)) resources.push(deny.resource);
|
|
16092
|
+
}
|
|
16093
|
+
}
|
|
16094
|
+
if (payload.implicit_denies) {
|
|
16095
|
+
for (const deny of payload.implicit_denies) {
|
|
16096
|
+
if (!actions.includes(deny.action)) actions.push(deny.action);
|
|
16097
|
+
if (!resources.includes(deny.resource)) resources.push(deny.resource);
|
|
16098
|
+
}
|
|
16099
|
+
}
|
|
16100
|
+
return {
|
|
16101
|
+
details: {
|
|
16102
|
+
actions,
|
|
16103
|
+
explicitAllows: payload.explicit_allow_count,
|
|
16104
|
+
explicitDenies: payload.explicit_deny_count,
|
|
16105
|
+
implicitDenies: payload.implicit_deny_count,
|
|
16106
|
+
resources
|
|
16107
|
+
},
|
|
16108
|
+
operation: payload.operation,
|
|
16109
|
+
permission,
|
|
16110
|
+
principal: payload.principal_arn,
|
|
16111
|
+
service: payload.service
|
|
16112
|
+
};
|
|
16113
|
+
} catch (error) {
|
|
16114
|
+
console.error("Error parsing IAM event payload:", error);
|
|
16115
|
+
return void 0;
|
|
16116
|
+
}
|
|
16117
|
+
}
|
|
16118
|
+
|
|
16119
|
+
// src/utils/event-utils.ts
|
|
16120
|
+
var iamEventParser = (eventName, attributes) => {
|
|
16121
|
+
if (attributes?.payload && typeof attributes.payload === "string") {
|
|
16122
|
+
const parsedIAM = parseIAMEvent(attributes.payload);
|
|
16123
|
+
if (parsedIAM) {
|
|
16124
|
+
const headline2 = `${parsedIAM.service}:${parsedIAM.operation} - ${formatPermissionStatus(parsedIAM.permission)}`;
|
|
16125
|
+
const messageParts = [`Principal: ${parsedIAM.principal}`];
|
|
16126
|
+
if (parsedIAM.details.actions && parsedIAM.details.actions.length > 0) {
|
|
16127
|
+
messageParts.push(`Actions: ${parsedIAM.details.actions.join(", ")}`);
|
|
16128
|
+
}
|
|
16129
|
+
if (parsedIAM.details.resources && parsedIAM.details.resources.length > 0) {
|
|
16130
|
+
messageParts.push(`Resources: ${parsedIAM.details.resources.join(", ")}`);
|
|
16131
|
+
}
|
|
16132
|
+
const detailsParts = [];
|
|
16133
|
+
if (parsedIAM.details.explicitAllows !== void 0) {
|
|
16134
|
+
detailsParts.push(`Explicit Allows: ${String(parsedIAM.details.explicitAllows)}`);
|
|
16135
|
+
}
|
|
16136
|
+
if (parsedIAM.details.explicitDenies !== void 0) {
|
|
16137
|
+
detailsParts.push(`Explicit Denies: ${String(parsedIAM.details.explicitDenies)}`);
|
|
16138
|
+
}
|
|
16139
|
+
if (parsedIAM.details.implicitDenies !== void 0) {
|
|
16140
|
+
detailsParts.push(`Implicit Denies: ${String(parsedIAM.details.implicitDenies)}`);
|
|
16141
|
+
}
|
|
16142
|
+
return {
|
|
16143
|
+
details: detailsParts.join("\n"),
|
|
16144
|
+
headline: headline2,
|
|
16145
|
+
message: messageParts.join("\n")
|
|
16146
|
+
};
|
|
16147
|
+
}
|
|
16148
|
+
}
|
|
16149
|
+
const headline = eventName || "IAM Event";
|
|
16150
|
+
const message = typeof attributes?.message === "string" ? attributes.message : "";
|
|
16151
|
+
const details = typeof attributes?.details === "string" ? attributes.details : "";
|
|
16152
|
+
return { details, headline, message };
|
|
16153
|
+
};
|
|
16154
|
+
var defaultEventParser = (eventName, attributes) => {
|
|
16155
|
+
const headline = eventName || "Event";
|
|
16156
|
+
const message = typeof attributes?.message === "string" ? attributes.message : "";
|
|
16157
|
+
const details = JSON.stringify(attributes ?? {}, void 0, 2);
|
|
16158
|
+
return { details, headline, message };
|
|
16159
|
+
};
|
|
16160
|
+
var eventParsers = {
|
|
13985
16161
|
"iam.error": iamEventParser,
|
|
13986
16162
|
"iam.event": iamEventParser,
|
|
13987
16163
|
"iam.warning": iamEventParser
|
|
@@ -14048,72 +16224,37 @@ var getEventGroupsByType = (events) => {
|
|
|
14048
16224
|
return groups;
|
|
14049
16225
|
};
|
|
14050
16226
|
|
|
14051
|
-
// src/components/event-details/event-details-header.tsx
|
|
14052
|
-
var import_icons_material3 = require("@mui/icons-material");
|
|
14053
|
-
var import_material7 = require("@mui/material");
|
|
14054
|
-
var import_jsx_runtime129 = require("react/jsx-runtime");
|
|
14055
|
-
var EventDetailsHeader = ({ event, onClose }) => {
|
|
14056
|
-
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
|
|
14057
|
-
import_material7.Box,
|
|
14058
|
-
{
|
|
14059
|
-
sx: {
|
|
14060
|
-
alignItems: "center",
|
|
14061
|
-
borderBottom: "1px solid",
|
|
14062
|
-
borderColor: "divider",
|
|
14063
|
-
display: "flex",
|
|
14064
|
-
justifyContent: "space-between",
|
|
14065
|
-
p: 2
|
|
14066
|
-
},
|
|
14067
|
-
children: [
|
|
14068
|
-
/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Box, { children: [
|
|
14069
|
-
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.Typography, { sx: { fontWeight: 600 }, variant: "h6", children: "Event Details" }),
|
|
14070
|
-
/* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(import_material7.Typography, { color: "text.secondary", variant: "body2", children: [
|
|
14071
|
-
event.service_name,
|
|
14072
|
-
" ",
|
|
14073
|
-
"-",
|
|
14074
|
-
event.operation_name
|
|
14075
|
-
] })
|
|
14076
|
-
] }),
|
|
14077
|
-
onClose && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_material7.IconButton, { onClick: onClose, size: "small", children: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_icons_material3.Close, {}) })
|
|
14078
|
-
]
|
|
14079
|
-
}
|
|
14080
|
-
);
|
|
14081
|
-
};
|
|
14082
|
-
|
|
14083
|
-
// src/components/event-details/event-section.tsx
|
|
14084
|
-
var import_material13 = require("@mui/material");
|
|
14085
|
-
|
|
14086
16227
|
// src/components/event-details/event-detail.tsx
|
|
14087
|
-
var
|
|
16228
|
+
var import_icons_material6 = require("@mui/icons-material");
|
|
14088
16229
|
var import_material11 = require("@mui/material");
|
|
14089
|
-
var
|
|
16230
|
+
var import_react51 = require("react");
|
|
14090
16231
|
|
|
14091
16232
|
// src/components/status-icon.tsx
|
|
14092
|
-
var
|
|
16233
|
+
var import_icons_material3 = require("@mui/icons-material");
|
|
14093
16234
|
var import_material8 = require("@mui/material");
|
|
14094
16235
|
var import_jsx_runtime130 = require("react/jsx-runtime");
|
|
14095
16236
|
var StatusIcon = ({ errorLevel }) => {
|
|
14096
16237
|
switch (errorLevel) {
|
|
14097
16238
|
case EventLevel.LevelError: {
|
|
14098
|
-
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
16239
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_icons_material3.Cancel, { sx: { color: "red" } });
|
|
14099
16240
|
}
|
|
14100
16241
|
case EventLevel.LevelInfo: {
|
|
14101
|
-
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
16242
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_icons_material3.Info, { sx: { color: "gray" } });
|
|
14102
16243
|
}
|
|
14103
16244
|
case EventLevel.LevelPermission: {
|
|
14104
|
-
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
16245
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_icons_material3.RemoveCircle, { sx: { color: "blue" } });
|
|
14105
16246
|
}
|
|
14106
16247
|
case EventLevel.LevelWarning: {
|
|
14107
|
-
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
16248
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_icons_material3.Error, { sx: { color: "orange" } });
|
|
14108
16249
|
}
|
|
14109
16250
|
default: {
|
|
14110
|
-
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
16251
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_icons_material3.CheckCircle, { sx: { color: "lightgray" } });
|
|
14111
16252
|
}
|
|
14112
16253
|
}
|
|
14113
16254
|
};
|
|
14114
16255
|
|
|
14115
16256
|
// src/components/event-details/iam-event-detail.tsx
|
|
14116
|
-
var
|
|
16257
|
+
var import_icons_material4 = require("@mui/icons-material");
|
|
14117
16258
|
var import_material9 = require("@mui/material");
|
|
14118
16259
|
var import_jsx_runtime131 = require("react/jsx-runtime");
|
|
14119
16260
|
var DetailRow = ({ content, label }) => /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(import_material9.Grid, { container: true, spacing: 0, sx: { mb: 1 }, children: [
|
|
@@ -14144,13 +16285,13 @@ var PermissionIcon = ({ status }) => {
|
|
|
14144
16285
|
switch (status) {
|
|
14145
16286
|
case "explicitly_allowed":
|
|
14146
16287
|
case "implicitly_allowed": {
|
|
14147
|
-
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
16288
|
+
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_icons_material4.CheckCircle, { sx: { color: "success.main", fontSize: "1rem" } });
|
|
14148
16289
|
}
|
|
14149
16290
|
case "explicitly_denied": {
|
|
14150
|
-
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
16291
|
+
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_icons_material4.Error, { sx: { color: "error.main", fontSize: "1rem" } });
|
|
14151
16292
|
}
|
|
14152
16293
|
case "implicitly_denied": {
|
|
14153
|
-
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
16294
|
+
return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_icons_material4.Warning, { sx: { color: "warning.main", fontSize: "1rem" } });
|
|
14154
16295
|
}
|
|
14155
16296
|
}
|
|
14156
16297
|
};
|
|
@@ -14235,9 +16376,9 @@ var IAMEventDetail = ({ event }) => {
|
|
|
14235
16376
|
};
|
|
14236
16377
|
|
|
14237
16378
|
// src/components/event-details/iam-permission-detail.tsx
|
|
14238
|
-
var
|
|
16379
|
+
var import_icons_material5 = require("@mui/icons-material");
|
|
14239
16380
|
var import_material10 = require("@mui/material");
|
|
14240
|
-
var
|
|
16381
|
+
var import_react50 = require("react");
|
|
14241
16382
|
var import_jsx_runtime132 = require("react/jsx-runtime");
|
|
14242
16383
|
var getChipColors = (status) => {
|
|
14243
16384
|
const isAllowed = status === "explicitly_allowed" || status === "implicitly_allowed";
|
|
@@ -14247,8 +16388,8 @@ var getChipColors = (status) => {
|
|
|
14247
16388
|
};
|
|
14248
16389
|
};
|
|
14249
16390
|
var IAMPermissionItem = ({ event }) => {
|
|
14250
|
-
const [isOpen, setIsOpen] = (0,
|
|
14251
|
-
const parsedData = (0,
|
|
16391
|
+
const [isOpen, setIsOpen] = (0, import_react50.useState)(false);
|
|
16392
|
+
const parsedData = (0, import_react50.useMemo)(() => {
|
|
14252
16393
|
const payloadString = event.attributes?.payload;
|
|
14253
16394
|
if (!payloadString) {
|
|
14254
16395
|
return;
|
|
@@ -14270,7 +16411,7 @@ var IAMPermissionItem = ({ event }) => {
|
|
|
14270
16411
|
/* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(import_material10.Box, { sx: { alignItems: "center", display: "flex" }, children: [
|
|
14271
16412
|
/* @__PURE__ */ (0, import_jsx_runtime132.jsx)(import_material10.IconButton, { onClick: () => {
|
|
14272
16413
|
setIsOpen(!isOpen);
|
|
14273
|
-
}, size: "small", sx: { mr: 1, p: 0 }, children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
|
|
16414
|
+
}, size: "small", sx: { mr: 1, p: 0 }, children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(import_icons_material5.KeyboardArrowDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(import_icons_material5.KeyboardArrowRight, {}) }),
|
|
14274
16415
|
/* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
|
|
14275
16416
|
import_material10.Chip,
|
|
14276
16417
|
{
|
|
@@ -14318,15 +16459,15 @@ var DetailRow2 = ({ content, label }) => /* @__PURE__ */ (0, import_jsx_runtime1
|
|
|
14318
16459
|
) : content })
|
|
14319
16460
|
] });
|
|
14320
16461
|
var EventMessage = ({ event }) => {
|
|
14321
|
-
const [isOpen, setIsOpen] = (0,
|
|
14322
|
-
const [isOverflowing, setIsOverflowing] = (0,
|
|
14323
|
-
const textReference = (0,
|
|
14324
|
-
const parsedMessage = (0,
|
|
14325
|
-
const isIAMPolicyEvent = (0,
|
|
16462
|
+
const [isOpen, setIsOpen] = (0, import_react51.useState)(false);
|
|
16463
|
+
const [isOverflowing, setIsOverflowing] = (0, import_react51.useState)(false);
|
|
16464
|
+
const textReference = (0, import_react51.useRef)(null);
|
|
16465
|
+
const parsedMessage = (0, import_react51.useMemo)(() => parseEventMessage(event), [event]);
|
|
16466
|
+
const isIAMPolicyEvent = (0, import_react51.useMemo)(
|
|
14326
16467
|
() => event.event_type === "iam.policy_evaluation" && event.attributes?.payload && typeof event.attributes.payload === "string",
|
|
14327
16468
|
[event]
|
|
14328
16469
|
);
|
|
14329
|
-
(0,
|
|
16470
|
+
(0, import_react51.useEffect)(() => {
|
|
14330
16471
|
const checkOverflow = () => {
|
|
14331
16472
|
const element = textReference.current;
|
|
14332
16473
|
if (element) {
|
|
@@ -14339,11 +16480,11 @@ var EventMessage = ({ event }) => {
|
|
|
14339
16480
|
window.removeEventListener("resize", checkOverflow);
|
|
14340
16481
|
};
|
|
14341
16482
|
}, [parsedMessage.headline]);
|
|
14342
|
-
const hasAdditionalContent = (0,
|
|
16483
|
+
const hasAdditionalContent = (0, import_react51.useMemo)(
|
|
14343
16484
|
() => parsedMessage.message || parsedMessage.details || isIAMPolicyEvent,
|
|
14344
16485
|
[parsedMessage.message, parsedMessage.details, isIAMPolicyEvent]
|
|
14345
16486
|
);
|
|
14346
|
-
const shouldShowToggle = (0,
|
|
16487
|
+
const shouldShowToggle = (0, import_react51.useMemo)(
|
|
14347
16488
|
() => isOverflowing || hasAdditionalContent,
|
|
14348
16489
|
[isOverflowing, hasAdditionalContent]
|
|
14349
16490
|
);
|
|
@@ -14357,7 +16498,7 @@ var EventMessage = ({ event }) => {
|
|
|
14357
16498
|
},
|
|
14358
16499
|
size: "small",
|
|
14359
16500
|
sx: { mr: 1, mt: -0.5, p: 0 },
|
|
14360
|
-
children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
|
|
16501
|
+
children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(import_icons_material6.KeyboardArrowDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(import_icons_material6.KeyboardArrowRight, {})
|
|
14361
16502
|
}
|
|
14362
16503
|
),
|
|
14363
16504
|
/* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
|
|
@@ -14482,85 +16623,6 @@ var EventDetail = ({
|
|
|
14482
16623
|
] });
|
|
14483
16624
|
};
|
|
14484
16625
|
|
|
14485
|
-
// src/components/event-details/toggle-section.tsx
|
|
14486
|
-
var import_icons_material8 = require("@mui/icons-material");
|
|
14487
|
-
var import_material12 = require("@mui/material");
|
|
14488
|
-
var import_react50 = require("react");
|
|
14489
|
-
var import_jsx_runtime134 = require("react/jsx-runtime");
|
|
14490
|
-
var ToggleSection = ({ children, headline, initialOpen = true }) => {
|
|
14491
|
-
const [isOpen, setIsOpen] = (0, import_react50.useState)(initialOpen);
|
|
14492
|
-
return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(import_material12.Box, { sx: { mt: 4 }, children: [
|
|
14493
|
-
/* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
|
|
14494
|
-
import_material12.Box,
|
|
14495
|
-
{
|
|
14496
|
-
onClick: () => {
|
|
14497
|
-
setIsOpen(!isOpen);
|
|
14498
|
-
},
|
|
14499
|
-
sx: {
|
|
14500
|
-
cursor: "pointer",
|
|
14501
|
-
mb: 1
|
|
14502
|
-
},
|
|
14503
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(
|
|
14504
|
-
import_material12.Box,
|
|
14505
|
-
{
|
|
14506
|
-
role: "button",
|
|
14507
|
-
sx: {
|
|
14508
|
-
alignItems: "center",
|
|
14509
|
-
display: "flex",
|
|
14510
|
-
gap: 1
|
|
14511
|
-
},
|
|
14512
|
-
children: [
|
|
14513
|
-
/* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Typography, { sx: { fontWeight: 600 }, variant: "subtitle2", children: headline }),
|
|
14514
|
-
isOpen ? /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_icons_material8.KeyboardArrowDown, { sx: { color: "text.secondary", height: 20, width: 20 } }) : /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_icons_material8.KeyboardArrowRight, { sx: { color: "text.secondary", height: 20, width: 20 } })
|
|
14515
|
-
]
|
|
14516
|
-
}
|
|
14517
|
-
)
|
|
14518
|
-
}
|
|
14519
|
-
),
|
|
14520
|
-
isOpen && /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Box, { children })
|
|
14521
|
-
] });
|
|
14522
|
-
};
|
|
14523
|
-
|
|
14524
|
-
// src/components/event-details/event-section.tsx
|
|
14525
|
-
var import_jsx_runtime135 = require("react/jsx-runtime");
|
|
14526
|
-
var EventSection = ({
|
|
14527
|
-
eventGroups,
|
|
14528
|
-
headline
|
|
14529
|
-
}) => /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(ToggleSection, { headline, children: /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(import_material13.Box, { children: [
|
|
14530
|
-
eventGroups.errors && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
14531
|
-
EventDetail,
|
|
14532
|
-
{
|
|
14533
|
-
displayText: "Error",
|
|
14534
|
-
events: eventGroups.errors,
|
|
14535
|
-
type: "error"
|
|
14536
|
-
}
|
|
14537
|
-
),
|
|
14538
|
-
eventGroups.warnings && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
14539
|
-
EventDetail,
|
|
14540
|
-
{
|
|
14541
|
-
displayText: "Warning",
|
|
14542
|
-
events: eventGroups.warnings,
|
|
14543
|
-
type: "warning"
|
|
14544
|
-
}
|
|
14545
|
-
),
|
|
14546
|
-
eventGroups.permissions && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
14547
|
-
EventDetail,
|
|
14548
|
-
{
|
|
14549
|
-
displayText: "IAM Permission",
|
|
14550
|
-
events: eventGroups.permissions,
|
|
14551
|
-
type: "permission"
|
|
14552
|
-
}
|
|
14553
|
-
),
|
|
14554
|
-
eventGroups.info && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
14555
|
-
EventDetail,
|
|
14556
|
-
{
|
|
14557
|
-
displayText: "Info",
|
|
14558
|
-
events: eventGroups.info,
|
|
14559
|
-
type: "info"
|
|
14560
|
-
}
|
|
14561
|
-
)
|
|
14562
|
-
] }) });
|
|
14563
|
-
|
|
14564
16626
|
// node_modules/@smithy/protocol-http/dist-es/extensions/httpExtensionConfiguration.js
|
|
14565
16627
|
var getHttpHandlerExtensionConfiguration = (runtimeConfig) => {
|
|
14566
16628
|
return {
|
|
@@ -14651,9 +16713,9 @@ var HttpRequest = class _HttpRequest {
|
|
|
14651
16713
|
return _HttpRequest.clone(this);
|
|
14652
16714
|
}
|
|
14653
16715
|
};
|
|
14654
|
-
function cloneQuery(
|
|
14655
|
-
return Object.keys(
|
|
14656
|
-
const param =
|
|
16716
|
+
function cloneQuery(query2) {
|
|
16717
|
+
return Object.keys(query2).reduce((carry, paramName) => {
|
|
16718
|
+
const param = query2[paramName];
|
|
14657
16719
|
return {
|
|
14658
16720
|
...carry,
|
|
14659
16721
|
[paramName]: Array.isArray(param) ? [...param] : param
|
|
@@ -14884,10 +16946,10 @@ var httpSigningMiddleware = (config) => (next, context) => async (args) => {
|
|
|
14884
16946
|
if (!scheme) {
|
|
14885
16947
|
throw new Error(`No HttpAuthScheme was selected: unable to sign request`);
|
|
14886
16948
|
}
|
|
14887
|
-
const { httpAuthOption: { signingProperties = {} }, identity, signer } = scheme;
|
|
16949
|
+
const { httpAuthOption: { signingProperties = {} }, identity: identity2, signer } = scheme;
|
|
14888
16950
|
const output = await next({
|
|
14889
16951
|
...args,
|
|
14890
|
-
request: await signer.sign(args.request,
|
|
16952
|
+
request: await signer.sign(args.request, identity2, signingProperties)
|
|
14891
16953
|
}).catch((signer.errorHandler || defaultErrorHandler)(signingProperties));
|
|
14892
16954
|
(signer.successHandler || defaultSuccessHandler)(output.response, signingProperties);
|
|
14893
16955
|
return output;
|
|
@@ -15025,10 +17087,10 @@ var escapeUri = (uri) => encodeURIComponent(uri).replace(/[!'()*]/g, hexEncode);
|
|
|
15025
17087
|
var hexEncode = (c3) => `%${c3.charCodeAt(0).toString(16).toUpperCase()}`;
|
|
15026
17088
|
|
|
15027
17089
|
// node_modules/@smithy/querystring-builder/dist-es/index.js
|
|
15028
|
-
function buildQueryString(
|
|
17090
|
+
function buildQueryString(query2) {
|
|
15029
17091
|
const parts = [];
|
|
15030
|
-
for (let key of Object.keys(
|
|
15031
|
-
const value =
|
|
17092
|
+
for (let key of Object.keys(query2).sort()) {
|
|
17093
|
+
const value = query2[key];
|
|
15032
17094
|
key = escapeUri(key);
|
|
15033
17095
|
if (Array.isArray(value)) {
|
|
15034
17096
|
for (let i2 = 0, iLen = value.length; i2 < iLen; i2++) {
|
|
@@ -15395,7 +17457,7 @@ var findHeader = (pattern, headers) => {
|
|
|
15395
17457
|
|
|
15396
17458
|
// node_modules/@smithy/querystring-parser/dist-es/index.js
|
|
15397
17459
|
function parseQueryString(querystring) {
|
|
15398
|
-
const
|
|
17460
|
+
const query2 = {};
|
|
15399
17461
|
querystring = querystring.replace(/^\?/, "");
|
|
15400
17462
|
if (querystring) {
|
|
15401
17463
|
for (const pair of querystring.split("&")) {
|
|
@@ -15404,16 +17466,16 @@ function parseQueryString(querystring) {
|
|
|
15404
17466
|
if (value) {
|
|
15405
17467
|
value = decodeURIComponent(value);
|
|
15406
17468
|
}
|
|
15407
|
-
if (!(key in
|
|
15408
|
-
|
|
15409
|
-
} else if (Array.isArray(
|
|
15410
|
-
|
|
17469
|
+
if (!(key in query2)) {
|
|
17470
|
+
query2[key] = value;
|
|
17471
|
+
} else if (Array.isArray(query2[key])) {
|
|
17472
|
+
query2[key].push(value);
|
|
15411
17473
|
} else {
|
|
15412
|
-
|
|
17474
|
+
query2[key] = [query2[key], value];
|
|
15413
17475
|
}
|
|
15414
17476
|
}
|
|
15415
17477
|
}
|
|
15416
|
-
return
|
|
17478
|
+
return query2;
|
|
15417
17479
|
}
|
|
15418
17480
|
|
|
15419
17481
|
// node_modules/@smithy/url-parser/dist-es/index.js
|
|
@@ -15422,16 +17484,16 @@ var parseUrl = (url) => {
|
|
|
15422
17484
|
return parseUrl(new URL(url));
|
|
15423
17485
|
}
|
|
15424
17486
|
const { hostname, pathname, port, protocol, search } = url;
|
|
15425
|
-
let
|
|
17487
|
+
let query2;
|
|
15426
17488
|
if (search) {
|
|
15427
|
-
|
|
17489
|
+
query2 = parseQueryString(search);
|
|
15428
17490
|
}
|
|
15429
17491
|
return {
|
|
15430
17492
|
hostname,
|
|
15431
17493
|
port: port ? parseInt(port) : void 0,
|
|
15432
17494
|
protocol,
|
|
15433
17495
|
path: pathname,
|
|
15434
|
-
query
|
|
17496
|
+
query: query2
|
|
15435
17497
|
};
|
|
15436
17498
|
};
|
|
15437
17499
|
|
|
@@ -15834,8 +17896,8 @@ var TypeRegistry = class _TypeRegistry {
|
|
|
15834
17896
|
}
|
|
15835
17897
|
register(shapeId, schema) {
|
|
15836
17898
|
const qualifiedName = this.normalizeShapeId(shapeId);
|
|
15837
|
-
for (const
|
|
15838
|
-
|
|
17899
|
+
for (const r3 of [this, _TypeRegistry.for(qualifiedName.split("#")[0])]) {
|
|
17900
|
+
r3.schemas.set(qualifiedName, schema);
|
|
15839
17901
|
}
|
|
15840
17902
|
}
|
|
15841
17903
|
getSchema(shapeId) {
|
|
@@ -15848,9 +17910,9 @@ var TypeRegistry = class _TypeRegistry {
|
|
|
15848
17910
|
registerError(es, ctor) {
|
|
15849
17911
|
const $error = es;
|
|
15850
17912
|
const ns = $error[1];
|
|
15851
|
-
for (const
|
|
15852
|
-
|
|
15853
|
-
|
|
17913
|
+
for (const r3 of [this, _TypeRegistry.for(ns)]) {
|
|
17914
|
+
r3.schemas.set(ns + "#" + $error[2], $error);
|
|
17915
|
+
r3.exceptions.set($error, ctor);
|
|
15854
17916
|
}
|
|
15855
17917
|
}
|
|
15856
17918
|
getErrorCtor(es) {
|
|
@@ -16368,7 +18430,7 @@ var HttpProtocol = class extends SerdeContext {
|
|
|
16368
18430
|
var RpcProtocol = class extends HttpProtocol {
|
|
16369
18431
|
async serializeRequest(operationSchema, input, context) {
|
|
16370
18432
|
const serializer = this.serializer;
|
|
16371
|
-
const
|
|
18433
|
+
const query2 = {};
|
|
16372
18434
|
const headers = {};
|
|
16373
18435
|
const endpoint = await context.endpoint();
|
|
16374
18436
|
const ns = NormalizedSchema.of(operationSchema?.input);
|
|
@@ -16380,7 +18442,7 @@ var RpcProtocol = class extends HttpProtocol {
|
|
|
16380
18442
|
port: void 0,
|
|
16381
18443
|
path: "/",
|
|
16382
18444
|
fragment: void 0,
|
|
16383
|
-
query,
|
|
18445
|
+
query: query2,
|
|
16384
18446
|
headers,
|
|
16385
18447
|
body: void 0
|
|
16386
18448
|
});
|
|
@@ -16414,7 +18476,7 @@ var RpcProtocol = class extends HttpProtocol {
|
|
|
16414
18476
|
}
|
|
16415
18477
|
}
|
|
16416
18478
|
request.headers = Object.assign(request.headers, headers);
|
|
16417
|
-
request.query =
|
|
18479
|
+
request.query = query2;
|
|
16418
18480
|
request.body = payload;
|
|
16419
18481
|
request.method = "POST";
|
|
16420
18482
|
return request;
|
|
@@ -16494,12 +18556,12 @@ var DefaultIdentityProviderConfig = class {
|
|
|
16494
18556
|
};
|
|
16495
18557
|
|
|
16496
18558
|
// node_modules/@smithy/core/dist-es/util-identity-and-auth/memoizeIdentityProvider.js
|
|
16497
|
-
var createIsIdentityExpiredFunction = (expirationMs) => function isIdentityExpired2(
|
|
16498
|
-
return doesIdentityRequireRefresh(
|
|
18559
|
+
var createIsIdentityExpiredFunction = (expirationMs) => function isIdentityExpired2(identity2) {
|
|
18560
|
+
return doesIdentityRequireRefresh(identity2) && identity2.expiration.getTime() - Date.now() < expirationMs;
|
|
16499
18561
|
};
|
|
16500
18562
|
var EXPIRATION_MS = 3e5;
|
|
16501
18563
|
var isIdentityExpired = createIsIdentityExpiredFunction(EXPIRATION_MS);
|
|
16502
|
-
var doesIdentityRequireRefresh = (
|
|
18564
|
+
var doesIdentityRequireRefresh = (identity2) => identity2.expiration !== void 0;
|
|
16503
18565
|
var memoizeIdentityProvider = (provider, isExpired, requiresRefresh) => {
|
|
16504
18566
|
if (provider === void 0) {
|
|
16505
18567
|
return void 0;
|
|
@@ -16732,9 +18794,9 @@ var parseURL = (value) => {
|
|
|
16732
18794
|
return value;
|
|
16733
18795
|
}
|
|
16734
18796
|
if (typeof value === "object" && "hostname" in value) {
|
|
16735
|
-
const { hostname: hostname2, port, protocol: protocol2 = "", path = "", query = {} } = value;
|
|
18797
|
+
const { hostname: hostname2, port, protocol: protocol2 = "", path = "", query: query2 = {} } = value;
|
|
16736
18798
|
const url = new URL(`${protocol2}//${hostname2}${port ? `:${port}` : ""}${path}`);
|
|
16737
|
-
url.search = Object.entries(
|
|
18799
|
+
url.search = Object.entries(query2).map(([k2, v2]) => `${k2}=${v2}`).join("&");
|
|
16738
18800
|
return url;
|
|
16739
18801
|
}
|
|
16740
18802
|
return new URL(value);
|
|
@@ -17471,7 +19533,7 @@ var validateSigningProperties = async (signingProperties) => {
|
|
|
17471
19533
|
};
|
|
17472
19534
|
};
|
|
17473
19535
|
var AwsSdkSigV4Signer = class {
|
|
17474
|
-
async sign(httpRequest,
|
|
19536
|
+
async sign(httpRequest, identity2, signingProperties) {
|
|
17475
19537
|
if (!HttpRequest.isInstance(httpRequest)) {
|
|
17476
19538
|
throw new Error("The request is not an instance of `HttpRequest` and cannot be signed");
|
|
17477
19539
|
}
|
|
@@ -17813,18 +19875,18 @@ var hasHeader = (soughtHeader, headers) => {
|
|
|
17813
19875
|
|
|
17814
19876
|
// node_modules/@smithy/signature-v4/dist-es/moveHeadersToQuery.js
|
|
17815
19877
|
var moveHeadersToQuery = (request, options = {}) => {
|
|
17816
|
-
const { headers, query = {} } = HttpRequest.clone(request);
|
|
19878
|
+
const { headers, query: query2 = {} } = HttpRequest.clone(request);
|
|
17817
19879
|
for (const name of Object.keys(headers)) {
|
|
17818
19880
|
const lname = name.toLowerCase();
|
|
17819
19881
|
if (lname.slice(0, 6) === "x-amz-" && !options.unhoistableHeaders?.has(lname) || options.hoistableHeaders?.has(lname)) {
|
|
17820
|
-
|
|
19882
|
+
query2[name] = headers[name];
|
|
17821
19883
|
delete headers[name];
|
|
17822
19884
|
}
|
|
17823
19885
|
}
|
|
17824
19886
|
return {
|
|
17825
19887
|
...request,
|
|
17826
19888
|
headers,
|
|
17827
|
-
query
|
|
19889
|
+
query: query2
|
|
17828
19890
|
};
|
|
17829
19891
|
};
|
|
17830
19892
|
|
|
@@ -17843,16 +19905,16 @@ var prepareRequest = (request) => {
|
|
|
17843
19905
|
init_dist_es();
|
|
17844
19906
|
|
|
17845
19907
|
// node_modules/@smithy/signature-v4/dist-es/getCanonicalQuery.js
|
|
17846
|
-
var getCanonicalQuery = ({ query = {} }) => {
|
|
19908
|
+
var getCanonicalQuery = ({ query: query2 = {} }) => {
|
|
17847
19909
|
const keys = [];
|
|
17848
19910
|
const serialized = {};
|
|
17849
|
-
for (const key of Object.keys(
|
|
19911
|
+
for (const key of Object.keys(query2)) {
|
|
17850
19912
|
if (key.toLowerCase() === SIGNATURE_HEADER) {
|
|
17851
19913
|
continue;
|
|
17852
19914
|
}
|
|
17853
19915
|
const encodedKey = escapeUri(key);
|
|
17854
19916
|
keys.push(encodedKey);
|
|
17855
|
-
const value =
|
|
19917
|
+
const value = query2[key];
|
|
17856
19918
|
if (typeof value === "string") {
|
|
17857
19919
|
serialized[encodedKey] = `${encodedKey}=${escapeUri(value)}`;
|
|
17858
19920
|
} else if (Array.isArray(value)) {
|
|
@@ -19873,9 +21935,9 @@ async function checkFeatures(context, config, args) {
|
|
|
19873
21935
|
break;
|
|
19874
21936
|
}
|
|
19875
21937
|
}
|
|
19876
|
-
const
|
|
19877
|
-
if (
|
|
19878
|
-
const credentials =
|
|
21938
|
+
const identity2 = context.__smithy_context?.selectedHttpAuthScheme?.identity;
|
|
21939
|
+
if (identity2?.$source) {
|
|
21940
|
+
const credentials = identity2;
|
|
19879
21941
|
if (credentials.accountId) {
|
|
19880
21942
|
setFeature2(context, "RESOLVED_ACCOUNT_ID", "T");
|
|
19881
21943
|
}
|
|
@@ -21080,11 +23142,11 @@ var Sha2563 = (
|
|
|
21080
23142
|
|
|
21081
23143
|
// node_modules/@aws-sdk/util-user-agent-browser/dist-es/index.js
|
|
21082
23144
|
var createDefaultUserAgentProvider = ({ serviceId, clientVersion }) => async (config) => {
|
|
21083
|
-
const
|
|
21084
|
-
const uaString =
|
|
21085
|
-
const osName =
|
|
23145
|
+
const navigator2 = typeof window !== "undefined" ? window.navigator : void 0;
|
|
23146
|
+
const uaString = navigator2?.userAgent ?? "";
|
|
23147
|
+
const osName = navigator2?.userAgentData?.platform ?? fallback.os(uaString) ?? "other";
|
|
21086
23148
|
const osVersion = void 0;
|
|
21087
|
-
const brands =
|
|
23149
|
+
const brands = navigator2?.userAgentData?.brands ?? [];
|
|
21088
23150
|
const brand = brands[brands.length - 1];
|
|
21089
23151
|
const browserName = brand?.brand ?? fallback.browser(uaString) ?? "unknown";
|
|
21090
23152
|
const browserVersion = brand?.version ?? "unknown";
|
|
@@ -22044,15 +24106,15 @@ var resolveDefaultsModeConfig = ({ defaultsMode } = {}) => memoize2(async () =>
|
|
|
22044
24106
|
}
|
|
22045
24107
|
});
|
|
22046
24108
|
var useMobileConfiguration = () => {
|
|
22047
|
-
const
|
|
22048
|
-
if (
|
|
22049
|
-
const { effectiveType, rtt, downlink } =
|
|
24109
|
+
const navigator2 = window?.navigator;
|
|
24110
|
+
if (navigator2?.connection) {
|
|
24111
|
+
const { effectiveType, rtt, downlink } = navigator2?.connection;
|
|
22050
24112
|
const slow = typeof effectiveType === "string" && effectiveType !== "4g" || Number(rtt) > 100 || Number(downlink) < 10;
|
|
22051
24113
|
if (slow) {
|
|
22052
24114
|
return true;
|
|
22053
24115
|
}
|
|
22054
24116
|
}
|
|
22055
|
-
return
|
|
24117
|
+
return navigator2?.userAgentData?.mobile || typeof navigator2?.maxTouchPoints === "number" && navigator2?.maxTouchPoints > 1;
|
|
22056
24118
|
};
|
|
22057
24119
|
|
|
22058
24120
|
// node_modules/@aws-sdk/client-cloudwatch-logs/dist-es/runtimeConfig.shared.js
|
|
@@ -22080,10 +24142,10 @@ var n = {};
|
|
|
22080
24142
|
var o = { [x]: "Region" };
|
|
22081
24143
|
var p = { [v]: "getAttr", [w]: [{ [x]: g }, "supportsFIPS"] };
|
|
22082
24144
|
var q = { [v]: c2, [w]: [true, { [v]: "getAttr", [w]: [{ [x]: g }, "supportsDualStack"] }] };
|
|
22083
|
-
var
|
|
24145
|
+
var r2 = [l];
|
|
22084
24146
|
var s = [m];
|
|
22085
24147
|
var t = [o];
|
|
22086
|
-
var _data = { version: "1.0", parameters: { Region: i, UseDualStack: j, UseFIPS: j, Endpoint: i }, rules: [{ conditions: [{ [v]: b2, [w]: [k] }], rules: [{ conditions:
|
|
24148
|
+
var _data = { version: "1.0", parameters: { Region: i, UseDualStack: j, UseFIPS: j, Endpoint: i }, rules: [{ conditions: [{ [v]: b2, [w]: [k] }], rules: [{ conditions: r2, error: "Invalid Configuration: FIPS and custom endpoint are not supported", type: d }, { conditions: s, error: "Invalid Configuration: Dualstack and custom endpoint are not supported", type: d }, { endpoint: { url: k, properties: n, headers: n }, type: e }], type: f }, { conditions: [{ [v]: b2, [w]: t }], rules: [{ conditions: [{ [v]: "aws.partition", [w]: t, assign: g }], rules: [{ conditions: [l, m], rules: [{ conditions: [{ [v]: c2, [w]: [a2, p] }, q], rules: [{ endpoint: { url: "https://logs-fips.{Region}.{PartitionResult#dualStackDnsSuffix}", properties: n, headers: n }, type: e }], type: f }, { error: "FIPS and DualStack are enabled, but this partition does not support one or both", type: d }], type: f }, { conditions: r2, rules: [{ conditions: [{ [v]: c2, [w]: [p, a2] }], rules: [{ conditions: [{ [v]: h, [w]: [o, "us-gov-east-1"] }], endpoint: { url: "https://logs.us-gov-east-1.amazonaws.com", properties: n, headers: n }, type: e }, { conditions: [{ [v]: h, [w]: [o, "us-gov-west-1"] }], endpoint: { url: "https://logs.us-gov-west-1.amazonaws.com", properties: n, headers: n }, type: e }, { endpoint: { url: "https://logs-fips.{Region}.{PartitionResult#dnsSuffix}", properties: n, headers: n }, type: e }], type: f }, { error: "FIPS is enabled but this partition does not support FIPS", type: d }], type: f }, { conditions: s, rules: [{ conditions: [q], rules: [{ endpoint: { url: "https://logs.{Region}.{PartitionResult#dualStackDnsSuffix}", properties: n, headers: n }, type: e }], type: f }, { error: "DualStack is enabled but this partition does not support DualStack", type: d }], type: f }, { endpoint: { url: "https://logs.{Region}.{PartitionResult#dnsSuffix}", properties: n, headers: n }, type: e }], type: f }], type: f }, { error: "Invalid Configuration: Missing Region", type: d }] };
|
|
22087
24149
|
var ruleSet = _data;
|
|
22088
24150
|
|
|
22089
24151
|
// node_modules/@aws-sdk/client-cloudwatch-logs/dist-es/endpoint/endpointResolver.js
|
|
@@ -24248,17 +26310,17 @@ var QueryStatus = {
|
|
|
24248
26310
|
};
|
|
24249
26311
|
|
|
24250
26312
|
// src/components/event-details/lambda-invoke-logs-section.tsx
|
|
24251
|
-
var
|
|
24252
|
-
var
|
|
24253
|
-
var
|
|
26313
|
+
var import_material12 = require("@mui/material");
|
|
26314
|
+
var import_react52 = require("react");
|
|
26315
|
+
var import_jsx_runtime134 = require("react/jsx-runtime");
|
|
24254
26316
|
var POLL_INTERVAL_MS = 1e3;
|
|
24255
26317
|
async function pollQueryResults(client, queryId) {
|
|
24256
26318
|
return client.send(new GetQueryResultsCommand({ queryId }));
|
|
24257
26319
|
}
|
|
24258
|
-
async function startLambdaLogsQuery(client,
|
|
26320
|
+
async function startLambdaLogsQuery(client, functionName2, requestId, startTimeSec, endTimeSec) {
|
|
24259
26321
|
const response = await client.send(new StartQueryCommand({
|
|
24260
26322
|
endTime: endTimeSec,
|
|
24261
|
-
logGroupName: `/aws/lambda/${
|
|
26323
|
+
logGroupName: `/aws/lambda/${functionName2}`,
|
|
24262
26324
|
queryString: `fields @timestamp, @message | filter @requestId = "${requestId}" | sort @timestamp asc`,
|
|
24263
26325
|
startTime: startTimeSec
|
|
24264
26326
|
}));
|
|
@@ -24267,7 +26329,7 @@ async function startLambdaLogsQuery(client, functionName, requestId, startTimeSe
|
|
|
24267
26329
|
}
|
|
24268
26330
|
function useCloudWatchLogsClient(region) {
|
|
24269
26331
|
const { localstackEndpoint } = useAppInspector();
|
|
24270
|
-
const client = (0,
|
|
26332
|
+
const client = (0, import_react52.useMemo)(() => new CloudWatchLogsClient({
|
|
24271
26333
|
credentials: {
|
|
24272
26334
|
accessKeyId: "test",
|
|
24273
26335
|
secretAccessKey: "test"
|
|
@@ -24277,19 +26339,19 @@ function useCloudWatchLogsClient(region) {
|
|
|
24277
26339
|
}), [region, localstackEndpoint]);
|
|
24278
26340
|
return client;
|
|
24279
26341
|
}
|
|
24280
|
-
function useLambdaInvokeLogs(
|
|
24281
|
-
const [loading, setLoading] = (0,
|
|
24282
|
-
const [logs, setLogs] = (0,
|
|
24283
|
-
const [error, setError] = (0,
|
|
24284
|
-
const pollTimerRef = (0,
|
|
26342
|
+
function useLambdaInvokeLogs(functionName2, requestId, region, startTimeNano, endTimeNano) {
|
|
26343
|
+
const [loading, setLoading] = (0, import_react52.useState)(true);
|
|
26344
|
+
const [logs, setLogs] = (0, import_react52.useState)([]);
|
|
26345
|
+
const [error, setError] = (0, import_react52.useState)();
|
|
26346
|
+
const pollTimerRef = (0, import_react52.useRef)(null);
|
|
24285
26347
|
const cloudWatchLogs = useCloudWatchLogsClient(region);
|
|
24286
|
-
(0,
|
|
26348
|
+
(0, import_react52.useEffect)(() => {
|
|
24287
26349
|
let cancelled = false;
|
|
24288
26350
|
const startTimeSec = Math.floor(Number(BigInt(startTimeNano) / BigInt(1e9)));
|
|
24289
26351
|
const endTimeSec = Math.ceil(Number(BigInt(endTimeNano) / BigInt(1e9)));
|
|
24290
26352
|
async function run() {
|
|
24291
26353
|
try {
|
|
24292
|
-
const queryId = await startLambdaLogsQuery(cloudWatchLogs,
|
|
26354
|
+
const queryId = await startLambdaLogsQuery(cloudWatchLogs, functionName2, requestId, startTimeSec - 60, endTimeSec + 60);
|
|
24293
26355
|
const poll = async () => {
|
|
24294
26356
|
if (cancelled) return;
|
|
24295
26357
|
try {
|
|
@@ -24334,42 +26396,85 @@ function useLambdaInvokeLogs(functionName, requestId, region, startTimeNano, end
|
|
|
24334
26396
|
cancelled = true;
|
|
24335
26397
|
if (pollTimerRef.current !== null) clearTimeout(pollTimerRef.current);
|
|
24336
26398
|
};
|
|
24337
|
-
}, [
|
|
26399
|
+
}, [functionName2, requestId, region, startTimeNano, endTimeNano]);
|
|
24338
26400
|
return { error, loading, logs };
|
|
24339
26401
|
}
|
|
24340
|
-
var LambdaInvokeLogsSection = ({ endTimeNano, functionName, region, requestId, startTimeNano }) => {
|
|
24341
|
-
const { error, loading, logs } = useLambdaInvokeLogs(
|
|
26402
|
+
var LambdaInvokeLogsSection = ({ endTimeNano, functionName: functionName2, region, requestId, startTimeNano }) => {
|
|
26403
|
+
const { error, loading, logs } = useLambdaInvokeLogs(functionName2, requestId, region, startTimeNano, endTimeNano);
|
|
24342
26404
|
if (loading) {
|
|
24343
|
-
return /* @__PURE__ */ (0,
|
|
24344
|
-
/* @__PURE__ */ (0,
|
|
24345
|
-
/* @__PURE__ */ (0,
|
|
26405
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(import_material12.Stack, { alignItems: "center", direction: "row", spacing: 1, children: [
|
|
26406
|
+
/* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.CircularProgress, { size: 14 }),
|
|
26407
|
+
/* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Typography, { color: "text.secondary", variant: "body2", children: "Loading logs\u2026" })
|
|
24346
26408
|
] });
|
|
24347
26409
|
}
|
|
24348
26410
|
if (error !== void 0) {
|
|
24349
|
-
return /* @__PURE__ */ (0,
|
|
26411
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Typography, { color: "error", variant: "body2", children: error.message });
|
|
24350
26412
|
}
|
|
24351
26413
|
if (logs.length === 0) {
|
|
24352
|
-
return /* @__PURE__ */ (0,
|
|
26414
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Typography, { color: "text.secondary", variant: "body2", children: "No logs found for this invocation." });
|
|
24353
26415
|
}
|
|
24354
|
-
return /* @__PURE__ */ (0,
|
|
26416
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Box, { sx: { backgroundColor: (theme) => theme.palette.background.default, borderRadius: 1, p: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)("pre", { style: { margin: 0, overflow: "auto" }, children: logs.map((log) => /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(import_material12.Typography, { variant: "body2", children: `[${log.timestamp}] ${log.message}` }, log.ptr)) }) });
|
|
24355
26417
|
};
|
|
24356
26418
|
|
|
24357
|
-
// src/components/event-details/
|
|
24358
|
-
var
|
|
24359
|
-
var
|
|
24360
|
-
|
|
24361
|
-
|
|
24362
|
-
|
|
24363
|
-
|
|
24364
|
-
|
|
24365
|
-
|
|
24366
|
-
|
|
24367
|
-
|
|
24368
|
-
|
|
24369
|
-
|
|
24370
|
-
|
|
24371
|
-
|
|
26419
|
+
// src/components/event-details/toggle-section.tsx
|
|
26420
|
+
var import_icons_material7 = require("@mui/icons-material");
|
|
26421
|
+
var import_material13 = require("@mui/material");
|
|
26422
|
+
var import_react53 = require("react");
|
|
26423
|
+
var import_jsx_runtime135 = require("react/jsx-runtime");
|
|
26424
|
+
var ToggleSection = ({ action, children, headline, initialOpen = true }) => {
|
|
26425
|
+
const [isOpen, setIsOpen] = (0, import_react53.useState)(initialOpen);
|
|
26426
|
+
return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(import_material13.Box, { sx: { mt: 4 }, children: [
|
|
26427
|
+
/* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
|
|
26428
|
+
import_material13.Box,
|
|
26429
|
+
{
|
|
26430
|
+
onClick: () => {
|
|
26431
|
+
setIsOpen(!isOpen);
|
|
26432
|
+
},
|
|
26433
|
+
sx: {
|
|
26434
|
+
alignItems: "center",
|
|
26435
|
+
cursor: "pointer",
|
|
26436
|
+
display: "flex",
|
|
26437
|
+
justifyContent: "space-between",
|
|
26438
|
+
mb: 1
|
|
26439
|
+
},
|
|
26440
|
+
children: [
|
|
26441
|
+
/* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
|
|
26442
|
+
import_material13.Box,
|
|
26443
|
+
{
|
|
26444
|
+
role: "button",
|
|
26445
|
+
sx: {
|
|
26446
|
+
alignItems: "center",
|
|
26447
|
+
display: "flex",
|
|
26448
|
+
gap: 1
|
|
26449
|
+
},
|
|
26450
|
+
children: [
|
|
26451
|
+
/* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_material13.Typography, { sx: { fontWeight: 600 }, variant: "subtitle2", children: headline }),
|
|
26452
|
+
isOpen ? /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_icons_material7.KeyboardArrowDown, { sx: { color: "text.secondary", height: 20, width: 20 } }) : /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_icons_material7.KeyboardArrowRight, { sx: { color: "text.secondary", height: 20, width: 20 } })
|
|
26453
|
+
]
|
|
26454
|
+
}
|
|
26455
|
+
),
|
|
26456
|
+
action !== false && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_material13.Box, { onClick: (event) => {
|
|
26457
|
+
event.stopPropagation();
|
|
26458
|
+
}, children: action })
|
|
26459
|
+
]
|
|
26460
|
+
}
|
|
26461
|
+
),
|
|
26462
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(import_material13.Box, { children })
|
|
26463
|
+
] });
|
|
24372
26464
|
};
|
|
26465
|
+
|
|
26466
|
+
// src/components/event-details/event-details.tsx
|
|
26467
|
+
var import_jsx_runtime136 = require("react/jsx-runtime");
|
|
26468
|
+
function tryParseJson(value) {
|
|
26469
|
+
if (typeof value !== "string") {
|
|
26470
|
+
return value;
|
|
26471
|
+
}
|
|
26472
|
+
try {
|
|
26473
|
+
return JSON.parse(value);
|
|
26474
|
+
} catch {
|
|
26475
|
+
return value;
|
|
26476
|
+
}
|
|
26477
|
+
}
|
|
24373
26478
|
var checkIsLambdaInvoke = (span) => {
|
|
24374
26479
|
if (span.service_name !== "lambda") {
|
|
24375
26480
|
return false;
|
|
@@ -24377,97 +26482,157 @@ var checkIsLambdaInvoke = (span) => {
|
|
|
24377
26482
|
const operationName = span.operation_name.toLowerCase();
|
|
24378
26483
|
return operationName === "invoke" || operationName === "invokewithresponsestream" || operationName === "invokeasync";
|
|
24379
26484
|
};
|
|
26485
|
+
var checkIsSqsSendMessage = (span) => {
|
|
26486
|
+
if (span.service_name !== "sqs") {
|
|
26487
|
+
return false;
|
|
26488
|
+
}
|
|
26489
|
+
return span.operation_name.startsWith("SendMessage");
|
|
26490
|
+
};
|
|
24380
26491
|
var EventDetails = ({ onClose, selectedEvent }) => {
|
|
24381
|
-
const
|
|
24382
|
-
|
|
24383
|
-
|
|
24384
|
-
|
|
24385
|
-
const
|
|
24386
|
-
const resourceArn = typeof selectedEvent?.attributes?.["localstack.aws.resource_arn"] === "string" ? selectedEvent.attributes["localstack.aws.resource_arn"] : void 0;
|
|
26492
|
+
const eventGroups = (0, import_react54.useMemo)(
|
|
26493
|
+
() => getEventGroupsByType(selectedEvent?.events ?? []),
|
|
26494
|
+
[selectedEvent?.events]
|
|
26495
|
+
);
|
|
26496
|
+
const [parseNestedJson, setParseNestedJson] = (0, import_react54.useState)(true);
|
|
24387
26497
|
if (!selectedEvent) {
|
|
24388
|
-
return /* @__PURE__ */ (0,
|
|
26498
|
+
return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Box, { sx: { p: 3, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { color: "text.secondary", variant: "body2", children: "Select an event to view details" }) });
|
|
24389
26499
|
}
|
|
24390
26500
|
const isLambdaInvoke = checkIsLambdaInvoke(selectedEvent);
|
|
24391
|
-
|
|
24392
|
-
|
|
24393
|
-
|
|
24394
|
-
|
|
24395
|
-
|
|
24396
|
-
|
|
24397
|
-
|
|
24398
|
-
|
|
24399
|
-
|
|
24400
|
-
|
|
24401
|
-
|
|
24402
|
-
|
|
24403
|
-
|
|
24404
|
-
|
|
24405
|
-
|
|
24406
|
-
|
|
24407
|
-
|
|
24408
|
-
|
|
24409
|
-
|
|
24410
|
-
|
|
24411
|
-
|
|
24412
|
-
|
|
24413
|
-
|
|
24414
|
-
|
|
24415
|
-
|
|
24416
|
-
|
|
26501
|
+
const isSqsSendMessage = checkIsSqsSendMessage(selectedEvent);
|
|
26502
|
+
const requestId = typeof selectedEvent.attributes?.["localstack.request_id"] === "string" ? selectedEvent.attributes["localstack.request_id"] : void 0;
|
|
26503
|
+
const resourceArn = typeof selectedEvent.attributes?.["localstack.aws.resource_arn"] === "string" ? selectedEvent.attributes["localstack.aws.resource_arn"] : void 0;
|
|
26504
|
+
const requestPayload = tryParseJson(selectedEvent.attributes?.["localstack.aws.service.request"]);
|
|
26505
|
+
if (parseNestedJson) {
|
|
26506
|
+
if (isLambdaInvoke && requestPayload && typeof requestPayload === "object" && "Payload" in requestPayload) {
|
|
26507
|
+
requestPayload.Payload = tryParseJson(requestPayload.Payload);
|
|
26508
|
+
} else if (isSqsSendMessage && requestPayload && typeof requestPayload === "object" && "MessageBody" in requestPayload) {
|
|
26509
|
+
requestPayload.MessageBody = tryParseJson(requestPayload.MessageBody);
|
|
26510
|
+
}
|
|
26511
|
+
}
|
|
26512
|
+
const responsePayload = tryParseJson(selectedEvent.attributes?.["localstack.aws.service.response"]);
|
|
26513
|
+
if (parseNestedJson && isLambdaInvoke && responsePayload && typeof responsePayload === "object" && "Payload" in responsePayload) {
|
|
26514
|
+
responsePayload.Payload = tryParseJson(responsePayload.Payload);
|
|
26515
|
+
}
|
|
26516
|
+
const exceptionPayload = tryParseJson(selectedEvent.attributes?.["localstack.aws.service.exception"]);
|
|
26517
|
+
const hasPayloads = requestPayload !== void 0 || responsePayload !== void 0 || exceptionPayload !== void 0;
|
|
26518
|
+
const duration = selectedEvent.end_time_unix_nano ? ((BigInt(selectedEvent.end_time_unix_nano) - BigInt(selectedEvent.start_time_unix_nano)) / BigInt("1000000")).toString() : void 0;
|
|
26519
|
+
return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { "data-testid": "event-details", sx: { display: "flex", flexDirection: "column", height: "100%" }, children: [
|
|
26520
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
|
|
26521
|
+
import_material14.Box,
|
|
26522
|
+
{
|
|
26523
|
+
sx: {
|
|
26524
|
+
alignItems: "center",
|
|
26525
|
+
borderBottom: "1px solid",
|
|
26526
|
+
borderColor: "divider",
|
|
26527
|
+
display: "flex",
|
|
26528
|
+
justifyContent: "space-between",
|
|
26529
|
+
px: 2,
|
|
26530
|
+
py: 1
|
|
26531
|
+
},
|
|
26532
|
+
children: [
|
|
26533
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "h6", children: "Operation Details" }) }),
|
|
26534
|
+
onClose && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.IconButton, { onClick: onClose, size: "small", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_icons_material8.Close, {}) })
|
|
26535
|
+
]
|
|
26536
|
+
}
|
|
26537
|
+
),
|
|
26538
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Box, { sx: { flexGrow: 1, overflow: "auto", p: 2 }, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Stack, { spacing: 2, children: [
|
|
26539
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(ToggleSection, { headline: "Basic Information", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Stack, { spacing: 1, children: [
|
|
26540
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { sx: { display: "grid", gap: 2, gridTemplateColumns: "1.3fr 1fr" }, children: [
|
|
26541
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26542
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Service" }),
|
|
26543
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.service_name })
|
|
26544
|
+
] }),
|
|
26545
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26546
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Operation" }),
|
|
26547
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.operation_name })
|
|
26548
|
+
] })
|
|
24417
26549
|
] }),
|
|
24418
|
-
/* @__PURE__ */ (0,
|
|
24419
|
-
/* @__PURE__ */ (0,
|
|
24420
|
-
/* @__PURE__ */ (0,
|
|
26550
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26551
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Resource" }),
|
|
26552
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.resource_name })
|
|
24421
26553
|
] }),
|
|
24422
|
-
Boolean(
|
|
24423
|
-
/* @__PURE__ */ (0,
|
|
24424
|
-
/* @__PURE__ */ (0,
|
|
26554
|
+
Boolean(resourceArn) && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26555
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Resource ARN" }),
|
|
26556
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: resourceArn })
|
|
24425
26557
|
] }),
|
|
24426
|
-
|
|
24427
|
-
/* @__PURE__ */ (0,
|
|
24428
|
-
|
|
24429
|
-
|
|
24430
|
-
|
|
24431
|
-
|
|
24432
|
-
|
|
24433
|
-
|
|
24434
|
-
|
|
24435
|
-
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material15.Typography, { variant: "body2", children: unixNanoToDate(selectedEvent.start_time_unix_nano)?.toISOString() })
|
|
26558
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { sx: { display: "grid", gap: 1, gridTemplateColumns: "1.3fr 1fr" }, children: [
|
|
26559
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26560
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Account" }),
|
|
26561
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.account_id })
|
|
26562
|
+
] }),
|
|
26563
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26564
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Region" }),
|
|
26565
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.region })
|
|
26566
|
+
] })
|
|
24436
26567
|
] }),
|
|
24437
|
-
|
|
24438
|
-
/* @__PURE__ */ (0,
|
|
24439
|
-
|
|
24440
|
-
((
|
|
24441
|
-
|
|
24442
|
-
|
|
26568
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { sx: { display: "grid", gap: 1, gridTemplateColumns: duration === void 0 ? "1fr" : "1.3fr 1fr" }, children: [
|
|
26569
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26570
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Start Time" }),
|
|
26571
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: unixNanoToDate(selectedEvent.start_time_unix_nano)?.toISOString() })
|
|
26572
|
+
] }),
|
|
26573
|
+
duration !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26574
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Duration" }),
|
|
26575
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Typography, { variant: "body2", children: [
|
|
26576
|
+
duration,
|
|
26577
|
+
"ms"
|
|
26578
|
+
] })
|
|
24443
26579
|
] })
|
|
26580
|
+
] }),
|
|
26581
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26582
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Status" }),
|
|
26583
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Stack, { alignItems: "center", direction: "row", flexWrap: "wrap", gap: 1, sx: { mb: eventGroups.errors || eventGroups.warnings ? 1 : 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
26584
|
+
import_material14.Chip,
|
|
26585
|
+
{
|
|
26586
|
+
color: selectedEvent.status_code === 2 ? "error" : selectedEvent.status_code === 1 ? "success" : "default",
|
|
26587
|
+
label: selectedEvent.status_code === 2 ? "Error" : selectedEvent.status_code === 1 ? "OK" : "Unset",
|
|
26588
|
+
size: "small"
|
|
26589
|
+
}
|
|
26590
|
+
) })
|
|
24444
26591
|
] })
|
|
24445
26592
|
] }) }),
|
|
24446
|
-
/* @__PURE__ */ (0,
|
|
24447
|
-
/* @__PURE__ */ (0,
|
|
24448
|
-
/* @__PURE__ */ (0,
|
|
24449
|
-
|
|
24450
|
-
|
|
24451
|
-
|
|
24452
|
-
|
|
24453
|
-
|
|
24454
|
-
|
|
24455
|
-
)
|
|
24456
|
-
|
|
24457
|
-
] }) }),
|
|
24458
|
-
selectedEvent.events.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(import_jsx_runtime137.Fragment, { children: [
|
|
24459
|
-
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material15.Divider, {}),
|
|
24460
|
-
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
|
|
24461
|
-
EventSection,
|
|
26593
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Divider, {}),
|
|
26594
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(ToggleSection, { headline: "Permissions", children: [
|
|
26595
|
+
!eventGroups.permissions && !eventGroups.errors && !eventGroups.warnings && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { color: "text.secondary", variant: "body2", children: "There is no permission information available. Are IAM Policy Streams enabled?" }),
|
|
26596
|
+
eventGroups.permissions && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(EventDetail, { displayText: "Permissions", events: eventGroups.permissions, type: "permission" }),
|
|
26597
|
+
eventGroups.errors && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(EventDetail, { displayText: "Error", events: eventGroups.errors, type: "error" }),
|
|
26598
|
+
eventGroups.warnings && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(EventDetail, { displayText: "Warning", events: eventGroups.warnings, type: "warning" })
|
|
26599
|
+
] }),
|
|
26600
|
+
hasPayloads && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_jsx_runtime136.Fragment, { children: [
|
|
26601
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Divider, {}),
|
|
26602
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
26603
|
+
ToggleSection,
|
|
24462
26604
|
{
|
|
24463
|
-
|
|
24464
|
-
|
|
26605
|
+
action: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
26606
|
+
import_material14.FormControlLabel,
|
|
26607
|
+
{
|
|
26608
|
+
control: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Switch, { checked: !parseNestedJson, onChange: (event) => {
|
|
26609
|
+
setParseNestedJson(!event.target.checked);
|
|
26610
|
+
}, size: "small" }),
|
|
26611
|
+
label: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "caption", children: "View raw data" }),
|
|
26612
|
+
sx: { mr: 0 }
|
|
26613
|
+
}
|
|
26614
|
+
),
|
|
26615
|
+
headline: "Payloads",
|
|
26616
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Stack, { spacing: 2, children: [
|
|
26617
|
+
requestPayload !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26618
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Request" }),
|
|
26619
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(PayloadViewer, { value: requestPayload })
|
|
26620
|
+
] }),
|
|
26621
|
+
responsePayload !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26622
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Response" }),
|
|
26623
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(PayloadViewer, { value: responsePayload })
|
|
26624
|
+
] }),
|
|
26625
|
+
exceptionPayload !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26626
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Exception" }),
|
|
26627
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(PayloadViewer, { value: exceptionPayload })
|
|
26628
|
+
] })
|
|
26629
|
+
] })
|
|
24465
26630
|
}
|
|
24466
26631
|
)
|
|
24467
26632
|
] }),
|
|
24468
|
-
isLambdaInvoke && requestId !== void 0 && /* @__PURE__ */ (0,
|
|
24469
|
-
/* @__PURE__ */ (0,
|
|
24470
|
-
/* @__PURE__ */ (0,
|
|
26633
|
+
isLambdaInvoke && requestId !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_jsx_runtime136.Fragment, { children: [
|
|
26634
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Divider, {}),
|
|
26635
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(ToggleSection, { headline: "Lambda Logs", children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
24471
26636
|
LambdaInvokeLogsSection,
|
|
24472
26637
|
{
|
|
24473
26638
|
endTimeNano: selectedEvent.end_time_unix_nano ?? selectedEvent.start_time_unix_nano,
|
|
@@ -24478,58 +26643,72 @@ var EventDetails = ({ onClose, selectedEvent }) => {
|
|
|
24478
26643
|
}
|
|
24479
26644
|
) })
|
|
24480
26645
|
] }),
|
|
24481
|
-
|
|
24482
|
-
|
|
24483
|
-
/* @__PURE__ */ (0,
|
|
24484
|
-
/* @__PURE__ */ (0,
|
|
24485
|
-
|
|
24486
|
-
] },
|
|
24487
|
-
|
|
26646
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Divider, {}),
|
|
26647
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(ToggleSection, { headline: "Advanced Information", initialOpen: false, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Stack, { spacing: 1, children: [
|
|
26648
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26649
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Span ID" }),
|
|
26650
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.span_id })
|
|
26651
|
+
] }),
|
|
26652
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26653
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Trace ID" }),
|
|
26654
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: selectedEvent.trace_id })
|
|
26655
|
+
] }),
|
|
26656
|
+
requestId !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(import_material14.Box, { children: [
|
|
26657
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { sx: { fontWeight: 600 }, variant: "caption", children: "Request ID" }),
|
|
26658
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Typography, { variant: "body2", children: requestId })
|
|
26659
|
+
] }),
|
|
26660
|
+
eventGroups.info && /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(EventDetail, { displayText: "Info", events: eventGroups.info, type: "info" })
|
|
26661
|
+
] }) })
|
|
24488
26662
|
] }) })
|
|
24489
26663
|
] });
|
|
24490
26664
|
};
|
|
24491
|
-
|
|
24492
|
-
|
|
24493
|
-
|
|
24494
|
-
|
|
24495
|
-
|
|
24496
|
-
|
|
24497
|
-
|
|
24498
|
-
|
|
24499
|
-
|
|
26665
|
+
var PayloadViewer = (0, import_react54.memo)(({ value }) => {
|
|
26666
|
+
const theme = (0, import_material14.useTheme)();
|
|
26667
|
+
return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(import_material14.Box, { sx: { backgroundColor: "background.default", borderRadius: 1, fontSize: 12, overflow: "auto", p: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
26668
|
+
JsonViewer,
|
|
26669
|
+
{
|
|
26670
|
+
displayDataTypes: false,
|
|
26671
|
+
displaySize: false,
|
|
26672
|
+
enableClipboard: false,
|
|
26673
|
+
rootName: false,
|
|
26674
|
+
theme: theme.palette.mode,
|
|
26675
|
+
value
|
|
26676
|
+
}
|
|
26677
|
+
) });
|
|
26678
|
+
});
|
|
24500
26679
|
|
|
24501
26680
|
// src/components/trace-graph/trace-graph.tsx
|
|
24502
26681
|
var import_base = require("@xyflow/react/dist/base.css");
|
|
24503
|
-
var
|
|
24504
|
-
var
|
|
24505
|
-
var
|
|
26682
|
+
var import_material18 = require("@mui/material");
|
|
26683
|
+
var import_react60 = require("@xyflow/react");
|
|
26684
|
+
var import_react61 = require("react");
|
|
24506
26685
|
|
|
24507
26686
|
// src/components/trace-graph/service-node.tsx
|
|
24508
|
-
var
|
|
26687
|
+
var import_material16 = require("@mui/material");
|
|
24509
26688
|
var import_style = require("@xyflow/react/dist/style.css");
|
|
24510
|
-
var
|
|
24511
|
-
var
|
|
26689
|
+
var import_react56 = require("@xyflow/react");
|
|
26690
|
+
var import_react57 = require("react");
|
|
24512
26691
|
|
|
24513
26692
|
// src/components/trace-graph/problem-indicator.tsx
|
|
24514
26693
|
var import_icons_material9 = require("@mui/icons-material");
|
|
24515
|
-
var
|
|
24516
|
-
var
|
|
24517
|
-
var
|
|
26694
|
+
var import_material15 = require("@mui/material");
|
|
26695
|
+
var import_react55 = require("react");
|
|
26696
|
+
var import_jsx_runtime137 = require("react/jsx-runtime");
|
|
24518
26697
|
var ProblemIndicator = ({ error }) => {
|
|
24519
|
-
const icon = (0,
|
|
26698
|
+
const icon = (0, import_react55.useMemo)(() => {
|
|
24520
26699
|
switch (error.level) {
|
|
24521
26700
|
case "error": {
|
|
24522
|
-
return /* @__PURE__ */ (0,
|
|
26701
|
+
return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_icons_material9.Error, { sx: { color: "#d32f2f", fontSize: "14px" } });
|
|
24523
26702
|
}
|
|
24524
26703
|
case "warning": {
|
|
24525
|
-
return /* @__PURE__ */ (0,
|
|
26704
|
+
return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_icons_material9.Warning, { sx: { color: "#ff9800", fontSize: "14px" } });
|
|
24526
26705
|
}
|
|
24527
26706
|
default: {
|
|
24528
|
-
return /* @__PURE__ */ (0,
|
|
26707
|
+
return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_icons_material9.Info, { sx: { color: "#2196f3", fontSize: "14px" } });
|
|
24529
26708
|
}
|
|
24530
26709
|
}
|
|
24531
26710
|
}, [error.level]);
|
|
24532
|
-
const color2 = (0,
|
|
26711
|
+
const color2 = (0, import_react55.useMemo)(() => {
|
|
24533
26712
|
switch (error.level) {
|
|
24534
26713
|
case "error": {
|
|
24535
26714
|
return "#d32f2f";
|
|
@@ -24542,8 +26721,8 @@ var ProblemIndicator = ({ error }) => {
|
|
|
24542
26721
|
}
|
|
24543
26722
|
}
|
|
24544
26723
|
}, [error.level]);
|
|
24545
|
-
return /* @__PURE__ */ (0,
|
|
24546
|
-
|
|
26724
|
+
return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(import_material15.Tooltip, { arrow: true, title: error.message ?? "Issue detected", children: /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
|
|
26725
|
+
import_material15.Box,
|
|
24547
26726
|
{
|
|
24548
26727
|
sx: {
|
|
24549
26728
|
alignItems: "center",
|
|
@@ -24562,17 +26741,17 @@ var ProblemIndicator = ({ error }) => {
|
|
|
24562
26741
|
};
|
|
24563
26742
|
|
|
24564
26743
|
// src/components/trace-graph/service-node.tsx
|
|
24565
|
-
var
|
|
26744
|
+
var import_jsx_runtime138 = require("react/jsx-runtime");
|
|
24566
26745
|
var handleStyle = {
|
|
24567
26746
|
backgroundColor: "white",
|
|
24568
26747
|
borderColor: "lightgray",
|
|
24569
26748
|
opacity: 0
|
|
24570
26749
|
};
|
|
24571
|
-
var ServiceNode = (0,
|
|
26750
|
+
var ServiceNode = (0, import_react57.memo)(({ data, selected }) => {
|
|
24572
26751
|
const hasErrors = (data.event.errors && data.event.errors.length > 0) ?? false;
|
|
24573
|
-
return /* @__PURE__ */ (0,
|
|
24574
|
-
/* @__PURE__ */ (0,
|
|
24575
|
-
|
|
26752
|
+
return /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(import_material16.Box, { sx: { maxWidth: 200 }, children: [
|
|
26753
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
|
|
26754
|
+
import_material16.Box,
|
|
24576
26755
|
{
|
|
24577
26756
|
role: "button",
|
|
24578
26757
|
sx: {
|
|
@@ -24592,9 +26771,9 @@ var ServiceNode = (0, import_react55.memo)(({ data, selected }) => {
|
|
|
24592
26771
|
},
|
|
24593
26772
|
tabIndex: 0,
|
|
24594
26773
|
children: [
|
|
24595
|
-
/* @__PURE__ */ (0,
|
|
24596
|
-
/* @__PURE__ */ (0,
|
|
24597
|
-
/* @__PURE__ */ (0,
|
|
26774
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_react56.Handle, { position: import_react56.Position.Left, style: handleStyle, type: "target" }),
|
|
26775
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsx)(import_react56.Handle, { position: import_react56.Position.Right, style: handleStyle, type: "source" }),
|
|
26776
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
|
|
24598
26777
|
ServiceCell,
|
|
24599
26778
|
{
|
|
24600
26779
|
height: "32px",
|
|
@@ -24607,8 +26786,8 @@ var ServiceNode = (0, import_react55.memo)(({ data, selected }) => {
|
|
|
24607
26786
|
]
|
|
24608
26787
|
}
|
|
24609
26788
|
),
|
|
24610
|
-
/* @__PURE__ */ (0,
|
|
24611
|
-
|
|
26789
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(
|
|
26790
|
+
import_material16.Stack,
|
|
24612
26791
|
{
|
|
24613
26792
|
alignItems: "center",
|
|
24614
26793
|
direction: "row",
|
|
@@ -24618,8 +26797,8 @@ var ServiceNode = (0, import_react55.memo)(({ data, selected }) => {
|
|
|
24618
26797
|
mt: 0.5
|
|
24619
26798
|
},
|
|
24620
26799
|
children: [
|
|
24621
|
-
hasErrors && /* @__PURE__ */ (0,
|
|
24622
|
-
|
|
26800
|
+
hasErrors && /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
|
|
26801
|
+
import_material16.Stack,
|
|
24623
26802
|
{
|
|
24624
26803
|
direction: "row",
|
|
24625
26804
|
spacing: 0.5,
|
|
@@ -24627,11 +26806,11 @@ var ServiceNode = (0, import_react55.memo)(({ data, selected }) => {
|
|
|
24627
26806
|
flexWrap: "wrap",
|
|
24628
26807
|
gap: "2px"
|
|
24629
26808
|
},
|
|
24630
|
-
children: data.event.errors?.map((error) => /* @__PURE__ */ (0,
|
|
26809
|
+
children: data.event.errors?.map((error) => /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(ProblemIndicator, { error }, error.span_id))
|
|
24631
26810
|
}
|
|
24632
26811
|
),
|
|
24633
|
-
/* @__PURE__ */ (0,
|
|
24634
|
-
|
|
26812
|
+
/* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
|
|
26813
|
+
import_material16.Typography,
|
|
24635
26814
|
{
|
|
24636
26815
|
sx: {
|
|
24637
26816
|
fontSize: "0.9rem",
|
|
@@ -24682,9 +26861,9 @@ var getLayoutedNodesAndEdges = (inputNodes, inputEdges) => {
|
|
|
24682
26861
|
|
|
24683
26862
|
// src/components/trace-graph/xyflow/controls.tsx
|
|
24684
26863
|
var import_icons_material10 = require("@mui/icons-material");
|
|
24685
|
-
var
|
|
24686
|
-
var
|
|
24687
|
-
var
|
|
26864
|
+
var import_material17 = require("@mui/material");
|
|
26865
|
+
var import_react58 = require("@xyflow/react");
|
|
26866
|
+
var import_react59 = require("react");
|
|
24688
26867
|
|
|
24689
26868
|
// node_modules/zustand/esm/shallow.mjs
|
|
24690
26869
|
function shallow$1(objA, objB) {
|
|
@@ -24725,15 +26904,15 @@ function shallow$1(objA, objB) {
|
|
|
24725
26904
|
}
|
|
24726
26905
|
|
|
24727
26906
|
// src/components/trace-graph/xyflow/controls.tsx
|
|
24728
|
-
var
|
|
26907
|
+
var import_jsx_runtime139 = require("react/jsx-runtime");
|
|
24729
26908
|
var selector = (s2) => ({
|
|
24730
26909
|
isInteractive: s2.nodesDraggable || s2.nodesConnectable || s2.elementsSelectable,
|
|
24731
26910
|
maxZoomReached: s2.transform[2] >= s2.maxZoom,
|
|
24732
26911
|
minZoomReached: s2.transform[2] <= s2.minZoom
|
|
24733
26912
|
});
|
|
24734
|
-
var Controls = (0,
|
|
24735
|
-
const { maxZoomReached, minZoomReached } = (0,
|
|
24736
|
-
const { fitView, zoomIn, zoomOut } = (0,
|
|
26913
|
+
var Controls = (0, import_react59.memo)(() => {
|
|
26914
|
+
const { maxZoomReached, minZoomReached } = (0, import_react58.useStore)(selector, shallow$1);
|
|
26915
|
+
const { fitView, zoomIn, zoomOut } = (0, import_react58.useReactFlow)();
|
|
24737
26916
|
const onZoomInHandler = () => {
|
|
24738
26917
|
void zoomIn();
|
|
24739
26918
|
};
|
|
@@ -24743,8 +26922,8 @@ var Controls = (0, import_react57.memo)(() => {
|
|
|
24743
26922
|
const onFitViewHandler = () => {
|
|
24744
26923
|
void fitView();
|
|
24745
26924
|
};
|
|
24746
|
-
return /* @__PURE__ */ (0,
|
|
24747
|
-
|
|
26925
|
+
return /* @__PURE__ */ (0, import_jsx_runtime139.jsxs)(
|
|
26926
|
+
import_material17.Box,
|
|
24748
26927
|
{
|
|
24749
26928
|
sx: {
|
|
24750
26929
|
bottom: 0,
|
|
@@ -24757,33 +26936,33 @@ var Controls = (0, import_react57.memo)(() => {
|
|
|
24757
26936
|
zIndex: 5
|
|
24758
26937
|
},
|
|
24759
26938
|
children: [
|
|
24760
|
-
/* @__PURE__ */ (0,
|
|
24761
|
-
|
|
26939
|
+
/* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
26940
|
+
import_material17.IconButton,
|
|
24762
26941
|
{
|
|
24763
26942
|
className: "react-flow__controls-zoomin",
|
|
24764
26943
|
disabled: maxZoomReached,
|
|
24765
26944
|
onClick: onZoomInHandler,
|
|
24766
26945
|
size: "small",
|
|
24767
|
-
children: /* @__PURE__ */ (0,
|
|
26946
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_icons_material10.Add, {})
|
|
24768
26947
|
}
|
|
24769
26948
|
),
|
|
24770
|
-
/* @__PURE__ */ (0,
|
|
24771
|
-
|
|
26949
|
+
/* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
26950
|
+
import_material17.IconButton,
|
|
24772
26951
|
{
|
|
24773
26952
|
className: "react-flow__controls-zoomout",
|
|
24774
26953
|
disabled: minZoomReached,
|
|
24775
26954
|
onClick: onZoomOutHandler,
|
|
24776
26955
|
size: "small",
|
|
24777
|
-
children: /* @__PURE__ */ (0,
|
|
26956
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_icons_material10.Remove, {})
|
|
24778
26957
|
}
|
|
24779
26958
|
),
|
|
24780
|
-
/* @__PURE__ */ (0,
|
|
24781
|
-
|
|
26959
|
+
/* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
26960
|
+
import_material17.IconButton,
|
|
24782
26961
|
{
|
|
24783
26962
|
className: "react-flow__controls-fitview",
|
|
24784
26963
|
onClick: onFitViewHandler,
|
|
24785
26964
|
size: "small",
|
|
24786
|
-
children: /* @__PURE__ */ (0,
|
|
26965
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(import_icons_material10.FitScreen, {})
|
|
24787
26966
|
}
|
|
24788
26967
|
)
|
|
24789
26968
|
]
|
|
@@ -24792,7 +26971,7 @@ var Controls = (0, import_react57.memo)(() => {
|
|
|
24792
26971
|
});
|
|
24793
26972
|
|
|
24794
26973
|
// src/components/trace-graph/trace-graph.tsx
|
|
24795
|
-
var
|
|
26974
|
+
var import_jsx_runtime140 = require("react/jsx-runtime");
|
|
24796
26975
|
var nodeTypes = {
|
|
24797
26976
|
service: ServiceNode
|
|
24798
26977
|
};
|
|
@@ -24802,9 +26981,9 @@ var TraceGraph = ({
|
|
|
24802
26981
|
onRefresh,
|
|
24803
26982
|
spans
|
|
24804
26983
|
}) => {
|
|
24805
|
-
const [nodes, setNodes, onNodesChange] = (0,
|
|
24806
|
-
const [edges, setEdges] = (0,
|
|
24807
|
-
(0,
|
|
26984
|
+
const [nodes, setNodes, onNodesChange] = (0, import_react60.useNodesState)([]);
|
|
26985
|
+
const [edges, setEdges] = (0, import_react60.useEdgesState)([]);
|
|
26986
|
+
(0, import_react61.useEffect)(() => {
|
|
24808
26987
|
const allNodes = [];
|
|
24809
26988
|
const allEdges = [];
|
|
24810
26989
|
for (const span of spans.data ?? []) {
|
|
@@ -24819,15 +26998,15 @@ var TraceGraph = ({
|
|
|
24819
26998
|
},
|
|
24820
26999
|
id: span.span_id,
|
|
24821
27000
|
position: { x: 0, y: 0 },
|
|
24822
|
-
sourcePosition:
|
|
24823
|
-
targetPosition:
|
|
27001
|
+
sourcePosition: import_react60.Position.Right,
|
|
27002
|
+
targetPosition: import_react60.Position.Left,
|
|
24824
27003
|
type: "service"
|
|
24825
27004
|
});
|
|
24826
27005
|
if (span.parent_span_id !== null) {
|
|
24827
27006
|
allEdges.push({
|
|
24828
27007
|
animated: false,
|
|
24829
27008
|
id: `e-${span.parent_span_id}-${span.span_id}`,
|
|
24830
|
-
markerEnd: { color: "lightgray", height: 16, type:
|
|
27009
|
+
markerEnd: { color: "lightgray", height: 16, type: import_react60.MarkerType.Arrow, width: 16 },
|
|
24831
27010
|
source: span.parent_span_id,
|
|
24832
27011
|
style: { stroke: "lightgray", strokeWidth: 1 },
|
|
24833
27012
|
target: span.span_id
|
|
@@ -24836,7 +27015,7 @@ var TraceGraph = ({
|
|
|
24836
27015
|
for (const linkedSpanId of span.linked_span_ids ?? []) {
|
|
24837
27016
|
allEdges.push({
|
|
24838
27017
|
id: `e-link-${linkedSpanId}-${span.span_id}`,
|
|
24839
|
-
markerEnd: { color: "lightgray", height: 16, type:
|
|
27018
|
+
markerEnd: { color: "lightgray", height: 16, type: import_react60.MarkerType.Arrow, width: 16 },
|
|
24840
27019
|
source: linkedSpanId,
|
|
24841
27020
|
style: { stroke: "lightgray", strokeWidth: 1 },
|
|
24842
27021
|
// animated: true,
|
|
@@ -24854,12 +27033,12 @@ var TraceGraph = ({
|
|
|
24854
27033
|
setNodes(layoutedNodes);
|
|
24855
27034
|
setEdges(layoutedEdges);
|
|
24856
27035
|
}, [spans.data, initialFocusEventId, setNodes, setEdges]);
|
|
24857
|
-
const theme = (0,
|
|
24858
|
-
return /* @__PURE__ */ (0,
|
|
24859
|
-
spans.error && /* @__PURE__ */ (0,
|
|
24860
|
-
|
|
27036
|
+
const theme = (0, import_material18.useTheme)();
|
|
27037
|
+
return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(import_jsx_runtime140.Fragment, { children: [
|
|
27038
|
+
spans.error && /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
|
|
27039
|
+
import_material18.Alert,
|
|
24861
27040
|
{
|
|
24862
|
-
action: /* @__PURE__ */ (0,
|
|
27041
|
+
action: /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(import_material18.Button, { onClick: () => {
|
|
24863
27042
|
onRefresh();
|
|
24864
27043
|
}, children: "Retry" }),
|
|
24865
27044
|
severity: "error",
|
|
@@ -24870,8 +27049,8 @@ var TraceGraph = ({
|
|
|
24870
27049
|
]
|
|
24871
27050
|
}
|
|
24872
27051
|
),
|
|
24873
|
-
/* @__PURE__ */ (0,
|
|
24874
|
-
|
|
27052
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
|
|
27053
|
+
import_react60.ReactFlow,
|
|
24875
27054
|
{
|
|
24876
27055
|
"data-testid": "trace-graph",
|
|
24877
27056
|
edges,
|
|
@@ -24888,9 +27067,9 @@ var TraceGraph = ({
|
|
|
24888
27067
|
onNodesChange,
|
|
24889
27068
|
selectNodesOnDrag: false,
|
|
24890
27069
|
children: [
|
|
24891
|
-
/* @__PURE__ */ (0,
|
|
24892
|
-
/* @__PURE__ */ (0,
|
|
24893
|
-
|
|
27070
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)(Controls, {}),
|
|
27071
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
27072
|
+
import_react60.Background,
|
|
24894
27073
|
{
|
|
24895
27074
|
bgColor: theme.palette.background.paper,
|
|
24896
27075
|
color: theme.palette.text.disabled
|
|
@@ -24903,7 +27082,7 @@ var TraceGraph = ({
|
|
|
24903
27082
|
};
|
|
24904
27083
|
|
|
24905
27084
|
// src/pages/trace-graph-page.tsx
|
|
24906
|
-
var
|
|
27085
|
+
var import_jsx_runtime141 = require("react/jsx-runtime");
|
|
24907
27086
|
var HEADER_HEIGHT = 56;
|
|
24908
27087
|
var DRAWER_WIDTH = "35%";
|
|
24909
27088
|
var Main = (0, import_styles.styled)("main", { shouldForwardProp: (property) => property !== "open" })(({ open, theme }) => ({
|
|
@@ -24921,7 +27100,7 @@ var Main = (0, import_styles.styled)("main", { shouldForwardProp: (property) =>
|
|
|
24921
27100
|
})
|
|
24922
27101
|
}
|
|
24923
27102
|
}));
|
|
24924
|
-
var StyledDrawer = (0, import_styles.styled)(
|
|
27103
|
+
var StyledDrawer = (0, import_styles.styled)(import_material19.Drawer)(() => ({
|
|
24925
27104
|
"& .MuiDrawer-paper": {
|
|
24926
27105
|
bottom: 0,
|
|
24927
27106
|
boxSizing: "border-box",
|
|
@@ -24951,8 +27130,8 @@ var TraceGraphView = ({
|
|
|
24951
27130
|
traceId
|
|
24952
27131
|
}) => {
|
|
24953
27132
|
const shouldShowStatusMessage = Boolean(statusError) || status?.status === "DISABLED";
|
|
24954
|
-
return /* @__PURE__ */ (0,
|
|
24955
|
-
|
|
27133
|
+
return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)(
|
|
27134
|
+
import_material19.Box,
|
|
24956
27135
|
{
|
|
24957
27136
|
"data-testid": "trace-graph-page",
|
|
24958
27137
|
sx: {
|
|
@@ -24964,14 +27143,14 @@ var TraceGraphView = ({
|
|
|
24964
27143
|
overflow: "hidden"
|
|
24965
27144
|
},
|
|
24966
27145
|
children: [
|
|
24967
|
-
/* @__PURE__ */ (0,
|
|
24968
|
-
/* @__PURE__ */ (0,
|
|
27146
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsxs)(import_material19.Box, { sx: { display: "flex", width: "100%" }, children: [
|
|
27147
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_material19.Button, { onClick: () => {
|
|
24969
27148
|
navigateToSpansList();
|
|
24970
|
-
}, startIcon: /* @__PURE__ */ (0,
|
|
24971
|
-
/* @__PURE__ */ (0,
|
|
27149
|
+
}, startIcon: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_icons_material11.ArrowBack, {}), children: "Go back" }),
|
|
27150
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_material19.Box, { sx: { flexGrow: 1 } })
|
|
24972
27151
|
] }),
|
|
24973
|
-
/* @__PURE__ */ (0,
|
|
24974
|
-
|
|
27152
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
27153
|
+
import_material19.Paper,
|
|
24975
27154
|
{
|
|
24976
27155
|
sx: {
|
|
24977
27156
|
display: "flex",
|
|
@@ -24980,22 +27159,22 @@ var TraceGraphView = ({
|
|
|
24980
27159
|
position: "relative",
|
|
24981
27160
|
width: "100%"
|
|
24982
27161
|
},
|
|
24983
|
-
children: shouldShowStatusMessage ? /* @__PURE__ */ (0,
|
|
27162
|
+
children: shouldShowStatusMessage ? /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
24984
27163
|
StatusMessage,
|
|
24985
27164
|
{
|
|
24986
27165
|
error: statusError,
|
|
24987
27166
|
onRetry: handleRetry,
|
|
24988
27167
|
status
|
|
24989
27168
|
}
|
|
24990
|
-
) : /* @__PURE__ */ (0,
|
|
24991
|
-
/* @__PURE__ */ (0,
|
|
24992
|
-
|
|
27169
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)(import_jsx_runtime141.Fragment, { children: [
|
|
27170
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(Main, { open, children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
27171
|
+
import_material19.Box,
|
|
24993
27172
|
{
|
|
24994
27173
|
sx: {
|
|
24995
27174
|
height: "100%",
|
|
24996
27175
|
overflow: "auto"
|
|
24997
27176
|
},
|
|
24998
|
-
children: traceId !== void 0 && /* @__PURE__ */ (0,
|
|
27177
|
+
children: traceId !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_react62.ReactFlowProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
24999
27178
|
TraceGraph,
|
|
25000
27179
|
{
|
|
25001
27180
|
initialFocusEventId: spanId,
|
|
@@ -25012,7 +27191,7 @@ var TraceGraphView = ({
|
|
|
25012
27191
|
) })
|
|
25013
27192
|
}
|
|
25014
27193
|
) }),
|
|
25015
|
-
/* @__PURE__ */ (0,
|
|
27194
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(StyledDrawer, { anchor: "right", open, variant: "persistent", children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(EventDetails, { onClose: handleClose, selectedEvent }) })
|
|
25016
27195
|
] })
|
|
25017
27196
|
}
|
|
25018
27197
|
)
|
|
@@ -25029,7 +27208,7 @@ async function fetchConnectedTraces(api, traceIds, allSpans = /* @__PURE__ */ ne
|
|
|
25029
27208
|
const traceResponses = await Promise.all(
|
|
25030
27209
|
newTraceIds.map((id2) => api.getSpans({ trace_id: id2 }))
|
|
25031
27210
|
);
|
|
25032
|
-
const currentBatchSpans = traceResponses.flatMap((
|
|
27211
|
+
const currentBatchSpans = traceResponses.flatMap((r3) => r3.spans);
|
|
25033
27212
|
const currentSpanIds = currentBatchSpans.map((s2) => s2.span_id);
|
|
25034
27213
|
for (const span of currentBatchSpans) {
|
|
25035
27214
|
allSpans.set(span.span_id, span);
|
|
@@ -25056,10 +27235,10 @@ async function fetchConnectedTraces(api, traceIds, allSpans = /* @__PURE__ */ ne
|
|
|
25056
27235
|
}
|
|
25057
27236
|
var TraceGraphPage = ({ onClose, spanId, traceId }) => {
|
|
25058
27237
|
const api = useAppInspectorApi();
|
|
25059
|
-
const [spans, setSpans] = (0,
|
|
25060
|
-
const [loading, setLoading] = (0,
|
|
25061
|
-
const [fetchError, setFetchError] = (0,
|
|
25062
|
-
const fetchSpans = (0,
|
|
27238
|
+
const [spans, setSpans] = (0, import_react63.useState)();
|
|
27239
|
+
const [loading, setLoading] = (0, import_react63.useState)(false);
|
|
27240
|
+
const [fetchError, setFetchError] = (0, import_react63.useState)();
|
|
27241
|
+
const fetchSpans = (0, import_react63.useCallback)(async () => {
|
|
25063
27242
|
setLoading(true);
|
|
25064
27243
|
try {
|
|
25065
27244
|
const spans2 = await fetchConnectedTraces(api, [traceId]);
|
|
@@ -25072,31 +27251,31 @@ var TraceGraphPage = ({ onClose, spanId, traceId }) => {
|
|
|
25072
27251
|
setLoading(false);
|
|
25073
27252
|
}
|
|
25074
27253
|
}, [api, traceId]);
|
|
25075
|
-
(0,
|
|
27254
|
+
(0, import_react63.useEffect)(() => {
|
|
25076
27255
|
void fetchSpans();
|
|
25077
27256
|
}, [fetchSpans]);
|
|
25078
|
-
const [open, setOpen] = (0,
|
|
25079
|
-
const [selectedEvent, setSelectedEvent] = (0,
|
|
25080
|
-
const spansReference = (0,
|
|
25081
|
-
(0,
|
|
27257
|
+
const [open, setOpen] = (0, import_react63.useState)(true);
|
|
27258
|
+
const [selectedEvent, setSelectedEvent] = (0, import_react63.useState)(() => spans?.find((span) => span.span_id === spanId));
|
|
27259
|
+
const spansReference = (0, import_react63.useRef)();
|
|
27260
|
+
(0, import_react63.useEffect)(() => {
|
|
25082
27261
|
if (!spansReference.current && spans) {
|
|
25083
27262
|
setSelectedEvent(spans.find((span) => span.span_id === spanId));
|
|
25084
27263
|
spansReference.current = spans;
|
|
25085
27264
|
}
|
|
25086
27265
|
}, [spans, setSelectedEvent, spanId]);
|
|
25087
27266
|
const { checkStatus, error: statusError, status } = useStatus();
|
|
25088
|
-
const handleEventSelect = (0,
|
|
27267
|
+
const handleEventSelect = (0, import_react63.useCallback)((spanId2) => {
|
|
25089
27268
|
const span = spans?.find((s2) => s2.span_id === spanId2);
|
|
25090
27269
|
setSelectedEvent(span);
|
|
25091
27270
|
setOpen(true);
|
|
25092
27271
|
}, [spans]);
|
|
25093
|
-
const handleRetry = (0,
|
|
27272
|
+
const handleRetry = (0, import_react63.useCallback)(() => {
|
|
25094
27273
|
void checkStatus();
|
|
25095
27274
|
}, [checkStatus]);
|
|
25096
|
-
const navigateToSpansList = (0,
|
|
27275
|
+
const navigateToSpansList = (0, import_react63.useCallback)(() => {
|
|
25097
27276
|
onClose?.();
|
|
25098
27277
|
}, [onClose]);
|
|
25099
|
-
return /* @__PURE__ */ (0,
|
|
27278
|
+
return /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
25100
27279
|
TraceGraphView,
|
|
25101
27280
|
{
|
|
25102
27281
|
fetchError,
|
|
@@ -25120,7 +27299,7 @@ var TraceGraphPage = ({ onClose, spanId, traceId }) => {
|
|
|
25120
27299
|
};
|
|
25121
27300
|
|
|
25122
27301
|
// src/pages/spans-list-page.tsx
|
|
25123
|
-
var
|
|
27302
|
+
var import_jsx_runtime142 = require("react/jsx-runtime");
|
|
25124
27303
|
var SpansListPage = () => {
|
|
25125
27304
|
const {
|
|
25126
27305
|
checkStatus,
|
|
@@ -25139,23 +27318,23 @@ var SpansListPage = () => {
|
|
|
25139
27318
|
streamPaused,
|
|
25140
27319
|
toggleStream
|
|
25141
27320
|
} = useSpans();
|
|
25142
|
-
const clearSpansSync = (0,
|
|
27321
|
+
const clearSpansSync = (0, import_react64.useCallback)(() => {
|
|
25143
27322
|
void clearSpans();
|
|
25144
27323
|
}, [clearSpans]);
|
|
25145
27324
|
const [order2, setOrder] = useLocalStorage("spans-order", "oldest_first");
|
|
25146
|
-
const [selectedTraceId, setSelectedTraceId] = (0,
|
|
25147
|
-
const [selectedSpanId, setSelectedSpanId] = (0,
|
|
25148
|
-
const navigateToSpan = (0,
|
|
27325
|
+
const [selectedTraceId, setSelectedTraceId] = (0, import_react64.useState)();
|
|
27326
|
+
const [selectedSpanId, setSelectedSpanId] = (0, import_react64.useState)();
|
|
27327
|
+
const navigateToSpan = (0, import_react64.useCallback)((span) => {
|
|
25149
27328
|
setSelectedTraceId(span.trace_id);
|
|
25150
27329
|
setSelectedSpanId(span.span_id);
|
|
25151
27330
|
}, []);
|
|
25152
|
-
const handleRetry = (0,
|
|
27331
|
+
const handleRetry = (0, import_react64.useCallback)(() => {
|
|
25153
27332
|
void checkStatus();
|
|
25154
27333
|
}, [checkStatus]);
|
|
25155
27334
|
const shouldShowStatusMessage = Boolean(statusError) || status?.status === "DISABLED";
|
|
25156
|
-
return /* @__PURE__ */ (0,
|
|
25157
|
-
/* @__PURE__ */ (0,
|
|
25158
|
-
|
|
27335
|
+
return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(import_jsx_runtime142.Fragment, { children: [
|
|
27336
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
27337
|
+
import_material20.Box,
|
|
25159
27338
|
{
|
|
25160
27339
|
"data-testid": "spans-list-page",
|
|
25161
27340
|
sx: {
|
|
@@ -25169,14 +27348,14 @@ var SpansListPage = () => {
|
|
|
25169
27348
|
visibility: selectedTraceId === void 0 ? "visible" : "hidden",
|
|
25170
27349
|
width: "100%"
|
|
25171
27350
|
},
|
|
25172
|
-
children: shouldShowStatusMessage ? /* @__PURE__ */ (0,
|
|
27351
|
+
children: shouldShowStatusMessage ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
25173
27352
|
StatusMessage,
|
|
25174
27353
|
{
|
|
25175
27354
|
error: statusError,
|
|
25176
27355
|
onRetry: handleRetry,
|
|
25177
27356
|
status
|
|
25178
27357
|
}
|
|
25179
|
-
) : /* @__PURE__ */ (0,
|
|
27358
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
25180
27359
|
SpansList,
|
|
25181
27360
|
{
|
|
25182
27361
|
clearingSpans,
|
|
@@ -25198,7 +27377,7 @@ var SpansListPage = () => {
|
|
|
25198
27377
|
)
|
|
25199
27378
|
}
|
|
25200
27379
|
),
|
|
25201
|
-
selectedTraceId !== void 0 && /* @__PURE__ */ (0,
|
|
27380
|
+
selectedTraceId !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(TraceGraphPage, { onClose: () => {
|
|
25202
27381
|
setSelectedTraceId(void 0);
|
|
25203
27382
|
}, spanId: selectedSpanId, traceId: selectedTraceId })
|
|
25204
27383
|
] });
|
|
@@ -25215,6 +27394,28 @@ var pages = {
|
|
|
25215
27394
|
};
|
|
25216
27395
|
/*! Bundled license information:
|
|
25217
27396
|
|
|
27397
|
+
use-sync-external-store/cjs/use-sync-external-store-shim.development.js:
|
|
27398
|
+
(**
|
|
27399
|
+
* @license React
|
|
27400
|
+
* use-sync-external-store-shim.development.js
|
|
27401
|
+
*
|
|
27402
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
27403
|
+
*
|
|
27404
|
+
* This source code is licensed under the MIT license found in the
|
|
27405
|
+
* LICENSE file in the root directory of this source tree.
|
|
27406
|
+
*)
|
|
27407
|
+
|
|
27408
|
+
use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js:
|
|
27409
|
+
(**
|
|
27410
|
+
* @license React
|
|
27411
|
+
* use-sync-external-store-shim/with-selector.development.js
|
|
27412
|
+
*
|
|
27413
|
+
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
27414
|
+
*
|
|
27415
|
+
* This source code is licensed under the MIT license found in the
|
|
27416
|
+
* LICENSE file in the root directory of this source tree.
|
|
27417
|
+
*)
|
|
27418
|
+
|
|
25218
27419
|
@tanstack/table-core/build/lib/index.mjs:
|
|
25219
27420
|
(**
|
|
25220
27421
|
* table-core
|