@perses-dev/prometheus-plugin 0.50.0-rc.1 → 0.50.0

package/dist/cjs/components/PromQLEditor.js

@@ -41,13 +41,6 @@ function _interop_require_default(obj) {
 const treeViewStr = 'Tree View';
 const treeViewOpenStr = 'Open ' + treeViewStr;
 const treeViewCloseStr = 'Close ' + treeViewStr;
-function getErrMessage(error) {
-    let errorMessage = 'An unknown error occurred';
-    if (error && error instanceof Error) {
-        errorMessage = error.message.trim();
-    }
-    return errorMessage;
-}
 function PromQLEditor({ completeConfig, datasource, ...rest }) {
     const theme = (0, _material.useTheme)();
     const isDarkMode = theme.palette.mode === 'dark';
@@ -66,9 +59,6 @@ function PromQLEditor({ completeConfig, datasource, ...rest }) {
         queryExpr = (0, _replaceprombuiltinvariables.replacePromBuiltinVariables)(queryExpr, 12345, 12345);
     }
     const { data: parseQueryResponse, isLoading, error } = (0, _parse.useParseQuery)(queryExpr !== null && queryExpr !== void 0 ? queryExpr : '', datasource, isTreeViewVisible);
-    const errorMessage = (0, _react.useMemo)(()=>getErrMessage(error), [
-        error
-    ]);
     const handleShowTreeView = ()=>{
         setTreeViewVisible(!isTreeViewVisible);
     };
@@ -160,7 +150,7 @@ function PromQLEditor({ completeConfig, datasource, ...rest }) {
                             /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.ErrorAlert, {
                                 error: {
                                     name: `${treeViewStr} not available`,
-                                    message: errorMessage
+                                    message: error.message
                                 }
                             }) : /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                                 style: {

package/dist/components/PromQLEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PromQLEditor.d.ts","sourceRoot":"","sources":["../../src/components/PromQLEditor.tsx"],"names":[],"mappings":"AAaA,OAAmB,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAmB,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;AAI1F,OAAO,EAAE,YAAY,EAAqB,MAAM,OAAO,CAAC;AAIxD,OAAO,EAAE,4BAA4B,EAAE,MAAM,UAAU,CAAC;AAiBxD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,cAAc,EAAE,qBAAqB,CAAC;IACtC,UAAU,EAAE,4BAA4B,CAAC;CAC1C,GAAG,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,YAAY,CAAC,CAAC;AAEvD,wBAAgB,YAAY,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAmHrG"}
+{"version":3,"file":"PromQLEditor.d.ts","sourceRoot":"","sources":["../../src/components/PromQLEditor.tsx"],"names":[],"mappings":"AAaA,OAAmB,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAmB,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;AAI1F,OAAO,EAAE,YAAY,EAAqB,MAAM,OAAO,CAAC;AAIxD,OAAO,EAAE,4BAA4B,EAAE,MAAM,UAAU,CAAC;AASxD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,cAAc,EAAE,qBAAqB,CAAC;IACtC,UAAU,EAAE,4BAA4B,CAAC;CAC1C,GAAG,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,YAAY,CAAC,CAAC;AAEvD,wBAAgB,YAAY,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAkHrG"}

package/dist/components/PromQLEditor.js

@@ -26,13 +26,6 @@ import TreeNode from './TreeNode';
 const treeViewStr = 'Tree View';
 const treeViewOpenStr = 'Open ' + treeViewStr;
 const treeViewCloseStr = 'Close ' + treeViewStr;
-function getErrMessage(error) {
-    let errorMessage = 'An unknown error occurred';
-    if (error && error instanceof Error) {
-        errorMessage = error.message.trim();
-    }
-    return errorMessage;
-}
 export function PromQLEditor({ completeConfig, datasource, ...rest }) {
     const theme = useTheme();
     const isDarkMode = theme.palette.mode === 'dark';
@@ -51,9 +44,6 @@ export function PromQLEditor({ completeConfig, datasource, ...rest }) {
         queryExpr = replacePromBuiltinVariables(queryExpr, 12345, 12345);
     }
     const { data: parseQueryResponse, isLoading, error } = useParseQuery(queryExpr !== null && queryExpr !== void 0 ? queryExpr : '', datasource, isTreeViewVisible);
-    const errorMessage = useMemo(()=>getErrMessage(error), [
-        error
-    ]);
     const handleShowTreeView = ()=>{
         setTreeViewVisible(!isTreeViewVisible);
     };
@@ -145,7 +135,7 @@ export function PromQLEditor({ completeConfig, datasource, ...rest }) {
                             /*#__PURE__*/ _jsx(ErrorAlert, {
                                 error: {
                                     name: `${treeViewStr} not available`,
-                                    message: errorMessage
+                                    message: error.message
                                 }
                             }) : /*#__PURE__*/ _jsx("div", {
                                 style: {

package/dist/components/PromQLEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/PromQLEditor.tsx"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport CodeMirror, { ReactCodeMirrorProps } from '@uiw/react-codemirror';\nimport { PromQLExtension, CompleteConfiguration } from '@prometheus-io/codemirror-promql';\nimport { EditorView } from '@codemirror/view';\nimport { useTheme, CircularProgress, InputLabel, Stack, IconButton, Tooltip } from '@mui/material';\nimport FileTreeIcon from 'mdi-material-ui/FileTree';\nimport { ReactElement, useMemo, useState } from 'react';\nimport { ErrorAlert } from '@perses-dev/components';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useReplaceVariablesInString } from '@perses-dev/plugin-system';\nimport { PrometheusDatasourceSelector } from '../model';\nimport { replacePromBuiltinVariables } from '../plugins/prometheus-time-series-query/replace-prom-builtin-variables';\nimport { useParseQuery } from './parse';\nimport TreeNode from './TreeNode';\n\nconst treeViewStr = 'Tree View';\nconst treeViewOpenStr = 'Open ' + treeViewStr;\nconst treeViewCloseStr = 'Close ' + treeViewStr;\n\nfunction getErrMessage(error: unknown): string {\n  let errorMessage = 'An unknown error occurred';\n  if (error && error instanceof Error) {\n    errorMessage = error.message.trim();\n  }\n  return errorMessage;\n}\n\nexport type PromQLEditorProps = {\n  completeConfig: CompleteConfiguration;\n  datasource: PrometheusDatasourceSelector;\n} & Omit<ReactCodeMirrorProps, 'theme' | 'extensions'>;\n\nexport function PromQLEditor({ completeConfig, datasource, ...rest }: PromQLEditorProps): ReactElement {\n  const theme = useTheme();\n  const isDarkMode = theme.palette.mode === 'dark';\n  const [isTreeViewVisible, setTreeViewVisible] = useState(false);\n\n  const promQLExtension = useMemo(() => {\n    return new PromQLExtension().activateLinter(false).setComplete(completeConfig).asExtension();\n  }, [completeConfig]);\n\n  let queryExpr = useReplaceVariablesInString(rest.value);\n  if (queryExpr) {\n    // TODO placeholder values for steps to be replaced with actual values\n    // Looks like providing proper values involves some refactoring: currently we'd need to rely on the timeseries query context,\n    // but these step values are actually computed independently / before the queries are getting fired, so it's useless to fire\n    // queries here, so maybe we should extract this part to independant hook(s), to be reused here?\n    queryExpr = replacePromBuiltinVariables(queryExpr, 12345, 12345);\n  }\n\n  const { data: parseQueryResponse, isLoading, error } = useParseQuery(queryExpr ?? '', datasource, isTreeViewVisible);\n  const errorMessage = useMemo(() => getErrMessage(error), [error]);\n\n  const handleShowTreeView = (): void => {\n    setTreeViewVisible(!isTreeViewVisible);\n  };\n\n  return (\n    <Stack position=\"relative\">\n      <InputLabel // reproduce the same kind of input label that regular MUI TextFields have\n        shrink\n        sx={{\n          position: 'absolute',\n          top: '-8px',\n          left: '10px',\n          padding: '0 4px',\n          color: theme.palette.text.primary,\n          zIndex: 1,\n        }}\n      >\n        PromQL Expression\n      </InputLabel>\n      <CodeMirror\n        {...rest}\n        style={{ border: `1px solid ${theme.palette.divider}` }}\n        theme={isDarkMode ? 'dark' : 'light'}\n        basicSetup={{\n          highlightActiveLine: false,\n          highlightActiveLineGutter: false,\n          foldGutter: false,\n        }}\n        extensions={[\n          EditorView.lineWrapping,\n          promQLExtension,\n          EditorView.theme({\n            '.cm-content': {\n              paddingTop: '8px',\n              paddingBottom: '8px',\n              paddingRight: '40px', // offset for the tree view button\n            },\n          }),\n        ]}\n        placeholder=\"Example: sum(rate(http_requests_total[5m]))\"\n      />\n      {queryExpr && (\n        <>\n          <Tooltip title={isTreeViewVisible ? treeViewCloseStr : treeViewOpenStr}>\n            <IconButton\n              aria-label={isTreeViewVisible ? treeViewCloseStr : treeViewOpenStr}\n              onClick={handleShowTreeView}\n              sx={{ position: 'absolute', right: '5px', top: '5px' }}\n              size=\"small\"\n            >\n              <FileTreeIcon sx={{ fontSize: '18px' }} />\n            </IconButton>\n          </Tooltip>\n          {isTreeViewVisible && (\n            <div style={{ border: `1px solid ${theme.palette.divider}`, position: 'relative' }}>\n              <Tooltip title={treeViewCloseStr}>\n                <IconButton\n                  aria-label={treeViewCloseStr}\n                  onClick={() => setTreeViewVisible(false)}\n                  sx={{ position: 'absolute', top: '5px', right: '5px' }}\n                  size=\"small\"\n                >\n                  <CloseIcon sx={{ fontSize: '18px' }} />\n                </IconButton>\n              </Tooltip>\n              {error ? (\n                // Here the user is able to hide the error alert\n                <ErrorAlert\n                  error={{\n                    name: `${treeViewStr} not available`,\n                    message: errorMessage,\n                  }}\n                />\n              ) : (\n                <div\n                  style={{\n                    padding: `${theme.spacing(1.5)} ${theme.spacing(1.5)} 0 ${theme.spacing(1.5)}`, // let paddingBottom at 0 because nodes have margin-bottom\n                    overflowX: 'auto',\n                    backgroundColor: theme.palette.background.default,\n                  }}\n                >\n                  {isLoading ? (\n                    <CircularProgress />\n                  ) : parseQueryResponse?.data ? (\n                    <TreeNode node={parseQueryResponse.data} reverse={false} />\n                  ) : null}\n                </div>\n              )}\n            </div>\n          )}\n        </>\n      )}\n    </Stack>\n  );\n}\n"],"names":["CodeMirror","PromQLExtension","EditorView","useTheme","CircularProgress","InputLabel","Stack","IconButton","Tooltip","FileTreeIcon","useMemo","useState","ErrorAlert","CloseIcon","useReplaceVariablesInString","replacePromBuiltinVariables","useParseQuery","TreeNode","treeViewStr","treeViewOpenStr","treeViewCloseStr","getErrMessage","error","errorMessage","Error","message","trim","PromQLEditor","completeConfig","datasource","rest","theme","isDarkMode","palette","mode","isTreeViewVisible","setTreeViewVisible","promQLExtension","activateLinter","setComplete","asExtension","queryExpr","value","data","parseQueryResponse","isLoading","handleShowTreeView","position","shrink","sx","top","left","padding","color","text","primary","zIndex","style","border","divider","basicSetup","highlightActiveLine","highlightActiveLineGutter","foldGutter","extensions","lineWrapping","paddingTop","paddingBottom","paddingRight","placeholder","title","aria-label","onClick","right","size","fontSize","div","name","spacing","overflowX","backgroundColor","background","default","node","reverse"],"mappings":"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"}
+{"version":3,"sources":["../../src/components/PromQLEditor.tsx"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport CodeMirror, { ReactCodeMirrorProps } from '@uiw/react-codemirror';\nimport { PromQLExtension, CompleteConfiguration } from '@prometheus-io/codemirror-promql';\nimport { EditorView } from '@codemirror/view';\nimport { useTheme, CircularProgress, InputLabel, Stack, IconButton, Tooltip } from '@mui/material';\nimport FileTreeIcon from 'mdi-material-ui/FileTree';\nimport { ReactElement, useMemo, useState } from 'react';\nimport { ErrorAlert } from '@perses-dev/components';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useReplaceVariablesInString } from '@perses-dev/plugin-system';\nimport { PrometheusDatasourceSelector } from '../model';\nimport { replacePromBuiltinVariables } from '../plugins/prometheus-time-series-query/replace-prom-builtin-variables';\nimport { useParseQuery } from './parse';\nimport TreeNode from './TreeNode';\n\nconst treeViewStr = 'Tree View';\nconst treeViewOpenStr = 'Open ' + treeViewStr;\nconst treeViewCloseStr = 'Close ' + treeViewStr;\n\nexport type PromQLEditorProps = {\n  completeConfig: CompleteConfiguration;\n  datasource: PrometheusDatasourceSelector;\n} & Omit<ReactCodeMirrorProps, 'theme' | 'extensions'>;\n\nexport function PromQLEditor({ completeConfig, datasource, ...rest }: PromQLEditorProps): ReactElement {\n  const theme = useTheme();\n  const isDarkMode = theme.palette.mode === 'dark';\n  const [isTreeViewVisible, setTreeViewVisible] = useState(false);\n\n  const promQLExtension = useMemo(() => {\n    return new PromQLExtension().activateLinter(false).setComplete(completeConfig).asExtension();\n  }, [completeConfig]);\n\n  let queryExpr = useReplaceVariablesInString(rest.value);\n  if (queryExpr) {\n    // TODO placeholder values for steps to be replaced with actual values\n    // Looks like providing proper values involves some refactoring: currently we'd need to rely on the timeseries query context,\n    // but these step values are actually computed independently / before the queries are getting fired, so it's useless to fire\n    // queries here, so maybe we should extract this part to independant hook(s), to be reused here?\n    queryExpr = replacePromBuiltinVariables(queryExpr, 12345, 12345);\n  }\n\n  const { data: parseQueryResponse, isLoading, error } = useParseQuery(queryExpr ?? '', datasource, isTreeViewVisible);\n\n  const handleShowTreeView = (): void => {\n    setTreeViewVisible(!isTreeViewVisible);\n  };\n\n  return (\n    <Stack position=\"relative\">\n      <InputLabel // reproduce the same kind of input label that regular MUI TextFields have\n        shrink\n        sx={{\n          position: 'absolute',\n          top: '-8px',\n          left: '10px',\n          padding: '0 4px',\n          color: theme.palette.text.primary,\n          zIndex: 1,\n        }}\n      >\n        PromQL Expression\n      </InputLabel>\n      <CodeMirror\n        {...rest}\n        style={{ border: `1px solid ${theme.palette.divider}` }}\n        theme={isDarkMode ? 'dark' : 'light'}\n        basicSetup={{\n          highlightActiveLine: false,\n          highlightActiveLineGutter: false,\n          foldGutter: false,\n        }}\n        extensions={[\n          EditorView.lineWrapping,\n          promQLExtension,\n          EditorView.theme({\n            '.cm-content': {\n              paddingTop: '8px',\n              paddingBottom: '8px',\n              paddingRight: '40px', // offset for the tree view button\n            },\n          }),\n        ]}\n        placeholder=\"Example: sum(rate(http_requests_total[5m]))\"\n      />\n      {queryExpr && (\n        <>\n          <Tooltip title={isTreeViewVisible ? treeViewCloseStr : treeViewOpenStr}>\n            <IconButton\n              aria-label={isTreeViewVisible ? treeViewCloseStr : treeViewOpenStr}\n              onClick={handleShowTreeView}\n              sx={{ position: 'absolute', right: '5px', top: '5px' }}\n              size=\"small\"\n            >\n              <FileTreeIcon sx={{ fontSize: '18px' }} />\n            </IconButton>\n          </Tooltip>\n          {isTreeViewVisible && (\n            <div style={{ border: `1px solid ${theme.palette.divider}`, position: 'relative' }}>\n              <Tooltip title={treeViewCloseStr}>\n                <IconButton\n                  aria-label={treeViewCloseStr}\n                  onClick={() => setTreeViewVisible(false)}\n                  sx={{ position: 'absolute', top: '5px', right: '5px' }}\n                  size=\"small\"\n                >\n                  <CloseIcon sx={{ fontSize: '18px' }} />\n                </IconButton>\n              </Tooltip>\n              {error ? (\n                // Here the user is able to hide the error alert\n                <ErrorAlert\n                  error={{\n                    name: `${treeViewStr} not available`,\n                    message: error.message,\n                  }}\n                />\n              ) : (\n                <div\n                  style={{\n                    padding: `${theme.spacing(1.5)} ${theme.spacing(1.5)} 0 ${theme.spacing(1.5)}`, // let paddingBottom at 0 because nodes have margin-bottom\n                    overflowX: 'auto',\n                    backgroundColor: theme.palette.background.default,\n                  }}\n                >\n                  {isLoading ? (\n                    <CircularProgress />\n                  ) : parseQueryResponse?.data ? (\n                    <TreeNode node={parseQueryResponse.data} reverse={false} />\n                  ) : null}\n                </div>\n              )}\n            </div>\n          )}\n        </>\n      )}\n    </Stack>\n  );\n}\n"],"names":["CodeMirror","PromQLExtension","EditorView","useTheme","CircularProgress","InputLabel","Stack","IconButton","Tooltip","FileTreeIcon","useMemo","useState","ErrorAlert","CloseIcon","useReplaceVariablesInString","replacePromBuiltinVariables","useParseQuery","TreeNode","treeViewStr","treeViewOpenStr","treeViewCloseStr","PromQLEditor","completeConfig","datasource","rest","theme","isDarkMode","palette","mode","isTreeViewVisible","setTreeViewVisible","promQLExtension","activateLinter","setComplete","asExtension","queryExpr","value","data","parseQueryResponse","isLoading","error","handleShowTreeView","position","shrink","sx","top","left","padding","color","text","primary","zIndex","style","border","divider","basicSetup","highlightActiveLine","highlightActiveLineGutter","foldGutter","extensions","lineWrapping","paddingTop","paddingBottom","paddingRight","placeholder","title","aria-label","onClick","right","size","fontSize","div","name","message","spacing","overflowX","backgroundColor","background","default","node","reverse"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,OAAOA,gBAA0C,wBAAwB;AACzE,SAASC,eAAe,QAA+B,mCAAmC;AAC1F,SAASC,UAAU,QAAQ,mBAAmB;AAC9C,SAASC,QAAQ,EAAEC,gBAAgB,EAAEC,UAAU,EAAEC,KAAK,EAAEC,UAAU,EAAEC,OAAO,QAAQ,gBAAgB;AACnG,OAAOC,kBAAkB,2BAA2B;AACpD,SAAuBC,OAAO,EAAEC,QAAQ,QAAQ,QAAQ;AACxD,SAASC,UAAU,QAAQ,yBAAyB;AACpD,OAAOC,eAAe,wBAAwB;AAC9C,SAASC,2BAA2B,QAAQ,4BAA4B;AAExE,SAASC,2BAA2B,QAAQ,yEAAyE;AACrH,SAASC,aAAa,QAAQ,UAAU;AACxC,OAAOC,cAAc,aAAa;AAElC,MAAMC,cAAc;AACpB,MAAMC,kBAAkB,UAAUD;AAClC,MAAME,mBAAmB,WAAWF;AAOpC,OAAO,SAASG,aAAa,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAGC,MAAyB;IACrF,MAAMC,QAAQtB;IACd,MAAMuB,aAAaD,MAAME,OAAO,CAACC,IAAI,KAAK;IAC1C,MAAM,CAACC,mBAAmBC,mBAAmB,GAAGnB,SAAS;IAEzD,MAAMoB,kBAAkBrB,QAAQ;QAC9B,OAAO,IAAIT,kBAAkB+B,cAAc,CAAC,OAAOC,WAAW,CAACX,gBAAgBY,WAAW;IAC5F,GAAG;QAACZ;KAAe;IAEnB,IAAIa,YAAYrB,4BAA4BU,KAAKY,KAAK;IACtD,IAAID,WAAW;QACb,sEAAsE;QACtE,6HAA6H;QAC7H,4HAA4H;QAC5H,gGAAgG;QAChGA,YAAYpB,4BAA4BoB,WAAW,OAAO;IAC5D;IAEA,MAAM,EAAEE,MAAMC,kBAAkB,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGxB,cAAcmB,sBAAAA,uBAAAA,YAAa,IAAIZ,YAAYM;IAElG,MAAMY,qBAAqB;QACzBX,mBAAmB,CAACD;IACtB;IAEA,qBACE,MAACvB;QAAMoC,UAAS;;0BACd,KAACrC,WAAW,0EAA0E;;gBACpFsC,MAAM;gBACNC,IAAI;oBACFF,UAAU;oBACVG,KAAK;oBACLC,MAAM;oBACNC,SAAS;oBACTC,OAAOvB,MAAME,OAAO,CAACsB,IAAI,CAACC,OAAO;oBACjCC,QAAQ;gBACV;0BACD;;0BAGD,KAACnD;gBACE,GAAGwB,IAAI;gBACR4B,OAAO;oBAAEC,QAAQ,CAAC,UAAU,EAAE5B,MAAME,OAAO,CAAC2B,OAAO,CAAC,CAAC;gBAAC;gBACtD7B,OAAOC,aAAa,SAAS;gBAC7B6B,YAAY;oBACVC,qBAAqB;oBACrBC,2BAA2B;oBAC3BC,YAAY;gBACd;gBACAC,YAAY;oBACVzD,WAAW0D,YAAY;oBACvB7B;oBACA7B,WAAWuB,KAAK,CAAC;wBACf,eAAe;4BACboC,YAAY;4BACZC,eAAe;4BACfC,cAAc;wBAChB;oBACF;iBACD;gBACDC,aAAY;;YAEb7B,2BACC;;kCACE,KAAC3B;wBAAQyD,OAAOpC,oBAAoBT,mBAAmBD;kCACrD,cAAA,KAACZ;4BACC2D,cAAYrC,oBAAoBT,mBAAmBD;4BACnDgD,SAAS1B;4BACTG,IAAI;gCAAEF,UAAU;gCAAY0B,OAAO;gCAAOvB,KAAK;4BAAM;4BACrDwB,MAAK;sCAEL,cAAA,KAAC5D;gCAAamC,IAAI;oCAAE0B,UAAU;gCAAO;;;;oBAGxCzC,mCACC,MAAC0C;wBAAInB,OAAO;4BAAEC,QAAQ,CAAC,UAAU,EAAE5B,MAAME,OAAO,CAAC2B,OAAO,CAAC,CAAC;4BAAEZ,UAAU;wBAAW;;0CAC/E,KAAClC;gCAAQyD,OAAO7C;0CACd,cAAA,KAACb;oCACC2D,cAAY9C;oCACZ+C,SAAS,IAAMrC,mBAAmB;oCAClCc,IAAI;wCAAEF,UAAU;wCAAYG,KAAK;wCAAOuB,OAAO;oCAAM;oCACrDC,MAAK;8CAEL,cAAA,KAACxD;wCAAU+B,IAAI;4CAAE0B,UAAU;wCAAO;;;;4BAGrC9B,QACC,gDAAgD;0CAChD,KAAC5B;gCACC4B,OAAO;oCACLgC,MAAM,CAAC,EAAEtD,YAAY,cAAc,CAAC;oCACpCuD,SAASjC,MAAMiC,OAAO;gCACxB;+CAGF,KAACF;gCACCnB,OAAO;oCACLL,SAAS,CAAC,EAAEtB,MAAMiD,OAAO,CAAC,KAAK,CAAC,EAAEjD,MAAMiD,OAAO,CAAC,KAAK,GAAG,EAAEjD,MAAMiD,OAAO,CAAC,KAAK,CAAC;oCAC9EC,WAAW;oCACXC,iBAAiBnD,MAAME,OAAO,CAACkD,UAAU,CAACC,OAAO;gCACnD;0CAECvC,0BACC,KAACnC,wBACCkC,CAAAA,+BAAAA,yCAAAA,mBAAoBD,IAAI,kBAC1B,KAACpB;oCAAS8D,MAAMzC,mBAAmBD,IAAI;oCAAE2C,SAAS;qCAChD;;;;;;;;AAStB"}

package/dist/components/parse.d.ts

@@ -1,5 +1,5 @@
-import { DatasourceSelector } from '@perses-dev/core';
+import { DatasourceSelector, StatusError } from '@perses-dev/core';
 import { UseQueryResult } from '@tanstack/react-query';
 import { ParseQueryResponse } from '../model';
-export declare function useParseQuery(content: string, datasource: DatasourceSelector, enabled?: boolean): UseQueryResult<ParseQueryResponse>;
+export declare function useParseQuery(content: string, datasource: DatasourceSelector, enabled?: boolean): UseQueryResult<ParseQueryResponse, StatusError>;
 //# sourceMappingURL=parse.d.ts.map

package/dist/components/parse.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"parse.d.ts","sourceRoot":"","sources":["../../src/components/parse.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAA+B,kBAAkB,EAAoB,MAAM,UAAU,CAAC;AAE7F,wBAAgB,aAAa,CAC3B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,kBAAkB,CAAC,CAYpC"}
+{"version":3,"file":"parse.d.ts","sourceRoot":"","sources":["../../src/components/parse.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACnE,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAA+B,kBAAkB,EAAoB,MAAM,UAAU,CAAC;AAE7F,wBAAgB,aAAa,CAC3B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,kBAAkB,EAAE,WAAW,CAAC,CAYjD"}

package/dist/components/parse.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/parse.ts"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useDatasourceClient } from '@perses-dev/plugin-system';\nimport { DatasourceSelector } from '@perses-dev/core';\nimport { useQuery, UseQueryResult } from '@tanstack/react-query';\nimport { ParseQueryRequestParameters, ParseQueryResponse, PrometheusClient } from '../model';\n\nexport function useParseQuery(\n  content: string,\n  datasource: DatasourceSelector,\n  enabled?: boolean\n): UseQueryResult<ParseQueryResponse> {\n  const { data: client } = useDatasourceClient<PrometheusClient>(datasource);\n\n  return useQuery<ParseQueryResponse>({\n    enabled: !!client && enabled,\n    queryKey: ['parseQuery', content, 'datasource', datasource],\n    queryFn: async () => {\n      const params: ParseQueryRequestParameters = { query: content };\n\n      return await client!.parseQuery(params);\n    },\n  });\n}\n"],"names":["useDatasourceClient","useQuery","useParseQuery","content","datasource","enabled","data","client","queryKey","queryFn","params","query","parseQuery"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,mBAAmB,QAAQ,4BAA4B;AAEhE,SAASC,QAAQ,QAAwB,wBAAwB;AAGjE,OAAO,SAASC,cACdC,OAAe,EACfC,UAA8B,EAC9BC,OAAiB;IAEjB,MAAM,EAAEC,MAAMC,MAAM,EAAE,GAAGP,oBAAsCI;IAE/D,OAAOH,SAA6B;QAClCI,SAAS,CAAC,CAACE,UAAUF;QACrBG,UAAU;YAAC;YAAcL;YAAS;YAAcC;SAAW;QAC3DK,SAAS;YACP,MAAMC,SAAsC;gBAAEC,OAAOR;YAAQ;YAE7D,OAAO,MAAMI,OAAQK,UAAU,CAACF;QAClC;IACF;AACF"}
+{"version":3,"sources":["../../src/components/parse.ts"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useDatasourceClient } from '@perses-dev/plugin-system';\nimport { DatasourceSelector, StatusError } from '@perses-dev/core';\nimport { useQuery, UseQueryResult } from '@tanstack/react-query';\nimport { ParseQueryRequestParameters, ParseQueryResponse, PrometheusClient } from '../model';\n\nexport function useParseQuery(\n  content: string,\n  datasource: DatasourceSelector,\n  enabled?: boolean\n): UseQueryResult<ParseQueryResponse, StatusError> {\n  const { data: client } = useDatasourceClient<PrometheusClient>(datasource);\n\n  return useQuery<ParseQueryResponse, StatusError>({\n    enabled: !!client && enabled,\n    queryKey: ['parseQuery', content, 'datasource', datasource],\n    queryFn: async () => {\n      const params: ParseQueryRequestParameters = { query: content };\n\n      return await client!.parseQuery(params);\n    },\n  });\n}\n"],"names":["useDatasourceClient","useQuery","useParseQuery","content","datasource","enabled","data","client","queryKey","queryFn","params","query","parseQuery"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,mBAAmB,QAAQ,4BAA4B;AAEhE,SAASC,QAAQ,QAAwB,wBAAwB;AAGjE,OAAO,SAASC,cACdC,OAAe,EACfC,UAA8B,EAC9BC,OAAiB;IAEjB,MAAM,EAAEC,MAAMC,MAAM,EAAE,GAAGP,oBAAsCI;IAE/D,OAAOH,SAA0C;QAC/CI,SAAS,CAAC,CAACE,UAAUF;QACrBG,UAAU;YAAC;YAAcL;YAAS;YAAcC;SAAW;QAC3DK,SAAS;YACP,MAAMC,SAAsC;gBAAEC,OAAOR;YAAQ;YAE7D,OAAO,MAAMI,OAAQK,UAAU,CAACF;QAClC;IACF;AACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/prometheus-plugin",
-  "version": "0.50.0-rc.1",
+  "version": "0.50.0",
   "description": "Prometheus plugin for Perses",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -31,9 +31,9 @@
   "dependencies": {
     "@lezer/highlight": "^1.0.0",
     "@lezer/lr": "^1.2.0",
-    "@perses-dev/components": "0.50.0-rc.1",
-    "@perses-dev/core": "0.50.0-rc.1",
-    "@perses-dev/plugin-system": "0.50.0-rc.1",
+    "@perses-dev/components": "0.50.0",
+    "@perses-dev/core": "0.50.0",
+    "@perses-dev/plugin-system": "0.50.0",
     "@prometheus-io/codemirror-promql": "^0.43.0",
     "@uiw/react-codemirror": "^4.19.1",
     "date-fns": "^2.28.0",