@perses-dev/dashboards 0.16.0 → 0.17.0

package/dist/components/Variables/VariableList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VariableList.d.ts","sourceRoot":"","sources":["../../../src/components/Variables/VariableList.tsx"],"names":[],"mappings":";AAuBA,UAAU,yBAAyB;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,eAoDpE"}
+{"version":3,"file":"VariableList.d.ts","sourceRoot":"","sources":["../../../src/components/Variables/VariableList.tsx"],"names":[],"mappings":";AAwBA,UAAU,yBAAyB;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,eAuDpE"}

package/dist/components/Variables/VariableList.js

@@ -12,11 +12,12 @@
 // limitations under the License.
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useState } from 'react';
-import { Button, Stack, Box, Drawer, AppBar, useScrollTrigger, IconButton } from '@mui/material';
+import { Button, Stack, Box, AppBar, useScrollTrigger, IconButton } from '@mui/material';
 import EyeIcon from 'mdi-material-ui/Eye';
 import PencilIcon from 'mdi-material-ui/Pencil';
 import PinOutline from 'mdi-material-ui/PinOutline';
 import PinOffOutline from 'mdi-material-ui/PinOffOutline';
+import { Drawer } from '@perses-dev/components';
 import { useTemplateVariableDefinitions, useEditMode, useTemplateVariableActions } from '../../context';
 import { TemplateVariable } from './Variable';
 import { VariableEditor } from './VariableEditor';
@@ -32,21 +33,22 @@ export function TemplateVariableList(props) {
         disableHysteresis: true
     });
     const isSticky = scrollTrigger && props.initialVariableIsSticky && isPin;
+    const onClose = ()=>{
+        setIsEditing(false);
+    };
     return /*#__PURE__*/ _jsxs(Box, {
         children: [
             /*#__PURE__*/ _jsx(Drawer, {
-                anchor: 'right',
-                open: isEditing,
+                isOpen: isEditing,
+                onClose: onClose,
                 PaperProps: {
                     sx: {
                         width: '50%'
                     }
                 },
                 children: /*#__PURE__*/ _jsx(VariableEditor, {
-                    onCancel: ()=>{
-                        setIsEditing(false);
-                    },
                     variableDefinitions: variableDefinitions,
+                    onCancel: onClose,
                     onChange: (v)=>{
                         setVariableDefinitions(v);
                         setIsEditing(false);
@@ -82,8 +84,8 @@ export function TemplateVariableList(props) {
                     ml: isSticky ? 2 : 0,
                     children: [
                         /*#__PURE__*/ _jsx(Stack, {
-                            direction: 'row',
-                            spacing: 2,
+                            direction: "row",
+                            spacing: 1,
                             children: showVariables && variableDefinitions.map((v)=>{
                                 var ref;
                                 /*#__PURE__*/ return _jsx(Box, {

package/dist/components/Variables/VariableList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Variables/VariableList.tsx"],"sourcesContent":["// Copyright 2022 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 React, { useState } from 'react';\nimport { Button, Stack, Box, Drawer, AppBar, useScrollTrigger, IconButton } from '@mui/material';\nimport EyeIcon from 'mdi-material-ui/Eye';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport PinOutline from 'mdi-material-ui/PinOutline';\nimport PinOffOutline from 'mdi-material-ui/PinOffOutline';\nimport { useTemplateVariableDefinitions, useEditMode, useTemplateVariableActions } from '../../context';\nimport { TemplateVariable } from './Variable';\nimport { VariableEditor } from './VariableEditor';\n\ninterface TemplateVariableListProps {\n  initialVariableIsSticky?: boolean;\n}\n\nexport function TemplateVariableList(props: TemplateVariableListProps) {\n  const [isEditing, setIsEditing] = useState(false);\n  const [isPin, setIsPin] = useState(props.initialVariableIsSticky);\n  const variableDefinitions = useTemplateVariableDefinitions();\n  const { isEditMode } = useEditMode();\n  const [showVariablesInEditMode, setShowVariablesInEditMode] = useState(true);\n  const showVariables = isEditMode ? showVariablesInEditMode : true;\n  const { setVariableDefinitions } = useTemplateVariableActions();\n  const scrollTrigger = useScrollTrigger({ disableHysteresis: true });\n  const isSticky = scrollTrigger && props.initialVariableIsSticky && isPin;\n  return (\n    <Box>\n      <Drawer anchor={'right'} open={isEditing} PaperProps={{ sx: { width: '50%' } }}>\n        <VariableEditor\n          onCancel={() => {\n            setIsEditing(false);\n          }}\n          variableDefinitions={variableDefinitions}\n          onChange={(v) => {\n            setVariableDefinitions(v);\n            setIsEditing(false);\n          }}\n        />\n      </Drawer>\n      {isEditMode && (\n        <Box pb={2}>\n          <Button onClick={() => setShowVariablesInEditMode(!showVariablesInEditMode)} startIcon={<EyeIcon />}>\n            {showVariablesInEditMode ? 'Hide' : 'Show'} Variables\n          </Button>\n          <Button onClick={() => setIsEditing(true)} startIcon={<PencilIcon />}>\n            Edit Variables\n          </Button>\n        </Box>\n      )}\n\n      <AppBar color={'inherit'} position={isSticky ? 'fixed' : 'static'} elevation={isSticky ? 4 : 0}>\n        <Box display={'flex'} justifyContent=\"space-between\" my={isSticky ? 2 : 0} ml={isSticky ? 2 : 0}>\n          <Stack direction={'row'} spacing={2}>\n            {showVariables &&\n              variableDefinitions.map((v) => (\n                <Box key={v.spec.name} display={v.spec.display?.hidden ? 'none' : undefined}>\n                  <TemplateVariable key={v.spec.name} name={v.spec.name} />\n                </Box>\n              ))}\n          </Stack>\n          {props.initialVariableIsSticky && (\n            <IconButton onClick={() => setIsPin(!isPin)}>{isPin ? <PinOutline /> : <PinOffOutline />}</IconButton>\n          )}\n        </Box>\n      </AppBar>\n    </Box>\n  );\n}\n"],"names":["React","useState","Button","Stack","Box","Drawer","AppBar","useScrollTrigger","IconButton","EyeIcon","PencilIcon","PinOutline","PinOffOutline","useTemplateVariableDefinitions","useEditMode","useTemplateVariableActions","TemplateVariable","VariableEditor","TemplateVariableList","props","isEditing","setIsEditing","isPin","setIsPin","initialVariableIsSticky","variableDefinitions","isEditMode","showVariablesInEditMode","setShowVariablesInEditMode","showVariables","setVariableDefinitions","scrollTrigger","disableHysteresis","isSticky","anchor","open","PaperProps","sx","width","onCancel","onChange","v","pb","onClick","startIcon","color","position","elevation","display","justifyContent","my","ml","direction","spacing","map","spec","hidden","undefined","name"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Variables/VariableList.tsx"],"sourcesContent":["// Copyright 2022 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 React, { useState } from 'react';\nimport { Button, Stack, Box, AppBar, useScrollTrigger, IconButton } from '@mui/material';\nimport EyeIcon from 'mdi-material-ui/Eye';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport PinOutline from 'mdi-material-ui/PinOutline';\nimport PinOffOutline from 'mdi-material-ui/PinOffOutline';\nimport { Drawer } from '@perses-dev/components';\nimport { useTemplateVariableDefinitions, useEditMode, useTemplateVariableActions } from '../../context';\nimport { TemplateVariable } from './Variable';\nimport { VariableEditor } from './VariableEditor';\n\ninterface TemplateVariableListProps {\n  initialVariableIsSticky?: boolean;\n}\n\nexport function TemplateVariableList(props: TemplateVariableListProps) {\n  const [isEditing, setIsEditing] = useState(false);\n  const [isPin, setIsPin] = useState(props.initialVariableIsSticky);\n  const variableDefinitions = useTemplateVariableDefinitions();\n  const { isEditMode } = useEditMode();\n  const [showVariablesInEditMode, setShowVariablesInEditMode] = useState(true);\n  const showVariables = isEditMode ? showVariablesInEditMode : true;\n  const { setVariableDefinitions } = useTemplateVariableActions();\n  const scrollTrigger = useScrollTrigger({ disableHysteresis: true });\n  const isSticky = scrollTrigger && props.initialVariableIsSticky && isPin;\n\n  const onClose = () => {\n    setIsEditing(false);\n  };\n\n  return (\n    <Box>\n      <Drawer isOpen={isEditing} onClose={onClose} PaperProps={{ sx: { width: '50%' } }}>\n        <VariableEditor\n          variableDefinitions={variableDefinitions}\n          onCancel={onClose}\n          onChange={(v) => {\n            setVariableDefinitions(v);\n            setIsEditing(false);\n          }}\n        />\n      </Drawer>\n      {isEditMode && (\n        <Box pb={2}>\n          <Button onClick={() => setShowVariablesInEditMode(!showVariablesInEditMode)} startIcon={<EyeIcon />}>\n            {showVariablesInEditMode ? 'Hide' : 'Show'} Variables\n          </Button>\n          <Button onClick={() => setIsEditing(true)} startIcon={<PencilIcon />}>\n            Edit Variables\n          </Button>\n        </Box>\n      )}\n\n      <AppBar color={'inherit'} position={isSticky ? 'fixed' : 'static'} elevation={isSticky ? 4 : 0}>\n        <Box display={'flex'} justifyContent=\"space-between\" my={isSticky ? 2 : 0} ml={isSticky ? 2 : 0}>\n          <Stack direction=\"row\" spacing={1}>\n            {showVariables &&\n              variableDefinitions.map((v) => (\n                <Box key={v.spec.name} display={v.spec.display?.hidden ? 'none' : undefined}>\n                  <TemplateVariable key={v.spec.name} name={v.spec.name} />\n                </Box>\n              ))}\n          </Stack>\n          {props.initialVariableIsSticky && (\n            <IconButton onClick={() => setIsPin(!isPin)}>{isPin ? <PinOutline /> : <PinOffOutline />}</IconButton>\n          )}\n        </Box>\n      </AppBar>\n    </Box>\n  );\n}\n"],"names":["React","useState","Button","Stack","Box","AppBar","useScrollTrigger","IconButton","EyeIcon","PencilIcon","PinOutline","PinOffOutline","Drawer","useTemplateVariableDefinitions","useEditMode","useTemplateVariableActions","TemplateVariable","VariableEditor","TemplateVariableList","props","isEditing","setIsEditing","isPin","setIsPin","initialVariableIsSticky","variableDefinitions","isEditMode","showVariablesInEditMode","setShowVariablesInEditMode","showVariables","setVariableDefinitions","scrollTrigger","disableHysteresis","isSticky","onClose","isOpen","PaperProps","sx","width","onCancel","onChange","v","pb","onClick","startIcon","color","position","elevation","display","justifyContent","my","ml","direction","spacing","map","spec","hidden","undefined","name"],"mappings":"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"}

package/dist/components/Variables/variable-model.d.ts

@@ -0,0 +1,8 @@
+import { ListVariableDefinition } from '@perses-dev/core';
+import { VariableStateMap } from '@perses-dev/plugin-system';
+export declare function useListVariablePluginValues(definition: ListVariableDefinition): import("@tanstack/react-query").UseQueryResult<import("@perses-dev/plugin-system").VariableOption[], unknown>;
+/**
+ * Returns a serialized string of the current state of variable values.
+ */
+export declare function getVariableValuesKey(v: VariableStateMap): string;
+//# sourceMappingURL=variable-model.d.ts.map

package/dist/components/Variables/variable-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"variable-model.d.ts","sourceRoot":"","sources":["../../../src/components/Variables/variable-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAKL,gBAAgB,EACjB,MAAM,2BAA2B,CAAC;AAGnC,wBAAgB,2BAA2B,CAAC,UAAU,EAAE,sBAAsB,iHAmC7E;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,EAAE,gBAAgB,UAIvD"}

package/dist/components/Variables/variable-model.js

@@ -0,0 +1,64 @@
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { usePlugin, useTemplateVariableValues, useDatasourceStore, useTimeRange } from '@perses-dev/plugin-system';
+import { useQuery } from '@tanstack/react-query';
+export function useListVariablePluginValues(definition) {
+    const { data: variablePlugin  } = usePlugin('Variable', definition.spec.plugin.kind);
+    const datasourceStore = useDatasourceStore();
+    const allVariables = useTemplateVariableValues();
+    const { timeRange  } = useTimeRange();
+    const variablePluginCtx = {
+        timeRange,
+        datasourceStore,
+        variables: allVariables
+    };
+    const spec = definition.spec.plugin.spec;
+    let dependsOnVariables;
+    if (variablePlugin === null || variablePlugin === void 0 ? void 0 : variablePlugin.dependsOn) {
+        const dependencies = variablePlugin.dependsOn(spec, variablePluginCtx);
+        dependsOnVariables = dependencies.variables;
+    }
+    const variables = useTemplateVariableValues(dependsOnVariables);
+    let waitToLoad = false;
+    if (dependsOnVariables) {
+        waitToLoad = dependsOnVariables.some((v)=>{
+            var ref;
+            return (ref = variables[v]) === null || ref === void 0 ? void 0 : ref.loading;
+        });
+    }
+    const variablesValueKey = getVariableValuesKey(variables);
+    const variablesOptionsQuery = useQuery([
+        name,
+        definition,
+        variablesValueKey,
+        timeRange
+    ], async ()=>{
+        const resp = await (variablePlugin === null || variablePlugin === void 0 ? void 0 : variablePlugin.getVariableOptions(spec, {
+            datasourceStore,
+            variables,
+            timeRange
+        }));
+        var ref;
+        return (ref = resp === null || resp === void 0 ? void 0 : resp.data) !== null && ref !== void 0 ? ref : [];
+    }, {
+        enabled: !!variablePlugin || waitToLoad
+    });
+    return variablesOptionsQuery;
+}
+/**
+ * Returns a serialized string of the current state of variable values.
+ */ export function getVariableValuesKey(v) {
+    return Object.values(v).map((v)=>JSON.stringify(v.value)).join(',');
+}
+
+//# sourceMappingURL=variable-model.js.map

package/dist/components/Variables/variable-model.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Variables/variable-model.ts"],"sourcesContent":["// Copyright 2022 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 { ListVariableDefinition } from '@perses-dev/core';\nimport {\n  usePlugin,\n  useTemplateVariableValues,\n  useDatasourceStore,\n  useTimeRange,\n  VariableStateMap,\n} from '@perses-dev/plugin-system';\nimport { useQuery } from '@tanstack/react-query';\n\nexport function useListVariablePluginValues(definition: ListVariableDefinition) {\n  const { data: variablePlugin } = usePlugin('Variable', definition.spec.plugin.kind);\n  const datasourceStore = useDatasourceStore();\n  const allVariables = useTemplateVariableValues();\n  const { timeRange } = useTimeRange();\n\n  const variablePluginCtx = { timeRange, datasourceStore, variables: allVariables };\n\n  const spec = definition.spec.plugin.spec;\n\n  let dependsOnVariables: string[] | undefined;\n  if (variablePlugin?.dependsOn) {\n    const dependencies = variablePlugin.dependsOn(spec, variablePluginCtx);\n    dependsOnVariables = dependencies.variables;\n  }\n\n  const variables = useTemplateVariableValues(dependsOnVariables);\n\n  let waitToLoad = false;\n  if (dependsOnVariables) {\n    waitToLoad = dependsOnVariables.some((v) => variables[v]?.loading);\n  }\n\n  const variablesValueKey = getVariableValuesKey(variables);\n\n  const variablesOptionsQuery = useQuery(\n    [name, definition, variablesValueKey, timeRange],\n    async () => {\n      const resp = await variablePlugin?.getVariableOptions(spec, { datasourceStore, variables, timeRange });\n      return resp?.data ?? [];\n    },\n    { enabled: !!variablePlugin || waitToLoad }\n  );\n\n  return variablesOptionsQuery;\n}\n\n/**\n * Returns a serialized string of the current state of variable values.\n */\nexport function getVariableValuesKey(v: VariableStateMap) {\n  return Object.values(v)\n    .map((v) => JSON.stringify(v.value))\n    .join(',');\n}\n"],"names":["usePlugin","useTemplateVariableValues","useDatasourceStore","useTimeRange","useQuery","useListVariablePluginValues","definition","data","variablePlugin","spec","plugin","kind","datasourceStore","allVariables","timeRange","variablePluginCtx","variables","dependsOnVariables","dependsOn","dependencies","waitToLoad","some","v","loading","variablesValueKey","getVariableValuesKey","variablesOptionsQuery","name","resp","getVariableOptions","enabled","Object","values","map","JSON","stringify","value","join"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/dashboards",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "The dashboards feature in Perses",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -28,9 +28,9 @@
     "lint:fix": "eslint --fix src --ext .ts,.tsx"
   },
   "dependencies": {
-    "@perses-dev/components": "^0.16.0",
-    "@perses-dev/core": "^0.16.0",
-    "@perses-dev/plugin-system": "^0.16.0",
+    "@perses-dev/components": "^0.17.0",
+    "@perses-dev/core": "^0.17.0",
+    "@perses-dev/plugin-system": "^0.17.0",
     "@types/react-grid-layout": "^1.3.2",
     "date-fns": "^2.28.0",
     "immer": "^9.0.15",