@perses-dev/prometheus-plugin 0.57.1 → 0.58.0-beta.1

package/lib/components/promql/format.js

@@ -14,7 +14,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/format.tsx
 import React from 'react';
 import { styled } from '@mui/material';
-import { formatDuration, msToPrometheusDuration } from '@perses-dev/core';
+import { convertTimeToDuration, formatDuration } from '@perses-dev/spec';
 import { matchType, vectorMatchCardinality, nodeType } from './ast';
 import { maybeParenthesizeBinopChild, escapeString } from './utils';
 // Styled components that reproduce the theming of CodeMirror:
@@ -99,7 +99,7 @@ const formatAtAndOffset = (timestamp, startOrEnd, offset)=>/*#__PURE__*/ _jsxs(_
                     }),
                     ' ',
                     /*#__PURE__*/ _jsx(PromQLDuration, {
-                        children: formatDuration(msToPrometheusDuration(offset))
+                        children: formatDuration(convertTimeToDuration(offset))
                     })
                 ]
             }) : /*#__PURE__*/ _jsxs(_Fragment, {
@@ -112,7 +112,7 @@ const formatAtAndOffset = (timestamp, startOrEnd, offset)=>/*#__PURE__*/ _jsxs(_
                     /*#__PURE__*/ _jsxs(PromQLDuration, {
                         children: [
                             "-",
-                            formatDuration(msToPrometheusDuration(-offset))
+                            formatDuration(convertTimeToDuration(-offset))
                         ]
                     })
                 ]
@@ -154,7 +154,7 @@ const formatSelector = (node)=>{
                 children: [
                     "[",
                     /*#__PURE__*/ _jsx(PromQLDuration, {
-                        children: formatDuration(msToPrometheusDuration(node.range))
+                        children: formatDuration(convertTimeToDuration(node.range))
                     }),
                     "]"
                 ]
@@ -234,11 +234,11 @@ const formatNodeInternal = (node, showChildren, maxDepth)=>{
                     showChildren && formatNode(node.expr, showChildren, childMaxDepth),
                     "[",
                     /*#__PURE__*/ _jsx(PromQLDuration, {
-                        children: formatDuration(msToPrometheusDuration(node.range))
+                        children: formatDuration(convertTimeToDuration(node.range))
                     }),
                     ":",
                     node.step !== 0 && /*#__PURE__*/ _jsx(PromQLDuration, {
-                        children: formatDuration(msToPrometheusDuration(node.step))
+                        children: formatDuration(convertTimeToDuration(node.step))
                     }),
                     "]",
                     formatAtAndOffset(node.timestamp, node.startOrEnd, node.offset)

package/lib/components/promql/format.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/promql/format.tsx"],"sourcesContent":["// Copyright 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\n// Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/format.tsx\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { styled } from '@mui/material';\nimport { formatDuration, msToPrometheusDuration } from '@perses-dev/core';\nimport ASTNode, {\n  VectorSelector,\n  matchType,\n  vectorMatchCardinality,\n  nodeType,\n  StartOrEnd,\n  MatrixSelector,\n} from './ast';\nimport { maybeParenthesizeBinopChild, escapeString } from './utils';\n\n// Styled components that reproduce the theming of CodeMirror:\n\nconst PromQLCode = styled('span')(() => ({\n  fontFamily: '\"DejaVu Sans Mono\", monospace',\n}));\n\nconst PromQLKeyword = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#708',\n}));\n\nconst PromQLFunction = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#61afef' : '#2a2e42',\n}));\n\nconst PromQLMetricName = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e06c75' : '#2a2e42',\n}));\n\nconst PromQLLabelName = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#61afef' : '#219',\n}));\n\nconst PromQLString = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#98c379' : '#a31515',\n}));\n\nconst PromQLEllipsis = styled('span')(() => ({\n  color: '#aaaaaa', // Same color for both modes as in the original CSS\n}));\n\nconst PromQLDuration = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#09885a',\n}));\n\nconst PromQLNumber = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#164',\n}));\n\nconst PromQLOperator = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#56b6c2' : '#708',\n}));\n\nexport const labelNameList = (labels: string[]): React.ReactNode[] => {\n  return labels.map((l, i) => {\n    return (\n      <span key={i}>\n        {i !== 0 && ', '}\n        <PromQLLabelName>{l}</PromQLLabelName>\n      </span>\n    );\n  });\n};\n\nconst formatAtAndOffset = (timestamp: number | null, startOrEnd: StartOrEnd, offset: number): ReactNode => (\n  <>\n    {timestamp !== null ? (\n      <>\n        {' '}\n        <PromQLOperator>@</PromQLOperator> <PromQLNumber>{(timestamp / 1000).toFixed(3)}</PromQLNumber>\n      </>\n    ) : startOrEnd !== null ? (\n      <>\n        {' '}\n        <PromQLOperator>@</PromQLOperator> <PromQLKeyword>{startOrEnd}</PromQLKeyword>\n        <span>(</span>\n        <span>)</span>\n      </>\n    ) : (\n      <></>\n    )}\n    {offset === 0 ? (\n      <></>\n    ) : offset > 0 ? (\n      <>\n        {' '}\n        <PromQLKeyword>offset</PromQLKeyword>{' '}\n        <PromQLDuration>{formatDuration(msToPrometheusDuration(offset))}</PromQLDuration>\n      </>\n    ) : (\n      <>\n        {' '}\n        <PromQLKeyword>offset</PromQLKeyword>{' '}\n        <PromQLDuration>-{formatDuration(msToPrometheusDuration(-offset))}</PromQLDuration>\n      </>\n    )}\n  </>\n);\n\nconst formatSelector = (node: VectorSelector | MatrixSelector): ReactElement => {\n  const matchLabels = node.matchers\n    .filter((m) => !(m.name === '__name__' && m.type === matchType.equal && m.value === node.name))\n    .map((m, i) => (\n      <span key={i}>\n        {i !== 0 && ','}\n        <PromQLLabelName>{m.name}</PromQLLabelName>\n        {m.type}\n        <PromQLString>&quot;{escapeString(m.value)}&quot;</PromQLString>\n      </span>\n    ));\n\n  return (\n    <>\n      <PromQLMetricName>{node.name}</PromQLMetricName>\n      {matchLabels.length > 0 && (\n        <>\n          {'{'}\n          <span>{matchLabels}</span>\n          {'}'}\n        </>\n      )}\n      {node.type === nodeType.matrixSelector && (\n        <>\n          [<PromQLDuration>{formatDuration(msToPrometheusDuration(node.range))}</PromQLDuration>]\n        </>\n      )}\n      {formatAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}\n    </>\n  );\n};\n\nconst ellipsis = <PromQLEllipsis>…</PromQLEllipsis>;\n\nconst formatNodeInternal = (node: ASTNode, showChildren: boolean, maxDepth?: number): React.ReactNode => {\n  if (maxDepth === 0) {\n    return ellipsis;\n  }\n\n  const childMaxDepth = maxDepth === undefined ? undefined : maxDepth - 1;\n\n  switch (node.type) {\n    case nodeType.aggregation:\n      return (\n        <>\n          <PromQLOperator>{node.op}</PromQLOperator>\n          {node.without ? (\n            <>\n              {' '}\n              <PromQLKeyword>without</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(node.grouping)}\n              <span>)</span>{' '}\n            </>\n          ) : (\n            node.grouping.length > 0 && (\n              <>\n                {' '}\n                <PromQLKeyword>by</PromQLKeyword>\n                <span>(</span>\n                {labelNameList(node.grouping)}\n                <span>)</span>{' '}\n              </>\n            )\n          )}\n          {showChildren && (\n            <>\n              <span>(</span>\n              {node.param !== null && <>{formatNode(node.param, showChildren, childMaxDepth)}, </>}\n              {formatNode(node.expr, showChildren, childMaxDepth)}\n              <span>)</span>\n            </>\n          )}\n        </>\n      );\n    case nodeType.subquery:\n      return (\n        <>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}[\n          <PromQLDuration>{formatDuration(msToPrometheusDuration(node.range))}</PromQLDuration>:\n          {node.step !== 0 && <PromQLDuration>{formatDuration(msToPrometheusDuration(node.step))}</PromQLDuration>}]\n          {formatAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}\n        </>\n      );\n    case nodeType.parenExpr:\n      return (\n        <>\n          <span>(</span>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}\n          <span>)</span>\n        </>\n      );\n    case nodeType.call: {\n      const children =\n        childMaxDepth === undefined || childMaxDepth > 0\n          ? node.args.map((arg, i) => (\n              <span key={i}>\n                {i !== 0 && ', '}\n                {formatNode(arg, showChildren)}\n              </span>\n            ))\n          : node.args.length > 0\n            ? ellipsis\n            : '';\n\n      return (\n        <>\n          <PromQLFunction>{node.func.name}</PromQLFunction>\n          {showChildren && (\n            <>\n              <span>(</span>\n              {children}\n              <span>)</span>\n            </>\n          )}\n        </>\n      );\n    }\n    case nodeType.matrixSelector:\n      return formatSelector(node);\n    case nodeType.vectorSelector:\n      return formatSelector(node);\n    case nodeType.numberLiteral:\n      return <PromQLNumber>{node.val}</PromQLNumber>;\n    case nodeType.stringLiteral:\n      return <PromQLString>&quot;{escapeString(node.val)}&quot;</PromQLString>;\n    case nodeType.unaryExpr:\n      return (\n        <>\n          <PromQLOperator>{node.op}</PromQLOperator>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}\n        </>\n      );\n    case nodeType.binaryExpr: {\n      let matching = <></>;\n      let grouping = <></>;\n      const vm = node.matching;\n      if (vm !== null && (vm.labels.length > 0 || vm.on)) {\n        if (vm.on) {\n          matching = (\n            <>\n              {' '}\n              <PromQLKeyword>on</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.labels)}\n              <span>)</span>\n            </>\n          );\n        } else {\n          matching = (\n            <>\n              {' '}\n              <PromQLKeyword>ignoring</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.labels)}\n              <span>)</span>\n            </>\n          );\n        }\n\n        if (vm.card === vectorMatchCardinality.manyToOne || vm.card === vectorMatchCardinality.oneToMany) {\n          grouping = (\n            <>\n              <PromQLKeyword>\n                {' '}\n                group_\n                {vm.card === vectorMatchCardinality.manyToOne ? 'left' : 'right'}\n              </PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.include)}\n              <span>)</span>\n            </>\n          );\n        }\n      }\n\n      return (\n        <>\n          {showChildren && formatNode(maybeParenthesizeBinopChild(node.op, node.lhs), showChildren, childMaxDepth)}{' '}\n          {['atan2', 'and', 'or', 'unless'].includes(node.op) ? (\n            <PromQLOperator>{node.op}</PromQLOperator>\n          ) : (\n            <PromQLOperator>{node.op}</PromQLOperator>\n          )}\n          {node.bool && (\n            <>\n              {' '}\n              <PromQLKeyword>bool</PromQLKeyword>\n            </>\n          )}\n          {matching}\n          {grouping}{' '}\n          {showChildren && formatNode(maybeParenthesizeBinopChild(node.op, node.rhs), showChildren, childMaxDepth)}\n        </>\n      );\n    }\n    case nodeType.placeholder:\n      // TODO: Include possible children of placeholders somehow?\n      return ellipsis;\n    default:\n      throw new Error('unsupported node type');\n  }\n};\n\nexport const formatNode = (node: ASTNode, showChildren: boolean, maxDepth?: number): React.ReactElement => (\n  <PromQLCode>{formatNodeInternal(node, showChildren, maxDepth)}</PromQLCode>\n);\n"],"names":["React","styled","formatDuration","msToPrometheusDuration","matchType","vectorMatchCardinality","nodeType","maybeParenthesizeBinopChild","escapeString","PromQLCode","fontFamily","PromQLKeyword","theme","color","palette","mode","PromQLFunction","PromQLMetricName","PromQLLabelName","PromQLString","PromQLEllipsis","PromQLDuration","PromQLNumber","PromQLOperator","labelNameList","labels","map","l","i","span","formatAtAndOffset","timestamp","startOrEnd","offset","toFixed","formatSelector","node","matchLabels","matchers","filter","m","name","type","equal","value","length","matrixSelector","range","ellipsis","formatNodeInternal","showChildren","maxDepth","childMaxDepth","undefined","aggregation","op","without","grouping","param","formatNode","expr","subquery","step","parenExpr","call","children","args","arg","func","vectorSelector","numberLiteral","val","stringLiteral","unaryExpr","binaryExpr","matching","vm","on","card","manyToOne","oneToMany","include","lhs","includes","bool","rhs","placeholder","Error"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/promql/format.tsx"],"sourcesContent":["// Copyright 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\n// Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/format.tsx\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { styled } from '@mui/material';\n\nimport { convertTimeToDuration, formatDuration } from '@perses-dev/spec';\nimport ASTNode, {\n  VectorSelector,\n  matchType,\n  vectorMatchCardinality,\n  nodeType,\n  StartOrEnd,\n  MatrixSelector,\n} from './ast';\nimport { maybeParenthesizeBinopChild, escapeString } from './utils';\n\n// Styled components that reproduce the theming of CodeMirror:\n\nconst PromQLCode = styled('span')(() => ({\n  fontFamily: '\"DejaVu Sans Mono\", monospace',\n}));\n\nconst PromQLKeyword = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#708',\n}));\n\nconst PromQLFunction = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#61afef' : '#2a2e42',\n}));\n\nconst PromQLMetricName = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e06c75' : '#2a2e42',\n}));\n\nconst PromQLLabelName = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#61afef' : '#219',\n}));\n\nconst PromQLString = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#98c379' : '#a31515',\n}));\n\nconst PromQLEllipsis = styled('span')(() => ({\n  color: '#aaaaaa', // Same color for both modes as in the original CSS\n}));\n\nconst PromQLDuration = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#09885a',\n}));\n\nconst PromQLNumber = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#e5c07b' : '#164',\n}));\n\nconst PromQLOperator = styled('span')(({ theme }) => ({\n  color: theme.palette.mode === 'dark' ? '#56b6c2' : '#708',\n}));\n\nexport const labelNameList = (labels: string[]): React.ReactNode[] => {\n  return labels.map((l, i) => {\n    return (\n      <span key={i}>\n        {i !== 0 && ', '}\n        <PromQLLabelName>{l}</PromQLLabelName>\n      </span>\n    );\n  });\n};\n\nconst formatAtAndOffset = (timestamp: number | null, startOrEnd: StartOrEnd, offset: number): ReactNode => (\n  <>\n    {timestamp !== null ? (\n      <>\n        {' '}\n        <PromQLOperator>@</PromQLOperator> <PromQLNumber>{(timestamp / 1000).toFixed(3)}</PromQLNumber>\n      </>\n    ) : startOrEnd !== null ? (\n      <>\n        {' '}\n        <PromQLOperator>@</PromQLOperator> <PromQLKeyword>{startOrEnd}</PromQLKeyword>\n        <span>(</span>\n        <span>)</span>\n      </>\n    ) : (\n      <></>\n    )}\n    {offset === 0 ? (\n      <></>\n    ) : offset > 0 ? (\n      <>\n        {' '}\n        <PromQLKeyword>offset</PromQLKeyword>{' '}\n        <PromQLDuration>{formatDuration(convertTimeToDuration(offset))}</PromQLDuration>\n      </>\n    ) : (\n      <>\n        {' '}\n        <PromQLKeyword>offset</PromQLKeyword>{' '}\n        <PromQLDuration>-{formatDuration(convertTimeToDuration(-offset))}</PromQLDuration>\n      </>\n    )}\n  </>\n);\n\nconst formatSelector = (node: VectorSelector | MatrixSelector): ReactElement => {\n  const matchLabels = node.matchers\n    .filter((m) => !(m.name === '__name__' && m.type === matchType.equal && m.value === node.name))\n    .map((m, i) => (\n      <span key={i}>\n        {i !== 0 && ','}\n        <PromQLLabelName>{m.name}</PromQLLabelName>\n        {m.type}\n        <PromQLString>&quot;{escapeString(m.value)}&quot;</PromQLString>\n      </span>\n    ));\n\n  return (\n    <>\n      <PromQLMetricName>{node.name}</PromQLMetricName>\n      {matchLabels.length > 0 && (\n        <>\n          {'{'}\n          <span>{matchLabels}</span>\n          {'}'}\n        </>\n      )}\n      {node.type === nodeType.matrixSelector && (\n        <>\n          [<PromQLDuration>{formatDuration(convertTimeToDuration(node.range))}</PromQLDuration>]\n        </>\n      )}\n      {formatAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}\n    </>\n  );\n};\n\nconst ellipsis = <PromQLEllipsis>…</PromQLEllipsis>;\n\nconst formatNodeInternal = (node: ASTNode, showChildren: boolean, maxDepth?: number): React.ReactNode => {\n  if (maxDepth === 0) {\n    return ellipsis;\n  }\n\n  const childMaxDepth = maxDepth === undefined ? undefined : maxDepth - 1;\n\n  switch (node.type) {\n    case nodeType.aggregation:\n      return (\n        <>\n          <PromQLOperator>{node.op}</PromQLOperator>\n          {node.without ? (\n            <>\n              {' '}\n              <PromQLKeyword>without</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(node.grouping)}\n              <span>)</span>{' '}\n            </>\n          ) : (\n            node.grouping.length > 0 && (\n              <>\n                {' '}\n                <PromQLKeyword>by</PromQLKeyword>\n                <span>(</span>\n                {labelNameList(node.grouping)}\n                <span>)</span>{' '}\n              </>\n            )\n          )}\n          {showChildren && (\n            <>\n              <span>(</span>\n              {node.param !== null && <>{formatNode(node.param, showChildren, childMaxDepth)}, </>}\n              {formatNode(node.expr, showChildren, childMaxDepth)}\n              <span>)</span>\n            </>\n          )}\n        </>\n      );\n    case nodeType.subquery:\n      return (\n        <>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}[\n          <PromQLDuration>{formatDuration(convertTimeToDuration(node.range))}</PromQLDuration>:\n          {node.step !== 0 && <PromQLDuration>{formatDuration(convertTimeToDuration(node.step))}</PromQLDuration>}]\n          {formatAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}\n        </>\n      );\n    case nodeType.parenExpr:\n      return (\n        <>\n          <span>(</span>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}\n          <span>)</span>\n        </>\n      );\n    case nodeType.call: {\n      const children =\n        childMaxDepth === undefined || childMaxDepth > 0\n          ? node.args.map((arg, i) => (\n              <span key={i}>\n                {i !== 0 && ', '}\n                {formatNode(arg, showChildren)}\n              </span>\n            ))\n          : node.args.length > 0\n            ? ellipsis\n            : '';\n\n      return (\n        <>\n          <PromQLFunction>{node.func.name}</PromQLFunction>\n          {showChildren && (\n            <>\n              <span>(</span>\n              {children}\n              <span>)</span>\n            </>\n          )}\n        </>\n      );\n    }\n    case nodeType.matrixSelector:\n      return formatSelector(node);\n    case nodeType.vectorSelector:\n      return formatSelector(node);\n    case nodeType.numberLiteral:\n      return <PromQLNumber>{node.val}</PromQLNumber>;\n    case nodeType.stringLiteral:\n      return <PromQLString>&quot;{escapeString(node.val)}&quot;</PromQLString>;\n    case nodeType.unaryExpr:\n      return (\n        <>\n          <PromQLOperator>{node.op}</PromQLOperator>\n          {showChildren && formatNode(node.expr, showChildren, childMaxDepth)}\n        </>\n      );\n    case nodeType.binaryExpr: {\n      let matching = <></>;\n      let grouping = <></>;\n      const vm = node.matching;\n      if (vm !== null && (vm.labels.length > 0 || vm.on)) {\n        if (vm.on) {\n          matching = (\n            <>\n              {' '}\n              <PromQLKeyword>on</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.labels)}\n              <span>)</span>\n            </>\n          );\n        } else {\n          matching = (\n            <>\n              {' '}\n              <PromQLKeyword>ignoring</PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.labels)}\n              <span>)</span>\n            </>\n          );\n        }\n\n        if (vm.card === vectorMatchCardinality.manyToOne || vm.card === vectorMatchCardinality.oneToMany) {\n          grouping = (\n            <>\n              <PromQLKeyword>\n                {' '}\n                group_\n                {vm.card === vectorMatchCardinality.manyToOne ? 'left' : 'right'}\n              </PromQLKeyword>\n              <span>(</span>\n              {labelNameList(vm.include)}\n              <span>)</span>\n            </>\n          );\n        }\n      }\n\n      return (\n        <>\n          {showChildren && formatNode(maybeParenthesizeBinopChild(node.op, node.lhs), showChildren, childMaxDepth)}{' '}\n          {['atan2', 'and', 'or', 'unless'].includes(node.op) ? (\n            <PromQLOperator>{node.op}</PromQLOperator>\n          ) : (\n            <PromQLOperator>{node.op}</PromQLOperator>\n          )}\n          {node.bool && (\n            <>\n              {' '}\n              <PromQLKeyword>bool</PromQLKeyword>\n            </>\n          )}\n          {matching}\n          {grouping}{' '}\n          {showChildren && formatNode(maybeParenthesizeBinopChild(node.op, node.rhs), showChildren, childMaxDepth)}\n        </>\n      );\n    }\n    case nodeType.placeholder:\n      // TODO: Include possible children of placeholders somehow?\n      return ellipsis;\n    default:\n      throw new Error('unsupported node type');\n  }\n};\n\nexport const formatNode = (node: ASTNode, showChildren: boolean, maxDepth?: number): React.ReactElement => (\n  <PromQLCode>{formatNodeInternal(node, showChildren, maxDepth)}</PromQLCode>\n);\n"],"names":["React","styled","convertTimeToDuration","formatDuration","matchType","vectorMatchCardinality","nodeType","maybeParenthesizeBinopChild","escapeString","PromQLCode","fontFamily","PromQLKeyword","theme","color","palette","mode","PromQLFunction","PromQLMetricName","PromQLLabelName","PromQLString","PromQLEllipsis","PromQLDuration","PromQLNumber","PromQLOperator","labelNameList","labels","map","l","i","span","formatAtAndOffset","timestamp","startOrEnd","offset","toFixed","formatSelector","node","matchLabels","matchers","filter","m","name","type","equal","value","length","matrixSelector","range","ellipsis","formatNodeInternal","showChildren","maxDepth","childMaxDepth","undefined","aggregation","op","without","grouping","param","formatNode","expr","subquery","step","parenExpr","call","children","args","arg","func","vectorSelector","numberLiteral","val","stringLiteral","unaryExpr","binaryExpr","matching","vm","on","card","manyToOne","oneToMany","include","lhs","includes","bool","rhs","placeholder","Error"],"mappings":"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"}

package/lib/components/promql/serialize.js

@@ -11,13 +11,13 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 // Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/serialize.ts
-import { formatDuration, msToPrometheusDuration } from '@perses-dev/core';
+import { convertTimeToDuration, formatDuration } from '@perses-dev/spec';
 import { matchType, vectorMatchCardinality, nodeType } from './ast';
 import { aggregatorsWithParam, maybeParenthesizeBinopChild, escapeString } from './utils';
-const serializeAtAndOffset = (timestamp, startOrEnd, offset)=>`${timestamp !== null ? ` @ ${(timestamp / 1000).toFixed(3)}` : startOrEnd !== null ? ` @ ${startOrEnd}()` : ''}${offset === 0 ? '' : offset > 0 ? ` offset ${formatDuration(msToPrometheusDuration(offset))}` : ` offset -${formatDuration(msToPrometheusDuration(-offset))}`}`;
+const serializeAtAndOffset = (timestamp, startOrEnd, offset)=>`${timestamp !== null ? ` @ ${(timestamp / 1000).toFixed(3)}` : startOrEnd !== null ? ` @ ${startOrEnd}()` : ''}${offset === 0 ? '' : offset > 0 ? ` offset ${formatDuration(convertTimeToDuration(offset))}` : ` offset -${formatDuration(convertTimeToDuration(-offset))}`}`;
 const serializeSelector = (node)=>{
     const matchers = node.matchers.filter((m)=>!(m.name === '__name__' && m.type === matchType.equal && m.value === node.name)).map((m)=>`${m.name}${m.type}"${escapeString(m.value)}"`);
-    const range = node.type === nodeType.matrixSelector ? `[${formatDuration(msToPrometheusDuration(node.range))}]` : '';
+    const range = node.type === nodeType.matrixSelector ? `[${formatDuration(convertTimeToDuration(node.range))}]` : '';
     const atAndOffset = serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset);
     return `${node.name}${matchers.length > 0 ? `{${matchers.join(',')}}` : ''}${range}${atAndOffset}`;
 };
@@ -32,7 +32,7 @@ const serializeNode = (node, indent = 0, pretty = false, initialIndent = true)=>
         case nodeType.aggregation:
             return `${initialInd}${node.op}${node.without ? ` without(${node.grouping.join(', ')}) ` : node.grouping.length > 0 ? ` by(${node.grouping.join(', ')}) ` : ''}(${childListSeparator}${aggregatorsWithParam.includes(node.op) && node.param !== null ? `${serializeNode(node.param, childIndent, pretty)},${childSeparator}` : ''}${serializeNode(node.expr, childIndent, pretty)}${childListSeparator}${ind})`;
         case nodeType.subquery:
-            return `${initialInd}${serializeNode(node.expr, indent, pretty)}[${formatDuration(msToPrometheusDuration(node.range))}:${node.step !== 0 ? formatDuration(msToPrometheusDuration(node.step)) : ''}]${serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}`;
+            return `${initialInd}${serializeNode(node.expr, indent, pretty)}[${formatDuration(convertTimeToDuration(node.range))}:${node.step !== 0 ? formatDuration(convertTimeToDuration(node.step)) : ''}]${serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}`;
         case nodeType.parenExpr:
             return `${initialInd}(${childListSeparator}${serializeNode(node.expr, childIndent, pretty)}${childListSeparator}${ind})`;
         case nodeType.call:

package/lib/components/promql/serialize.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/promql/serialize.ts"],"sourcesContent":["// Copyright 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\n// Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/serialize.ts\n\nimport { formatDuration, msToPrometheusDuration } from '@perses-dev/core';\nimport ASTNode, {\n  VectorSelector,\n  matchType,\n  vectorMatchCardinality,\n  nodeType,\n  StartOrEnd,\n  MatrixSelector,\n} from './ast';\nimport { aggregatorsWithParam, maybeParenthesizeBinopChild, escapeString } from './utils';\n\nconst serializeAtAndOffset = (timestamp: number | null, startOrEnd: StartOrEnd, offset: number): string =>\n  `${timestamp !== null ? ` @ ${(timestamp / 1000).toFixed(3)}` : startOrEnd !== null ? ` @ ${startOrEnd}()` : ''}${\n    offset === 0\n      ? ''\n      : offset > 0\n        ? ` offset ${formatDuration(msToPrometheusDuration(offset))}`\n        : ` offset -${formatDuration(msToPrometheusDuration(-offset))}`\n  }`;\n\nconst serializeSelector = (node: VectorSelector | MatrixSelector): string => {\n  const matchers = node.matchers\n    .filter((m) => !(m.name === '__name__' && m.type === matchType.equal && m.value === node.name))\n    .map((m) => `${m.name}${m.type}\"${escapeString(m.value)}\"`);\n\n  const range = node.type === nodeType.matrixSelector ? `[${formatDuration(msToPrometheusDuration(node.range))}]` : '';\n  const atAndOffset = serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset);\n\n  return `${node.name}${matchers.length > 0 ? `{${matchers.join(',')}}` : ''}${range}${atAndOffset}`;\n};\n\nconst serializeNode = (node: ASTNode, indent = 0, pretty = false, initialIndent = true): string => {\n  const childListSeparator = pretty ? '\\n' : '';\n  const childSeparator = pretty ? '\\n' : ' ';\n  const childIndent = indent + 2;\n  const ind = pretty ? ' '.repeat(indent) : '';\n  // Needed for unary operators.\n  const initialInd = initialIndent ? ind : '';\n\n  switch (node.type) {\n    case nodeType.aggregation:\n      return `${initialInd}${node.op}${\n        node.without\n          ? ` without(${node.grouping.join(', ')}) `\n          : node.grouping.length > 0\n            ? ` by(${node.grouping.join(', ')}) `\n            : ''\n      }(${childListSeparator}${\n        aggregatorsWithParam.includes(node.op) && node.param !== null\n          ? `${serializeNode(node.param, childIndent, pretty)},${childSeparator}`\n          : ''\n      }${serializeNode(node.expr, childIndent, pretty)}${childListSeparator}${ind})`;\n\n    case nodeType.subquery:\n      return `${initialInd}${serializeNode(node.expr, indent, pretty)}[${formatDuration(msToPrometheusDuration(node.range))}:${\n        node.step !== 0 ? formatDuration(msToPrometheusDuration(node.step)) : ''\n      }]${serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}`;\n\n    case nodeType.parenExpr:\n      return `${initialInd}(${childListSeparator}${serializeNode(\n        node.expr,\n        childIndent,\n        pretty\n      )}${childListSeparator}${ind})`;\n\n    case nodeType.call: {\n      const sep = node.args.length > 0 ? childListSeparator : '';\n\n      return `${initialInd}${node.func.name}(${sep}${node.args\n        .map((arg) => serializeNode(arg, childIndent, pretty))\n        .join(',' + childSeparator)}${sep}${node.args.length > 0 ? ind : ''})`;\n    }\n\n    case nodeType.matrixSelector:\n      return `${initialInd}${serializeSelector(node)}`;\n\n    case nodeType.vectorSelector:\n      return `${initialInd}${serializeSelector(node)}`;\n\n    case nodeType.numberLiteral:\n      return `${initialInd}${node.val}`;\n\n    case nodeType.stringLiteral:\n      return `${initialInd}\"${escapeString(node.val)}\"`;\n\n    case nodeType.unaryExpr:\n      return `${initialInd}${node.op}${serializeNode(node.expr, indent, pretty, false)}`;\n\n    case nodeType.binaryExpr: {\n      let matching = '';\n      let grouping = '';\n      const vm = node.matching;\n      if (vm !== null && (vm.labels.length > 0 || vm.on)) {\n        if (vm.on) {\n          matching = ` on(${vm.labels.join(', ')})`;\n        } else {\n          matching = ` ignoring(${vm.labels.join(', ')})`;\n        }\n\n        if (vm.card === vectorMatchCardinality.manyToOne || vm.card === vectorMatchCardinality.oneToMany) {\n          grouping = ` group_${vm.card === vectorMatchCardinality.manyToOne ? 'left' : 'right'}(${vm.include.join(',')})`;\n        }\n      }\n\n      return `${serializeNode(maybeParenthesizeBinopChild(node.op, node.lhs), childIndent, pretty)}${childSeparator}${ind}${\n        node.op\n      }${node.bool ? ' bool' : ''}${matching}${grouping}${childSeparator}${serializeNode(\n        maybeParenthesizeBinopChild(node.op, node.rhs),\n        childIndent,\n        pretty\n      )}`;\n    }\n\n    case nodeType.placeholder:\n      // TODO: Should we just throw an error when trying to serialize an AST containing a placeholder node?\n      // (that would currently break editing-as-text of ASTs that contain placeholders)\n      return `${initialInd}…${\n        node.children.length > 0\n          ? `(${childListSeparator}${node.children\n              .map((child) => serializeNode(child, childIndent, pretty))\n              .join(',' + childSeparator)}${childListSeparator}${ind})`\n          : ''\n      }`;\n\n    default:\n      throw new Error('unsupported node type');\n  }\n};\n\nexport default serializeNode;\n"],"names":["formatDuration","msToPrometheusDuration","matchType","vectorMatchCardinality","nodeType","aggregatorsWithParam","maybeParenthesizeBinopChild","escapeString","serializeAtAndOffset","timestamp","startOrEnd","offset","toFixed","serializeSelector","node","matchers","filter","m","name","type","equal","value","map","range","matrixSelector","atAndOffset","length","join","serializeNode","indent","pretty","initialIndent","childListSeparator","childSeparator","childIndent","ind","repeat","initialInd","aggregation","op","without","grouping","includes","param","expr","subquery","step","parenExpr","call","sep","args","func","arg","vectorSelector","numberLiteral","val","stringLiteral","unaryExpr","binaryExpr","matching","vm","labels","on","card","manyToOne","oneToMany","include","lhs","bool","rhs","placeholder","children","child","Error"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,+IAA+I;AAE/I,SAASA,cAAc,EAAEC,sBAAsB,QAAQ,mBAAmB;AAC1E,SAEEC,SAAS,EACTC,sBAAsB,EACtBC,QAAQ,QAGH,QAAQ;AACf,SAASC,oBAAoB,EAAEC,2BAA2B,EAAEC,YAAY,QAAQ,UAAU;AAE1F,MAAMC,uBAAuB,CAACC,WAA0BC,YAAwBC,SAC9E,GAAGF,cAAc,OAAO,CAAC,GAAG,EAAE,AAACA,CAAAA,YAAY,IAAG,EAAGG,OAAO,CAAC,IAAI,GAAGF,eAAe,OAAO,CAAC,GAAG,EAAEA,WAAW,EAAE,CAAC,GAAG,KAC3GC,WAAW,IACP,KACAA,SAAS,IACP,CAAC,QAAQ,EAAEX,eAAeC,uBAAuBU,UAAU,GAC3D,CAAC,SAAS,EAAEX,eAAeC,uBAAuB,CAACU,UAAU,EACnE;AAEJ,MAAME,oBAAoB,CAACC;IACzB,MAAMC,WAAWD,KAAKC,QAAQ,CAC3BC,MAAM,CAAC,CAACC,IAAM,CAAEA,CAAAA,EAAEC,IAAI,KAAK,cAAcD,EAAEE,IAAI,KAAKjB,UAAUkB,KAAK,IAAIH,EAAEI,KAAK,KAAKP,KAAKI,IAAI,AAAD,GAC3FI,GAAG,CAAC,CAACL,IAAM,GAAGA,EAAEC,IAAI,GAAGD,EAAEE,IAAI,CAAC,CAAC,EAAEZ,aAAaU,EAAEI,KAAK,EAAE,CAAC,CAAC;IAE5D,MAAME,QAAQT,KAAKK,IAAI,KAAKf,SAASoB,cAAc,GAAG,CAAC,CAAC,EAAExB,eAAeC,uBAAuBa,KAAKS,KAAK,GAAG,CAAC,CAAC,GAAG;IAClH,MAAME,cAAcjB,qBAAqBM,KAAKL,SAAS,EAAEK,KAAKJ,UAAU,EAAEI,KAAKH,MAAM;IAErF,OAAO,GAAGG,KAAKI,IAAI,GAAGH,SAASW,MAAM,GAAG,IAAI,CAAC,CAAC,EAAEX,SAASY,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,KAAKJ,QAAQE,aAAa;AACpG;AAEA,MAAMG,gBAAgB,CAACd,MAAee,SAAS,CAAC,EAAEC,SAAS,KAAK,EAAEC,gBAAgB,IAAI;IACpF,MAAMC,qBAAqBF,SAAS,OAAO;IAC3C,MAAMG,iBAAiBH,SAAS,OAAO;IACvC,MAAMI,cAAcL,SAAS;IAC7B,MAAMM,MAAML,SAAS,IAAIM,MAAM,CAACP,UAAU;IAC1C,8BAA8B;IAC9B,MAAMQ,aAAaN,gBAAgBI,MAAM;IAEzC,OAAQrB,KAAKK,IAAI;QACf,KAAKf,SAASkC,WAAW;YACvB,OAAO,GAAGD,aAAavB,KAAKyB,EAAE,GAC5BzB,KAAK0B,OAAO,GACR,CAAC,SAAS,EAAE1B,KAAK2B,QAAQ,CAACd,IAAI,CAAC,MAAM,EAAE,CAAC,GACxCb,KAAK2B,QAAQ,CAACf,MAAM,GAAG,IACrB,CAAC,IAAI,EAAEZ,KAAK2B,QAAQ,CAACd,IAAI,CAAC,MAAM,EAAE,CAAC,GACnC,GACP,CAAC,EAAEK,qBACF3B,qBAAqBqC,QAAQ,CAAC5B,KAAKyB,EAAE,KAAKzB,KAAK6B,KAAK,KAAK,OACrD,GAAGf,cAAcd,KAAK6B,KAAK,EAAET,aAAaJ,QAAQ,CAAC,EAAEG,gBAAgB,GACrE,KACHL,cAAcd,KAAK8B,IAAI,EAAEV,aAAaJ,UAAUE,qBAAqBG,IAAI,CAAC,CAAC;QAEhF,KAAK/B,SAASyC,QAAQ;YACpB,OAAO,GAAGR,aAAaT,cAAcd,KAAK8B,IAAI,EAAEf,QAAQC,QAAQ,CAAC,EAAE9B,eAAeC,uBAAuBa,KAAKS,KAAK,GAAG,CAAC,EACrHT,KAAKgC,IAAI,KAAK,IAAI9C,eAAeC,uBAAuBa,KAAKgC,IAAI,KAAK,GACvE,CAAC,EAAEtC,qBAAqBM,KAAKL,SAAS,EAAEK,KAAKJ,UAAU,EAAEI,KAAKH,MAAM,GAAG;QAE1E,KAAKP,SAAS2C,SAAS;YACrB,OAAO,GAAGV,WAAW,CAAC,EAAEL,qBAAqBJ,cAC3Cd,KAAK8B,IAAI,EACTV,aACAJ,UACEE,qBAAqBG,IAAI,CAAC,CAAC;QAEjC,KAAK/B,SAAS4C,IAAI;YAAE;gBAClB,MAAMC,MAAMnC,KAAKoC,IAAI,CAACxB,MAAM,GAAG,IAAIM,qBAAqB;gBAExD,OAAO,GAAGK,aAAavB,KAAKqC,IAAI,CAACjC,IAAI,CAAC,CAAC,EAAE+B,MAAMnC,KAAKoC,IAAI,CACrD5B,GAAG,CAAC,CAAC8B,MAAQxB,cAAcwB,KAAKlB,aAAaJ,SAC7CH,IAAI,CAAC,MAAMM,kBAAkBgB,MAAMnC,KAAKoC,IAAI,CAACxB,MAAM,GAAG,IAAIS,MAAM,GAAG,CAAC,CAAC;YAC1E;QAEA,KAAK/B,SAASoB,cAAc;YAC1B,OAAO,GAAGa,aAAaxB,kBAAkBC,OAAO;QAElD,KAAKV,SAASiD,cAAc;YAC1B,OAAO,GAAGhB,aAAaxB,kBAAkBC,OAAO;QAElD,KAAKV,SAASkD,aAAa;YACzB,OAAO,GAAGjB,aAAavB,KAAKyC,GAAG,EAAE;QAEnC,KAAKnD,SAASoD,aAAa;YACzB,OAAO,GAAGnB,WAAW,CAAC,EAAE9B,aAAaO,KAAKyC,GAAG,EAAE,CAAC,CAAC;QAEnD,KAAKnD,SAASqD,SAAS;YACrB,OAAO,GAAGpB,aAAavB,KAAKyB,EAAE,GAAGX,cAAcd,KAAK8B,IAAI,EAAEf,QAAQC,QAAQ,QAAQ;QAEpF,KAAK1B,SAASsD,UAAU;YAAE;gBACxB,IAAIC,WAAW;gBACf,IAAIlB,WAAW;gBACf,MAAMmB,KAAK9C,KAAK6C,QAAQ;gBACxB,IAAIC,OAAO,QAASA,CAAAA,GAAGC,MAAM,CAACnC,MAAM,GAAG,KAAKkC,GAAGE,EAAE,AAAD,GAAI;oBAClD,IAAIF,GAAGE,EAAE,EAAE;wBACTH,WAAW,CAAC,IAAI,EAAEC,GAAGC,MAAM,CAAClC,IAAI,CAAC,MAAM,CAAC,CAAC;oBAC3C,OAAO;wBACLgC,WAAW,CAAC,UAAU,EAAEC,GAAGC,MAAM,CAAClC,IAAI,CAAC,MAAM,CAAC,CAAC;oBACjD;oBAEA,IAAIiC,GAAGG,IAAI,KAAK5D,uBAAuB6D,SAAS,IAAIJ,GAAGG,IAAI,KAAK5D,uBAAuB8D,SAAS,EAAE;wBAChGxB,WAAW,CAAC,OAAO,EAAEmB,GAAGG,IAAI,KAAK5D,uBAAuB6D,SAAS,GAAG,SAAS,QAAQ,CAAC,EAAEJ,GAAGM,OAAO,CAACvC,IAAI,CAAC,KAAK,CAAC,CAAC;oBACjH;gBACF;gBAEA,OAAO,GAAGC,cAActB,4BAA4BQ,KAAKyB,EAAE,EAAEzB,KAAKqD,GAAG,GAAGjC,aAAaJ,UAAUG,iBAAiBE,MAC9GrB,KAAKyB,EAAE,GACNzB,KAAKsD,IAAI,GAAG,UAAU,KAAKT,WAAWlB,WAAWR,iBAAiBL,cACnEtB,4BAA4BQ,KAAKyB,EAAE,EAAEzB,KAAKuD,GAAG,GAC7CnC,aACAJ,SACC;YACL;QAEA,KAAK1B,SAASkE,WAAW;YACvB,qGAAqG;YACrG,iFAAiF;YACjF,OAAO,GAAGjC,WAAW,CAAC,EACpBvB,KAAKyD,QAAQ,CAAC7C,MAAM,GAAG,IACnB,CAAC,CAAC,EAAEM,qBAAqBlB,KAAKyD,QAAQ,CACnCjD,GAAG,CAAC,CAACkD,QAAU5C,cAAc4C,OAAOtC,aAAaJ,SACjDH,IAAI,CAAC,MAAMM,kBAAkBD,qBAAqBG,IAAI,CAAC,CAAC,GAC3D,IACJ;QAEJ;YACE,MAAM,IAAIsC,MAAM;IACpB;AACF;AAEA,eAAe7C,cAAc"}
+{"version":3,"sources":["../../../../src/components/promql/serialize.ts"],"sourcesContent":["// Copyright 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\n// Forked from https://github.com/prometheus/prometheus/blob/65f610353919b1c7b42d3776c3a95b68046a6bba/web/ui/mantine-ui/src/promql/serialize.ts\n\nimport { convertTimeToDuration, formatDuration } from '@perses-dev/spec';\nimport ASTNode, {\n  VectorSelector,\n  matchType,\n  vectorMatchCardinality,\n  nodeType,\n  StartOrEnd,\n  MatrixSelector,\n} from './ast';\nimport { aggregatorsWithParam, maybeParenthesizeBinopChild, escapeString } from './utils';\n\nconst serializeAtAndOffset = (timestamp: number | null, startOrEnd: StartOrEnd, offset: number): string =>\n  `${timestamp !== null ? ` @ ${(timestamp / 1000).toFixed(3)}` : startOrEnd !== null ? ` @ ${startOrEnd}()` : ''}${\n    offset === 0\n      ? ''\n      : offset > 0\n        ? ` offset ${formatDuration(convertTimeToDuration(offset))}`\n        : ` offset -${formatDuration(convertTimeToDuration(-offset))}`\n  }`;\n\nconst serializeSelector = (node: VectorSelector | MatrixSelector): string => {\n  const matchers = node.matchers\n    .filter((m) => !(m.name === '__name__' && m.type === matchType.equal && m.value === node.name))\n    .map((m) => `${m.name}${m.type}\"${escapeString(m.value)}\"`);\n\n  const range = node.type === nodeType.matrixSelector ? `[${formatDuration(convertTimeToDuration(node.range))}]` : '';\n  const atAndOffset = serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset);\n\n  return `${node.name}${matchers.length > 0 ? `{${matchers.join(',')}}` : ''}${range}${atAndOffset}`;\n};\n\nconst serializeNode = (node: ASTNode, indent = 0, pretty = false, initialIndent = true): string => {\n  const childListSeparator = pretty ? '\\n' : '';\n  const childSeparator = pretty ? '\\n' : ' ';\n  const childIndent = indent + 2;\n  const ind = pretty ? ' '.repeat(indent) : '';\n  // Needed for unary operators.\n  const initialInd = initialIndent ? ind : '';\n\n  switch (node.type) {\n    case nodeType.aggregation:\n      return `${initialInd}${node.op}${\n        node.without\n          ? ` without(${node.grouping.join(', ')}) `\n          : node.grouping.length > 0\n            ? ` by(${node.grouping.join(', ')}) `\n            : ''\n      }(${childListSeparator}${\n        aggregatorsWithParam.includes(node.op) && node.param !== null\n          ? `${serializeNode(node.param, childIndent, pretty)},${childSeparator}`\n          : ''\n      }${serializeNode(node.expr, childIndent, pretty)}${childListSeparator}${ind})`;\n\n    case nodeType.subquery:\n      return `${initialInd}${serializeNode(node.expr, indent, pretty)}[${formatDuration(convertTimeToDuration(node.range))}:${\n        node.step !== 0 ? formatDuration(convertTimeToDuration(node.step)) : ''\n      }]${serializeAtAndOffset(node.timestamp, node.startOrEnd, node.offset)}`;\n\n    case nodeType.parenExpr:\n      return `${initialInd}(${childListSeparator}${serializeNode(\n        node.expr,\n        childIndent,\n        pretty\n      )}${childListSeparator}${ind})`;\n\n    case nodeType.call: {\n      const sep = node.args.length > 0 ? childListSeparator : '';\n\n      return `${initialInd}${node.func.name}(${sep}${node.args\n        .map((arg) => serializeNode(arg, childIndent, pretty))\n        .join(',' + childSeparator)}${sep}${node.args.length > 0 ? ind : ''})`;\n    }\n\n    case nodeType.matrixSelector:\n      return `${initialInd}${serializeSelector(node)}`;\n\n    case nodeType.vectorSelector:\n      return `${initialInd}${serializeSelector(node)}`;\n\n    case nodeType.numberLiteral:\n      return `${initialInd}${node.val}`;\n\n    case nodeType.stringLiteral:\n      return `${initialInd}\"${escapeString(node.val)}\"`;\n\n    case nodeType.unaryExpr:\n      return `${initialInd}${node.op}${serializeNode(node.expr, indent, pretty, false)}`;\n\n    case nodeType.binaryExpr: {\n      let matching = '';\n      let grouping = '';\n      const vm = node.matching;\n      if (vm !== null && (vm.labels.length > 0 || vm.on)) {\n        if (vm.on) {\n          matching = ` on(${vm.labels.join(', ')})`;\n        } else {\n          matching = ` ignoring(${vm.labels.join(', ')})`;\n        }\n\n        if (vm.card === vectorMatchCardinality.manyToOne || vm.card === vectorMatchCardinality.oneToMany) {\n          grouping = ` group_${vm.card === vectorMatchCardinality.manyToOne ? 'left' : 'right'}(${vm.include.join(',')})`;\n        }\n      }\n\n      return `${serializeNode(maybeParenthesizeBinopChild(node.op, node.lhs), childIndent, pretty)}${childSeparator}${ind}${\n        node.op\n      }${node.bool ? ' bool' : ''}${matching}${grouping}${childSeparator}${serializeNode(\n        maybeParenthesizeBinopChild(node.op, node.rhs),\n        childIndent,\n        pretty\n      )}`;\n    }\n\n    case nodeType.placeholder:\n      // TODO: Should we just throw an error when trying to serialize an AST containing a placeholder node?\n      // (that would currently break editing-as-text of ASTs that contain placeholders)\n      return `${initialInd}…${\n        node.children.length > 0\n          ? `(${childListSeparator}${node.children\n              .map((child) => serializeNode(child, childIndent, pretty))\n              .join(',' + childSeparator)}${childListSeparator}${ind})`\n          : ''\n      }`;\n\n    default:\n      throw new Error('unsupported node type');\n  }\n};\n\nexport default serializeNode;\n"],"names":["convertTimeToDuration","formatDuration","matchType","vectorMatchCardinality","nodeType","aggregatorsWithParam","maybeParenthesizeBinopChild","escapeString","serializeAtAndOffset","timestamp","startOrEnd","offset","toFixed","serializeSelector","node","matchers","filter","m","name","type","equal","value","map","range","matrixSelector","atAndOffset","length","join","serializeNode","indent","pretty","initialIndent","childListSeparator","childSeparator","childIndent","ind","repeat","initialInd","aggregation","op","without","grouping","includes","param","expr","subquery","step","parenExpr","call","sep","args","func","arg","vectorSelector","numberLiteral","val","stringLiteral","unaryExpr","binaryExpr","matching","vm","labels","on","card","manyToOne","oneToMany","include","lhs","bool","rhs","placeholder","children","child","Error"],"mappings":"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"}

package/lib/components/query.d.ts

@@ -1,5 +1,6 @@
-import { DatasourceSelector, StatusError } from '@perses-dev/core';
 import { UseQueryResult } from '@tanstack/react-query';
+import { DatasourceSelector } from '@perses-dev/spec';
+import { StatusError } from '@perses-dev/client';
 import { MonitoredInstantQueryResponse, ParseQueryResponse } from '../model';
 export declare function useParseQuery(content: string, datasource: DatasourceSelector, enabled?: boolean): UseQueryResult<ParseQueryResponse, StatusError>;
 export declare function useInstantQuery(content: string, datasource: DatasourceSelector, enabled?: boolean): UseQueryResult<MonitoredInstantQueryResponse, StatusError>;

package/lib/components/query.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"query.d.ts","sourceRoot":"","sources":["../../../src/components/query.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACnE,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAEL,6BAA6B,EAE7B,kBAAkB,EAEnB,MAAM,UAAU,CAAC;AAElB,wBAAgB,aAAa,CAC3B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,kBAAkB,EAAE,WAAW,CAAC,CAYjD;AAED,wBAAgB,eAAe,CAC7B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,6BAA6B,EAAE,WAAW,CAAC,CAgB5D"}
+{"version":3,"file":"query.d.ts","sourceRoot":"","sources":["../../../src/components/query.ts"],"names":[],"mappings":"AAcA,OAAO,EAAY,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACjD,OAAO,EAEL,6BAA6B,EAE7B,kBAAkB,EAEnB,MAAM,UAAU,CAAC;AAElB,wBAAgB,aAAa,CAC3B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,kBAAkB,EAAE,WAAW,CAAC,CAYjD;AAED,wBAAgB,eAAe,CAC7B,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,kBAAkB,EAC9B,OAAO,CAAC,EAAE,OAAO,GAChB,cAAc,CAAC,6BAA6B,EAAE,WAAW,CAAC,CAgB5D"}

package/lib/components/query.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/query.ts"],"sourcesContent":["// Copyright 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 {\n  InstantQueryRequestParameters,\n  MonitoredInstantQueryResponse,\n  ParseQueryRequestParameters,\n  ParseQueryResponse,\n  PrometheusClient,\n} 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\nexport function useInstantQuery(\n  content: string,\n  datasource: DatasourceSelector,\n  enabled?: boolean\n): UseQueryResult<MonitoredInstantQueryResponse, StatusError> {\n  const { data: client } = useDatasourceClient<PrometheusClient>(datasource);\n\n  return useQuery<MonitoredInstantQueryResponse, StatusError>({\n    enabled: !!client && enabled,\n    // TODO: for some reason the caching is not working: identical nodes still fire their requests after each change made to the promQL\n    queryKey: ['instantQuery', content, 'datasource', datasource.kind],\n    queryFn: async () => {\n      const params: InstantQueryRequestParameters = { query: content };\n      const startTime = performance.now();\n      const response = await client!.instantQuery(params);\n      const responseTime = performance.now() - startTime;\n\n      return { ...response, responseTime };\n    },\n  });\n}\n"],"names":["useDatasourceClient","useQuery","useParseQuery","content","datasource","enabled","data","client","queryKey","queryFn","params","query","parseQuery","useInstantQuery","kind","startTime","performance","now","response","instantQuery","responseTime"],"mappings":"AAAA,+BAA+B;AAC/B,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;AASjE,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;AAEA,OAAO,SAASG,gBACdV,OAAe,EACfC,UAA8B,EAC9BC,OAAiB;IAEjB,MAAM,EAAEC,MAAMC,MAAM,EAAE,GAAGP,oBAAsCI;IAE/D,OAAOH,SAAqD;QAC1DI,SAAS,CAAC,CAACE,UAAUF;QACrB,mIAAmI;QACnIG,UAAU;YAAC;YAAgBL;YAAS;YAAcC,WAAWU,IAAI;SAAC;QAClEL,SAAS;YACP,MAAMC,SAAwC;gBAAEC,OAAOR;YAAQ;YAC/D,MAAMY,YAAYC,YAAYC,GAAG;YACjC,MAAMC,WAAW,MAAMX,OAAQY,YAAY,CAACT;YAC5C,MAAMU,eAAeJ,YAAYC,GAAG,KAAKF;YAEzC,OAAO;gBAAE,GAAGG,QAAQ;gBAAEE;YAAa;QACrC;IACF;AACF"}
+{"version":3,"sources":["../../../src/components/query.ts"],"sourcesContent":["// Copyright 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 { useQuery, UseQueryResult } from '@tanstack/react-query';\nimport { DatasourceSelector } from '@perses-dev/spec';\nimport { StatusError } from '@perses-dev/client';\nimport {\n  InstantQueryRequestParameters,\n  MonitoredInstantQueryResponse,\n  ParseQueryRequestParameters,\n  ParseQueryResponse,\n  PrometheusClient,\n} 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\nexport function useInstantQuery(\n  content: string,\n  datasource: DatasourceSelector,\n  enabled?: boolean\n): UseQueryResult<MonitoredInstantQueryResponse, StatusError> {\n  const { data: client } = useDatasourceClient<PrometheusClient>(datasource);\n\n  return useQuery<MonitoredInstantQueryResponse, StatusError>({\n    enabled: !!client && enabled,\n    // TODO: for some reason the caching is not working: identical nodes still fire their requests after each change made to the promQL\n    queryKey: ['instantQuery', content, 'datasource', datasource.kind],\n    queryFn: async () => {\n      const params: InstantQueryRequestParameters = { query: content };\n      const startTime = performance.now();\n      const response = await client!.instantQuery(params);\n      const responseTime = performance.now() - startTime;\n\n      return { ...response, responseTime };\n    },\n  });\n}\n"],"names":["useDatasourceClient","useQuery","useParseQuery","content","datasource","enabled","data","client","queryKey","queryFn","params","query","parseQuery","useInstantQuery","kind","startTime","performance","now","response","instantQuery","responseTime"],"mappings":"AAAA,+BAA+B;AAC/B,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;AAChE,SAASC,QAAQ,QAAwB,wBAAwB;AAWjE,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;AAEA,OAAO,SAASG,gBACdV,OAAe,EACfC,UAA8B,EAC9BC,OAAiB;IAEjB,MAAM,EAAEC,MAAMC,MAAM,EAAE,GAAGP,oBAAsCI;IAE/D,OAAOH,SAAqD;QAC1DI,SAAS,CAAC,CAACE,UAAUF;QACrB,mIAAmI;QACnIG,UAAU;YAAC;YAAgBL;YAAS;YAAcC,WAAWU,IAAI;SAAC;QAClEL,SAAS;YACP,MAAMC,SAAwC;gBAAEC,OAAOR;YAAQ;YAC/D,MAAMY,YAAYC,YAAYC,GAAG;YACjC,MAAMC,WAAW,MAAMX,OAAQY,YAAY,CAACT;YAC5C,MAAMU,eAAeJ,YAAYC,GAAG,KAAKF;YAEzC,OAAO;gBAAE,GAAGG,QAAQ;gBAAEE;YAAa;QACrC;IACF;AACF"}

package/lib/explore/PrometheusExplorer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrometheusExplorer.d.ts","sourceRoot":"","sources":["../../../src/explore/PrometheusExplorer.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAC;AA0E/C,wBAAgB,kBAAkB,IAAI,YAAY,CAwDjD"}
+{"version":3,"file":"PrometheusExplorer.d.ts","sourceRoot":"","sources":["../../../src/explore/PrometheusExplorer.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAC;AA2E/C,wBAAgB,kBAAkB,IAAI,YAAY,CAwDjD"}

package/lib/explore/PrometheusExplorer.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,6 @@
 // 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.
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Stack, Tab, Tabs } from '@mui/material';
 import { DataQueriesProvider, MultiQueryEditor, useSuggestedStepMs } from '@perses-dev/plugin-system';
 import { useExplorerManagerContext } from '@perses-dev/explore';

package/lib/explore/PrometheusExplorer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/explore/PrometheusExplorer.tsx"],"sourcesContent":["// Copyright 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 { QueryDefinition } from '@perses-dev/core';\nimport { Box, Stack, Tab, Tabs } from '@mui/material';\nimport { DataQueriesProvider, MultiQueryEditor, useSuggestedStepMs } from '@perses-dev/plugin-system';\nimport { useExplorerManagerContext } from '@perses-dev/explore';\nimport useResizeObserver from 'use-resize-observer';\nimport { Panel } from '@perses-dev/dashboards';\nimport { ReactElement, useState } from 'react';\nimport { DEFAULT_PROM } from '../model/prometheus-selectors';\nimport { FinderQueryParams } from './PrometheusMetricsFinder/types';\nimport { PrometheusMetricsFinder } from './PrometheusMetricsFinder';\n\ninterface MetricsExplorerQueryParams extends FinderQueryParams {\n  tab?: string;\n  queries?: QueryDefinition[];\n}\n\nconst PANEL_PREVIEW_HEIGHT = 700;\nconst FILTERED_QUERY_PLUGINS = ['PrometheusTimeSeriesQuery'];\n\nfunction TimeSeriesPanel({ queries }: { queries: QueryDefinition[] }): ReactElement {\n  const { width, ref: boxRef } = useResizeObserver();\n  const height = PANEL_PREVIEW_HEIGHT;\n\n  const suggestedStepMs = useSuggestedStepMs(width);\n\n  // map TimeSeriesQueryDefinition to Definition<UnknownSpec>\n  const definitions = queries.length\n    ? queries.map((query) => {\n        return {\n          kind: query.spec.plugin.kind,\n          spec: query.spec.plugin.spec,\n        };\n      })\n    : [];\n\n  return (\n    <Box ref={boxRef} height={height}>\n      <DataQueriesProvider definitions={definitions} options={{ suggestedStepMs, mode: 'range' }}>\n        <Panel\n          panelOptions={{\n            hideHeader: true,\n          }}\n          definition={{\n            kind: 'Panel',\n            spec: { queries: queries, display: { name: '' }, plugin: { kind: 'TimeSeriesChart', spec: {} } },\n          }}\n        />\n      </DataQueriesProvider>\n    </Box>\n  );\n}\n\nfunction MetricDataTable({ queries }: { queries: QueryDefinition[] }): ReactElement {\n  const height = PANEL_PREVIEW_HEIGHT;\n\n  // map TimeSeriesQueryDefinition to Definition<UnknownSpec>\n  const definitions = queries.map((query) => {\n    return {\n      kind: query.spec.plugin.kind,\n      spec: query.spec.plugin.spec,\n    };\n  });\n\n  return (\n    <Box height={height}>\n      <DataQueriesProvider definitions={definitions} options={{ mode: 'instant' }}>\n        <Panel\n          panelOptions={{\n            hideHeader: true,\n          }}\n          definition={{\n            kind: 'Panel',\n            spec: { queries: queries, display: { name: '' }, plugin: { kind: 'TimeSeriesTable', spec: {} } },\n          }}\n        />\n      </DataQueriesProvider>\n    </Box>\n  );\n}\n\nexport function PrometheusExplorer(): ReactElement {\n  const {\n    data: { tab = 'table', queries = [], datasource = DEFAULT_PROM, filters = [], exploredMetric = undefined },\n    setData,\n  } = useExplorerManagerContext<MetricsExplorerQueryParams>();\n\n  const [queryDefinitions, setQueryDefinitions] = useState<QueryDefinition[]>(queries);\n\n  return (\n    <Stack gap={2} sx={{ width: '100%' }}>\n      <Tabs\n        value={tab}\n        onChange={(_, state) => setData({ tab: state, queries })}\n        variant=\"scrollable\"\n        sx={{ borderBottom: 1, borderColor: 'divider' }}\n      >\n        <Tab value=\"table\" label=\"Table\" />\n        <Tab value=\"graph\" label=\"Graph\" />\n        <Tab value=\"finder\" label=\"Finder\" />\n      </Tabs>\n      <Stack gap={1}>\n        {tab === 'table' && (\n          <Stack>\n            <MultiQueryEditor\n              queryTypes={['TimeSeriesQuery']}\n              onChange={(state) => setQueryDefinitions(state)}\n              queries={queryDefinitions}\n              onQueryRun={() => setData({ tab, queries: queryDefinitions })}\n              filteredQueryPlugins={FILTERED_QUERY_PLUGINS}\n            />\n            <MetricDataTable queries={queries} />\n          </Stack>\n        )}\n        {tab === 'graph' && (\n          <Stack>\n            <MultiQueryEditor\n              queryTypes={['TimeSeriesQuery']}\n              onChange={(state) => setQueryDefinitions(state)}\n              queries={queryDefinitions}\n              onQueryRun={() => setData({ tab, queries: queryDefinitions })}\n              filteredQueryPlugins={FILTERED_QUERY_PLUGINS}\n            />\n            <TimeSeriesPanel queries={queries} />\n          </Stack>\n        )}\n        {tab === 'finder' && (\n          <Stack>\n            <PrometheusMetricsFinder\n              onChange={(state) => setData({ tab, ...state })}\n              value={{ datasource, filters, exploredMetric }}\n            />\n          </Stack>\n        )}\n      </Stack>\n    </Stack>\n  );\n}\n"],"names":["Box","Stack","Tab","Tabs","DataQueriesProvider","MultiQueryEditor","useSuggestedStepMs","useExplorerManagerContext","useResizeObserver","Panel","useState","DEFAULT_PROM","PrometheusMetricsFinder","PANEL_PREVIEW_HEIGHT","FILTERED_QUERY_PLUGINS","TimeSeriesPanel","queries","width","ref","boxRef","height","suggestedStepMs","definitions","length","map","query","kind","spec","plugin","options","mode","panelOptions","hideHeader","definition","display","name","MetricDataTable","PrometheusExplorer","data","tab","datasource","filters","exploredMetric","undefined","setData","queryDefinitions","setQueryDefinitions","gap","sx","value","onChange","_","state","variant","borderBottom","borderColor","label","queryTypes","onQueryRun","filteredQueryPlugins"],"mappings":"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"}
+{"version":3,"sources":["../../../src/explore/PrometheusExplorer.tsx"],"sourcesContent":["// Copyright 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 { Box, Stack, Tab, Tabs } from '@mui/material';\nimport { DataQueriesProvider, MultiQueryEditor, useSuggestedStepMs } from '@perses-dev/plugin-system';\nimport { useExplorerManagerContext } from '@perses-dev/explore';\nimport useResizeObserver from 'use-resize-observer';\nimport { Panel } from '@perses-dev/dashboards';\nimport { ReactElement, useState } from 'react';\nimport { QueryDefinition } from '@perses-dev/spec';\nimport { DEFAULT_PROM } from '../model/prometheus-selectors';\nimport { FinderQueryParams } from './PrometheusMetricsFinder/types';\nimport { PrometheusMetricsFinder } from './PrometheusMetricsFinder';\n\ninterface MetricsExplorerQueryParams extends FinderQueryParams {\n  tab?: string;\n  queries?: QueryDefinition[];\n}\n\nconst PANEL_PREVIEW_HEIGHT = 700;\nconst FILTERED_QUERY_PLUGINS = ['PrometheusTimeSeriesQuery'];\n\nfunction TimeSeriesPanel({ queries }: { queries: QueryDefinition[] }): ReactElement {\n  const { width, ref: boxRef } = useResizeObserver();\n  const height = PANEL_PREVIEW_HEIGHT;\n\n  const suggestedStepMs = useSuggestedStepMs(width);\n\n  // map TimeSeriesQueryDefinition to Definition<UnknownSpec>\n  const definitions = queries.length\n    ? queries.map((query) => {\n        return {\n          kind: query.spec.plugin.kind,\n          spec: query.spec.plugin.spec,\n        };\n      })\n    : [];\n\n  return (\n    <Box ref={boxRef} height={height}>\n      <DataQueriesProvider definitions={definitions} options={{ suggestedStepMs, mode: 'range' }}>\n        <Panel\n          panelOptions={{\n            hideHeader: true,\n          }}\n          definition={{\n            kind: 'Panel',\n            spec: { queries: queries, display: { name: '' }, plugin: { kind: 'TimeSeriesChart', spec: {} } },\n          }}\n        />\n      </DataQueriesProvider>\n    </Box>\n  );\n}\n\nfunction MetricDataTable({ queries }: { queries: QueryDefinition[] }): ReactElement {\n  const height = PANEL_PREVIEW_HEIGHT;\n\n  // map TimeSeriesQueryDefinition to Definition<UnknownSpec>\n  const definitions = queries.map((query) => {\n    return {\n      kind: query.spec.plugin.kind,\n      spec: query.spec.plugin.spec,\n    };\n  });\n\n  return (\n    <Box height={height}>\n      <DataQueriesProvider definitions={definitions} options={{ mode: 'instant' }}>\n        <Panel\n          panelOptions={{\n            hideHeader: true,\n          }}\n          definition={{\n            kind: 'Panel',\n            spec: { queries: queries, display: { name: '' }, plugin: { kind: 'TimeSeriesTable', spec: {} } },\n          }}\n        />\n      </DataQueriesProvider>\n    </Box>\n  );\n}\n\nexport function PrometheusExplorer(): ReactElement {\n  const {\n    data: { tab = 'table', queries = [], datasource = DEFAULT_PROM, filters = [], exploredMetric = undefined },\n    setData,\n  } = useExplorerManagerContext<MetricsExplorerQueryParams>();\n\n  const [queryDefinitions, setQueryDefinitions] = useState<QueryDefinition[]>(queries);\n\n  return (\n    <Stack gap={2} sx={{ width: '100%' }}>\n      <Tabs\n        value={tab}\n        onChange={(_, state) => setData({ tab: state, queries })}\n        variant=\"scrollable\"\n        sx={{ borderBottom: 1, borderColor: 'divider' }}\n      >\n        <Tab value=\"table\" label=\"Table\" />\n        <Tab value=\"graph\" label=\"Graph\" />\n        <Tab value=\"finder\" label=\"Finder\" />\n      </Tabs>\n      <Stack gap={1}>\n        {tab === 'table' && (\n          <Stack>\n            <MultiQueryEditor\n              queryTypes={['TimeSeriesQuery']}\n              onChange={(state) => setQueryDefinitions(state)}\n              queries={queryDefinitions}\n              onQueryRun={() => setData({ tab, queries: queryDefinitions })}\n              filteredQueryPlugins={FILTERED_QUERY_PLUGINS}\n            />\n            <MetricDataTable queries={queries} />\n          </Stack>\n        )}\n        {tab === 'graph' && (\n          <Stack>\n            <MultiQueryEditor\n              queryTypes={['TimeSeriesQuery']}\n              onChange={(state) => setQueryDefinitions(state)}\n              queries={queryDefinitions}\n              onQueryRun={() => setData({ tab, queries: queryDefinitions })}\n              filteredQueryPlugins={FILTERED_QUERY_PLUGINS}\n            />\n            <TimeSeriesPanel queries={queries} />\n          </Stack>\n        )}\n        {tab === 'finder' && (\n          <Stack>\n            <PrometheusMetricsFinder\n              onChange={(state) => setData({ tab, ...state })}\n              value={{ datasource, filters, exploredMetric }}\n            />\n          </Stack>\n        )}\n      </Stack>\n    </Stack>\n  );\n}\n"],"names":["Box","Stack","Tab","Tabs","DataQueriesProvider","MultiQueryEditor","useSuggestedStepMs","useExplorerManagerContext","useResizeObserver","Panel","useState","DEFAULT_PROM","PrometheusMetricsFinder","PANEL_PREVIEW_HEIGHT","FILTERED_QUERY_PLUGINS","TimeSeriesPanel","queries","width","ref","boxRef","height","suggestedStepMs","definitions","length","map","query","kind","spec","plugin","options","mode","panelOptions","hideHeader","definition","display","name","MetricDataTable","PrometheusExplorer","data","tab","datasource","filters","exploredMetric","undefined","setData","queryDefinitions","setQueryDefinitions","gap","sx","value","onChange","_","state","variant","borderBottom","borderColor","label","queryTypes","onQueryRun","filteredQueryPlugins"],"mappings":"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"}

package/lib/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.d.ts

@@ -1,6 +1,6 @@
 import { StackProps } from '@mui/material';
-import { DatasourceSelector } from '@perses-dev/core';
 import { ReactElement } from 'react';
+import { DatasourceSelector } from '@perses-dev/spec';
 import { LabelFilter, Settings } from './types';
 export interface SettingsMenuProps {
     value: Settings;

package/lib/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrometheusMetricsFinder.d.ts","sourceRoot":"","sources":["../../../../src/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.tsx"],"names":[],"mappings":"AAaA,OAAO,EAUL,UAAU,EAIX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAKtD,OAAO,EAAc,YAAY,EAAqB,MAAM,OAAO,CAAC;AAMpE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAKhD,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,QAAQ,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAmCjF;AAED,MAAM,WAAW,uBAAwB,SAAQ,UAAU;IACzD,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,GAAG,YAAY,CAkDxC;AAED,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC;IAChF,KAAK,EAAE;QACL,UAAU,EAAE,kBAAkB,CAAC;QAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;IACF,QAAQ,EAAE,CAAC,EACT,UAAU,EACV,OAAO,EACP,cAAc,GACf,EAAE;QACD,UAAU,EAAE,kBAAkB,CAAC;QAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,KAAK,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EAAE,EAAE,UAAyB,EAAE,OAAY,EAAE,cAAc,EAAE,EAClE,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,4BAA4B,GAAG,YAAY,CAkF7C"}
+{"version":3,"file":"PrometheusMetricsFinder.d.ts","sourceRoot":"","sources":["../../../../src/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.tsx"],"names":[],"mappings":"AAaA,OAAO,EAUL,UAAU,EAIX,MAAM,eAAe,CAAC;AAMvB,OAAO,EAAc,YAAY,EAAqB,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAKtD,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAKhD,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,QAAQ,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAmCjF;AAED,MAAM,WAAW,uBAAwB,SAAQ,UAAU;IACzD,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,GAAG,YAAY,CAkDxC;AAED,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC;IAChF,KAAK,EAAE;QACL,UAAU,EAAE,kBAAkB,CAAC;QAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;IACF,QAAQ,EAAE,CAAC,EACT,UAAU,EACV,OAAO,EACP,cAAc,GACf,EAAE;QACD,UAAU,EAAE,kBAAkB,CAAC;QAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,KAAK,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EAAE,EAAE,UAAyB,EAAE,OAAY,EAAE,cAAc,EAAE,EAClE,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,4BAA4B,GAAG,YAAY,CAkF7C"}

package/lib/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.tsx"],"sourcesContent":["// Copyright 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 {\n  Button,\n  Checkbox,\n  CircularProgress,\n  FormControlLabel,\n  IconButton,\n  InputAdornment,\n  Menu,\n  MenuItem,\n  Stack,\n  StackProps,\n  TextField,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material';\nimport { Fuzzy, FuzzyMatchingInterval } from '@nexucis/fuzzy';\nimport { DatasourceSelector } from '@perses-dev/core';\nimport { useExplorerQueryParams } from '@perses-dev/explore';\nimport ArrowLeftIcon from 'mdi-material-ui/ArrowLeft';\nimport CogIcon from 'mdi-material-ui/Cog';\nimport Magnify from 'mdi-material-ui/Magnify';\nimport { MouseEvent, ReactElement, useMemo, useState } from 'react';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { DEFAULT_PROM } from '../../model';\nimport { MetricList } from './display/list/MetricList';\nimport { FinderFilters } from './filter/FinderFilters';\nimport { MetricOverview } from './overview/MetricOverview';\nimport { LabelFilter, Settings } from './types';\nimport { useLabelValues } from './utils';\n\nconst PERSES_METRICS_FINDER_SETTINGS = 'PERSES_METRICS_FINDER_SETTINGS';\n\nexport interface SettingsMenuProps {\n  value: Settings;\n  onChange: (value: Settings) => void;\n}\n\nexport function SettingsMenu({ value, onChange }: SettingsMenuProps): ReactElement {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const open = Boolean(anchorEl);\n  const handleClick = (event: MouseEvent<HTMLButtonElement>): void => {\n    setAnchorEl(event.currentTarget);\n  };\n  const handleClose = (): void => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <IconButton aria-label=\"settings\" size=\"large\" onClick={handleClick}>\n        <CogIcon />\n      </IconButton>\n      <Menu id=\"finder-settings-menu\" anchorEl={anchorEl} open={open} onClose={handleClose}>\n        <MenuItem onClick={(e) => e.preventDefault()}>\n          <FormControlLabel\n            control={<Checkbox />}\n            label=\"Enable Metadata\"\n            checked={value.isMetadataEnabled}\n            onClick={() => onChange({ ...value, isMetadataEnabled: !value.isMetadataEnabled })}\n          />\n        </MenuItem>\n        <MenuItem onClick={(e) => e.preventDefault()}>\n          <FormControlLabel\n            control={<Checkbox />}\n            label=\"Enable Time Series Chart\"\n            checked={value.isPanelEnabled}\n            onClick={() => onChange({ ...value, isPanelEnabled: !value.isPanelEnabled })}\n          />\n        </MenuItem>\n      </Menu>\n    </>\n  );\n}\n\nexport interface MetricNameExplorerProps extends StackProps {\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricNameExplorer({\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n  ...props\n}: MetricNameExplorerProps): ReactElement {\n  const { data, isLoading, error } = useLabelValues('__name__', filters, datasource);\n  const [search, setSearch] = useState('');\n  const fuzzy = useMemo(() => new Fuzzy({ includeMatches: true, excludedChars: [' '] }), []);\n\n  const filteredResults: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }> | undefined = useMemo(() => {\n    if (search && data?.data) {\n      return fuzzy.filter(search, data.data).sort((a, b) => b.score - a.score);\n    }\n    return undefined;\n  }, [data, fuzzy, search]);\n\n  if (error) {\n    return <Stack width=\"100%\">Error: {error.message}</Stack>;\n  }\n\n  if (isLoading) {\n    return (\n      <Stack width=\"100%\" sx={{ alignItems: 'center', justifyContent: 'center' }}>\n        <CircularProgress />\n      </Stack>\n    );\n  }\n\n  return (\n    <Stack {...props}>\n      <TextField\n        value={search}\n        onChange={(e) => setSearch(e.target.value)}\n        placeholder=\"Search metric name...\"\n        slotProps={{\n          input: {\n            startAdornment: (\n              <InputAdornment position=\"start\">\n                <Magnify />\n              </InputAdornment>\n            ),\n          },\n        }}\n      />\n      <MetricList\n        metricNames={data?.data ?? []}\n        filteredResults={filteredResults}\n        datasource={datasource}\n        filters={filters}\n        isMetadataEnabled={isMetadataEnabled}\n        onExplore={onExplore}\n      />\n    </Stack>\n  );\n}\n\nexport interface PrometheusMetricsFinderProps extends Omit<StackProps, 'onChange'> {\n  value: {\n    datasource: DatasourceSelector;\n    filters: LabelFilter[];\n    exploredMetric?: string;\n  };\n  onChange: ({\n    datasource,\n    filters,\n    exploredMetric,\n  }: {\n    datasource: DatasourceSelector;\n    filters: LabelFilter[];\n    exploredMetric?: string;\n  }) => void;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function PrometheusMetricsFinder({\n  value: { datasource = DEFAULT_PROM, filters = [], exploredMetric },\n  onChange,\n  onExplore,\n  ...props\n}: PrometheusMetricsFinderProps): ReactElement {\n  const settingsStored = localStorage.getItem(PERSES_METRICS_FINDER_SETTINGS);\n  const [settings, setSettings] = useState<Settings>(\n    settingsStored ? JSON.parse(settingsStored) : { isMetadataEnabled: true }\n  );\n\n  function handleSettingsUpdate(value: Settings): void {\n    setSettings(value);\n    localStorage.setItem(PERSES_METRICS_FINDER_SETTINGS, JSON.stringify(value));\n  }\n\n  const isMobileSize = useMediaQuery(useTheme().breakpoints.down('md'));\n\n  // Remove duplicated filters and filters without label or labelValues\n  const filteredFilters: LabelFilter[] = useMemo(() => {\n    return filters.filter(({ label, labelValues }) => label && labelValues?.[0]);\n  }, [filters]);\n\n  const searchParams = useExplorerQueryParams({\n    data: { tab: 'finder', datasource, filters, exploredMetric: undefined },\n  });\n\n  function setDatasource(value: DatasourceSelector): void {\n    onChange({ datasource: value, filters, exploredMetric });\n  }\n\n  function setFilters(value: LabelFilter[]): void {\n    onChange({ datasource, filters: value, exploredMetric });\n  }\n\n  return (\n    <Stack {...props} gap={1}>\n      <Stack direction={isMobileSize ? 'column' : 'row'} gap={2} justifyContent=\"space-between\">\n        <FinderFilters\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filters ?? []}\n          filteredFilters={filteredFilters}\n          onDatasourceChange={setDatasource}\n          onFiltersChange={setFilters}\n        />\n        <Stack direction=\"row\" gap={1} alignItems=\"center\">\n          {exploredMetric && (\n            <Button\n              variant=\"contained\"\n              aria-label=\"back to metric explorer\"\n              startIcon={<ArrowLeftIcon />}\n              component={RouterLink}\n              to={`?${searchParams}`}\n            >\n              Back\n            </Button>\n          )}\n          <Stack\n            direction=\"row\"\n            sx={{ width: isMobileSize ? '100%' : 'unset' }}\n            justifyContent={isMobileSize ? 'end' : 'unset'}\n            alignItems=\"center\"\n          >\n            <SettingsMenu value={settings} onChange={handleSettingsUpdate} />\n          </Stack>\n        </Stack>\n      </Stack>\n      {exploredMetric ? (\n        <MetricOverview\n          metricName={exploredMetric}\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filteredFilters}\n          isMetadataEnabled={settings.isMetadataEnabled}\n          isPanelEnabled={settings.isPanelEnabled}\n          onFiltersChange={setFilters}\n          onExplore={onExplore}\n        />\n      ) : (\n        <MetricNameExplorer\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filteredFilters}\n          isMetadataEnabled={settings.isMetadataEnabled}\n          onExplore={onExplore}\n        />\n      )}\n    </Stack>\n  );\n}\n"],"names":["Button","Checkbox","CircularProgress","FormControlLabel","IconButton","InputAdornment","Menu","MenuItem","Stack","TextField","useMediaQuery","useTheme","Fuzzy","useExplorerQueryParams","ArrowLeftIcon","CogIcon","Magnify","useMemo","useState","Link","RouterLink","DEFAULT_PROM","MetricList","FinderFilters","MetricOverview","useLabelValues","PERSES_METRICS_FINDER_SETTINGS","SettingsMenu","value","onChange","anchorEl","setAnchorEl","open","Boolean","handleClick","event","currentTarget","handleClose","aria-label","size","onClick","id","onClose","e","preventDefault","control","label","checked","isMetadataEnabled","isPanelEnabled","MetricNameExplorer","datasource","filters","onExplore","props","data","isLoading","error","search","setSearch","fuzzy","includeMatches","excludedChars","filteredResults","filter","sort","a","b","score","undefined","width","message","sx","alignItems","justifyContent","target","placeholder","slotProps","input","startAdornment","position","metricNames","PrometheusMetricsFinder","exploredMetric","settingsStored","localStorage","getItem","settings","setSettings","JSON","parse","handleSettingsUpdate","setItem","stringify","isMobileSize","breakpoints","down","filteredFilters","labelValues","searchParams","tab","setDatasource","setFilters","gap","direction","onDatasourceChange","onFiltersChange","variant","startIcon","component","to","metricName"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/explore/PrometheusMetricsFinder/PrometheusMetricsFinder.tsx"],"sourcesContent":["// Copyright 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 {\n  Button,\n  Checkbox,\n  CircularProgress,\n  FormControlLabel,\n  IconButton,\n  InputAdornment,\n  Menu,\n  MenuItem,\n  Stack,\n  StackProps,\n  TextField,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material';\nimport { Fuzzy, FuzzyMatchingInterval } from '@nexucis/fuzzy';\nimport { useExplorerQueryParams } from '@perses-dev/explore';\nimport ArrowLeftIcon from 'mdi-material-ui/ArrowLeft';\nimport CogIcon from 'mdi-material-ui/Cog';\nimport Magnify from 'mdi-material-ui/Magnify';\nimport { MouseEvent, ReactElement, useMemo, useState } from 'react';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { DatasourceSelector } from '@perses-dev/spec';\nimport { DEFAULT_PROM } from '../../model';\nimport { MetricList } from './display/list/MetricList';\nimport { FinderFilters } from './filter/FinderFilters';\nimport { MetricOverview } from './overview/MetricOverview';\nimport { LabelFilter, Settings } from './types';\nimport { useLabelValues } from './utils';\n\nconst PERSES_METRICS_FINDER_SETTINGS = 'PERSES_METRICS_FINDER_SETTINGS';\n\nexport interface SettingsMenuProps {\n  value: Settings;\n  onChange: (value: Settings) => void;\n}\n\nexport function SettingsMenu({ value, onChange }: SettingsMenuProps): ReactElement {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const open = Boolean(anchorEl);\n  const handleClick = (event: MouseEvent<HTMLButtonElement>): void => {\n    setAnchorEl(event.currentTarget);\n  };\n  const handleClose = (): void => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <IconButton aria-label=\"settings\" size=\"large\" onClick={handleClick}>\n        <CogIcon />\n      </IconButton>\n      <Menu id=\"finder-settings-menu\" anchorEl={anchorEl} open={open} onClose={handleClose}>\n        <MenuItem onClick={(e) => e.preventDefault()}>\n          <FormControlLabel\n            control={<Checkbox />}\n            label=\"Enable Metadata\"\n            checked={value.isMetadataEnabled}\n            onClick={() => onChange({ ...value, isMetadataEnabled: !value.isMetadataEnabled })}\n          />\n        </MenuItem>\n        <MenuItem onClick={(e) => e.preventDefault()}>\n          <FormControlLabel\n            control={<Checkbox />}\n            label=\"Enable Time Series Chart\"\n            checked={value.isPanelEnabled}\n            onClick={() => onChange({ ...value, isPanelEnabled: !value.isPanelEnabled })}\n          />\n        </MenuItem>\n      </Menu>\n    </>\n  );\n}\n\nexport interface MetricNameExplorerProps extends StackProps {\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricNameExplorer({\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n  ...props\n}: MetricNameExplorerProps): ReactElement {\n  const { data, isLoading, error } = useLabelValues('__name__', filters, datasource);\n  const [search, setSearch] = useState('');\n  const fuzzy = useMemo(() => new Fuzzy({ includeMatches: true, excludedChars: [' '] }), []);\n\n  const filteredResults: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }> | undefined = useMemo(() => {\n    if (search && data?.data) {\n      return fuzzy.filter(search, data.data).sort((a, b) => b.score - a.score);\n    }\n    return undefined;\n  }, [data, fuzzy, search]);\n\n  if (error) {\n    return <Stack width=\"100%\">Error: {error.message}</Stack>;\n  }\n\n  if (isLoading) {\n    return (\n      <Stack width=\"100%\" sx={{ alignItems: 'center', justifyContent: 'center' }}>\n        <CircularProgress />\n      </Stack>\n    );\n  }\n\n  return (\n    <Stack {...props}>\n      <TextField\n        value={search}\n        onChange={(e) => setSearch(e.target.value)}\n        placeholder=\"Search metric name...\"\n        slotProps={{\n          input: {\n            startAdornment: (\n              <InputAdornment position=\"start\">\n                <Magnify />\n              </InputAdornment>\n            ),\n          },\n        }}\n      />\n      <MetricList\n        metricNames={data?.data ?? []}\n        filteredResults={filteredResults}\n        datasource={datasource}\n        filters={filters}\n        isMetadataEnabled={isMetadataEnabled}\n        onExplore={onExplore}\n      />\n    </Stack>\n  );\n}\n\nexport interface PrometheusMetricsFinderProps extends Omit<StackProps, 'onChange'> {\n  value: {\n    datasource: DatasourceSelector;\n    filters: LabelFilter[];\n    exploredMetric?: string;\n  };\n  onChange: ({\n    datasource,\n    filters,\n    exploredMetric,\n  }: {\n    datasource: DatasourceSelector;\n    filters: LabelFilter[];\n    exploredMetric?: string;\n  }) => void;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function PrometheusMetricsFinder({\n  value: { datasource = DEFAULT_PROM, filters = [], exploredMetric },\n  onChange,\n  onExplore,\n  ...props\n}: PrometheusMetricsFinderProps): ReactElement {\n  const settingsStored = localStorage.getItem(PERSES_METRICS_FINDER_SETTINGS);\n  const [settings, setSettings] = useState<Settings>(\n    settingsStored ? JSON.parse(settingsStored) : { isMetadataEnabled: true }\n  );\n\n  function handleSettingsUpdate(value: Settings): void {\n    setSettings(value);\n    localStorage.setItem(PERSES_METRICS_FINDER_SETTINGS, JSON.stringify(value));\n  }\n\n  const isMobileSize = useMediaQuery(useTheme().breakpoints.down('md'));\n\n  // Remove duplicated filters and filters without label or labelValues\n  const filteredFilters: LabelFilter[] = useMemo(() => {\n    return filters.filter(({ label, labelValues }) => label && labelValues?.[0]);\n  }, [filters]);\n\n  const searchParams = useExplorerQueryParams({\n    data: { tab: 'finder', datasource, filters, exploredMetric: undefined },\n  });\n\n  function setDatasource(value: DatasourceSelector): void {\n    onChange({ datasource: value, filters, exploredMetric });\n  }\n\n  function setFilters(value: LabelFilter[]): void {\n    onChange({ datasource, filters: value, exploredMetric });\n  }\n\n  return (\n    <Stack {...props} gap={1}>\n      <Stack direction={isMobileSize ? 'column' : 'row'} gap={2} justifyContent=\"space-between\">\n        <FinderFilters\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filters ?? []}\n          filteredFilters={filteredFilters}\n          onDatasourceChange={setDatasource}\n          onFiltersChange={setFilters}\n        />\n        <Stack direction=\"row\" gap={1} alignItems=\"center\">\n          {exploredMetric && (\n            <Button\n              variant=\"contained\"\n              aria-label=\"back to metric explorer\"\n              startIcon={<ArrowLeftIcon />}\n              component={RouterLink}\n              to={`?${searchParams}`}\n            >\n              Back\n            </Button>\n          )}\n          <Stack\n            direction=\"row\"\n            sx={{ width: isMobileSize ? '100%' : 'unset' }}\n            justifyContent={isMobileSize ? 'end' : 'unset'}\n            alignItems=\"center\"\n          >\n            <SettingsMenu value={settings} onChange={handleSettingsUpdate} />\n          </Stack>\n        </Stack>\n      </Stack>\n      {exploredMetric ? (\n        <MetricOverview\n          metricName={exploredMetric}\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filteredFilters}\n          isMetadataEnabled={settings.isMetadataEnabled}\n          isPanelEnabled={settings.isPanelEnabled}\n          onFiltersChange={setFilters}\n          onExplore={onExplore}\n        />\n      ) : (\n        <MetricNameExplorer\n          datasource={datasource ?? DEFAULT_PROM}\n          filters={filteredFilters}\n          isMetadataEnabled={settings.isMetadataEnabled}\n          onExplore={onExplore}\n        />\n      )}\n    </Stack>\n  );\n}\n"],"names":["Button","Checkbox","CircularProgress","FormControlLabel","IconButton","InputAdornment","Menu","MenuItem","Stack","TextField","useMediaQuery","useTheme","Fuzzy","useExplorerQueryParams","ArrowLeftIcon","CogIcon","Magnify","useMemo","useState","Link","RouterLink","DEFAULT_PROM","MetricList","FinderFilters","MetricOverview","useLabelValues","PERSES_METRICS_FINDER_SETTINGS","SettingsMenu","value","onChange","anchorEl","setAnchorEl","open","Boolean","handleClick","event","currentTarget","handleClose","aria-label","size","onClick","id","onClose","e","preventDefault","control","label","checked","isMetadataEnabled","isPanelEnabled","MetricNameExplorer","datasource","filters","onExplore","props","data","isLoading","error","search","setSearch","fuzzy","includeMatches","excludedChars","filteredResults","filter","sort","a","b","score","undefined","width","message","sx","alignItems","justifyContent","target","placeholder","slotProps","input","startAdornment","position","metricNames","PrometheusMetricsFinder","exploredMetric","settingsStored","localStorage","getItem","settings","setSettings","JSON","parse","handleSettingsUpdate","setItem","stringify","isMobileSize","breakpoints","down","filteredFilters","labelValues","searchParams","tab","setDatasource","setFilters","gap","direction","onDatasourceChange","onFiltersChange","variant","startIcon","component","to","metricName"],"mappings":"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"}

package/lib/explore/PrometheusMetricsFinder/display/list/MetricList.d.ts

@@ -1,7 +1,7 @@
 import { StackProps } from '@mui/material';
 import { FuzzyMatchingInterval } from '@nexucis/fuzzy';
-import { DatasourceSelector } from '@perses-dev/core';
 import { ReactElement, ReactNode } from 'react';
+import { DatasourceSelector } from '@perses-dev/spec';
 import { LabelFilter } from '../../types';
 export interface MetricRowProps {
     children?: ReactNode;

package/lib/explore/PrometheusMetricsFinder/display/list/MetricList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MetricList.d.ts","sourceRoot":"","sources":["../../../../../../src/explore/PrometheusMetricsFinder/display/list/MetricList.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAoC,UAAU,EAAyB,MAAM,eAAe,CAAC;AACpG,OAAO,EAAS,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAI1C,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,UAAU,EACV,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,GACV,EAAE,cAAc,GAAG,YAAY,CA4C/B;AAED,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,qBAAqB,EAAE,CAAA;KAAE,CAAC,CAAC;IACnF,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,UAAU,CAAC,EACzB,WAAW,EACX,eAAe,EACf,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,YAAY,CA0ChC"}
+{"version":3,"file":"MetricList.d.ts","sourceRoot":"","sources":["../../../../../../src/explore/PrometheusMetricsFinder/display/list/MetricList.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAoC,UAAU,EAAyB,MAAM,eAAe,CAAC;AACpG,OAAO,EAAS,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAG9D,OAAO,EAAE,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAI1C,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,UAAU,EACV,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,GACV,EAAE,cAAc,GAAG,YAAY,CA4C/B;AAED,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,qBAAqB,EAAE,CAAA;KAAE,CAAC,CAAC;IACnF,UAAU,EAAE,kBAAkB,CAAC;IAC/B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,UAAU,CAAC,EACzB,WAAW,EACX,eAAe,EACf,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,YAAY,CA0ChC"}

package/lib/explore/PrometheusMetricsFinder/display/list/MetricList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/explore/PrometheusMetricsFinder/display/list/MetricList.tsx"],"sourcesContent":["// Copyright 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 { Button, Divider, Skeleton, Stack, StackProps, TableCell, Typography } from '@mui/material';\nimport { Fuzzy, FuzzyMatchingInterval } from '@nexucis/fuzzy';\nimport { DatasourceSelector } from '@perses-dev/core';\nimport { useExplorerQueryParams } from '@perses-dev/explore';\nimport CompassIcon from 'mdi-material-ui/Compass';\nimport { ReactElement, ReactNode, useMemo } from 'react';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { TableVirtuoso } from 'react-virtuoso';\nimport { LabelFilter } from '../../types';\nimport { useMetricMetadata } from '../../utils';\nimport { MetricChip } from '../MetricChip';\n\nexport interface MetricRowProps {\n  children?: ReactNode;\n  metricName: string;\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricRow({\n  children,\n  metricName,\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n}: MetricRowProps): ReactElement {\n  const { metadata, isLoading } = useMetricMetadata(metricName, datasource, isMetadataEnabled);\n\n  const searchParams = useExplorerQueryParams({\n    data: { tab: 'finder', datasource, filters, exploredMetric: metricName },\n  });\n\n  return (\n    <>\n      <TableCell style={{ width: '300px' }}>\n        <Typography sx={{ fontFamily: 'monospace' }}>{children ?? metricName}</Typography>\n      </TableCell>\n\n      <TableCell style={{ width: 115, textAlign: 'center' }}>\n        {isMetadataEnabled && isLoading ? (\n          <Skeleton variant=\"rounded\" width={75} />\n        ) : (\n          <MetricChip label={metadata?.type ?? 'unknown'} />\n        )}\n      </TableCell>\n      <TableCell style={{ width: '100%' }}>\n        {isMetadataEnabled && isLoading ? (\n          <Skeleton variant=\"text\" width={180} />\n        ) : (\n          <Typography sx={{ fontStyle: metadata?.help ? 'initial' : 'italic', minWidth: '30vw' }}>\n            {metadata ? metadata.help : 'unknown'}\n          </Typography>\n        )}\n      </TableCell>\n      <TableCell style={{ width: 140 }}>\n        <Button\n          aria-label={`explore metric ${metricName}`}\n          variant=\"contained\"\n          startIcon={<CompassIcon />}\n          style={{ textWrap: 'nowrap' }}\n          onClick={() => onExplore?.(metricName)}\n          component={RouterLink}\n          to={`?${searchParams}`}\n        >\n          Explore\n        </Button>\n      </TableCell>\n    </>\n  );\n}\n\nexport interface MetricListProps extends StackProps {\n  metricNames: string[];\n  filteredResults?: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }>;\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricList({\n  metricNames,\n  filteredResults,\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n  ...props\n}: MetricListProps): ReactElement {\n  const fuzzy = new Fuzzy();\n\n  const fuzzyMetrics: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }> = useMemo(() => {\n    if (filteredResults) {\n      return filteredResults;\n    }\n    return metricNames.map((metricName) => ({ original: metricName }));\n  }, [filteredResults, metricNames]);\n\n  return (\n    <Stack gap={2} width=\"100%\" divider={<Divider orientation=\"horizontal\" flexItem />} {...props}>\n      <TableVirtuoso\n        style={{ height: '70vh', width: '100%' }}\n        totalCount={fuzzyMetrics.length}\n        itemContent={(index) => (\n          <MetricRow\n            metricName={fuzzyMetrics[index]!.original}\n            datasource={datasource}\n            filters={filters}\n            isMetadataEnabled={isMetadataEnabled}\n            onExplore={onExplore}\n          >\n            <span\n              dangerouslySetInnerHTML={{\n                __html: fuzzy.render(fuzzyMetrics[index]!.original, fuzzyMetrics[index]!.intervals ?? [], {\n                  pre: '<strong style=\"color:darkorange\">',\n                  post: '</strong>',\n                  escapeHTML: true,\n                }),\n              }}\n            />\n          </MetricRow>\n        )}\n      />\n      <Stack sx={{ width: '100%' }} textAlign=\"end\">\n        <Typography data-testid=\"finder-total\">\n          Total: <strong>{metricNames.length}</strong> metrics\n        </Typography>\n      </Stack>\n    </Stack>\n  );\n}\n"],"names":["Button","Divider","Skeleton","Stack","TableCell","Typography","Fuzzy","useExplorerQueryParams","CompassIcon","useMemo","Link","RouterLink","TableVirtuoso","useMetricMetadata","MetricChip","MetricRow","children","metricName","datasource","filters","isMetadataEnabled","onExplore","metadata","isLoading","searchParams","data","tab","exploredMetric","style","width","sx","fontFamily","textAlign","variant","label","type","fontStyle","help","minWidth","aria-label","startIcon","textWrap","onClick","component","to","MetricList","metricNames","filteredResults","props","fuzzy","fuzzyMetrics","map","original","gap","divider","orientation","flexItem","height","totalCount","length","itemContent","index","span","dangerouslySetInnerHTML","__html","render","intervals","pre","post","escapeHTML","data-testid","strong"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,MAAM,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,KAAK,EAAcC,SAAS,EAAEC,UAAU,QAAQ,gBAAgB;AACpG,SAASC,KAAK,QAA+B,iBAAiB;AAE9D,SAASC,sBAAsB,QAAQ,sBAAsB;AAC7D,OAAOC,iBAAiB,0BAA0B;AAClD,SAAkCC,OAAO,QAAQ,QAAQ;AACzD,SAASC,QAAQC,UAAU,QAAQ,mBAAmB;AACtD,SAASC,aAAa,QAAQ,iBAAiB;AAE/C,SAASC,iBAAiB,QAAQ,cAAc;AAChD,SAASC,UAAU,QAAQ,gBAAgB;AAW3C,OAAO,SAASC,UAAU,EACxBC,QAAQ,EACRC,UAAU,EACVC,UAAU,EACVC,OAAO,EACPC,iBAAiB,EACjBC,SAAS,EACM;IACf,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGV,kBAAkBI,YAAYC,YAAYE;IAE1E,MAAMI,eAAejB,uBAAuB;QAC1CkB,MAAM;YAAEC,KAAK;YAAUR;YAAYC;YAASQ,gBAAgBV;QAAW;IACzE;IAEA,qBACE;;0BACE,KAACb;gBAAUwB,OAAO;oBAAEC,OAAO;gBAAQ;0BACjC,cAAA,KAACxB;oBAAWyB,IAAI;wBAAEC,YAAY;oBAAY;8BAAIf,YAAYC;;;0BAG5D,KAACb;gBAAUwB,OAAO;oBAAEC,OAAO;oBAAKG,WAAW;gBAAS;0BACjDZ,qBAAqBG,0BACpB,KAACrB;oBAAS+B,SAAQ;oBAAUJ,OAAO;mCAEnC,KAACf;oBAAWoB,OAAOZ,UAAUa,QAAQ;;;0BAGzC,KAAC/B;gBAAUwB,OAAO;oBAAEC,OAAO;gBAAO;0BAC/BT,qBAAqBG,0BACpB,KAACrB;oBAAS+B,SAAQ;oBAAOJ,OAAO;mCAEhC,KAACxB;oBAAWyB,IAAI;wBAAEM,WAAWd,UAAUe,OAAO,YAAY;wBAAUC,UAAU;oBAAO;8BAClFhB,WAAWA,SAASe,IAAI,GAAG;;;0BAIlC,KAACjC;gBAAUwB,OAAO;oBAAEC,OAAO;gBAAI;0BAC7B,cAAA,KAAC7B;oBACCuC,cAAY,CAAC,eAAe,EAAEtB,YAAY;oBAC1CgB,SAAQ;oBACRO,yBAAW,KAAChC;oBACZoB,OAAO;wBAAEa,UAAU;oBAAS;oBAC5BC,SAAS,IAAMrB,YAAYJ;oBAC3B0B,WAAWhC;oBACXiC,IAAI,CAAC,CAAC,EAAEpB,cAAc;8BACvB;;;;;AAMT;AAWA,OAAO,SAASqB,WAAW,EACzBC,WAAW,EACXC,eAAe,EACf7B,UAAU,EACVC,OAAO,EACPC,iBAAiB,EACjBC,SAAS,EACT,GAAG2B,OACa;IAChB,MAAMC,QAAQ,IAAI3C;IAElB,MAAM4C,eAAiFzC,QAAQ;QAC7F,IAAIsC,iBAAiB;YACnB,OAAOA;QACT;QACA,OAAOD,YAAYK,GAAG,CAAC,CAAClC,aAAgB,CAAA;gBAAEmC,UAAUnC;YAAW,CAAA;IACjE,GAAG;QAAC8B;QAAiBD;KAAY;IAEjC,qBACE,MAAC3C;QAAMkD,KAAK;QAAGxB,OAAM;QAAOyB,uBAAS,KAACrD;YAAQsD,aAAY;YAAaC,QAAQ;;QAAM,GAAGR,KAAK;;0BAC3F,KAACpC;gBACCgB,OAAO;oBAAE6B,QAAQ;oBAAQ5B,OAAO;gBAAO;gBACvC6B,YAAYR,aAAaS,MAAM;gBAC/BC,aAAa,CAACC,sBACZ,KAAC9C;wBACCE,YAAYiC,YAAY,CAACW,MAAM,CAAET,QAAQ;wBACzClC,YAAYA;wBACZC,SAASA;wBACTC,mBAAmBA;wBACnBC,WAAWA;kCAEX,cAAA,KAACyC;4BACCC,yBAAyB;gCACvBC,QAAQf,MAAMgB,MAAM,CAACf,YAAY,CAACW,MAAM,CAAET,QAAQ,EAAEF,YAAY,CAACW,MAAM,CAAEK,SAAS,IAAI,EAAE,EAAE;oCACxFC,KAAK;oCACLC,MAAM;oCACNC,YAAY;gCACd;4BACF;;;;0BAKR,KAAClE;gBAAM2B,IAAI;oBAAED,OAAO;gBAAO;gBAAGG,WAAU;0BACtC,cAAA,MAAC3B;oBAAWiE,eAAY;;wBAAe;sCAC9B,KAACC;sCAAQzB,YAAYa,MAAM;;wBAAU;;;;;;AAKtD"}
+{"version":3,"sources":["../../../../../../src/explore/PrometheusMetricsFinder/display/list/MetricList.tsx"],"sourcesContent":["// Copyright 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 { Button, Divider, Skeleton, Stack, StackProps, TableCell, Typography } from '@mui/material';\nimport { Fuzzy, FuzzyMatchingInterval } from '@nexucis/fuzzy';\nimport { useExplorerQueryParams } from '@perses-dev/explore';\nimport CompassIcon from 'mdi-material-ui/Compass';\nimport { ReactElement, ReactNode, useMemo } from 'react';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { TableVirtuoso } from 'react-virtuoso';\nimport { DatasourceSelector } from '@perses-dev/spec';\nimport { LabelFilter } from '../../types';\nimport { useMetricMetadata } from '../../utils';\nimport { MetricChip } from '../MetricChip';\n\nexport interface MetricRowProps {\n  children?: ReactNode;\n  metricName: string;\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricRow({\n  children,\n  metricName,\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n}: MetricRowProps): ReactElement {\n  const { metadata, isLoading } = useMetricMetadata(metricName, datasource, isMetadataEnabled);\n\n  const searchParams = useExplorerQueryParams({\n    data: { tab: 'finder', datasource, filters, exploredMetric: metricName },\n  });\n\n  return (\n    <>\n      <TableCell style={{ width: '300px' }}>\n        <Typography sx={{ fontFamily: 'monospace' }}>{children ?? metricName}</Typography>\n      </TableCell>\n\n      <TableCell style={{ width: 115, textAlign: 'center' }}>\n        {isMetadataEnabled && isLoading ? (\n          <Skeleton variant=\"rounded\" width={75} />\n        ) : (\n          <MetricChip label={metadata?.type ?? 'unknown'} />\n        )}\n      </TableCell>\n      <TableCell style={{ width: '100%' }}>\n        {isMetadataEnabled && isLoading ? (\n          <Skeleton variant=\"text\" width={180} />\n        ) : (\n          <Typography sx={{ fontStyle: metadata?.help ? 'initial' : 'italic', minWidth: '30vw' }}>\n            {metadata ? metadata.help : 'unknown'}\n          </Typography>\n        )}\n      </TableCell>\n      <TableCell style={{ width: 140 }}>\n        <Button\n          aria-label={`explore metric ${metricName}`}\n          variant=\"contained\"\n          startIcon={<CompassIcon />}\n          style={{ textWrap: 'nowrap' }}\n          onClick={() => onExplore?.(metricName)}\n          component={RouterLink}\n          to={`?${searchParams}`}\n        >\n          Explore\n        </Button>\n      </TableCell>\n    </>\n  );\n}\n\nexport interface MetricListProps extends StackProps {\n  metricNames: string[];\n  filteredResults?: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }>;\n  datasource: DatasourceSelector;\n  filters: LabelFilter[];\n  isMetadataEnabled?: boolean;\n  onExplore?: (metricName: string) => void;\n}\n\nexport function MetricList({\n  metricNames,\n  filteredResults,\n  datasource,\n  filters,\n  isMetadataEnabled,\n  onExplore,\n  ...props\n}: MetricListProps): ReactElement {\n  const fuzzy = new Fuzzy();\n\n  const fuzzyMetrics: Array<{ original: string; intervals?: FuzzyMatchingInterval[] }> = useMemo(() => {\n    if (filteredResults) {\n      return filteredResults;\n    }\n    return metricNames.map((metricName) => ({ original: metricName }));\n  }, [filteredResults, metricNames]);\n\n  return (\n    <Stack gap={2} width=\"100%\" divider={<Divider orientation=\"horizontal\" flexItem />} {...props}>\n      <TableVirtuoso\n        style={{ height: '70vh', width: '100%' }}\n        totalCount={fuzzyMetrics.length}\n        itemContent={(index) => (\n          <MetricRow\n            metricName={fuzzyMetrics[index]!.original}\n            datasource={datasource}\n            filters={filters}\n            isMetadataEnabled={isMetadataEnabled}\n            onExplore={onExplore}\n          >\n            <span\n              dangerouslySetInnerHTML={{\n                __html: fuzzy.render(fuzzyMetrics[index]!.original, fuzzyMetrics[index]!.intervals ?? [], {\n                  pre: '<strong style=\"color:darkorange\">',\n                  post: '</strong>',\n                  escapeHTML: true,\n                }),\n              }}\n            />\n          </MetricRow>\n        )}\n      />\n      <Stack sx={{ width: '100%' }} textAlign=\"end\">\n        <Typography data-testid=\"finder-total\">\n          Total: <strong>{metricNames.length}</strong> metrics\n        </Typography>\n      </Stack>\n    </Stack>\n  );\n}\n"],"names":["Button","Divider","Skeleton","Stack","TableCell","Typography","Fuzzy","useExplorerQueryParams","CompassIcon","useMemo","Link","RouterLink","TableVirtuoso","useMetricMetadata","MetricChip","MetricRow","children","metricName","datasource","filters","isMetadataEnabled","onExplore","metadata","isLoading","searchParams","data","tab","exploredMetric","style","width","sx","fontFamily","textAlign","variant","label","type","fontStyle","help","minWidth","aria-label","startIcon","textWrap","onClick","component","to","MetricList","metricNames","filteredResults","props","fuzzy","fuzzyMetrics","map","original","gap","divider","orientation","flexItem","height","totalCount","length","itemContent","index","span","dangerouslySetInnerHTML","__html","render","intervals","pre","post","escapeHTML","data-testid","strong"],"mappings":"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"}

package/lib/explore/PrometheusMetricsFinder/filter/FilterInputs.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes, ReactElement } from 'react';
-import { DatasourceSelector } from '@perses-dev/core';
+import { DatasourceSelector } from '@perses-dev/spec';
 import { LabelFilter } from '../types';
 export interface LabelFilterInputProps {
     datasource: DatasourceSelector;

package/lib/explore/PrometheusMetricsFinder/filter/FilterInputs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterInputs.d.ts","sourceRoot":"","sources":["../../../../../src/explore/PrometheusMetricsFinder/filter/FilterInputs.tsx"],"names":[],"mappings":"AAaA,OAAO,EAGL,cAAc,EACd,YAAY,EAKb,MAAM,OAAO,CAAC;AAaf,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAEtD,OAAO,EAAE,WAAW,EAAY,MAAM,UAAU,CAAC;AAGjD,MAAM,WAAW,qBAAqB;IACpC,UAAU,EAAE,kBAAkB,CAAC;IAC/B,KAAK,EAAE,WAAW,CAAC;IACnB,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,UAAU,EACV,KAAK,EACL,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,qBAAqB,GAAG,YAAY,CAwBtC;AAGD,eAAO,MAAM,gBAAgB,+HAiC5B,CAAC;AAGF,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,WAAW,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,2BAA2B,EAC3B,QAAQ,EACR,QAAQ,GACT,EAAE,mBAAmB,GAAG,YAAY,CAoHpC"}
+{"version":3,"file":"FilterInputs.d.ts","sourceRoot":"","sources":["../../../../../src/explore/PrometheusMetricsFinder/filter/FilterInputs.tsx"],"names":[],"mappings":"AAaA,OAAO,EAGL,cAAc,EACd,YAAY,EAKb,MAAM,OAAO,CAAC;AAcf,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAY,MAAM,UAAU,CAAC;AAGjD,MAAM,WAAW,qBAAqB;IACpC,UAAU,EAAE,kBAAkB,CAAC;IAC/B,KAAK,EAAE,WAAW,CAAC;IACnB,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,UAAU,EACV,KAAK,EACL,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,qBAAqB,GAAG,YAAY,CAwBtC;AAGD,eAAO,MAAM,gBAAgB,+HAiC5B,CAAC;AAGF,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,WAAW,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,2BAA2B,EAC3B,QAAQ,EACR,QAAQ,GACT,EAAE,mBAAmB,GAAG,YAAY,CAoHpC"}