@perses-dev/tracing-gantt-chart-plugin 0.6.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 (189) hide show
  1. package/LICENSE +201 -0
  2. package/README.md +41 -0
  3. package/__mf/css/async/341.6c6463ea.css +1 -0
  4. package/__mf/css/async/759.6c6463ea.css +1 -0
  5. package/__mf/font/lato-all-300-normal.322bdf14.woff +0 -0
  6. package/__mf/font/lato-all-400-normal.63513b00.woff +0 -0
  7. package/__mf/font/lato-all-700-normal.bb27db94.woff +0 -0
  8. package/__mf/font/lato-all-900-normal.a27049a3.woff +0 -0
  9. package/__mf/font/lato-latin-300-normal.c5195215.woff2 +0 -0
  10. package/__mf/font/lato-latin-400-normal.b7ffde23.woff2 +0 -0
  11. package/__mf/font/lato-latin-700-normal.d5eb20bc.woff2 +0 -0
  12. package/__mf/font/lato-latin-900-normal.d884a71c.woff2 +0 -0
  13. package/__mf/font/lato-latin-ext-300-normal.abcc64a9.woff2 +0 -0
  14. package/__mf/font/lato-latin-ext-400-normal.6ebed106.woff2 +0 -0
  15. package/__mf/font/lato-latin-ext-700-normal.8697d1d5.woff2 +0 -0
  16. package/__mf/font/lato-latin-ext-900-normal.20a2b415.woff2 +0 -0
  17. package/__mf/js/788.91bbf7bd.js +5 -0
  18. package/__mf/js/TracingGanttChart.1a922a19.js +5 -0
  19. package/__mf/js/async/156.5a401ecb.js +1 -0
  20. package/__mf/js/async/173.6314a363.js +2 -0
  21. package/__mf/js/async/173.6314a363.js.LICENSE.txt +19 -0
  22. package/__mf/js/async/620.1d1ce390.js +2 -0
  23. package/__mf/js/async/620.1d1ce390.js.LICENSE.txt +9 -0
  24. package/__mf/js/async/651.3ea371e5.js +1 -0
  25. package/__mf/js/async/694.4580ad20.js +1 -0
  26. package/__mf/js/async/740.babbb403.js +1 -0
  27. package/__mf/js/async/75.d81e6bbf.js +1 -0
  28. package/__mf/js/async/770.5431adef.js +1 -0
  29. package/__mf/js/async/783.3c2c57f6.js +110 -0
  30. package/__mf/js/async/783.3c2c57f6.js.LICENSE.txt +27 -0
  31. package/__mf/js/async/844.556cc34d.js +66 -0
  32. package/__mf/js/async/844.556cc34d.js.LICENSE.txt +84 -0
  33. package/__mf/js/async/928.096f73eb.js +1 -0
  34. package/__mf/js/async/960.478a8f11.js +2 -0
  35. package/__mf/js/async/960.478a8f11.js.LICENSE.txt +8 -0
  36. package/__mf/js/async/964.a98cab40.js +2 -0
  37. package/__mf/js/async/964.a98cab40.js.LICENSE.txt +9 -0
  38. package/__mf/js/async/981.bc5132f8.js +2 -0
  39. package/__mf/js/async/981.bc5132f8.js.LICENSE.txt +8 -0
  40. package/__mf/js/async/__federation_expose_TracingGanttChart.5ab86c44.js +1 -0
  41. package/__mf/js/async/lib-router.36c0d526.js +2 -0
  42. package/__mf/js/async/lib-router.36c0d526.js.LICENSE.txt +32 -0
  43. package/__mf/js/main.e75dea7b.js +1 -0
  44. package/lib/TracingGanttChart/DetailPane/Attributes.d.ts +9 -0
  45. package/lib/TracingGanttChart/DetailPane/Attributes.d.ts.map +1 -0
  46. package/lib/TracingGanttChart/DetailPane/Attributes.js +66 -0
  47. package/lib/TracingGanttChart/DetailPane/Attributes.js.map +1 -0
  48. package/lib/TracingGanttChart/DetailPane/DetailPane.d.ts +14 -0
  49. package/lib/TracingGanttChart/DetailPane/DetailPane.d.ts.map +1 -0
  50. package/lib/TracingGanttChart/DetailPane/DetailPane.js +95 -0
  51. package/lib/TracingGanttChart/DetailPane/DetailPane.js.map +1 -0
  52. package/lib/TracingGanttChart/DetailPane/SpanEvents.d.ts +8 -0
  53. package/lib/TracingGanttChart/DetailPane/SpanEvents.d.ts.map +1 -0
  54. package/lib/TracingGanttChart/DetailPane/SpanEvents.js +54 -0
  55. package/lib/TracingGanttChart/DetailPane/SpanEvents.js.map +1 -0
  56. package/lib/TracingGanttChart/GanttTable/GanttTable.d.ts +13 -0
  57. package/lib/TracingGanttChart/GanttTable/GanttTable.d.ts.map +1 -0
  58. package/lib/TracingGanttChart/GanttTable/GanttTable.js +93 -0
  59. package/lib/TracingGanttChart/GanttTable/GanttTable.js.map +1 -0
  60. package/lib/TracingGanttChart/GanttTable/GanttTableHeader.d.ts +12 -0
  61. package/lib/TracingGanttChart/GanttTable/GanttTableHeader.d.ts.map +1 -0
  62. package/lib/TracingGanttChart/GanttTable/GanttTableHeader.js +56 -0
  63. package/lib/TracingGanttChart/GanttTable/GanttTableHeader.js.map +1 -0
  64. package/lib/TracingGanttChart/GanttTable/GanttTableProvider.d.ts +23 -0
  65. package/lib/TracingGanttChart/GanttTable/GanttTableProvider.d.ts.map +1 -0
  66. package/lib/TracingGanttChart/GanttTable/GanttTableProvider.js +45 -0
  67. package/lib/TracingGanttChart/GanttTable/GanttTableProvider.js.map +1 -0
  68. package/lib/TracingGanttChart/GanttTable/GanttTableRow.d.ts +15 -0
  69. package/lib/TracingGanttChart/GanttTable/GanttTableRow.d.ts.map +1 -0
  70. package/lib/TracingGanttChart/GanttTable/GanttTableRow.js +56 -0
  71. package/lib/TracingGanttChart/GanttTable/GanttTableRow.js.map +1 -0
  72. package/lib/TracingGanttChart/GanttTable/ResizableDivider.d.ts +9 -0
  73. package/lib/TracingGanttChart/GanttTable/ResizableDivider.d.ts.map +1 -0
  74. package/lib/TracingGanttChart/GanttTable/ResizableDivider.js +86 -0
  75. package/lib/TracingGanttChart/GanttTable/ResizableDivider.js.map +1 -0
  76. package/lib/TracingGanttChart/GanttTable/SpanDuration.d.ts +14 -0
  77. package/lib/TracingGanttChart/GanttTable/SpanDuration.d.ts.map +1 -0
  78. package/lib/TracingGanttChart/GanttTable/SpanDuration.js +75 -0
  79. package/lib/TracingGanttChart/GanttTable/SpanDuration.js.map +1 -0
  80. package/lib/TracingGanttChart/GanttTable/SpanIndents.d.ts +14 -0
  81. package/lib/TracingGanttChart/GanttTable/SpanIndents.d.ts.map +1 -0
  82. package/lib/TracingGanttChart/GanttTable/SpanIndents.js +90 -0
  83. package/lib/TracingGanttChart/GanttTable/SpanIndents.js.map +1 -0
  84. package/lib/TracingGanttChart/GanttTable/SpanName.d.ts +11 -0
  85. package/lib/TracingGanttChart/GanttTable/SpanName.d.ts.map +1 -0
  86. package/lib/TracingGanttChart/GanttTable/SpanName.js +61 -0
  87. package/lib/TracingGanttChart/GanttTable/SpanName.js.map +1 -0
  88. package/lib/TracingGanttChart/MiniGanttChart/Canvas.d.ts +13 -0
  89. package/lib/TracingGanttChart/MiniGanttChart/Canvas.d.ts.map +1 -0
  90. package/lib/TracingGanttChart/MiniGanttChart/Canvas.js +243 -0
  91. package/lib/TracingGanttChart/MiniGanttChart/Canvas.js.map +1 -0
  92. package/lib/TracingGanttChart/MiniGanttChart/MiniGanttChart.d.ts +13 -0
  93. package/lib/TracingGanttChart/MiniGanttChart/MiniGanttChart.d.ts.map +1 -0
  94. package/lib/TracingGanttChart/MiniGanttChart/MiniGanttChart.js +51 -0
  95. package/lib/TracingGanttChart/MiniGanttChart/MiniGanttChart.js.map +1 -0
  96. package/lib/TracingGanttChart/MiniGanttChart/draw.d.ts +3 -0
  97. package/lib/TracingGanttChart/MiniGanttChart/draw.d.ts.map +1 -0
  98. package/lib/TracingGanttChart/MiniGanttChart/draw.js +48 -0
  99. package/lib/TracingGanttChart/MiniGanttChart/draw.js.map +1 -0
  100. package/lib/TracingGanttChart/Ticks.d.ts +16 -0
  101. package/lib/TracingGanttChart/Ticks.d.ts.map +1 -0
  102. package/lib/TracingGanttChart/Ticks.js +94 -0
  103. package/lib/TracingGanttChart/Ticks.js.map +1 -0
  104. package/lib/TracingGanttChart/TracingGanttChart.d.ts +17 -0
  105. package/lib/TracingGanttChart/TracingGanttChart.d.ts.map +1 -0
  106. package/lib/TracingGanttChart/TracingGanttChart.js +106 -0
  107. package/lib/TracingGanttChart/TracingGanttChart.js.map +1 -0
  108. package/lib/TracingGanttChart/palette.d.ts +6 -0
  109. package/lib/TracingGanttChart/palette.d.ts.map +1 -0
  110. package/lib/TracingGanttChart/palette.js +64 -0
  111. package/lib/TracingGanttChart/palette.js.map +1 -0
  112. package/lib/TracingGanttChart/trace.d.ts +45 -0
  113. package/lib/TracingGanttChart/trace.d.ts.map +1 -0
  114. package/lib/TracingGanttChart/trace.js +109 -0
  115. package/lib/TracingGanttChart/trace.js.map +1 -0
  116. package/lib/TracingGanttChart/utils.d.ts +18 -0
  117. package/lib/TracingGanttChart/utils.d.ts.map +1 -0
  118. package/lib/TracingGanttChart/utils.js +48 -0
  119. package/lib/TracingGanttChart/utils.js.map +1 -0
  120. package/lib/TracingGanttChart.d.ts +5 -0
  121. package/lib/TracingGanttChart.d.ts.map +1 -0
  122. package/lib/TracingGanttChart.js +23 -0
  123. package/lib/TracingGanttChart.js.map +1 -0
  124. package/lib/TracingGanttChartPanel.d.ts +17 -0
  125. package/lib/TracingGanttChartPanel.d.ts.map +1 -0
  126. package/lib/TracingGanttChartPanel.js +45 -0
  127. package/lib/TracingGanttChartPanel.js.map +1 -0
  128. package/lib/bootstrap.d.ts +2 -0
  129. package/lib/bootstrap.d.ts.map +1 -0
  130. package/lib/bootstrap.js +19 -0
  131. package/lib/bootstrap.js.map +1 -0
  132. package/lib/cjs/TracingGanttChart/DetailPane/Attributes.js +74 -0
  133. package/lib/cjs/TracingGanttChart/DetailPane/DetailPane.js +106 -0
  134. package/lib/cjs/TracingGanttChart/DetailPane/SpanEvents.js +67 -0
  135. package/lib/cjs/TracingGanttChart/GanttTable/GanttTable.js +101 -0
  136. package/lib/cjs/TracingGanttChart/GanttTable/GanttTableHeader.js +64 -0
  137. package/lib/cjs/TracingGanttChart/GanttTable/GanttTableProvider.js +60 -0
  138. package/lib/cjs/TracingGanttChart/GanttTable/GanttTableRow.js +64 -0
  139. package/lib/cjs/TracingGanttChart/GanttTable/ResizableDivider.js +94 -0
  140. package/lib/cjs/TracingGanttChart/GanttTable/SpanDuration.js +81 -0
  141. package/lib/cjs/TracingGanttChart/GanttTable/SpanIndents.js +97 -0
  142. package/lib/cjs/TracingGanttChart/GanttTable/SpanName.js +72 -0
  143. package/lib/cjs/TracingGanttChart/MiniGanttChart/Canvas.js +256 -0
  144. package/lib/cjs/TracingGanttChart/MiniGanttChart/MiniGanttChart.js +59 -0
  145. package/lib/cjs/TracingGanttChart/MiniGanttChart/draw.js +56 -0
  146. package/lib/cjs/TracingGanttChart/Ticks.js +106 -0
  147. package/lib/cjs/TracingGanttChart/TracingGanttChart.js +109 -0
  148. package/lib/cjs/TracingGanttChart/palette.js +83 -0
  149. package/lib/cjs/TracingGanttChart/trace.js +113 -0
  150. package/lib/cjs/TracingGanttChart/utils.js +76 -0
  151. package/lib/cjs/TracingGanttChart.js +31 -0
  152. package/lib/cjs/TracingGanttChartPanel.js +53 -0
  153. package/lib/cjs/bootstrap.js +26 -0
  154. package/lib/cjs/env.d.js +14 -0
  155. package/lib/cjs/gantt-chart-model.js +28 -0
  156. package/lib/cjs/getPluginModule.js +27 -0
  157. package/lib/cjs/index-federation.js +55 -0
  158. package/lib/cjs/index.js +27 -0
  159. package/lib/cjs/setup-tests.js +19 -0
  160. package/lib/cjs/test/convert/jaeger.js +86 -0
  161. package/lib/env.d.js +15 -0
  162. package/lib/env.d.js.map +1 -0
  163. package/lib/gantt-chart-model.d.ts +17 -0
  164. package/lib/gantt-chart-model.d.ts.map +1 -0
  165. package/lib/gantt-chart-model.js +22 -0
  166. package/lib/gantt-chart-model.js.map +1 -0
  167. package/lib/getPluginModule.d.ts +6 -0
  168. package/lib/getPluginModule.d.ts.map +1 -0
  169. package/lib/getPluginModule.js +16 -0
  170. package/lib/getPluginModule.js.map +1 -0
  171. package/lib/index-federation.d.ts +1 -0
  172. package/lib/index-federation.d.ts.map +1 -0
  173. package/lib/index-federation.js +15 -0
  174. package/lib/index-federation.js.map +1 -0
  175. package/lib/index.d.ts +5 -0
  176. package/lib/index.d.ts.map +1 -0
  177. package/lib/index.js +6 -0
  178. package/lib/index.js.map +1 -0
  179. package/lib/setup-tests.d.ts +2 -0
  180. package/lib/setup-tests.d.ts.map +1 -0
  181. package/lib/setup-tests.js +17 -0
  182. package/lib/setup-tests.js.map +1 -0
  183. package/lib/test/convert/jaeger.d.ts +41 -0
  184. package/lib/test/convert/jaeger.d.ts.map +1 -0
  185. package/lib/test/convert/jaeger.js +78 -0
  186. package/lib/test/convert/jaeger.js.map +1 -0
  187. package/mf-manifest.json +233 -0
  188. package/mf-stats.json +269 -0
  189. package/package.json +58 -0
@@ -0,0 +1,106 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ function _export(target, all) {
18
+ for(var name in all)Object.defineProperty(target, name, {
19
+ enumerable: true,
20
+ get: all[name]
21
+ });
22
+ }
23
+ _export(exports, {
24
+ Ticks: function() {
25
+ return Ticks;
26
+ },
27
+ TicksHeader: function() {
28
+ return TicksHeader;
29
+ }
30
+ });
31
+ const _jsxruntime = require("react/jsx-runtime");
32
+ const _material = require("@mui/material");
33
+ const _utils = require("./utils");
34
+ function TicksHeader(props) {
35
+ const { trace, viewport } = props;
36
+ const duration = viewport.endTimeUnixMs - viewport.startTimeUnixMs;
37
+ const startAt = viewport.startTimeUnixMs - trace.startTimeUnixMs;
38
+ return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
39
+ children: [
40
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
41
+ style: {
42
+ left: '0%',
43
+ borderWidth: 0
44
+ },
45
+ children: (0, _utils.formatDuration)(startAt + duration * 0)
46
+ }),
47
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
48
+ style: {
49
+ left: '25%'
50
+ },
51
+ children: (0, _utils.formatDuration)(startAt + duration * 0.25)
52
+ }),
53
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
54
+ style: {
55
+ left: '50%'
56
+ },
57
+ children: (0, _utils.formatDuration)(startAt + duration * 0.5)
58
+ }),
59
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
60
+ style: {
61
+ left: '75%'
62
+ },
63
+ children: (0, _utils.formatDuration)(startAt + duration * 0.75)
64
+ }),
65
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
66
+ style: {
67
+ left: '100%'
68
+ },
69
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
70
+ style: {
71
+ position: 'absolute',
72
+ right: '.75rem'
73
+ },
74
+ children: (0, _utils.formatDuration)(startAt + duration * 1)
75
+ })
76
+ })
77
+ ]
78
+ });
79
+ }
80
+ function Ticks() {
81
+ return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
82
+ children: [
83
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
84
+ style: {
85
+ left: '25%'
86
+ }
87
+ }),
88
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
89
+ style: {
90
+ left: '50%'
91
+ }
92
+ }),
93
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(TickBox, {
94
+ style: {
95
+ left: '75%'
96
+ }
97
+ })
98
+ ]
99
+ });
100
+ }
101
+ const TickBox = (0, _material.styled)(_material.Box)(({ theme })=>({
102
+ position: 'absolute',
103
+ height: '100%',
104
+ borderLeft: `1px solid ${theme.palette.divider}`,
105
+ padding: '.25rem'
106
+ }));
@@ -0,0 +1,109 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "TracingGanttChart", {
18
+ enumerable: true,
19
+ get: function() {
20
+ return TracingGanttChart;
21
+ }
22
+ });
23
+ const _jsxruntime = require("react/jsx-runtime");
24
+ const _react = require("react");
25
+ const _material = require("@mui/material");
26
+ const _MiniGanttChart = require("./MiniGanttChart/MiniGanttChart");
27
+ const _DetailPane = require("./DetailPane/DetailPane");
28
+ const _GanttTable = require("./GanttTable/GanttTable");
29
+ const _GanttTableProvider = require("./GanttTable/GanttTableProvider");
30
+ const _ResizableDivider = require("./GanttTable/ResizableDivider");
31
+ const _trace = require("./trace");
32
+ function TracingGanttChart(props) {
33
+ const { options, attributeLinks, trace: otlpTrace } = props;
34
+ const theme = (0, _material.useTheme)();
35
+ const trace = (0, _react.useMemo)(()=>{
36
+ try {
37
+ return (0, _trace.getTraceModel)(otlpTrace);
38
+ } catch (e) {
39
+ throw new Error(`Error: unable to parse trace: ${e}`);
40
+ }
41
+ }, [
42
+ otlpTrace
43
+ ]);
44
+ const [viewport, setViewport] = (0, _react.useState)({
45
+ startTimeUnixMs: trace.startTimeUnixMs,
46
+ endTimeUnixMs: trace.endTimeUnixMs
47
+ });
48
+ const [selectedSpan, setSelectedSpan] = (0, _react.useState)(undefined);
49
+ const ganttChart = (0, _react.useRef)(null);
50
+ // tableWidth only comes to effect if the detail pane is visible.
51
+ // setTableWidth() is only called by <ResizableDivider />
52
+ const [tableWidth, setTableWidth] = (0, _react.useState)(0.82);
53
+ const gap = 2;
54
+ return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
55
+ ref: ganttChart,
56
+ direction: "row",
57
+ sx: {
58
+ height: '100%',
59
+ minHeight: '240px',
60
+ gap
61
+ },
62
+ children: [
63
+ /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
64
+ sx: {
65
+ flexGrow: 1,
66
+ gap
67
+ },
68
+ children: [
69
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(_MiniGanttChart.MiniGanttChart, {
70
+ options: options,
71
+ trace: trace,
72
+ viewport: viewport,
73
+ setViewport: setViewport
74
+ }),
75
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(_GanttTableProvider.GanttTableProvider, {
76
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_GanttTable.GanttTable, {
77
+ options: options,
78
+ trace: trace,
79
+ viewport: viewport,
80
+ selectedSpan: selectedSpan,
81
+ onSpanClick: setSelectedSpan
82
+ })
83
+ })
84
+ ]
85
+ }),
86
+ selectedSpan && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
87
+ children: [
88
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(_ResizableDivider.ResizableDivider, {
89
+ parentRef: ganttChart,
90
+ spacing: parseInt(theme.spacing(gap)),
91
+ onMove: setTableWidth
92
+ }),
93
+ /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
94
+ sx: {
95
+ width: `${(1 - tableWidth) * 100}%`,
96
+ overflow: 'auto'
97
+ },
98
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_DetailPane.DetailPane, {
99
+ attributeLinks: attributeLinks,
100
+ trace: trace,
101
+ span: selectedSpan,
102
+ onCloseBtnClick: ()=>setSelectedSpan(undefined)
103
+ })
104
+ })
105
+ ]
106
+ })
107
+ ]
108
+ });
109
+ }
@@ -0,0 +1,83 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ function _export(target, all) {
18
+ for(var name in all)Object.defineProperty(target, name, {
19
+ enumerable: true,
20
+ get: all[name]
21
+ });
22
+ }
23
+ _export(exports, {
24
+ getConsistentCategoricalColor: function() {
25
+ return getConsistentCategoricalColor;
26
+ },
27
+ getConsistentColor: function() {
28
+ return getConsistentColor;
29
+ }
30
+ });
31
+ const _colorhash = /*#__PURE__*/ _interop_require_default(require("color-hash"));
32
+ function _interop_require_default(obj) {
33
+ return obj && obj.__esModule ? obj : {
34
+ default: obj
35
+ };
36
+ }
37
+ // Valid hue values are 0 to 360 and can be adjusted to control the generated colors.
38
+ // More info: https://github.com/zenozeng/color-hash#custom-hue
39
+ // Picked min of 20 and max of 360 to exclude common threshold colors (red).
40
+ // Items with "error" in them will always be generated as red.
41
+ const ERROR_HUE_CUTOFF = 20;
42
+ const colorGenerator = new _colorhash.default({
43
+ hue: {
44
+ min: ERROR_HUE_CUTOFF,
45
+ max: 360
46
+ }
47
+ });
48
+ const redColorGenerator = new _colorhash.default({
49
+ hue: {
50
+ min: 0,
51
+ max: ERROR_HUE_CUTOFF
52
+ }
53
+ });
54
+ function computeConsistentColor(name, error) {
55
+ const [hue, saturation, lightness] = error ? redColorGenerator.hsl(name) : colorGenerator.hsl(name);
56
+ const saturationPercent = `${(saturation * 100).toFixed(0)}%`;
57
+ const lightnessPercent = `${(lightness * 100).toFixed(0)}%`;
58
+ return `hsla(${hue.toFixed(2)},${saturationPercent},${lightnessPercent},0.9)`;
59
+ }
60
+ // To check whether a color has already been generated for a given string.
61
+ // TODO: Predefined color aliases will be defined here
62
+ const colorLookup = {};
63
+ function getConsistentColor(name, error) {
64
+ const key = `${name}_____${error}`;
65
+ let value = colorLookup[key];
66
+ if (!value) {
67
+ value = computeConsistentColor(name, error);
68
+ colorLookup[key] = value;
69
+ }
70
+ return value;
71
+ }
72
+ function getConsistentCategoricalColor(name, error, categoricalPalette, errorPalette) {
73
+ const palette = error ? errorPalette : categoricalPalette;
74
+ if (palette.length === 0) {
75
+ console.warn('getConsistentCategoricalColor() called with empty color palette, fallback to #000');
76
+ return '#000';
77
+ }
78
+ let hash = 0;
79
+ for(let i = 0; i < name.length; i++){
80
+ hash = name.charCodeAt(i) + ((hash << 5) - hash);
81
+ }
82
+ return palette[Math.abs(hash) % palette.length] ?? '#000';
83
+ }
@@ -0,0 +1,113 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "getTraceModel", {
18
+ enumerable: true,
19
+ get: function() {
20
+ return getTraceModel;
21
+ }
22
+ });
23
+ const _lodash = require("lodash");
24
+ function getTraceModel(trace) {
25
+ // first pass: build lookup table <spanId, Span> and compute min/max
26
+ const lookup = new Map();
27
+ const rootSpans = [];
28
+ let startTimeUnixMs = 0;
29
+ let endTimeUnixMs = 0;
30
+ for (const resourceSpan of trace.resourceSpans){
31
+ const resource = parseResource(resourceSpan.resource);
32
+ for (const scopeSpan of resourceSpan.scopeSpans){
33
+ const scope = parseScope(scopeSpan.scope);
34
+ for (const otelSpan of scopeSpan.spans){
35
+ const span = {
36
+ resource,
37
+ scope,
38
+ childSpans: [],
39
+ ...parseSpan(otelSpan)
40
+ };
41
+ lookup.set(otelSpan.spanId, span);
42
+ if (startTimeUnixMs === 0 || span.startTimeUnixMs < startTimeUnixMs) {
43
+ startTimeUnixMs = span.startTimeUnixMs;
44
+ }
45
+ if (endTimeUnixMs === 0 || span.endTimeUnixMs > endTimeUnixMs) {
46
+ endTimeUnixMs = span.endTimeUnixMs;
47
+ }
48
+ }
49
+ }
50
+ }
51
+ // second pass: build tree based on parentSpanId property
52
+ for (const [, span] of lookup){
53
+ if (!span.parentSpanId) {
54
+ rootSpans.push(span);
55
+ continue;
56
+ }
57
+ const parent = lookup.get(span.parentSpanId);
58
+ if (!parent) {
59
+ console.trace(`span ${span.spanId} has parent ${span.parentSpanId} which has not been received yet`);
60
+ rootSpans.push(span);
61
+ continue;
62
+ }
63
+ span.parentSpan = parent;
64
+ const insertChildSpanAt = (0, _lodash.sortedIndexBy)(parent.childSpans, span, (s)=>s.startTimeUnixMs);
65
+ parent.childSpans.splice(insertChildSpanAt, 0, span);
66
+ }
67
+ return {
68
+ trace,
69
+ rootSpans,
70
+ startTimeUnixMs,
71
+ endTimeUnixMs
72
+ };
73
+ }
74
+ function parseResource(resource) {
75
+ let serviceName = 'unknown';
76
+ for (const attr of resource?.attributes ?? []){
77
+ if (attr.key === 'service.name' && 'stringValue' in attr.value) {
78
+ serviceName = attr.value.stringValue;
79
+ break;
80
+ }
81
+ }
82
+ return {
83
+ serviceName,
84
+ attributes: resource?.attributes ?? []
85
+ };
86
+ }
87
+ function parseScope(scope) {
88
+ return scope ?? {};
89
+ }
90
+ /**
91
+ * parseSpan parses the Span API type to the internal representation
92
+ * i.e. convert strings to numbers etc.
93
+ */ function parseSpan(span) {
94
+ return {
95
+ traceId: span.traceId,
96
+ spanId: span.spanId,
97
+ parentSpanId: span.parentSpanId,
98
+ name: span.name,
99
+ kind: span.kind,
100
+ startTimeUnixMs: parseInt(span.startTimeUnixNano) * 1e-6,
101
+ endTimeUnixMs: parseInt(span.endTimeUnixNano) * 1e-6,
102
+ attributes: span.attributes ?? [],
103
+ events: (span.events ?? []).map(parseEvent),
104
+ status: span.status ?? {}
105
+ };
106
+ }
107
+ function parseEvent(event) {
108
+ return {
109
+ timeUnixMs: parseInt(event.timeUnixNano) * 1e-6,
110
+ name: event.name,
111
+ attributes: event.attributes ?? []
112
+ };
113
+ }
@@ -0,0 +1,76 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ function _export(target, all) {
18
+ for(var name in all)Object.defineProperty(target, name, {
19
+ enumerable: true,
20
+ get: all[name]
21
+ });
22
+ }
23
+ _export(exports, {
24
+ formatDuration: function() {
25
+ return formatDuration;
26
+ },
27
+ getServiceColor: function() {
28
+ return getServiceColor;
29
+ },
30
+ getSpanColor: function() {
31
+ return getSpanColor;
32
+ },
33
+ minSpanWidthPx: function() {
34
+ return minSpanWidthPx;
35
+ },
36
+ rowHeight: function() {
37
+ return rowHeight;
38
+ },
39
+ spanHasError: function() {
40
+ return spanHasError;
41
+ }
42
+ });
43
+ const _core = require("@perses-dev/core");
44
+ const _palette = require("./palette");
45
+ const minSpanWidthPx = 2;
46
+ const rowHeight = '2rem';
47
+ const spanHasError = (span)=>span.status?.code === _core.otlptracev1.StatusCodeError;
48
+ function getServiceColor(muiTheme, chartsTheme, paletteMode, serviceName, error = false) {
49
+ switch(paletteMode){
50
+ case 'categorical':
51
+ {
52
+ // ECharts type for color is not always an array but it is always an array in ChartsProvider
53
+ const categoricalPalette = chartsTheme.echartsTheme.color;
54
+ const errorPalette = [
55
+ muiTheme.palette.error.light,
56
+ muiTheme.palette.error.main,
57
+ muiTheme.palette.error.dark
58
+ ];
59
+ return (0, _palette.getConsistentCategoricalColor)(serviceName, error, categoricalPalette, errorPalette);
60
+ }
61
+ default:
62
+ return (0, _palette.getConsistentColor)(serviceName, error);
63
+ }
64
+ }
65
+ function getSpanColor(muiTheme, chartsTheme, paletteMode, span) {
66
+ return getServiceColor(muiTheme, chartsTheme, paletteMode, span.resource.serviceName ?? '', spanHasError(span));
67
+ }
68
+ function formatDuration(timeMs) {
69
+ if (timeMs < 1) {
70
+ return `${Math.round(timeMs * 1000)}μs`;
71
+ }
72
+ if (timeMs < 1000) {
73
+ return `${+timeMs.toFixed(2)}ms`;
74
+ }
75
+ return `${+(timeMs / 1000).toFixed(2)}s`;
76
+ }
@@ -0,0 +1,31 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "TracingGanttChart", {
18
+ enumerable: true,
19
+ get: function() {
20
+ return TracingGanttChart;
21
+ }
22
+ });
23
+ const _ganttchartmodel = require("./gantt-chart-model");
24
+ const _TracingGanttChartPanel = require("./TracingGanttChartPanel");
25
+ const TracingGanttChart = {
26
+ PanelComponent: _TracingGanttChartPanel.TracingGanttChartPanel,
27
+ supportedQueryTypes: [
28
+ 'TraceQuery'
29
+ ],
30
+ createInitialOptions: _ganttchartmodel.createInitialTracingGanttChartOptions
31
+ };
@@ -0,0 +1,53 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "TracingGanttChartPanel", {
18
+ enumerable: true,
19
+ get: function() {
20
+ return TracingGanttChartPanel;
21
+ }
22
+ });
23
+ const _jsxruntime = require("react/jsx-runtime");
24
+ const _components = require("@perses-dev/components");
25
+ const _material = require("@mui/material");
26
+ const _TracingGanttChart = require("./TracingGanttChart/TracingGanttChart");
27
+ function TracingGanttChartPanel(props) {
28
+ const { spec, queryResults, attributeLinks } = props;
29
+ const chartsTheme = (0, _components.useChartsTheme)();
30
+ const contentPadding = chartsTheme.container.padding.default;
31
+ if (queryResults.length > 1) {
32
+ return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.TextOverlay, {
33
+ message: "This panel does not support more than one query."
34
+ });
35
+ }
36
+ const trace = queryResults[0]?.data.trace;
37
+ if (!trace) {
38
+ return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.NoDataOverlay, {
39
+ resource: "trace"
40
+ });
41
+ }
42
+ return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
43
+ sx: {
44
+ height: '100%',
45
+ padding: `${contentPadding}px`
46
+ },
47
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_TracingGanttChart.TracingGanttChart, {
48
+ options: spec,
49
+ attributeLinks: attributeLinks,
50
+ trace: trace
51
+ })
52
+ });
53
+ }
@@ -0,0 +1,26 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ const _jsxruntime = require("react/jsx-runtime");
18
+ const _react = /*#__PURE__*/ _interop_require_default(require("react"));
19
+ const _client = /*#__PURE__*/ _interop_require_default(require("react-dom/client"));
20
+ function _interop_require_default(obj) {
21
+ return obj && obj.__esModule ? obj : {
22
+ default: obj
23
+ };
24
+ }
25
+ const root = _client.default.createRoot(document.getElementById('root'));
26
+ root.render(/*#__PURE__*/ (0, _jsxruntime.jsx)(_react.default.StrictMode, {}));
@@ -0,0 +1,14 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ /// <reference types="@rsbuild/core/types" />
14
+ "use strict";
@@ -0,0 +1,28 @@
1
+ // Copyright 2024 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ /**
14
+ * The Options object type supported by the TracingGanttChart panel plugin.
15
+ */ // Note: The interface attributes must match cue/schemas/panels/tracing-gantt-chart/tracing-gantt-chart.cue
16
+ "use strict";
17
+ Object.defineProperty(exports, "__esModule", {
18
+ value: true
19
+ });
20
+ Object.defineProperty(exports, "createInitialTracingGanttChartOptions", {
21
+ enumerable: true,
22
+ get: function() {
23
+ return createInitialTracingGanttChartOptions;
24
+ }
25
+ });
26
+ function createInitialTracingGanttChartOptions() {
27
+ return {};
28
+ }
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "getPluginModule", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return getPluginModule;
9
+ }
10
+ });
11
+ const _packagejson = /*#__PURE__*/ _interop_require_default(require("../package.json"));
12
+ function _interop_require_default(obj) {
13
+ return obj && obj.__esModule ? obj : {
14
+ default: obj
15
+ };
16
+ }
17
+ function getPluginModule() {
18
+ const { name, version, perses } = _packagejson.default;
19
+ return {
20
+ kind: 'PluginModule',
21
+ metadata: {
22
+ name,
23
+ version
24
+ },
25
+ spec: perses
26
+ };
27
+ }