@perses-dev/plugin-system 0.0.0-snapshot-panel-extra-content-3-17f9c42 → 0.0.0-snapshot-scatter-chart-embed-8efdfab

package/dist/cjs/components/TraceQueryEditor/TraceQueryEditor.js

@@ -0,0 +1,143 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TraceQueryEditor", {
+    enumerable: true,
+    get: function() {
+        return TraceQueryEditor;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _material = require("@mui/material");
+const _Plus = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Plus"));
+const _react = require("react");
+const _immer = require("immer");
+const _runtime = require("../../runtime");
+const _TraceQueryInput = require("./TraceQueryInput");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const DEFAULT_QUERY_PLUGIN_TYPE = 'TraceQuery';
+function TraceQueryEditor({ queries =[] , onChange  }) {
+    const hasMoreThanOneQuery = queries.length > 1;
+    const defaultTraceQueryKind = 'TempoTraceQuery';
+    // State for which queries are collapsed
+    // TODO: Would be easier if we had IDs for queries.
+    const [queriesCollapsed, setQueriesCollapsed] = (0, _react.useState)(queries.map(()=>false));
+    const { data: defaultQueryPlugin  } = (0, _runtime.usePlugin)(DEFAULT_QUERY_PLUGIN_TYPE, defaultTraceQueryKind, {
+        useErrorBoundary: true,
+        enabled: true
+    });
+    // Query handlers
+    const handleQueryChange = (index, queryDef)=>{
+        onChange((0, _immer.produce)(queries, (draft)=>{
+            if (draft) {
+                draft[index] = queryDef;
+            } else {
+                draft = [
+                    queryDef
+                ];
+            }
+        }));
+    };
+    const handleQueryAdd = ()=>{
+        if (!defaultQueryPlugin) return;
+        onChange((0, _immer.produce)(queries, (draft)=>{
+            const queryDef = {
+                kind: DEFAULT_QUERY_PLUGIN_TYPE,
+                spec: {
+                    plugin: {
+                        kind: defaultTraceQueryKind,
+                        spec: defaultQueryPlugin.createInitialOptions()
+                    }
+                }
+            };
+            if (draft) {
+                draft.push(queryDef);
+            } else {
+                draft = [
+                    ...queries,
+                    queryDef
+                ];
+            }
+        }));
+        setQueriesCollapsed((queriesCollapsed)=>{
+            queriesCollapsed.push(false);
+            return [
+                ...queriesCollapsed
+            ];
+        });
+    };
+    const handleQueryDelete = (index)=>{
+        onChange((0, _immer.produce)(queries, (draft)=>{
+            draft.splice(index, 1);
+        }));
+        setQueriesCollapsed((queriesCollapsed)=>{
+            queriesCollapsed.splice(index, 1);
+            return [
+                ...queriesCollapsed
+            ];
+        });
+    };
+    const handleQueryCollapseExpand = (index)=>{
+        setQueriesCollapsed((queriesCollapsed)=>{
+            queriesCollapsed[index] = !queriesCollapsed[index];
+            return [
+                ...queriesCollapsed
+            ];
+        });
+    };
+    // show one query input if queries is empty
+    const queryDefinitions = queries.length ? queries : [
+        {
+            kind: 'TraceQuery',
+            spec: {
+                plugin: {
+                    kind: 'TempoTraceQuery',
+                    spec: {
+                        query: ''
+                    }
+                }
+            }
+        }
+    ];
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {
+                spacing: 1,
+                children: queryDefinitions.map((query, i)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_TraceQueryInput.TraceQueryInput, {
+                        index: i,
+                        query: query,
+                        isCollapsed: !!queriesCollapsed[i],
+                        onChange: handleQueryChange,
+                        onDelete: hasMoreThanOneQuery ? handleQueryDelete : undefined,
+                        onCollapseExpand: handleQueryCollapseExpand
+                    }, i))
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
+                variant: "contained",
+                startIcon: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Plus.default, {}),
+                sx: {
+                    marginTop: 1
+                },
+                onClick: handleQueryAdd,
+                children: "Add Query"
+            })
+        ]
+    });
+}

package/dist/cjs/components/TraceQueryEditor/TraceQueryInput.js

@@ -0,0 +1,96 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TraceQueryInput", {
+    enumerable: true,
+    get: function() {
+        return TraceQueryInput;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _material = require("@mui/material");
+const _ChevronDown = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/ChevronDown"));
+const _ChevronRight = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/ChevronRight"));
+const _DeleteOutline = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/DeleteOutline"));
+const _immer = /*#__PURE__*/ _interop_require_default(require("immer"));
+const _PluginEditor = require("../PluginEditor");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const TraceQueryInput = ({ index , query , isCollapsed , onDelete , onChange , onCollapseExpand  })=>{
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
+        spacing: 1,
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
+                direction: "row",
+                alignItems: "center",
+                borderBottom: 1,
+                borderColor: (theme)=>theme.palette.divider,
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.IconButton, {
+                        size: "small",
+                        onClick: ()=>onCollapseExpand(index),
+                        children: isCollapsed ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_ChevronRight.default, {}) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_ChevronDown.default, {})
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Typography, {
+                        variant: "overline",
+                        component: "h4",
+                        children: [
+                            "Query ",
+                            index + 1
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.IconButton, {
+                        size: "small",
+                        // Use `visibility` to ensure that the row has the same height when delete button is visible or not visible
+                        sx: {
+                            marginLeft: 'auto',
+                            visibility: `${onDelete ? 'visible' : 'hidden'}`
+                        },
+                        onClick: ()=>onDelete && onDelete(index),
+                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_DeleteOutline.default, {})
+                    })
+                ]
+            }),
+            !isCollapsed && /*#__PURE__*/ (0, _jsxruntime.jsx)(QueryEditor, {
+                value: query,
+                onChange: (next)=>onChange(index, next)
+            })
+        ]
+    }, index);
+};
+/**
+ * Displays an editor for TraceQueryDefinition objects.
+ */ function QueryEditor(props) {
+    const { value , onChange , ...others } = props;
+    const { spec: { plugin  }  } = value;
+    const handlePluginChange = (next)=>{
+        onChange((0, _immer.default)(value, (draft)=>{
+            draft.spec.plugin = next;
+        }));
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
+        ...others,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_PluginEditor.PluginEditor, {
+            pluginType: "TraceQuery",
+            pluginKindLabel: "Query Type",
+            value: plugin,
+            onChange: handlePluginChange
+        })
+    });
+}

package/dist/cjs/components/TraceQueryEditor/index.js

@@ -0,0 +1,30 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+_export_star(require("./TraceQueryEditor"), exports);
+function _export_star(from, to) {
+    Object.keys(from).forEach(function(k) {
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
+    });
+    return from;
+}