adonisjs-server-stats 1.9.0 → 1.10.0

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.
Files changed (80) hide show
  1. package/dist/core/index.js +24 -22
  2. package/dist/core/split-pane.d.ts +18 -0
  3. package/dist/core/trace-utils.d.ts +5 -0
  4. package/dist/core/types.d.ts +1 -1
  5. package/dist/react/{CacheSection-xH75hwXu.js → CacheSection-UCMptWyn.js} +1 -1
  6. package/dist/react/{CacheTab-DYmsZJJ1.js → CacheTab-CA8LB1J5.js} +1 -1
  7. package/dist/react/{ConfigSection-D8BO1Ry9.js → ConfigSection-DfFd-WRq.js} +1 -1
  8. package/dist/react/{ConfigTab-CcN-tfjv.js → ConfigTab-Bdg8YMer.js} +1 -1
  9. package/dist/react/{CustomPaneTab-D7_o3Ec6.js → CustomPaneTab-Bxtv_8Rw.js} +1 -1
  10. package/dist/react/{EmailsSection-BzlsTdPs.js → EmailsSection-CM7stSyh.js} +1 -1
  11. package/dist/react/{EmailsTab-Uh2CQY3o.js → EmailsTab-BDhEiomM.js} +1 -1
  12. package/dist/react/{EventsSection-CGQWiIdV.js → EventsSection-ByQ-9blq.js} +1 -1
  13. package/dist/react/{EventsTab-CC6DQzEm.js → EventsTab-CMfY98Rl.js} +1 -1
  14. package/dist/react/{JobsSection-D7AHQmZi.js → JobsSection-DF3qEv9O.js} +1 -1
  15. package/dist/react/{JobsTab-B3Lfdqed.js → JobsTab-BbrBWIOb.js} +1 -1
  16. package/dist/react/{LogsSection-Cly1dpvS.js → LogsSection-DcFTZY7b.js} +1 -1
  17. package/dist/react/{LogsTab-BbYK-iyh.js → LogsTab-CicucmVk.js} +2 -2
  18. package/dist/react/{OverviewSection-CkBGFEWq.js → OverviewSection-C4T1ur51.js} +1 -1
  19. package/dist/react/{QueriesSection-CfCpnNUD.js → QueriesSection-PswteoF9.js} +1 -1
  20. package/dist/react/{QueriesTab-DbBmAqzO.js → QueriesTab-osLUWd4L.js} +1 -1
  21. package/dist/react/RelatedLogs-DFDOyUMr.js +40 -0
  22. package/dist/react/RequestsSection-Nag30rEA.js +341 -0
  23. package/dist/react/{RoutesSection-CRqF-cNM.js → RoutesSection-BUSkM6PY.js} +1 -1
  24. package/dist/react/{RoutesTab-Bwreij3e.js → RoutesTab-DgVzd2PZ.js} +1 -1
  25. package/dist/react/TimelineTab-Covg5weo.js +220 -0
  26. package/dist/react/{index-CecA4IdQ.js → index-Cflz9Ebj.js} +197 -203
  27. package/dist/react/index.js +1 -1
  28. package/dist/react/react/components/shared/RelatedLogs.d.ts +7 -0
  29. package/dist/react/style.css +1 -1
  30. package/dist/src/controller/debug_controller.js +1 -1
  31. package/dist/src/dashboard/dashboard_controller.js +13 -0
  32. package/dist/src/dashboard/dashboard_store.d.ts +1 -0
  33. package/dist/src/dashboard/dashboard_store.js +88 -41
  34. package/dist/src/dashboard/migrator.js +6 -0
  35. package/dist/src/data/data_access.d.ts +7 -0
  36. package/dist/src/data/data_access.js +32 -1
  37. package/dist/src/debug/trace_collector.d.ts +1 -1
  38. package/dist/src/debug/trace_collector.js +2 -1
  39. package/dist/src/debug/types.d.ts +4 -0
  40. package/dist/src/edge/client/dashboard.js +2 -2
  41. package/dist/src/edge/client/debug-panel-deferred.js +1 -1
  42. package/dist/src/edge/client-vue/dashboard.js +4 -4
  43. package/dist/src/edge/client-vue/debug-panel-deferred.js +3 -3
  44. package/dist/src/middleware/request_tracking_middleware.d.ts +1 -0
  45. package/dist/src/middleware/request_tracking_middleware.js +3 -1
  46. package/dist/src/provider/server_stats_provider.d.ts +3 -3
  47. package/dist/src/provider/server_stats_provider.js +29 -15
  48. package/dist/src/routes/register_routes.js +7 -2
  49. package/dist/src/styles/components.css +81 -0
  50. package/dist/src/styles/debug-panel.css +9 -0
  51. package/dist/src/types.d.ts +1 -1
  52. package/dist/vue/{CacheSection-Cx-hj09X.js → CacheSection-oFAJL3mo.js} +1 -1
  53. package/dist/vue/{ConfigSection-CMXyryf6.js → ConfigSection-BhfJ4KqL.js} +1 -1
  54. package/dist/vue/{EmailsSection-DgKl9xGT.js → EmailsSection-BcNyhyHs.js} +1 -1
  55. package/dist/vue/{EventsSection-BNMCAim1.js → EventsSection-r60Q5Lmu.js} +1 -1
  56. package/dist/vue/{JobsSection-CCMgMlxd.js → JobsSection-BHL-hkQw.js} +1 -1
  57. package/dist/vue/{LogsSection-CvOnTxUu.js → LogsSection-DRMGzJmg.js} +1 -1
  58. package/dist/vue/{OverviewSection-CHgaKtUR.js → OverviewSection-CXh6Ja1B.js} +1 -1
  59. package/dist/vue/{QueriesSection-BnHRD98z.js → QueriesSection-IodIsCJ-.js} +1 -1
  60. package/dist/vue/RelatedLogs.vue_vue_type_script_setup_true_lang-CB2_TzYW.js +84 -0
  61. package/dist/vue/RequestsSection-BPuMdmMc.js +401 -0
  62. package/dist/vue/{RoutesSection-BrceOcKQ.js → RoutesSection-NKo3Rbq3.js} +1 -1
  63. package/dist/vue/TimelineTab-zj5Z5OdT.js +338 -0
  64. package/dist/vue/components/Dashboard/sections/RequestsSection.vue.d.ts +4 -0
  65. package/dist/vue/components/DebugPanel/tabs/TimelineTab.vue.d.ts +4 -0
  66. package/dist/vue/components/{Dashboard/sections/TimelineSection.vue.d.ts → shared/RelatedLogs.vue.d.ts} +5 -6
  67. package/dist/vue/index-Dtgysd26.js +1229 -0
  68. package/dist/vue/index.js +1 -1
  69. package/dist/vue/style.css +1 -1
  70. package/package.json +1 -1
  71. package/dist/react/RequestsSection-Cb5a6MlT.js +0 -209
  72. package/dist/react/TimelineSection-B2y06kRE.js +0 -158
  73. package/dist/react/TimelineTab-6hthfdBB.js +0 -193
  74. package/dist/react/WaterfallChart-Cj73WdfM.js +0 -100
  75. package/dist/react/react/components/Dashboard/sections/TimelineSection.d.ts +0 -8
  76. package/dist/vue/RequestsSection-B-uSlM0f.js +0 -243
  77. package/dist/vue/TimelineSection-CfvnA2Oo.js +0 -186
  78. package/dist/vue/TimelineTab-Db6lKKsD.js +0 -250
  79. package/dist/vue/WaterfallChart.vue_vue_type_script_setup_true_lang-tZ13cNj1.js +0 -118
  80. package/dist/vue/index-oLxS08vN.js +0 -1235
@@ -1,158 +0,0 @@
1
- import { jsx as a, jsxs as t, Fragment as T } from "react/jsx-runtime";
2
- import { useState as n, useEffect as B, useCallback as L } from "react";
3
- import { normalizeTraceFields as P, durationSeverity as f, timeAgo as A, formatTime as E } from "adonisjs-server-stats/core";
4
- import { u as M } from "./useApiClient-BVtNCmnL.js";
5
- import { a as $, M as g, b } from "./index-CecA4IdQ.js";
6
- import { D as j } from "./DataTable-YyShr5B-.js";
7
- import { F as z } from "./FilterBar-DQRXpWrb.js";
8
- import { P as I } from "./Pagination-BkmzUDY8.js";
9
- import { W as R } from "./WaterfallChart-Cj73WdfM.js";
10
- function Q({ options: s = {}, tracingEnabled: y = !0 }) {
11
- const [w, v] = n(1), [i, k] = n(""), [r, o] = n(null), [c, h] = n(null), [x, d] = n(!1), { data: m, meta: l, isLoading: C, error: N } = $("traces", { ...s, page: w, search: i }), D = m || [], u = M(s.baseUrl || "", s.authToken);
12
- B(() => {
13
- if (!r) {
14
- h(null);
15
- return;
16
- }
17
- let e = !1;
18
- d(!0);
19
- const S = s.dashboardEndpoint || "/__stats/api";
20
- return u().fetch(`${S}/traces/${r}`).then((F) => {
21
- e || (h(F), d(!1));
22
- }).catch(() => {
23
- e || d(!1);
24
- }), () => {
25
- e = !0;
26
- };
27
- }, [r, u, s.dashboardEndpoint]);
28
- const p = L(() => o(null), []);
29
- if (!y)
30
- return /* @__PURE__ */ a("div", { className: "ss-dash-empty", children: "Tracing is not enabled. Enable tracing in your server-stats config to use the timeline." });
31
- if (r && c) {
32
- const e = P(c);
33
- return /* @__PURE__ */ t("div", { children: [
34
- /* @__PURE__ */ t("div", { className: "ss-dash-tl-detail-header", children: [
35
- /* @__PURE__ */ a("button", { type: "button", className: "ss-dash-btn", onClick: p, children: "← Back" }),
36
- /* @__PURE__ */ a(g, { method: e.method }),
37
- /* @__PURE__ */ a("span", { style: { color: "var(--ss-text)" }, children: e.url }),
38
- /* @__PURE__ */ a(b, { code: e.statusCode }),
39
- /* @__PURE__ */ t("span", { className: "ss-dash-tl-meta", children: [
40
- e.totalDuration.toFixed(1),
41
- "ms · ",
42
- e.spanCount,
43
- " spans"
44
- ] })
45
- ] }),
46
- /* @__PURE__ */ a(
47
- R,
48
- {
49
- spans: e.spans,
50
- totalDuration: e.totalDuration,
51
- warnings: e.warnings
52
- }
53
- )
54
- ] });
55
- }
56
- return r && x ? /* @__PURE__ */ t("div", { children: [
57
- /* @__PURE__ */ a("div", { className: "ss-dash-tl-detail-header", children: /* @__PURE__ */ a("button", { type: "button", className: "ss-dash-btn", onClick: p, children: "← Back" }) }),
58
- /* @__PURE__ */ a("div", { className: "ss-dash-empty", children: "Loading trace detail..." })
59
- ] }) : /* @__PURE__ */ t("div", { children: [
60
- /* @__PURE__ */ a(
61
- z,
62
- {
63
- search: i,
64
- onSearchChange: k,
65
- placeholder: "Filter traces...",
66
- summary: `${l?.total ?? 0} traces`
67
- }
68
- ),
69
- N && /* @__PURE__ */ a("div", { className: "ss-dash-empty", children: "Failed to load traces" }),
70
- C && !m ? /* @__PURE__ */ a("div", { className: "ss-dash-empty", children: "Loading traces..." }) : /* @__PURE__ */ t(T, { children: [
71
- /* @__PURE__ */ a("div", { className: "ss-dash-table-wrap", children: /* @__PURE__ */ a(
72
- j,
73
- {
74
- columns: [
75
- {
76
- key: "id",
77
- label: "#",
78
- width: "40px",
79
- render: (e) => /* @__PURE__ */ a("span", { style: { color: "var(--ss-dim)" }, children: e })
80
- },
81
- {
82
- key: "method",
83
- label: "Method",
84
- width: "70px",
85
- render: (e) => /* @__PURE__ */ a(g, { method: e })
86
- },
87
- {
88
- key: "url",
89
- label: "URL",
90
- render: (e) => /* @__PURE__ */ a(
91
- "span",
92
- {
93
- style: {
94
- color: "var(--ss-text)",
95
- overflow: "hidden",
96
- textOverflow: "ellipsis",
97
- whiteSpace: "nowrap"
98
- },
99
- title: e,
100
- children: e
101
- }
102
- )
103
- },
104
- {
105
- key: "statusCode",
106
- label: "Status",
107
- width: "60px",
108
- render: (e) => /* @__PURE__ */ a(b, { code: e })
109
- },
110
- {
111
- key: "totalDuration",
112
- label: "Duration",
113
- width: "80px",
114
- render: (e) => /* @__PURE__ */ t(
115
- "span",
116
- {
117
- className: `ss-dash-duration ${f(e) === "very-slow" ? "ss-dash-very-slow" : f(e) === "slow" ? "ss-dash-slow" : ""}`,
118
- children: [
119
- e.toFixed(1),
120
- "ms"
121
- ]
122
- }
123
- )
124
- },
125
- {
126
- key: "spanCount",
127
- label: "Spans",
128
- width: "50px",
129
- render: (e) => /* @__PURE__ */ a("span", { style: { color: "var(--ss-muted)", textAlign: "center" }, children: e })
130
- },
131
- {
132
- key: "createdAt",
133
- label: "Time",
134
- width: "80px",
135
- render: (e) => /* @__PURE__ */ a("span", { className: "ss-dash-event-time", title: E(e), children: A(e) })
136
- }
137
- ],
138
- data: D,
139
- onRowClick: (e) => o(e.id),
140
- emptyMessage: "No traces recorded"
141
- }
142
- ) }),
143
- l && /* @__PURE__ */ a(
144
- I,
145
- {
146
- page: l.page,
147
- lastPage: l.lastPage,
148
- total: l.total,
149
- onPageChange: v
150
- }
151
- )
152
- ] })
153
- ] });
154
- }
155
- export {
156
- Q as TimelineSection,
157
- Q as default
158
- };
@@ -1,193 +0,0 @@
1
- import { jsx as e, jsxs as l } from "react/jsx-runtime";
2
- import { useState as r, useMemo as B, useEffect as I, useCallback as C } from "react";
3
- import { formatDuration as u, durationSeverity as D, timeAgo as O, formatTime as j } from "adonisjs-server-stats/core";
4
- import { u as F } from "./useApiClient-BVtNCmnL.js";
5
- import { u as U } from "./index-CecA4IdQ.js";
6
- import { u as _ } from "./useResizableTable-CNJmACdt.js";
7
- const L = {
8
- request: "#1e3a5f",
9
- middleware: "rgba(30, 58, 95, 0.7)",
10
- db: "#6d28d9",
11
- view: "#0e7490",
12
- mail: "#059669",
13
- event: "#b45309",
14
- custom: "#525252"
15
- }, z = [
16
- { label: "Request", color: "#1e3a5f" },
17
- { label: "Middleware", color: "rgba(30, 58, 95, 0.7)" },
18
- { label: "Database", color: "#6d28d9" },
19
- { label: "View", color: "#0e7490" },
20
- { label: "Mail", color: "#059669" },
21
- { label: "Event", color: "#b45309" }
22
- ];
23
- function P({ options: p }) {
24
- const { baseUrl: E = "", debugEndpoint: f = "/admin/api/debug", authToken: $ } = p || {}, { data: h, isLoading: S, error: N } = U("timeline", p), [i, T] = r(""), [n, m] = r(null), [a, v] = r(null), [k, b] = r(!1), [w, g] = r(null), c = B(() => {
25
- const s = h?.traces || [];
26
- if (!i) return s;
27
- const d = i.toLowerCase();
28
- return s.filter(
29
- (t) => t.url.toLowerCase().includes(d) || t.method.toLowerCase().includes(d) || String(t.statusCode).includes(d)
30
- );
31
- }, [h, i]), y = F(E, $);
32
- I(() => {
33
- if (n === null) {
34
- v(null), g(null);
35
- return;
36
- }
37
- let s = !1;
38
- return b(!0), g(null), y().get(`${f}/traces/${n}`).then((t) => {
39
- s || (v(t), b(!1));
40
- }).catch((t) => {
41
- s || (g(t instanceof Error ? t.message : "Failed to load trace"), b(!1));
42
- }), () => {
43
- s = !0;
44
- };
45
- }, [n, f, y]);
46
- const M = C((s) => {
47
- m((d) => d === s ? null : s);
48
- }, []), x = C((s) => s >= 500 ? "ss-dbg-status-5xx" : s >= 400 ? "ss-dbg-status-4xx" : s >= 300 ? "ss-dbg-status-3xx" : "ss-dbg-status-2xx", []), R = _([c]);
49
- if (S && !h)
50
- return /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Loading traces..." });
51
- if (N)
52
- return /* @__PURE__ */ l("div", { className: "ss-dbg-empty", children: [
53
- "Error: ",
54
- N.message
55
- ] });
56
- if (n !== null) {
57
- if (k)
58
- return /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Loading trace detail..." });
59
- if (w)
60
- return /* @__PURE__ */ l("div", { children: [
61
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-detail-header", children: /* @__PURE__ */ e(
62
- "button",
63
- {
64
- type: "button",
65
- className: "ss-dbg-btn-clear",
66
- onClick: () => m(null),
67
- children: "← Back"
68
- }
69
- ) }),
70
- /* @__PURE__ */ l("div", { className: "ss-dbg-empty", children: [
71
- "Error: ",
72
- w
73
- ] })
74
- ] });
75
- if (!a)
76
- return /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Loading trace detail..." });
77
- const s = a.spans || [], d = a.warnings || [];
78
- return /* @__PURE__ */ l("div", { children: [
79
- /* @__PURE__ */ l("div", { className: "ss-dbg-tl-detail-header", children: [
80
- /* @__PURE__ */ e(
81
- "button",
82
- {
83
- type: "button",
84
- className: "ss-dbg-btn-clear",
85
- onClick: () => m(null),
86
- children: "← Back"
87
- }
88
- ),
89
- /* @__PURE__ */ e("span", { className: `ss-dbg-method ss-dbg-method-${a.method.toLowerCase()}`, children: a.method }),
90
- /* @__PURE__ */ e("span", { className: "ss-dbg-tl-detail-url", children: a.url }),
91
- /* @__PURE__ */ e("span", { className: `ss-dbg-status ${x(a.statusCode)}`, children: a.statusCode }),
92
- /* @__PURE__ */ l("span", { className: "ss-dbg-tl-meta", children: [
93
- u(a.totalDuration),
94
- " · ",
95
- a.spanCount,
96
- " spans"
97
- ] })
98
- ] }),
99
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-legend", children: z.map((t) => /* @__PURE__ */ l("div", { className: "ss-dbg-tl-legend-item", children: [
100
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-legend-dot", style: { background: t.color } }),
101
- /* @__PURE__ */ e("span", { children: t.label })
102
- ] }, t.label)) }),
103
- /* @__PURE__ */ e("div", { style: { padding: "8px 12px", overflow: "auto" }, children: s.length === 0 ? /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "No spans captured for this request" }) : s.map((t) => {
104
- const o = a.totalDuration || 1, A = t.startOffset / o * 100, q = Math.max(t.duration / o * 100, 0.5);
105
- return /* @__PURE__ */ l("div", { className: "ss-dbg-tl-row", children: [
106
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-label", title: t.label, children: t.label }),
107
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-track", children: /* @__PURE__ */ e(
108
- "div",
109
- {
110
- className: `ss-dbg-tl-bar ss-dbg-tl-bar-${t.category}`,
111
- style: {
112
- left: `${A}%`,
113
- width: `${q}%`,
114
- background: L[t.category] || L.custom
115
- },
116
- title: `${t.label}: ${u(t.duration)}`
117
- }
118
- ) }),
119
- /* @__PURE__ */ e("span", { className: "ss-dbg-tl-dur", children: u(t.duration) })
120
- ] }, t.id);
121
- }) }),
122
- d.length > 0 && /* @__PURE__ */ l("div", { className: "ss-dbg-tl-warnings", children: [
123
- /* @__PURE__ */ e("div", { className: "ss-dbg-tl-warnings-title", children: "Warnings" }),
124
- d.map((t, o) => /* @__PURE__ */ e("div", { className: "ss-dbg-tl-warning", children: t }, o))
125
- ] })
126
- ] });
127
- }
128
- return /* @__PURE__ */ l("div", { children: [
129
- /* @__PURE__ */ l("div", { className: "ss-dbg-search-bar", children: [
130
- /* @__PURE__ */ e(
131
- "input",
132
- {
133
- type: "text",
134
- className: "ss-dbg-search",
135
- placeholder: "Filter traces...",
136
- value: i,
137
- onChange: (s) => T(s.target.value)
138
- }
139
- ),
140
- /* @__PURE__ */ l("span", { className: "ss-dbg-summary", children: [
141
- c.length,
142
- " traces"
143
- ] })
144
- ] }),
145
- c.length === 0 ? /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "No traces captured. Enable tracing in config." }) : /* @__PURE__ */ l("table", { ref: R, className: "ss-dbg-table", children: [
146
- /* @__PURE__ */ l("colgroup", { children: [
147
- /* @__PURE__ */ e("col", { style: { width: "50px" } }),
148
- /* @__PURE__ */ e("col", { style: { width: "70px" } }),
149
- /* @__PURE__ */ e("col", {}),
150
- /* @__PURE__ */ e("col", { style: { width: "60px" } }),
151
- /* @__PURE__ */ e("col", { style: { width: "80px" } }),
152
- /* @__PURE__ */ e("col", { style: { width: "50px" } }),
153
- /* @__PURE__ */ e("col", { style: { width: "80px" } })
154
- ] }),
155
- /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ l("tr", { children: [
156
- /* @__PURE__ */ e("th", { children: "#" }),
157
- /* @__PURE__ */ e("th", { children: "Method" }),
158
- /* @__PURE__ */ e("th", { children: "URL" }),
159
- /* @__PURE__ */ e("th", { children: "Status" }),
160
- /* @__PURE__ */ e("th", { children: "Duration" }),
161
- /* @__PURE__ */ e("th", { children: "Spans" }),
162
- /* @__PURE__ */ e("th", { children: "Time" })
163
- ] }) }),
164
- /* @__PURE__ */ e("tbody", { children: c.map((s) => /* @__PURE__ */ l(
165
- "tr",
166
- {
167
- className: "ss-dbg-email-row",
168
- onClick: () => M(s.id),
169
- children: [
170
- /* @__PURE__ */ e("td", { className: "ss-dbg-c-dim", style: { whiteSpace: "nowrap" }, children: s.id }),
171
- /* @__PURE__ */ e("td", { children: /* @__PURE__ */ e("span", { className: `ss-dbg-method ss-dbg-method-${s.method.toLowerCase()}`, children: s.method }) }),
172
- /* @__PURE__ */ e("td", { title: s.url, children: s.url }),
173
- /* @__PURE__ */ e("td", { children: /* @__PURE__ */ e("span", { className: `ss-dbg-status ${x(s.statusCode)}`, children: s.statusCode }) }),
174
- /* @__PURE__ */ e(
175
- "td",
176
- {
177
- className: `ss-dbg-duration ${D(s.totalDuration) === "very-slow" ? "ss-dbg-very-slow" : D(s.totalDuration) === "slow" ? "ss-dbg-slow" : ""}`,
178
- children: u(s.totalDuration)
179
- }
180
- ),
181
- /* @__PURE__ */ e("td", { className: "ss-dbg-c-muted", style: { textAlign: "center" }, children: s.spanCount }),
182
- /* @__PURE__ */ e("td", { className: "ss-dbg-event-time", title: j(s.timestamp), children: O(s.timestamp) })
183
- ]
184
- },
185
- s.id
186
- )) })
187
- ] })
188
- ] });
189
- }
190
- export {
191
- P as TimelineTab,
192
- P as default
193
- };
@@ -1,100 +0,0 @@
1
- import { jsx as t, jsxs as a } from "react/jsx-runtime";
2
- import { useMemo as n } from "react";
3
- const h = {
4
- request: "#1e3a5f",
5
- middleware: "rgba(30, 58, 95, 0.7)",
6
- db: "#6d28d9",
7
- view: "#0e7490",
8
- mail: "#059669",
9
- event: "#b45309",
10
- custom: "var(--ss-dim)"
11
- }, x = {
12
- request: "Request",
13
- middleware: "Middleware",
14
- db: "DB",
15
- mail: "Mail",
16
- event: "Event",
17
- view: "View",
18
- custom: "Custom"
19
- };
20
- function C({
21
- spans: b,
22
- totalDuration: d,
23
- className: g = "",
24
- warnings: l
25
- }) {
26
- const i = b || [], c = n(
27
- () => [...i].sort((e, s) => e.startOffset - s.startOffset),
28
- [i]
29
- ), u = n(() => {
30
- const e = {};
31
- for (const s of c)
32
- e[s.id] = s.parentId ? (e[s.parentId] || 0) + 1 : 0;
33
- return e;
34
- }, [c]);
35
- return i.length === 0 ? /* @__PURE__ */ t("div", { className: "ss-dash-empty", children: "No spans recorded" }) : /* @__PURE__ */ a("div", { className: `ss-dash-tl-waterfall ${g}`, children: [
36
- /* @__PURE__ */ t("div", { className: "ss-dash-tl-legend", children: Object.entries(x).map(([e, s]) => /* @__PURE__ */ a("div", { className: "ss-dash-tl-legend-item", children: [
37
- /* @__PURE__ */ t(
38
- "span",
39
- {
40
- className: "ss-dash-tl-legend-dot",
41
- style: {
42
- background: h[e] || h.custom
43
- }
44
- }
45
- ),
46
- /* @__PURE__ */ t("span", { children: s })
47
- ] }, e)) }),
48
- c.map((e) => {
49
- const s = d > 0 ? e.startOffset / d * 100 : 0, f = d > 0 ? Math.max(e.duration / d * 100, 0.5) : 1, v = u[e.id] || 0, N = e.label.length > 50 ? e.label.slice(0, 50) + "..." : e.label, y = e.category === "db" ? "DB" : e.category, $ = e.category === "db" ? "purple" : e.category === "mail" ? "green" : e.category === "event" ? "amber" : e.category === "view" ? "blue" : "muted", o = e.metadata ? Object.entries(e.metadata).filter(([, r]) => r != null).map(([r, w]) => `${r}=${w}`).join(", ") : "", m = o ? `${e.label} (${e.duration.toFixed(2)}ms)
50
- ${o}` : `${e.label} (${e.duration.toFixed(2)}ms)`;
51
- return /* @__PURE__ */ a("div", { className: "ss-dash-tl-row", children: [
52
- /* @__PURE__ */ a(
53
- "div",
54
- {
55
- className: "ss-dash-tl-label",
56
- title: m,
57
- style: { paddingLeft: 8 + v * 16 + "px" },
58
- children: [
59
- /* @__PURE__ */ t(
60
- "span",
61
- {
62
- className: `ss-dash-badge ss-dash-badge-${$}`,
63
- style: { fontSize: "9px", marginRight: "4px" },
64
- children: y
65
- }
66
- ),
67
- N
68
- ]
69
- }
70
- ),
71
- /* @__PURE__ */ t("div", { className: "ss-dash-tl-track", children: /* @__PURE__ */ t(
72
- "div",
73
- {
74
- className: `ss-dash-tl-bar ss-dash-tl-bar-${e.category || "custom"}`,
75
- style: {
76
- left: `${s}%`,
77
- width: `${f}%`
78
- },
79
- title: m
80
- }
81
- ) }),
82
- /* @__PURE__ */ a("span", { className: "ss-dash-tl-dur", children: [
83
- e.duration.toFixed(2),
84
- "ms"
85
- ] })
86
- ] }, e.id);
87
- }),
88
- l && l.length > 0 && /* @__PURE__ */ a("div", { className: "ss-dash-tl-warnings", children: [
89
- /* @__PURE__ */ a("div", { className: "ss-dash-tl-warnings-title", children: [
90
- "Warnings (",
91
- l.length,
92
- ")"
93
- ] }),
94
- l.map((e, s) => /* @__PURE__ */ t("div", { className: "ss-dash-tl-warning", children: e }, s))
95
- ] })
96
- ] });
97
- }
98
- export {
99
- C as W
100
- };
@@ -1,8 +0,0 @@
1
- import { DashboardHookOptions } from '../../../../core/types.js';
2
- interface TimelineSectionProps {
3
- options?: DashboardHookOptions;
4
- /** When false, show a "tracing disabled" message instead of fetching. Defaults to true. */
5
- tracingEnabled?: boolean;
6
- }
7
- export declare function TimelineSection({ options, tracingEnabled }: TimelineSectionProps): import("react/jsx-runtime").JSX.Element;
8
- export default TimelineSection;