@perses-dev/dashboards 0.50.2 → 0.50.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/PanelDrawer/PanelEditorForm.js +21 -11
- package/dist/cjs/context/VariableProvider/VariableProvider.js +12 -11
- package/dist/components/PanelDrawer/PanelEditorForm.d.ts.map +1 -1
- package/dist/components/PanelDrawer/PanelEditorForm.js +21 -11
- package/dist/components/PanelDrawer/PanelEditorForm.js.map +1 -1
- package/dist/context/VariableProvider/VariableProvider.d.ts.map +1 -1
- package/dist/context/VariableProvider/VariableProvider.js +12 -11
- package/dist/context/VariableProvider/VariableProvider.js.map +1 -1
- package/package.json +6 -6
|
@@ -44,6 +44,12 @@ function PanelEditorForm(props) {
|
|
|
44
44
|
const { panelDefinition, setName, setDescription, setLinks, setQueries, setPlugin, setPanelDefinition } = (0, _usePanelEditor.usePanelEditor)(initialValues.panelDefinition);
|
|
45
45
|
const { plugin } = panelDefinition.spec;
|
|
46
46
|
const [isDiscardDialogOpened, setDiscardDialogOpened] = (0, _react.useState)(false);
|
|
47
|
+
const { panelEditorSchema } = (0, _pluginsystem.useValidationSchemas)();
|
|
48
|
+
const form = (0, _reacthookform.useForm)({
|
|
49
|
+
resolver: (0, _zod.zodResolver)(panelEditorSchema),
|
|
50
|
+
mode: 'onBlur',
|
|
51
|
+
defaultValues: initialValues
|
|
52
|
+
});
|
|
47
53
|
// Use common plugin editor logic even though we've split the inputs up in this form
|
|
48
54
|
const pluginEditor = (0, _pluginsystem.usePluginEditor)({
|
|
49
55
|
pluginTypes: [
|
|
@@ -72,12 +78,6 @@ function PanelEditorForm(props) {
|
|
|
72
78
|
});
|
|
73
79
|
const titleAction = (0, _pluginsystem.getTitleAction)(initialAction, true);
|
|
74
80
|
const submitText = (0, _pluginsystem.getSubmitText)(initialAction, true);
|
|
75
|
-
const { panelEditorSchema } = (0, _pluginsystem.useValidationSchemas)();
|
|
76
|
-
const form = (0, _reacthookform.useForm)({
|
|
77
|
-
resolver: (0, _zod.zodResolver)(panelEditorSchema),
|
|
78
|
-
mode: 'onBlur',
|
|
79
|
-
defaultValues: initialValues
|
|
80
|
-
});
|
|
81
81
|
const links = (0, _reacthookform.useWatch)({
|
|
82
82
|
control: form.control,
|
|
83
83
|
name: 'panelDefinition.spec.links'
|
|
@@ -111,6 +111,18 @@ function PanelEditorForm(props) {
|
|
|
111
111
|
}
|
|
112
112
|
setPanelDefinition(nextPanelDef);
|
|
113
113
|
};
|
|
114
|
+
const watchedName = (0, _reacthookform.useWatch)({
|
|
115
|
+
control: form.control,
|
|
116
|
+
name: 'panelDefinition.spec.display.name'
|
|
117
|
+
});
|
|
118
|
+
const watchedDescription = (0, _reacthookform.useWatch)({
|
|
119
|
+
control: form.control,
|
|
120
|
+
name: 'panelDefinition.spec.display.description'
|
|
121
|
+
});
|
|
122
|
+
const watchedPluginKind = (0, _reacthookform.useWatch)({
|
|
123
|
+
control: form.control,
|
|
124
|
+
name: 'panelDefinition.spec.plugin.kind'
|
|
125
|
+
});
|
|
114
126
|
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reacthookform.FormProvider, {
|
|
115
127
|
...form,
|
|
116
128
|
children: [
|
|
@@ -169,7 +181,6 @@ function PanelEditorForm(props) {
|
|
|
169
181
|
name: "panelDefinition.spec.display.name",
|
|
170
182
|
render: ({ field, fieldState })=>{
|
|
171
183
|
var _fieldState_error;
|
|
172
|
-
var _field_value;
|
|
173
184
|
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
|
|
174
185
|
...field,
|
|
175
186
|
required: true,
|
|
@@ -177,7 +188,7 @@ function PanelEditorForm(props) {
|
|
|
177
188
|
label: "Name",
|
|
178
189
|
error: !!fieldState.error,
|
|
179
190
|
helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
180
|
-
value:
|
|
191
|
+
value: watchedName !== null && watchedName !== void 0 ? watchedName : '',
|
|
181
192
|
onChange: (event)=>{
|
|
182
193
|
field.onChange(event);
|
|
183
194
|
setName(event.target.value);
|
|
@@ -224,14 +235,13 @@ function PanelEditorForm(props) {
|
|
|
224
235
|
name: "panelDefinition.spec.display.description",
|
|
225
236
|
render: ({ field, fieldState })=>{
|
|
226
237
|
var _fieldState_error;
|
|
227
|
-
var _field_value;
|
|
228
238
|
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
|
|
229
239
|
...field,
|
|
230
240
|
fullWidth: true,
|
|
231
241
|
label: "Description",
|
|
232
242
|
error: !!fieldState.error,
|
|
233
243
|
helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
234
|
-
value:
|
|
244
|
+
value: watchedDescription !== null && watchedDescription !== void 0 ? watchedDescription : '',
|
|
235
245
|
onChange: (event)=>{
|
|
236
246
|
field.onChange(event);
|
|
237
247
|
setDescription(event.target.value);
|
|
@@ -262,7 +272,7 @@ function PanelEditorForm(props) {
|
|
|
262
272
|
helperText: (_pluginEditor_error_message = (_pluginEditor_error = pluginEditor.error) === null || _pluginEditor_error === void 0 ? void 0 : _pluginEditor_error.message) !== null && _pluginEditor_error_message !== void 0 ? _pluginEditor_error_message : (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
263
273
|
value: {
|
|
264
274
|
type: 'Panel',
|
|
265
|
-
kind:
|
|
275
|
+
kind: watchedPluginKind
|
|
266
276
|
},
|
|
267
277
|
onChange: (event)=>{
|
|
268
278
|
field.onChange(event.kind);
|
|
@@ -52,6 +52,7 @@ const _zustand = require("zustand");
|
|
|
52
52
|
const _traditional = require("zustand/traditional");
|
|
53
53
|
const _immer = require("zustand/middleware/immer");
|
|
54
54
|
const _middleware = require("zustand/middleware");
|
|
55
|
+
const _shallow = require("zustand/shallow");
|
|
55
56
|
const _immer1 = /*#__PURE__*/ _interop_require_default(require("immer"));
|
|
56
57
|
const _pluginsystem = require("@perses-dev/plugin-system");
|
|
57
58
|
const _core = require("@perses-dev/core");
|
|
@@ -126,7 +127,7 @@ function useVariableDefinitionAndState(name, source) {
|
|
|
126
127
|
}
|
|
127
128
|
function useVariableDefinitionActions() {
|
|
128
129
|
const store = useVariableDefinitionStoreCtx();
|
|
129
|
-
return (0,
|
|
130
|
+
return (0, _traditional.useStoreWithEqualityFn)(store, (s)=>{
|
|
130
131
|
return {
|
|
131
132
|
setVariableValue: s.setVariableValue,
|
|
132
133
|
setVariableLoading: s.setVariableLoading,
|
|
@@ -135,7 +136,7 @@ function useVariableDefinitionActions() {
|
|
|
135
136
|
setVariableDefaultValues: s.setVariableDefaultValues,
|
|
136
137
|
getSavedVariablesStatus: s.getSavedVariablesStatus
|
|
137
138
|
};
|
|
138
|
-
});
|
|
139
|
+
}, _shallow.shallow);
|
|
139
140
|
}
|
|
140
141
|
function useVariableDefinitions() {
|
|
141
142
|
const store = useVariableDefinitionStoreCtx();
|
|
@@ -372,10 +373,10 @@ function createVariableDefinitionStore({ initialVariableDefinitions = [], extern
|
|
|
372
373
|
return store; // TODO: @Gladorme check if we can avoid this cast
|
|
373
374
|
}
|
|
374
375
|
function VariableProvider({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions = [] }) {
|
|
375
|
-
const [store] = (0, _react.useState)(createVariableDefinitionStore({
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
376
|
+
const [store] = (0, _react.useState)(()=>createVariableDefinitionStore({
|
|
377
|
+
initialVariableDefinitions,
|
|
378
|
+
externalVariableDefinitions
|
|
379
|
+
}));
|
|
379
380
|
return /*#__PURE__*/ (0, _jsxruntime.jsx)(VariableDefinitionStoreContext.Provider, {
|
|
380
381
|
value: store,
|
|
381
382
|
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(PluginProvider, {
|
|
@@ -387,11 +388,11 @@ function VariableProvider({ children, initialVariableDefinitions = [], externalV
|
|
|
387
388
|
function VariableProviderWithQueryParams({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions: builtinVariables = [] }) {
|
|
388
389
|
const allVariableDefs = (0, _utils.mergeVariableDefinitions)(initialVariableDefinitions, externalVariableDefinitions);
|
|
389
390
|
const queryParams = (0, _queryparams.useVariableQueryParams)(allVariableDefs);
|
|
390
|
-
const [store] = (0, _react.useState)(createVariableDefinitionStore({
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
391
|
+
const [store] = (0, _react.useState)(()=>createVariableDefinitionStore({
|
|
392
|
+
initialVariableDefinitions,
|
|
393
|
+
externalVariableDefinitions,
|
|
394
|
+
queryParams
|
|
395
|
+
}));
|
|
395
396
|
return /*#__PURE__*/ (0, _jsxruntime.jsx)(VariableDefinitionStoreContext.Provider, {
|
|
396
397
|
value: store,
|
|
397
398
|
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(PluginProvider, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PanelEditorForm.d.ts","sourceRoot":"","sources":["../../../src/components/PanelDrawer/PanelEditorForm.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,MAAM,EAAmB,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAgB9E,MAAM,WAAW,oBAAoB;IACnC,aAAa,EAAE,iBAAiB,CAAC;IACjC,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"PanelEditorForm.d.ts","sourceRoot":"","sources":["../../../src/components/PanelDrawer/PanelEditorForm.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,MAAM,EAAmB,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAgB9E,MAAM,WAAW,oBAAoB;IACnC,aAAa,EAAE,iBAAiB,CAAC;IACjC,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,YAAY,CA8NzE;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,sBAAsB,CAAC"}
|
|
@@ -26,6 +26,12 @@ export function PanelEditorForm(props) {
|
|
|
26
26
|
const { panelDefinition, setName, setDescription, setLinks, setQueries, setPlugin, setPanelDefinition } = usePanelEditor(initialValues.panelDefinition);
|
|
27
27
|
const { plugin } = panelDefinition.spec;
|
|
28
28
|
const [isDiscardDialogOpened, setDiscardDialogOpened] = useState(false);
|
|
29
|
+
const { panelEditorSchema } = useValidationSchemas();
|
|
30
|
+
const form = useForm({
|
|
31
|
+
resolver: zodResolver(panelEditorSchema),
|
|
32
|
+
mode: 'onBlur',
|
|
33
|
+
defaultValues: initialValues
|
|
34
|
+
});
|
|
29
35
|
// Use common plugin editor logic even though we've split the inputs up in this form
|
|
30
36
|
const pluginEditor = usePluginEditor({
|
|
31
37
|
pluginTypes: [
|
|
@@ -54,12 +60,6 @@ export function PanelEditorForm(props) {
|
|
|
54
60
|
});
|
|
55
61
|
const titleAction = getTitleAction(initialAction, true);
|
|
56
62
|
const submitText = getSubmitText(initialAction, true);
|
|
57
|
-
const { panelEditorSchema } = useValidationSchemas();
|
|
58
|
-
const form = useForm({
|
|
59
|
-
resolver: zodResolver(panelEditorSchema),
|
|
60
|
-
mode: 'onBlur',
|
|
61
|
-
defaultValues: initialValues
|
|
62
|
-
});
|
|
63
63
|
const links = useWatch({
|
|
64
64
|
control: form.control,
|
|
65
65
|
name: 'panelDefinition.spec.links'
|
|
@@ -93,6 +93,18 @@ export function PanelEditorForm(props) {
|
|
|
93
93
|
}
|
|
94
94
|
setPanelDefinition(nextPanelDef);
|
|
95
95
|
};
|
|
96
|
+
const watchedName = useWatch({
|
|
97
|
+
control: form.control,
|
|
98
|
+
name: 'panelDefinition.spec.display.name'
|
|
99
|
+
});
|
|
100
|
+
const watchedDescription = useWatch({
|
|
101
|
+
control: form.control,
|
|
102
|
+
name: 'panelDefinition.spec.display.description'
|
|
103
|
+
});
|
|
104
|
+
const watchedPluginKind = useWatch({
|
|
105
|
+
control: form.control,
|
|
106
|
+
name: 'panelDefinition.spec.plugin.kind'
|
|
107
|
+
});
|
|
96
108
|
return /*#__PURE__*/ _jsxs(FormProvider, {
|
|
97
109
|
...form,
|
|
98
110
|
children: [
|
|
@@ -151,7 +163,6 @@ export function PanelEditorForm(props) {
|
|
|
151
163
|
name: "panelDefinition.spec.display.name",
|
|
152
164
|
render: ({ field, fieldState })=>{
|
|
153
165
|
var _fieldState_error;
|
|
154
|
-
var _field_value;
|
|
155
166
|
return /*#__PURE__*/ _jsx(TextField, {
|
|
156
167
|
...field,
|
|
157
168
|
required: true,
|
|
@@ -159,7 +170,7 @@ export function PanelEditorForm(props) {
|
|
|
159
170
|
label: "Name",
|
|
160
171
|
error: !!fieldState.error,
|
|
161
172
|
helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
162
|
-
value:
|
|
173
|
+
value: watchedName !== null && watchedName !== void 0 ? watchedName : '',
|
|
163
174
|
onChange: (event)=>{
|
|
164
175
|
field.onChange(event);
|
|
165
176
|
setName(event.target.value);
|
|
@@ -206,14 +217,13 @@ export function PanelEditorForm(props) {
|
|
|
206
217
|
name: "panelDefinition.spec.display.description",
|
|
207
218
|
render: ({ field, fieldState })=>{
|
|
208
219
|
var _fieldState_error;
|
|
209
|
-
var _field_value;
|
|
210
220
|
return /*#__PURE__*/ _jsx(TextField, {
|
|
211
221
|
...field,
|
|
212
222
|
fullWidth: true,
|
|
213
223
|
label: "Description",
|
|
214
224
|
error: !!fieldState.error,
|
|
215
225
|
helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
216
|
-
value:
|
|
226
|
+
value: watchedDescription !== null && watchedDescription !== void 0 ? watchedDescription : '',
|
|
217
227
|
onChange: (event)=>{
|
|
218
228
|
field.onChange(event);
|
|
219
229
|
setDescription(event.target.value);
|
|
@@ -244,7 +254,7 @@ export function PanelEditorForm(props) {
|
|
|
244
254
|
helperText: (_pluginEditor_error_message = (_pluginEditor_error = pluginEditor.error) === null || _pluginEditor_error === void 0 ? void 0 : _pluginEditor_error.message) !== null && _pluginEditor_error_message !== void 0 ? _pluginEditor_error_message : (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
|
|
245
255
|
value: {
|
|
246
256
|
type: 'Panel',
|
|
247
|
-
kind:
|
|
257
|
+
kind: watchedPluginKind
|
|
248
258
|
},
|
|
249
259
|
onChange: (event)=>{
|
|
250
260
|
field.onChange(event.kind);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/PanelDrawer/PanelEditorForm.tsx"],"sourcesContent":["// Copyright 2023 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 { ReactElement, useEffect, useState } from 'react';\nimport { Box, Button, Grid, MenuItem, Stack, TextField, Typography } from '@mui/material';\nimport { Action, PanelDefinition, PanelEditorValues } from '@perses-dev/core';\nimport { DiscardChangesConfirmationDialog, ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport {\n PluginKindSelect,\n usePluginEditor,\n PanelSpecEditor,\n getTitleAction,\n getSubmitText,\n useValidationSchemas,\n} from '@perses-dev/plugin-system';\nimport { Controller, FormProvider, SubmitHandler, useForm, useWatch } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { useListPanelGroups } from '../../context';\nimport { PanelPreview } from './PanelPreview';\nimport { usePanelEditor } from './usePanelEditor';\n\nexport interface PanelEditorFormProps {\n initialValues: PanelEditorValues;\n initialAction: Action;\n onSave: (values: PanelEditorValues) => void;\n onClose: () => void;\n}\n\nexport function PanelEditorForm(props: PanelEditorFormProps): ReactElement {\n const { initialValues, initialAction, onSave, onClose } = props;\n const panelGroups = useListPanelGroups();\n const { panelDefinition, setName, setDescription, setLinks, setQueries, setPlugin, setPanelDefinition } =\n usePanelEditor(initialValues.panelDefinition);\n const { plugin } = panelDefinition.spec;\n const [isDiscardDialogOpened, setDiscardDialogOpened] = useState<boolean>(false);\n\n // Use common plugin editor logic even though we've split the inputs up in this form\n const pluginEditor = usePluginEditor({\n pluginTypes: ['Panel'],\n value: { selection: { kind: plugin.kind, type: 'Panel' }, spec: plugin.spec },\n onChange: (plugin) => {\n form.setValue('panelDefinition.spec.plugin', { kind: plugin.selection.kind, spec: plugin.spec });\n setPlugin({\n kind: plugin.selection.kind,\n spec: plugin.spec,\n });\n },\n onHideQueryEditorChange: (isHidden) => {\n setQueries(undefined, isHidden);\n },\n });\n\n const titleAction = getTitleAction(initialAction, true);\n const submitText = getSubmitText(initialAction, true);\n\n const { panelEditorSchema } = useValidationSchemas();\n const form = useForm<PanelEditorValues>({\n resolver: zodResolver(panelEditorSchema),\n mode: 'onBlur',\n defaultValues: initialValues,\n });\n\n const links = useWatch({ control: form.control, name: 'panelDefinition.spec.links' });\n useEffect(() => {\n setLinks(links);\n }, [setLinks, links]);\n\n const processForm: SubmitHandler<PanelEditorValues> = (data) => {\n onSave(data);\n };\n\n // When user click on cancel, several possibilities:\n // - create action: ask for discard approval\n // - update action: ask for discard approval if changed\n // - read action: don´t ask for discard approval\n function handleCancel(): void {\n if (JSON.stringify(initialValues) !== JSON.stringify(form.getValues())) {\n setDiscardDialogOpened(true);\n } else {\n onClose();\n }\n }\n\n const handlePanelDefinitionChange = (nextPanelDefStr: string): void => {\n const nextPanelDef: PanelDefinition = JSON.parse(nextPanelDefStr);\n const { kind: pluginKind, spec: pluginSpec } = nextPanelDef.spec.plugin;\n // if panel plugin kind and spec are modified, then need to save current spec\n if (\n panelDefinition.spec.plugin.kind !== pluginKind &&\n JSON.stringify(panelDefinition.spec.plugin.spec) !== JSON.stringify(pluginSpec)\n ) {\n pluginEditor.rememberCurrentSpecState();\n }\n setPanelDefinition(nextPanelDef);\n };\n\n return (\n <FormProvider {...form}>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n padding: (theme) => theme.spacing(1, 2),\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n }}\n >\n <Typography variant=\"h2\">{titleAction} Panel</Typography>\n <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n <Button variant=\"contained\" disabled={!form.formState.isValid} onClick={form.handleSubmit(processForm)}>\n {submitText}\n </Button>\n <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n Cancel\n </Button>\n </Stack>\n </Box>\n <Box id={panelEditorFormId} sx={{ flex: 1, overflowY: 'scroll', padding: (theme) => theme.spacing(2) }}>\n <Grid container spacing={2}>\n <Grid item xs={8}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.display.name\"\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n required\n fullWidth\n label=\"Name\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n value={field.value ?? ''}\n onChange={(event) => {\n field.onChange(event);\n setName(event.target.value);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={4}>\n <Controller\n control={form.control}\n name=\"groupId\"\n render={({ field, fieldState }) => (\n <TextField\n select\n {...field}\n required\n fullWidth\n label=\"Group\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n onChange={(event) => {\n field.onChange(event);\n }}\n >\n {panelGroups.map((panelGroup, index) => (\n <MenuItem key={panelGroup.id} value={panelGroup.id}>\n {panelGroup.title ?? `Group ${index + 1}`}\n </MenuItem>\n ))}\n </TextField>\n )}\n />\n </Grid>\n <Grid item xs={8}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.display.description\"\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n fullWidth\n label=\"Description\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n value={field.value ?? ''}\n onChange={(event) => {\n field.onChange(event);\n setDescription(event.target.value);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={4}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.plugin.kind\"\n render={({ field, fieldState }) => (\n <PluginKindSelect\n {...field}\n pluginTypes={['Panel']}\n required\n fullWidth\n label=\"Type\"\n disabled={pluginEditor.isLoading}\n error={!!pluginEditor.error || !!fieldState.error}\n helperText={pluginEditor.error?.message ?? fieldState.error?.message}\n value={{ type: 'Panel', kind: field.value }}\n onChange={(event) => {\n field.onChange(event.kind);\n pluginEditor.onSelectionChange(event);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={12}>\n <Typography variant=\"h4\" marginBottom={1}>\n Preview\n </Typography>\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <PanelPreview panelDefinition={panelDefinition} />\n </ErrorBoundary>\n </Grid>\n <Grid item xs={12}>\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <PanelSpecEditor\n control={form.control}\n panelDefinition={panelDefinition}\n onJSONChange={handlePanelDefinitionChange}\n onQueriesChange={(queries) => {\n setQueries(queries);\n }}\n onPluginSpecChange={(spec) => {\n pluginEditor.onSpecChange(spec);\n }}\n />\n </ErrorBoundary>\n </Grid>\n </Grid>\n </Box>\n <DiscardChangesConfirmationDialog\n description=\"You have unapplied changes in this panel. Are you sure you want to discard these changes? Changes cannot be recovered.\"\n isOpen={isDiscardDialogOpened}\n onCancel={() => {\n setDiscardDialogOpened(false);\n }}\n onDiscardChanges={() => {\n setDiscardDialogOpened(false);\n onClose();\n }}\n />\n </FormProvider>\n );\n}\n\n/**\n * The `id` attribute added to the `PanelEditorForm` component, allowing submit buttons to live outside the form.\n */\nexport const panelEditorFormId = 'panel-editor-form';\n"],"names":["useEffect","useState","Box","Button","Grid","MenuItem","Stack","TextField","Typography","DiscardChangesConfirmationDialog","ErrorAlert","ErrorBoundary","PluginKindSelect","usePluginEditor","PanelSpecEditor","getTitleAction","getSubmitText","useValidationSchemas","Controller","FormProvider","useForm","useWatch","zodResolver","useListPanelGroups","PanelPreview","usePanelEditor","PanelEditorForm","props","initialValues","initialAction","onSave","onClose","panelGroups","panelDefinition","setName","setDescription","setLinks","setQueries","setPlugin","setPanelDefinition","plugin","spec","isDiscardDialogOpened","setDiscardDialogOpened","pluginEditor","pluginTypes","value","selection","kind","type","onChange","form","setValue","onHideQueryEditorChange","isHidden","undefined","titleAction","submitText","panelEditorSchema","resolver","mode","defaultValues","links","control","name","processForm","data","handleCancel","JSON","stringify","getValues","handlePanelDefinitionChange","nextPanelDefStr","nextPanelDef","parse","pluginKind","pluginSpec","rememberCurrentSpecState","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","formState","isValid","onClick","handleSubmit","color","id","panelEditorFormId","flex","overflowY","container","item","xs","render","field","fieldState","required","fullWidth","label","error","helperText","message","event","target","select","map","panelGroup","index","title","isLoading","onSelectionChange","marginBottom","FallbackComponent","onJSONChange","onQueriesChange","queries","onPluginSpecChange","onSpecChange","description","isOpen","onCancel","onDiscardChanges"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/PanelDrawer/PanelEditorForm.tsx"],"sourcesContent":["// Copyright 2023 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 { ReactElement, useEffect, useState } from 'react';\nimport { Box, Button, Grid, MenuItem, Stack, TextField, Typography } from '@mui/material';\nimport { Action, PanelDefinition, PanelEditorValues } from '@perses-dev/core';\nimport { DiscardChangesConfirmationDialog, ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport {\n PluginKindSelect,\n usePluginEditor,\n PanelSpecEditor,\n getTitleAction,\n getSubmitText,\n useValidationSchemas,\n} from '@perses-dev/plugin-system';\nimport { Controller, FormProvider, SubmitHandler, useForm, useWatch } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { useListPanelGroups } from '../../context';\nimport { PanelPreview } from './PanelPreview';\nimport { usePanelEditor } from './usePanelEditor';\n\nexport interface PanelEditorFormProps {\n initialValues: PanelEditorValues;\n initialAction: Action;\n onSave: (values: PanelEditorValues) => void;\n onClose: () => void;\n}\n\nexport function PanelEditorForm(props: PanelEditorFormProps): ReactElement {\n const { initialValues, initialAction, onSave, onClose } = props;\n const panelGroups = useListPanelGroups();\n const { panelDefinition, setName, setDescription, setLinks, setQueries, setPlugin, setPanelDefinition } =\n usePanelEditor(initialValues.panelDefinition);\n const { plugin } = panelDefinition.spec;\n const [isDiscardDialogOpened, setDiscardDialogOpened] = useState<boolean>(false);\n\n const { panelEditorSchema } = useValidationSchemas();\n const form = useForm<PanelEditorValues>({\n resolver: zodResolver(panelEditorSchema),\n mode: 'onBlur',\n defaultValues: initialValues,\n });\n\n // Use common plugin editor logic even though we've split the inputs up in this form\n const pluginEditor = usePluginEditor({\n pluginTypes: ['Panel'],\n value: { selection: { kind: plugin.kind, type: 'Panel' }, spec: plugin.spec },\n onChange: (plugin) => {\n form.setValue('panelDefinition.spec.plugin', { kind: plugin.selection.kind, spec: plugin.spec });\n setPlugin({\n kind: plugin.selection.kind,\n spec: plugin.spec,\n });\n },\n onHideQueryEditorChange: (isHidden) => {\n setQueries(undefined, isHidden);\n },\n });\n\n const titleAction = getTitleAction(initialAction, true);\n const submitText = getSubmitText(initialAction, true);\n\n const links = useWatch({ control: form.control, name: 'panelDefinition.spec.links' });\n useEffect(() => {\n setLinks(links);\n }, [setLinks, links]);\n\n const processForm: SubmitHandler<PanelEditorValues> = (data) => {\n onSave(data);\n };\n\n // When user click on cancel, several possibilities:\n // - create action: ask for discard approval\n // - update action: ask for discard approval if changed\n // - read action: don´t ask for discard approval\n function handleCancel(): void {\n if (JSON.stringify(initialValues) !== JSON.stringify(form.getValues())) {\n setDiscardDialogOpened(true);\n } else {\n onClose();\n }\n }\n\n const handlePanelDefinitionChange = (nextPanelDefStr: string): void => {\n const nextPanelDef: PanelDefinition = JSON.parse(nextPanelDefStr);\n const { kind: pluginKind, spec: pluginSpec } = nextPanelDef.spec.plugin;\n // if panel plugin kind and spec are modified, then need to save current spec\n if (\n panelDefinition.spec.plugin.kind !== pluginKind &&\n JSON.stringify(panelDefinition.spec.plugin.spec) !== JSON.stringify(pluginSpec)\n ) {\n pluginEditor.rememberCurrentSpecState();\n }\n setPanelDefinition(nextPanelDef);\n };\n\n const watchedName = useWatch({ control: form.control, name: 'panelDefinition.spec.display.name' });\n const watchedDescription = useWatch({ control: form.control, name: 'panelDefinition.spec.display.description' });\n const watchedPluginKind = useWatch({ control: form.control, name: 'panelDefinition.spec.plugin.kind' });\n\n return (\n <FormProvider {...form}>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n padding: (theme) => theme.spacing(1, 2),\n borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n }}\n >\n <Typography variant=\"h2\">{titleAction} Panel</Typography>\n <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n <Button variant=\"contained\" disabled={!form.formState.isValid} onClick={form.handleSubmit(processForm)}>\n {submitText}\n </Button>\n <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n Cancel\n </Button>\n </Stack>\n </Box>\n <Box id={panelEditorFormId} sx={{ flex: 1, overflowY: 'scroll', padding: (theme) => theme.spacing(2) }}>\n <Grid container spacing={2}>\n <Grid item xs={8}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.display.name\"\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n required\n fullWidth\n label=\"Name\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n value={watchedName ?? ''}\n onChange={(event) => {\n field.onChange(event);\n setName(event.target.value);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={4}>\n <Controller\n control={form.control}\n name=\"groupId\"\n render={({ field, fieldState }) => (\n <TextField\n select\n {...field}\n required\n fullWidth\n label=\"Group\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n onChange={(event) => {\n field.onChange(event);\n }}\n >\n {panelGroups.map((panelGroup, index) => (\n <MenuItem key={panelGroup.id} value={panelGroup.id}>\n {panelGroup.title ?? `Group ${index + 1}`}\n </MenuItem>\n ))}\n </TextField>\n )}\n />\n </Grid>\n <Grid item xs={8}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.display.description\"\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n fullWidth\n label=\"Description\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n value={watchedDescription ?? ''}\n onChange={(event) => {\n field.onChange(event);\n setDescription(event.target.value);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={4}>\n <Controller\n control={form.control}\n name=\"panelDefinition.spec.plugin.kind\"\n render={({ field, fieldState }) => (\n <PluginKindSelect\n {...field}\n pluginTypes={['Panel']}\n required\n fullWidth\n label=\"Type\"\n disabled={pluginEditor.isLoading}\n error={!!pluginEditor.error || !!fieldState.error}\n helperText={pluginEditor.error?.message ?? fieldState.error?.message}\n value={{ type: 'Panel', kind: watchedPluginKind }}\n onChange={(event) => {\n field.onChange(event.kind);\n pluginEditor.onSelectionChange(event);\n }}\n />\n )}\n />\n </Grid>\n <Grid item xs={12}>\n <Typography variant=\"h4\" marginBottom={1}>\n Preview\n </Typography>\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <PanelPreview panelDefinition={panelDefinition} />\n </ErrorBoundary>\n </Grid>\n <Grid item xs={12}>\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <PanelSpecEditor\n control={form.control}\n panelDefinition={panelDefinition}\n onJSONChange={handlePanelDefinitionChange}\n onQueriesChange={(queries) => {\n setQueries(queries);\n }}\n onPluginSpecChange={(spec) => {\n pluginEditor.onSpecChange(spec);\n }}\n />\n </ErrorBoundary>\n </Grid>\n </Grid>\n </Box>\n <DiscardChangesConfirmationDialog\n description=\"You have unapplied changes in this panel. Are you sure you want to discard these changes? Changes cannot be recovered.\"\n isOpen={isDiscardDialogOpened}\n onCancel={() => {\n setDiscardDialogOpened(false);\n }}\n onDiscardChanges={() => {\n setDiscardDialogOpened(false);\n onClose();\n }}\n />\n </FormProvider>\n );\n}\n\n/**\n * The `id` attribute added to the `PanelEditorForm` component, allowing submit buttons to live outside the form.\n */\nexport const panelEditorFormId = 'panel-editor-form';\n"],"names":["useEffect","useState","Box","Button","Grid","MenuItem","Stack","TextField","Typography","DiscardChangesConfirmationDialog","ErrorAlert","ErrorBoundary","PluginKindSelect","usePluginEditor","PanelSpecEditor","getTitleAction","getSubmitText","useValidationSchemas","Controller","FormProvider","useForm","useWatch","zodResolver","useListPanelGroups","PanelPreview","usePanelEditor","PanelEditorForm","props","initialValues","initialAction","onSave","onClose","panelGroups","panelDefinition","setName","setDescription","setLinks","setQueries","setPlugin","setPanelDefinition","plugin","spec","isDiscardDialogOpened","setDiscardDialogOpened","panelEditorSchema","form","resolver","mode","defaultValues","pluginEditor","pluginTypes","value","selection","kind","type","onChange","setValue","onHideQueryEditorChange","isHidden","undefined","titleAction","submitText","links","control","name","processForm","data","handleCancel","JSON","stringify","getValues","handlePanelDefinitionChange","nextPanelDefStr","nextPanelDef","parse","pluginKind","pluginSpec","rememberCurrentSpecState","watchedName","watchedDescription","watchedPluginKind","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","formState","isValid","onClick","handleSubmit","color","id","panelEditorFormId","flex","overflowY","container","item","xs","render","field","fieldState","required","fullWidth","label","error","helperText","message","event","target","select","map","panelGroup","index","title","isLoading","onSelectionChange","marginBottom","FallbackComponent","onJSONChange","onQueriesChange","queries","onPluginSpecChange","onSpecChange","description","isOpen","onCancel","onDiscardChanges"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VariableProvider.d.ts","sourceRoot":"","sources":["../../../src/context/VariableProvider/VariableProvider.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAiB,YAAY,EAAE,SAAS,EAAiC,MAAM,OAAO,CAAC;AAC9F,OAAO,EAAe,QAAQ,EAAY,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"VariableProvider.d.ts","sourceRoot":"","sources":["../../../src/context/VariableProvider/VariableProvider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -16,6 +16,7 @@ import { createStore, useStore } from 'zustand';
|
|
|
16
16
|
import { useStoreWithEqualityFn } from 'zustand/traditional';
|
|
17
17
|
import { immer } from 'zustand/middleware/immer';
|
|
18
18
|
import { devtools } from 'zustand/middleware';
|
|
19
|
+
import { shallow } from 'zustand/shallow';
|
|
19
20
|
import produce from 'immer';
|
|
20
21
|
import { VariableContext, BuiltinVariableContext, useTimeRange } from '@perses-dev/plugin-system';
|
|
21
22
|
import { DEFAULT_ALL_VALUE as ALL_VALUE, formatDuration, intervalToPrometheusDuration } from '@perses-dev/core';
|
|
@@ -89,7 +90,7 @@ export function useVariableDefinitionStates(variableNames) {
|
|
|
89
90
|
}
|
|
90
91
|
export function useVariableDefinitionActions() {
|
|
91
92
|
const store = useVariableDefinitionStoreCtx();
|
|
92
|
-
return
|
|
93
|
+
return useStoreWithEqualityFn(store, (s)=>{
|
|
93
94
|
return {
|
|
94
95
|
setVariableValue: s.setVariableValue,
|
|
95
96
|
setVariableLoading: s.setVariableLoading,
|
|
@@ -98,7 +99,7 @@ export function useVariableDefinitionActions() {
|
|
|
98
99
|
setVariableDefaultValues: s.setVariableDefaultValues,
|
|
99
100
|
getSavedVariablesStatus: s.getSavedVariablesStatus
|
|
100
101
|
};
|
|
101
|
-
});
|
|
102
|
+
}, shallow);
|
|
102
103
|
}
|
|
103
104
|
export function useVariableDefinitions() {
|
|
104
105
|
const store = useVariableDefinitionStoreCtx();
|
|
@@ -336,10 +337,10 @@ function createVariableDefinitionStore({ initialVariableDefinitions = [], extern
|
|
|
336
337
|
}
|
|
337
338
|
// TODO: merge the different providers related to Variables under a single one (and keep "VariableProvider" as a name)
|
|
338
339
|
export function VariableProvider({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions = [] }) {
|
|
339
|
-
const [store] = useState(createVariableDefinitionStore({
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
340
|
+
const [store] = useState(()=>createVariableDefinitionStore({
|
|
341
|
+
initialVariableDefinitions,
|
|
342
|
+
externalVariableDefinitions
|
|
343
|
+
}));
|
|
343
344
|
return /*#__PURE__*/ _jsx(VariableDefinitionStoreContext.Provider, {
|
|
344
345
|
value: store,
|
|
345
346
|
children: /*#__PURE__*/ _jsx(PluginProvider, {
|
|
@@ -351,11 +352,11 @@ export function VariableProvider({ children, initialVariableDefinitions = [], ex
|
|
|
351
352
|
export function VariableProviderWithQueryParams({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions: builtinVariables = [] }) {
|
|
352
353
|
const allVariableDefs = mergeVariableDefinitions(initialVariableDefinitions, externalVariableDefinitions);
|
|
353
354
|
const queryParams = useVariableQueryParams(allVariableDefs);
|
|
354
|
-
const [store] = useState(createVariableDefinitionStore({
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
355
|
+
const [store] = useState(()=>createVariableDefinitionStore({
|
|
356
|
+
initialVariableDefinitions,
|
|
357
|
+
externalVariableDefinitions,
|
|
358
|
+
queryParams
|
|
359
|
+
}));
|
|
359
360
|
return /*#__PURE__*/ _jsx(VariableDefinitionStoreContext.Provider, {
|
|
360
361
|
value: store,
|
|
361
362
|
children: /*#__PURE__*/ _jsx(PluginProvider, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/context/VariableProvider/VariableProvider.tsx"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { createContext, ReactElement, ReactNode, useContext, useMemo, useState } from 'react';\nimport { createStore, StoreApi, useStore } from 'zustand';\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { immer } from 'zustand/middleware/immer';\nimport { devtools } from 'zustand/middleware';\nimport produce from 'immer';\nimport {\n VariableContext,\n VariableStateMap,\n VariableState,\n VariableStoreStateMap,\n VariableOption,\n BuiltinVariableContext,\n useTimeRange,\n} from '@perses-dev/plugin-system';\nimport {\n DEFAULT_ALL_VALUE as ALL_VALUE,\n VariableName,\n VariableValue,\n VariableDefinition,\n formatDuration,\n intervalToPrometheusDuration,\n BuiltinVariableDefinition,\n TextVariableDefinition,\n ListVariableDefinition,\n} from '@perses-dev/core';\nimport { checkSavedDefaultVariableStatus, findVariableDefinitionByName, mergeVariableDefinitions } from './utils';\nimport { hydrateVariableDefinitionStates as hydrateVariableDefinitionStates } from './hydrationUtils';\nimport { getInitalValuesFromQueryParameters, getURLQueryParamName, useVariableQueryParams } from './query-params';\n\n/**\n * This store is used to manipulate and read the definition of the variables and their state.\n * - being local or external variables.\n * - being text or list variables.\n * - being of any state (value, options, loading, error, ...) check {@VariableState}\n * Go and read each property documentation for more details.\n */\ntype VariableDefinitionStore = {\n /**\n * List of local variables definitions.\n * This is typically the variable definition that can be modified through the setVariableDefinition setter.\n *\n * In Perses App ecosystem, this is typically the dashboard scope variables, that's why we call them local.\n * Note that depending on the form, we can reuse this store to modify higher scope variables. For example,\n * when we modify the variable of a project, we'll set this field with project scope variables. To be able to modify\n * them.\n */\n variableDefinitions: VariableDefinition[];\n /**\n * List of external variable definitions.\n * This is static variable definitions that won´t be modified under this context.\n * You'll have to set one list of external variable definition by scope. See {@link ExternalVariableDefinition} for\n * more details.\n *\n * In Perses App ecosystem, this is typically the project or global scope variables.\n * Note that depending on the form, we can reuse this store to modify higher scope variables. For example,\n * when we modify the variable of a project, we'll set this field with global scope variables. Which means we\n * won't be able to modify them from this form.\n */\n externalVariableDefinitions: ExternalVariableDefinition[];\n /**\n * Additionally to definitions, we need to associate to each variable a state. That's what this map is meant for.\n * This can be heavily modified under this context, using the different setters available.\n * Note that the state of local AND external variables can be modified.\n */\n variableState: VariableStoreStateMap;\n /**\n * Allow to modify the `value` property of a variable in the state map.\n * @param variableName identify the variable\n * @param value new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableValue: (variableName: VariableName, value: VariableValue, source?: string) => void;\n /**\n * Allow to modify the `options` property of a variable in the state map.\n * @param variableName identify the variable\n * @param options new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableOptions: (name: VariableName, options: VariableOption[], source?: string) => void;\n /**\n * Allow to modify the `loading` property of a variable in the state map.\n * @param variableName identify the variable\n * @param laoding new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableLoading: (name: VariableName, loading: boolean, source?: string) => void;\n setVariableDefinitions: (definitions: VariableDefinition[]) => void;\n setVariableDefaultValues: () => VariableDefinition[];\n getSavedVariablesStatus: () => { isSavedVariableModified: boolean; modifiedVariableNames: string[] };\n};\n\n/**\n * Context object for {@link VariableDefinitionStore}.\n */\nconst VariableDefinitionStoreContext = createContext<StoreApi<VariableDefinitionStore> | undefined>(undefined);\nexport function useVariableDefinitionStoreCtx(): StoreApi<VariableDefinitionStore> {\n const context = useContext(VariableDefinitionStoreContext);\n if (!context) {\n throw new Error('VariableStoreContext not initialized');\n }\n return context;\n}\n\nexport function useVariableDefinitionStates(variableNames?: string[]): VariableStateMap {\n const store = useVariableDefinitionStoreCtx();\n return useStoreWithEqualityFn(\n store,\n (s) => {\n const varStates: VariableStateMap = {};\n\n // Collect values of local variables, from the variable state\n const names = variableNames ?? s.variableDefinitions.map((value) => value.spec.name);\n names.forEach((name) => {\n const varState = s.variableState.get({ name });\n if (!varState || varState.overridden) {\n return;\n }\n varStates[name] = varState;\n });\n\n // Collect values of external variables, from the variable state\n s.externalVariableDefinitions.forEach((d) => {\n const source = d.source;\n d.definitions.forEach((value) => {\n const name = value.spec.name;\n const varState = s.variableState.get({ name, source });\n if (!varState || varState.overridden) {\n return;\n }\n varStates[name] = varState;\n });\n });\n\n return varStates;\n },\n (left, right) => {\n return JSON.stringify(left) === JSON.stringify(right);\n }\n );\n}\n\n/**\n * Get the state and definition of a variable from the variables context.\n * @param name name of the variable\n * @param source if given, it searches in the external variables\n */\nexport function useVariableDefinitionAndState(\n name: string,\n source?: string\n): {\n definition: TextVariableDefinition | ListVariableDefinition | undefined;\n state: VariableState | undefined;\n} {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => {\n const state = s.variableState.get({ name, source });\n const definitions = source\n ? s.externalVariableDefinitions.find((v) => v.source === source)?.definitions\n : s.variableDefinitions;\n const definition = (definitions || []).find((v) => v.spec.name === name);\n\n return { state, definition };\n });\n}\n\nexport function useVariableDefinitionActions(): {\n setVariableLoading: (name: VariableName, loading: boolean, source?: string) => void;\n getSavedVariablesStatus: () => { isSavedVariableModified: boolean; modifiedVariableNames: string[] };\n setVariableDefaultValues: () => VariableDefinition[];\n setVariableValue: (variableName: VariableName, value: VariableValue, source?: string) => void;\n setVariableOptions: (name: VariableName, options: VariableOption[], source?: string) => void;\n setVariableDefinitions: (definitions: VariableDefinition[]) => void;\n} {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => {\n return {\n setVariableValue: s.setVariableValue,\n setVariableLoading: s.setVariableLoading,\n setVariableOptions: s.setVariableOptions,\n setVariableDefinitions: s.setVariableDefinitions,\n setVariableDefaultValues: s.setVariableDefaultValues,\n getSavedVariablesStatus: s.getSavedVariablesStatus,\n };\n });\n}\n\nexport function useVariableDefinitions(): VariableDefinition[] {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => s.variableDefinitions);\n}\n\nexport function useExternalVariableDefinitions(): ExternalVariableDefinition[] {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => s.externalVariableDefinitions);\n}\n\ninterface PluginProviderProps {\n children: ReactNode;\n builtinVariables?: BuiltinVariableDefinition[];\n}\n\nfunction PluginProvider({ children, builtinVariables }: PluginProviderProps): ReactElement {\n const originalValues = useVariableDefinitionStates();\n const definitions = useVariableDefinitions();\n const externalDefinitions = useExternalVariableDefinitions();\n const { absoluteTimeRange } = useTimeRange();\n\n const values = useMemo(() => {\n const contextValues: VariableStateMap = {};\n\n // This will loop through all the current variables values\n // and update any variables that have ALL_VALUE as their current value\n // to include all options.\n Object.keys(originalValues).forEach((name) => {\n const v = { ...originalValues[name] } as VariableState;\n\n if (v.value === ALL_VALUE) {\n const definition = findVariableDefinitionByName(name, definitions, externalDefinitions);\n // If the variable is a list variable and has a custom all value, then use that value instead\n if (definition?.kind === 'ListVariable' && definition.spec.customAllValue) {\n v.value = definition.spec.customAllValue;\n } else {\n v.value = v.options?.map((o: { value: string }) => o.value) ?? null;\n }\n }\n contextValues[name] = v;\n });\n return contextValues;\n }, [originalValues, definitions, externalDefinitions]);\n\n const allBuiltinVariables: BuiltinVariableDefinition[] = useMemo(() => {\n const result: BuiltinVariableDefinition[] = [\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__from',\n value: () => absoluteTimeRange.start.valueOf().toString(),\n source: 'Dashboard',\n display: {\n name: '__from',\n description: 'Start time of the current time range in unix millisecond epoch',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__to',\n value: () => absoluteTimeRange.end.valueOf().toString(),\n source: 'Dashboard',\n display: {\n name: '__to',\n description: 'End time of the current time range in unix millisecond epoch',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range',\n value: () => formatDuration(intervalToPrometheusDuration(absoluteTimeRange)),\n source: 'Dashboard',\n display: {\n name: '__range',\n description: 'The range for the current dashboard in human readable format',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range_s',\n value: () => ((absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf()) / 1000).toString(),\n source: 'Dashboard',\n display: {\n name: '__range_s',\n description: 'The range for the current dashboard in second',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range_ms',\n value: () => (absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf()).toString(),\n source: 'Dashboard',\n display: {\n name: '__range_ms',\n description: 'The range for the current dashboard in millisecond',\n hidden: true,\n },\n },\n },\n ];\n builtinVariables?.forEach((def) => result.push(def));\n return result;\n }, [absoluteTimeRange, builtinVariables]);\n\n return (\n <BuiltinVariableContext.Provider value={{ variables: allBuiltinVariables }}>\n <VariableContext.Provider value={{ state: values }}>{children}</VariableContext.Provider>\n </BuiltinVariableContext.Provider>\n );\n}\n\ninterface VariableDefinitionStoreArgs {\n initialVariableDefinitions?: VariableDefinition[];\n externalVariableDefinitions?: ExternalVariableDefinition[];\n queryParams?: ReturnType<typeof useVariableQueryParams>;\n}\n\nfunction createVariableDefinitionStore({\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n queryParams,\n}: VariableDefinitionStoreArgs): StoreApi<VariableDefinitionStore> {\n const initialParams = getInitalValuesFromQueryParameters(queryParams ? queryParams[0] : {});\n const store = createStore<VariableDefinitionStore>()(\n devtools(\n immer((set, get) => ({\n variableState: hydrateVariableDefinitionStates(\n initialVariableDefinitions,\n initialParams,\n externalVariableDefinitions\n ),\n variableDefinitions: initialVariableDefinitions,\n externalVariableDefinitions: externalVariableDefinitions,\n setVariableDefinitions(definitions: VariableDefinition[]): void {\n set(\n (state) => {\n state.variableDefinitions = definitions;\n state.variableState = hydrateVariableDefinitionStates(\n definitions,\n initialParams,\n externalVariableDefinitions\n );\n },\n false,\n '[Variables] setVariableDefinitions' // Used for action name in Redux devtools\n );\n },\n setVariableOptions(name, options, source?: string): void {\n set(\n (state) => {\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n varState.options = options;\n },\n false,\n '[Variables] setVariableOptions'\n );\n },\n setVariableLoading(name, loading, source?: string): void {\n set(\n (state) => {\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n varState.loading = loading;\n },\n false,\n '[Variables] setVariableLoading'\n );\n },\n setVariableValue: (name, value, source?: string): void =>\n set(\n (state) => {\n let val = value;\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n\n // Make sure there is only one all value\n if (Array.isArray(val) && val.includes(ALL_VALUE)) {\n if (val.at(-1) === ALL_VALUE) {\n val = ALL_VALUE;\n } else {\n val = val.filter((v) => v !== ALL_VALUE);\n }\n }\n if (queryParams) {\n const setQueryParams = queryParams[1];\n setQueryParams({ [getURLQueryParamName(name)]: val });\n }\n varState.value = val;\n },\n false,\n '[Variables] setVariableValue'\n ),\n setVariableDefaultValues: (): VariableDefinition[] => {\n const variableDefinitions = get().variableDefinitions;\n const variableState = get().variableState;\n const updatedVariables = produce(variableDefinitions, (draft) => {\n draft.forEach((variable, index) => {\n const name = variable.spec.name;\n if (variable.kind === 'ListVariable') {\n const currentVariable = variableState.get({ name });\n if (currentVariable?.value !== undefined) {\n draft[index] = {\n kind: 'ListVariable',\n spec: produce(variable.spec, (specDraft) => {\n specDraft.defaultValue = currentVariable.value;\n }),\n };\n }\n } else if (variable.kind === 'TextVariable') {\n const currentVariable = variableState.get({ name });\n const currentVariableValue = typeof currentVariable?.value === 'string' ? currentVariable.value : '';\n if (currentVariable?.value !== undefined) {\n draft[index] = {\n kind: 'TextVariable',\n spec: produce(variable.spec, (specDraft) => {\n specDraft.value = currentVariableValue;\n }),\n };\n }\n }\n });\n });\n set(\n (state) => {\n state.variableDefinitions = updatedVariables;\n },\n false,\n '[Variables] setVariableDefaultValues'\n );\n return updatedVariables;\n },\n getSavedVariablesStatus: (): {\n modifiedVariableNames: string[];\n isSavedVariableModified: boolean;\n } => {\n return checkSavedDefaultVariableStatus(get().variableDefinitions, get().variableState);\n },\n }))\n )\n );\n\n return store as unknown as StoreApi<VariableDefinitionStore>; // TODO: @Gladorme check if we can avoid this cast\n}\n\n/**\n * The external variables allow you to give to the provider some additional variables, not defined in the dashboard and static.\n * It means that you won´t be able to update them from the dashboard itself, but you will see them appear and will be able\n * to modify their runtime value as any other variable.\n * If one of the external variable has the same name as a local one, it will be marked as overridden.\n * You can define one list of variable definition by source and as many source as you want.\n * The order of the sources is important as first one will take precedence on the following ones, in case they have same names.\n */\nexport type ExternalVariableDefinition = {\n source: string;\n tooltip?: {\n title?: string;\n description?: string;\n };\n editLink?: string;\n definitions: VariableDefinition[];\n};\n\nexport interface VariableProviderProps {\n children: ReactNode;\n initialVariableDefinitions?: VariableDefinition[];\n externalVariableDefinitions?: ExternalVariableDefinition[];\n builtinVariableDefinitions?: BuiltinVariableDefinition[];\n}\n\n// TODO: merge the different providers related to Variables under a single one (and keep \"VariableProvider\" as a name)\nexport function VariableProvider({\n children,\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n builtinVariableDefinitions = [],\n}: VariableProviderProps): ReactElement {\n const [store] = useState(createVariableDefinitionStore({ initialVariableDefinitions, externalVariableDefinitions }));\n\n return (\n <VariableDefinitionStoreContext.Provider value={store}>\n <PluginProvider builtinVariables={builtinVariableDefinitions}>{children}</PluginProvider>\n </VariableDefinitionStoreContext.Provider>\n );\n}\n\nexport function VariableProviderWithQueryParams({\n children,\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n builtinVariableDefinitions: builtinVariables = [],\n}: VariableProviderProps): ReactElement {\n const allVariableDefs = mergeVariableDefinitions(initialVariableDefinitions, externalVariableDefinitions);\n const queryParams = useVariableQueryParams(allVariableDefs);\n const [store] = useState(\n createVariableDefinitionStore({ initialVariableDefinitions, externalVariableDefinitions, queryParams })\n );\n\n return (\n <VariableDefinitionStoreContext.Provider value={store}>\n <PluginProvider builtinVariables={builtinVariables}>{children}</PluginProvider>\n </VariableDefinitionStoreContext.Provider>\n );\n}\n"],"names":["createContext","useContext","useMemo","useState","createStore","useStore","useStoreWithEqualityFn","immer","devtools","produce","VariableContext","BuiltinVariableContext","useTimeRange","DEFAULT_ALL_VALUE","ALL_VALUE","formatDuration","intervalToPrometheusDuration","checkSavedDefaultVariableStatus","findVariableDefinitionByName","mergeVariableDefinitions","hydrateVariableDefinitionStates","getInitalValuesFromQueryParameters","getURLQueryParamName","useVariableQueryParams","VariableDefinitionStoreContext","undefined","useVariableDefinitionStoreCtx","context","Error","useVariableDefinitionStates","variableNames","store","s","varStates","names","variableDefinitions","map","value","spec","name","forEach","varState","variableState","get","overridden","externalVariableDefinitions","d","source","definitions","left","right","JSON","stringify","useVariableDefinitionAndState","state","find","v","definition","useVariableDefinitionActions","setVariableValue","setVariableLoading","setVariableOptions","setVariableDefinitions","setVariableDefaultValues","getSavedVariablesStatus","useVariableDefinitions","useExternalVariableDefinitions","PluginProvider","children","builtinVariables","originalValues","externalDefinitions","absoluteTimeRange","values","contextValues","Object","keys","kind","customAllValue","options","o","allBuiltinVariables","result","start","valueOf","toString","display","description","hidden","end","def","push","Provider","variables","createVariableDefinitionStore","initialVariableDefinitions","queryParams","initialParams","set","loading","val","Array","isArray","includes","at","filter","setQueryParams","updatedVariables","draft","variable","index","currentVariable","specDraft","defaultValue","currentVariableValue","VariableProvider","builtinVariableDefinitions","VariableProviderWithQueryParams","allVariableDefs"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,aAAa,EAA2BC,UAAU,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAQ;AAC9F,SAASC,WAAW,EAAYC,QAAQ,QAAQ,UAAU;AAC1D,SAASC,sBAAsB,QAAQ,sBAAsB;AAC7D,SAASC,KAAK,QAAQ,2BAA2B;AACjD,SAASC,QAAQ,QAAQ,qBAAqB;AAC9C,OAAOC,aAAa,QAAQ;AAC5B,SACEC,eAAe,EAKfC,sBAAsB,EACtBC,YAAY,QACP,4BAA4B;AACnC,SACEC,qBAAqBC,SAAS,EAI9BC,cAAc,EACdC,4BAA4B,QAIvB,mBAAmB;AAC1B,SAASC,+BAA+B,EAAEC,4BAA4B,EAAEC,wBAAwB,QAAQ,UAAU;AAClH,SAASC,mCAAmCA,+BAA+B,QAAQ,mBAAmB;AACtG,SAASC,kCAAkC,EAAEC,oBAAoB,EAAEC,sBAAsB,QAAQ,iBAAiB;AAgElH;;CAEC,GACD,MAAMC,+CAAiCxB,cAA6DyB;AACpG,OAAO,SAASC;IACd,MAAMC,UAAU1B,WAAWuB;IAC3B,IAAI,CAACG,SAAS;QACZ,MAAM,IAAIC,MAAM;IAClB;IACA,OAAOD;AACT;AAEA,OAAO,SAASE,4BAA4BC,aAAwB;IAClE,MAAMC,QAAQL;IACd,OAAOpB,uBACLyB,OACA,CAACC;QACC,MAAMC,YAA8B,CAAC;QAErC,6DAA6D;QAC7D,MAAMC,QAAQJ,0BAAAA,2BAAAA,gBAAiBE,EAAEG,mBAAmB,CAACC,GAAG,CAAC,CAACC,QAAUA,MAAMC,IAAI,CAACC,IAAI;QACnFL,MAAMM,OAAO,CAAC,CAACD;YACb,MAAME,WAAWT,EAAEU,aAAa,CAACC,GAAG,CAAC;gBAAEJ;YAAK;YAC5C,IAAI,CAACE,YAAYA,SAASG,UAAU,EAAE;gBACpC;YACF;YACAX,SAAS,CAACM,KAAK,GAAGE;QACpB;QAEA,gEAAgE;QAChET,EAAEa,2BAA2B,CAACL,OAAO,CAAC,CAACM;YACrC,MAAMC,SAASD,EAAEC,MAAM;YACvBD,EAAEE,WAAW,CAACR,OAAO,CAAC,CAACH;gBACrB,MAAME,OAAOF,MAAMC,IAAI,CAACC,IAAI;gBAC5B,MAAME,WAAWT,EAAEU,aAAa,CAACC,GAAG,CAAC;oBAAEJ;oBAAMQ;gBAAO;gBACpD,IAAI,CAACN,YAAYA,SAASG,UAAU,EAAE;oBACpC;gBACF;gBACAX,SAAS,CAACM,KAAK,GAAGE;YACpB;QACF;QAEA,OAAOR;IACT,GACA,CAACgB,MAAMC;QACL,OAAOC,KAAKC,SAAS,CAACH,UAAUE,KAAKC,SAAS,CAACF;IACjD;AAEJ;AAEA;;;;CAIC,GACD,OAAO,SAASG,8BACdd,IAAY,EACZQ,MAAe;IAKf,MAAMhB,QAAQL;IACd,OAAOrB,SAAS0B,OAAO,CAACC;YAGlBA;QAFJ,MAAMsB,QAAQtB,EAAEU,aAAa,CAACC,GAAG,CAAC;YAAEJ;YAAMQ;QAAO;QACjD,MAAMC,cAAcD,UAChBf,sCAAAA,EAAEa,2BAA2B,CAACU,IAAI,CAAC,CAACC,IAAMA,EAAET,MAAM,KAAKA,qBAAvDf,0DAAAA,oCAAgEgB,WAAW,GAC3EhB,EAAEG,mBAAmB;QACzB,MAAMsB,aAAa,AAACT,CAAAA,eAAe,EAAE,AAAD,EAAGO,IAAI,CAAC,CAACC,IAAMA,EAAElB,IAAI,CAACC,IAAI,KAAKA;QAEnE,OAAO;YAAEe;YAAOG;QAAW;IAC7B;AACF;AAEA,OAAO,SAASC;IAQd,MAAM3B,QAAQL;IACd,OAAOrB,SAAS0B,OAAO,CAACC;QACtB,OAAO;YACL2B,kBAAkB3B,EAAE2B,gBAAgB;YACpCC,oBAAoB5B,EAAE4B,kBAAkB;YACxCC,oBAAoB7B,EAAE6B,kBAAkB;YACxCC,wBAAwB9B,EAAE8B,sBAAsB;YAChDC,0BAA0B/B,EAAE+B,wBAAwB;YACpDC,yBAAyBhC,EAAEgC,uBAAuB;QACpD;IACF;AACF;AAEA,OAAO,SAASC;IACd,MAAMlC,QAAQL;IACd,OAAOrB,SAAS0B,OAAO,CAACC,IAAMA,EAAEG,mBAAmB;AACrD;AAEA,OAAO,SAAS+B;IACd,MAAMnC,QAAQL;IACd,OAAOrB,SAAS0B,OAAO,CAACC,IAAMA,EAAEa,2BAA2B;AAC7D;AAOA,SAASsB,eAAe,EAAEC,QAAQ,EAAEC,gBAAgB,EAAuB;IACzE,MAAMC,iBAAiBzC;IACvB,MAAMmB,cAAciB;IACpB,MAAMM,sBAAsBL;IAC5B,MAAM,EAAEM,iBAAiB,EAAE,GAAG5D;IAE9B,MAAM6D,SAASvE,QAAQ;QACrB,MAAMwE,gBAAkC,CAAC;QAEzC,0DAA0D;QAC1D,sEAAsE;QACtE,0BAA0B;QAC1BC,OAAOC,IAAI,CAACN,gBAAgB9B,OAAO,CAAC,CAACD;YACnC,MAAMiB,IAAI;gBAAE,GAAGc,cAAc,CAAC/B,KAAK;YAAC;YAEpC,IAAIiB,EAAEnB,KAAK,KAAKvB,WAAW;gBACzB,MAAM2C,aAAavC,6BAA6BqB,MAAMS,aAAauB;gBACnE,6FAA6F;gBAC7F,IAAId,CAAAA,uBAAAA,iCAAAA,WAAYoB,IAAI,MAAK,kBAAkBpB,WAAWnB,IAAI,CAACwC,cAAc,EAAE;oBACzEtB,EAAEnB,KAAK,GAAGoB,WAAWnB,IAAI,CAACwC,cAAc;gBAC1C,OAAO;wBACKtB;wBAAAA;oBAAVA,EAAEnB,KAAK,GAAGmB,CAAAA,kBAAAA,aAAAA,EAAEuB,OAAO,cAATvB,iCAAAA,WAAWpB,GAAG,CAAC,CAAC4C,IAAyBA,EAAE3C,KAAK,eAAhDmB,4BAAAA,iBAAqD;gBACjE;YACF;YACAkB,aAAa,CAACnC,KAAK,GAAGiB;QACxB;QACA,OAAOkB;IACT,GAAG;QAACJ;QAAgBtB;QAAauB;KAAoB;IAErD,MAAMU,sBAAmD/E,QAAQ;QAC/D,MAAMgF,SAAsC;YAC1C;gBACEL,MAAM;gBACNvC,MAAM;oBACJC,MAAM;oBACNF,OAAO,IAAMmC,kBAAkBW,KAAK,CAACC,OAAO,GAAGC,QAAQ;oBACvDtC,QAAQ;oBACRuC,SAAS;wBACP/C,MAAM;wBACNgD,aAAa;wBACbC,QAAQ;oBACV;gBACF;YACF;YACA;gBACEX,MAAM;gBACNvC,MAAM;oBACJC,MAAM;oBACNF,OAAO,IAAMmC,kBAAkBiB,GAAG,CAACL,OAAO,GAAGC,QAAQ;oBACrDtC,QAAQ;oBACRuC,SAAS;wBACP/C,MAAM;wBACNgD,aAAa;wBACbC,QAAQ;oBACV;gBACF;YACF;YACA;gBACEX,MAAM;gBACNvC,MAAM;oBACJC,MAAM;oBACNF,OAAO,IAAMtB,eAAeC,6BAA6BwD;oBACzDzB,QAAQ;oBACRuC,SAAS;wBACP/C,MAAM;wBACNgD,aAAa;wBACbC,QAAQ;oBACV;gBACF;YACF;YACA;gBACEX,MAAM;gBACNvC,MAAM;oBACJC,MAAM;oBACNF,OAAO,IAAM,AAAC,CAAA,AAACmC,CAAAA,kBAAkBiB,GAAG,CAACL,OAAO,KAAKZ,kBAAkBW,KAAK,CAACC,OAAO,EAAC,IAAK,IAAG,EAAGC,QAAQ;oBACpGtC,QAAQ;oBACRuC,SAAS;wBACP/C,MAAM;wBACNgD,aAAa;wBACbC,QAAQ;oBACV;gBACF;YACF;YACA;gBACEX,MAAM;gBACNvC,MAAM;oBACJC,MAAM;oBACNF,OAAO,IAAM,AAACmC,CAAAA,kBAAkBiB,GAAG,CAACL,OAAO,KAAKZ,kBAAkBW,KAAK,CAACC,OAAO,EAAC,EAAGC,QAAQ;oBAC3FtC,QAAQ;oBACRuC,SAAS;wBACP/C,MAAM;wBACNgD,aAAa;wBACbC,QAAQ;oBACV;gBACF;YACF;SACD;QACDnB,6BAAAA,uCAAAA,iBAAkB7B,OAAO,CAAC,CAACkD,MAAQR,OAAOS,IAAI,CAACD;QAC/C,OAAOR;IACT,GAAG;QAACV;QAAmBH;KAAiB;IAExC,qBACE,KAAC1D,uBAAuBiF,QAAQ;QAACvD,OAAO;YAAEwD,WAAWZ;QAAoB;kBACvE,cAAA,KAACvE,gBAAgBkF,QAAQ;YAACvD,OAAO;gBAAEiB,OAAOmB;YAAO;sBAAIL;;;AAG3D;AAQA,SAAS0B,8BAA8B,EACrCC,6BAA6B,EAAE,EAC/BlD,8BAA8B,EAAE,EAChCmD,WAAW,EACiB;IAC5B,MAAMC,gBAAgB5E,mCAAmC2E,cAAcA,WAAW,CAAC,EAAE,GAAG,CAAC;IACzF,MAAMjE,QAAQ3B,cACZI,SACED,MAAM,CAAC2F,KAAKvD,MAAS,CAAA;YACnBD,eAAetB,gCACb2E,4BACAE,eACApD;YAEFV,qBAAqB4D;YACrBlD,6BAA6BA;YAC7BiB,wBAAuBd,WAAiC;gBACtDkD,IACE,CAAC5C;oBACCA,MAAMnB,mBAAmB,GAAGa;oBAC5BM,MAAMZ,aAAa,GAAGtB,gCACpB4B,aACAiD,eACApD;gBAEJ,GACA,OACA,qCAAqC,yCAAyC;;YAElF;YACAgB,oBAAmBtB,IAAI,EAAEwC,OAAO,EAAEhC,MAAe;gBAC/CmD,IACE,CAAC5C;oBACC,MAAMb,WAAWa,MAAMZ,aAAa,CAACC,GAAG,CAAC;wBAAEJ;wBAAMQ;oBAAO;oBACxD,IAAI,CAACN,UAAU;wBACb;oBACF;oBACAA,SAASsC,OAAO,GAAGA;gBACrB,GACA,OACA;YAEJ;YACAnB,oBAAmBrB,IAAI,EAAE4D,OAAO,EAAEpD,MAAe;gBAC/CmD,IACE,CAAC5C;oBACC,MAAMb,WAAWa,MAAMZ,aAAa,CAACC,GAAG,CAAC;wBAAEJ;wBAAMQ;oBAAO;oBACxD,IAAI,CAACN,UAAU;wBACb;oBACF;oBACAA,SAAS0D,OAAO,GAAGA;gBACrB,GACA,OACA;YAEJ;YACAxC,kBAAkB,CAACpB,MAAMF,OAAOU,SAC9BmD,IACE,CAAC5C;oBACC,IAAI8C,MAAM/D;oBACV,MAAMI,WAAWa,MAAMZ,aAAa,CAACC,GAAG,CAAC;wBAAEJ;wBAAMQ;oBAAO;oBACxD,IAAI,CAACN,UAAU;wBACb;oBACF;oBAEA,wCAAwC;oBACxC,IAAI4D,MAAMC,OAAO,CAACF,QAAQA,IAAIG,QAAQ,CAACzF,YAAY;wBACjD,IAAIsF,IAAII,EAAE,CAAC,CAAC,OAAO1F,WAAW;4BAC5BsF,MAAMtF;wBACR,OAAO;4BACLsF,MAAMA,IAAIK,MAAM,CAAC,CAACjD,IAAMA,MAAM1C;wBAChC;oBACF;oBACA,IAAIkF,aAAa;wBACf,MAAMU,iBAAiBV,WAAW,CAAC,EAAE;wBACrCU,eAAe;4BAAE,CAACpF,qBAAqBiB,MAAM,EAAE6D;wBAAI;oBACrD;oBACA3D,SAASJ,KAAK,GAAG+D;gBACnB,GACA,OACA;YAEJrC,0BAA0B;gBACxB,MAAM5B,sBAAsBQ,MAAMR,mBAAmB;gBACrD,MAAMO,gBAAgBC,MAAMD,aAAa;gBACzC,MAAMiE,mBAAmBlG,QAAQ0B,qBAAqB,CAACyE;oBACrDA,MAAMpE,OAAO,CAAC,CAACqE,UAAUC;wBACvB,MAAMvE,OAAOsE,SAASvE,IAAI,CAACC,IAAI;wBAC/B,IAAIsE,SAAShC,IAAI,KAAK,gBAAgB;4BACpC,MAAMkC,kBAAkBrE,cAAcC,GAAG,CAAC;gCAAEJ;4BAAK;4BACjD,IAAIwE,CAAAA,4BAAAA,sCAAAA,gBAAiB1E,KAAK,MAAKZ,WAAW;gCACxCmF,KAAK,CAACE,MAAM,GAAG;oCACbjC,MAAM;oCACNvC,MAAM7B,QAAQoG,SAASvE,IAAI,EAAE,CAAC0E;wCAC5BA,UAAUC,YAAY,GAAGF,gBAAgB1E,KAAK;oCAChD;gCACF;4BACF;wBACF,OAAO,IAAIwE,SAAShC,IAAI,KAAK,gBAAgB;4BAC3C,MAAMkC,kBAAkBrE,cAAcC,GAAG,CAAC;gCAAEJ;4BAAK;4BACjD,MAAM2E,uBAAuB,QAAOH,4BAAAA,sCAAAA,gBAAiB1E,KAAK,MAAK,WAAW0E,gBAAgB1E,KAAK,GAAG;4BAClG,IAAI0E,CAAAA,4BAAAA,sCAAAA,gBAAiB1E,KAAK,MAAKZ,WAAW;gCACxCmF,KAAK,CAACE,MAAM,GAAG;oCACbjC,MAAM;oCACNvC,MAAM7B,QAAQoG,SAASvE,IAAI,EAAE,CAAC0E;wCAC5BA,UAAU3E,KAAK,GAAG6E;oCACpB;gCACF;4BACF;wBACF;oBACF;gBACF;gBACAhB,IACE,CAAC5C;oBACCA,MAAMnB,mBAAmB,GAAGwE;gBAC9B,GACA,OACA;gBAEF,OAAOA;YACT;YACA3C,yBAAyB;gBAIvB,OAAO/C,gCAAgC0B,MAAMR,mBAAmB,EAAEQ,MAAMD,aAAa;YACvF;QACF,CAAA;IAIJ,OAAOX,OAAuD,kDAAkD;AAClH;AA2BA,sHAAsH;AACtH,OAAO,SAASoF,iBAAiB,EAC/B/C,QAAQ,EACR2B,6BAA6B,EAAE,EAC/BlD,8BAA8B,EAAE,EAChCuE,6BAA6B,EAAE,EACT;IACtB,MAAM,CAACrF,MAAM,GAAG5B,SAAS2F,8BAA8B;QAAEC;QAA4BlD;IAA4B;IAEjH,qBACE,KAACrB,+BAA+BoE,QAAQ;QAACvD,OAAON;kBAC9C,cAAA,KAACoC;YAAeE,kBAAkB+C;sBAA6BhD;;;AAGrE;AAEA,OAAO,SAASiD,gCAAgC,EAC9CjD,QAAQ,EACR2B,6BAA6B,EAAE,EAC/BlD,8BAA8B,EAAE,EAChCuE,4BAA4B/C,mBAAmB,EAAE,EAC3B;IACtB,MAAMiD,kBAAkBnG,yBAAyB4E,4BAA4BlD;IAC7E,MAAMmD,cAAczE,uBAAuB+F;IAC3C,MAAM,CAACvF,MAAM,GAAG5B,SACd2F,8BAA8B;QAAEC;QAA4BlD;QAA6BmD;IAAY;IAGvG,qBACE,KAACxE,+BAA+BoE,QAAQ;QAACvD,OAAON;kBAC9C,cAAA,KAACoC;YAAeE,kBAAkBA;sBAAmBD;;;AAG3D"}
|
|
1
|
+
{"version":3,"sources":["../../../src/context/VariableProvider/VariableProvider.tsx"],"sourcesContent":["// Copyright 2024 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { createContext, ReactElement, ReactNode, useContext, useMemo, useState } from 'react';\nimport { createStore, StoreApi, useStore } from 'zustand';\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { immer } from 'zustand/middleware/immer';\nimport { devtools } from 'zustand/middleware';\nimport { shallow } from 'zustand/shallow';\nimport produce from 'immer';\nimport {\n VariableContext,\n VariableStateMap,\n VariableState,\n VariableStoreStateMap,\n VariableOption,\n BuiltinVariableContext,\n useTimeRange,\n} from '@perses-dev/plugin-system';\nimport {\n DEFAULT_ALL_VALUE as ALL_VALUE,\n VariableName,\n VariableValue,\n VariableDefinition,\n formatDuration,\n intervalToPrometheusDuration,\n BuiltinVariableDefinition,\n TextVariableDefinition,\n ListVariableDefinition,\n} from '@perses-dev/core';\nimport { checkSavedDefaultVariableStatus, findVariableDefinitionByName, mergeVariableDefinitions } from './utils';\nimport { hydrateVariableDefinitionStates as hydrateVariableDefinitionStates } from './hydrationUtils';\nimport { getInitalValuesFromQueryParameters, getURLQueryParamName, useVariableQueryParams } from './query-params';\n\n/**\n * This store is used to manipulate and read the definition of the variables and their state.\n * - being local or external variables.\n * - being text or list variables.\n * - being of any state (value, options, loading, error, ...) check {@VariableState}\n * Go and read each property documentation for more details.\n */\ntype VariableDefinitionStore = {\n /**\n * List of local variables definitions.\n * This is typically the variable definition that can be modified through the setVariableDefinition setter.\n *\n * In Perses App ecosystem, this is typically the dashboard scope variables, that's why we call them local.\n * Note that depending on the form, we can reuse this store to modify higher scope variables. For example,\n * when we modify the variable of a project, we'll set this field with project scope variables. To be able to modify\n * them.\n */\n variableDefinitions: VariableDefinition[];\n /**\n * List of external variable definitions.\n * This is static variable definitions that won´t be modified under this context.\n * You'll have to set one list of external variable definition by scope. See {@link ExternalVariableDefinition} for\n * more details.\n *\n * In Perses App ecosystem, this is typically the project or global scope variables.\n * Note that depending on the form, we can reuse this store to modify higher scope variables. For example,\n * when we modify the variable of a project, we'll set this field with global scope variables. Which means we\n * won't be able to modify them from this form.\n */\n externalVariableDefinitions: ExternalVariableDefinition[];\n /**\n * Additionally to definitions, we need to associate to each variable a state. That's what this map is meant for.\n * This can be heavily modified under this context, using the different setters available.\n * Note that the state of local AND external variables can be modified.\n */\n variableState: VariableStoreStateMap;\n /**\n * Allow to modify the `value` property of a variable in the state map.\n * @param variableName identify the variable\n * @param value new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableValue: (variableName: VariableName, value: VariableValue, source?: string) => void;\n /**\n * Allow to modify the `options` property of a variable in the state map.\n * @param variableName identify the variable\n * @param options new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableOptions: (name: VariableName, options: VariableOption[], source?: string) => void;\n /**\n * Allow to modify the `loading` property of a variable in the state map.\n * @param variableName identify the variable\n * @param laoding new value\n * @param source identify the variable source if this is an external variable. See {@link ExternalVariableDefinition}\n */\n setVariableLoading: (name: VariableName, loading: boolean, source?: string) => void;\n setVariableDefinitions: (definitions: VariableDefinition[]) => void;\n setVariableDefaultValues: () => VariableDefinition[];\n getSavedVariablesStatus: () => { isSavedVariableModified: boolean; modifiedVariableNames: string[] };\n};\n\n/**\n * Context object for {@link VariableDefinitionStore}.\n */\nconst VariableDefinitionStoreContext = createContext<StoreApi<VariableDefinitionStore> | undefined>(undefined);\nexport function useVariableDefinitionStoreCtx(): StoreApi<VariableDefinitionStore> {\n const context = useContext(VariableDefinitionStoreContext);\n if (!context) {\n throw new Error('VariableStoreContext not initialized');\n }\n return context;\n}\n\nexport function useVariableDefinitionStates(variableNames?: string[]): VariableStateMap {\n const store = useVariableDefinitionStoreCtx();\n return useStoreWithEqualityFn(\n store,\n (s) => {\n const varStates: VariableStateMap = {};\n\n // Collect values of local variables, from the variable state\n const names = variableNames ?? s.variableDefinitions.map((value) => value.spec.name);\n names.forEach((name) => {\n const varState = s.variableState.get({ name });\n if (!varState || varState.overridden) {\n return;\n }\n varStates[name] = varState;\n });\n\n // Collect values of external variables, from the variable state\n s.externalVariableDefinitions.forEach((d) => {\n const source = d.source;\n d.definitions.forEach((value) => {\n const name = value.spec.name;\n const varState = s.variableState.get({ name, source });\n if (!varState || varState.overridden) {\n return;\n }\n varStates[name] = varState;\n });\n });\n\n return varStates;\n },\n (left, right) => {\n return JSON.stringify(left) === JSON.stringify(right);\n }\n );\n}\n\n/**\n * Get the state and definition of a variable from the variables context.\n * @param name name of the variable\n * @param source if given, it searches in the external variables\n */\nexport function useVariableDefinitionAndState(\n name: string,\n source?: string\n): {\n definition: TextVariableDefinition | ListVariableDefinition | undefined;\n state: VariableState | undefined;\n} {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => {\n const state = s.variableState.get({ name, source });\n const definitions = source\n ? s.externalVariableDefinitions.find((v) => v.source === source)?.definitions\n : s.variableDefinitions;\n const definition = (definitions || []).find((v) => v.spec.name === name);\n\n return { state, definition };\n });\n}\n\nexport function useVariableDefinitionActions(): {\n setVariableLoading: (name: VariableName, loading: boolean, source?: string) => void;\n getSavedVariablesStatus: () => { isSavedVariableModified: boolean; modifiedVariableNames: string[] };\n setVariableDefaultValues: () => VariableDefinition[];\n setVariableValue: (variableName: VariableName, value: VariableValue, source?: string) => void;\n setVariableOptions: (name: VariableName, options: VariableOption[], source?: string) => void;\n setVariableDefinitions: (definitions: VariableDefinition[]) => void;\n} {\n const store = useVariableDefinitionStoreCtx();\n return useStoreWithEqualityFn(\n store,\n (s) => {\n return {\n setVariableValue: s.setVariableValue,\n setVariableLoading: s.setVariableLoading,\n setVariableOptions: s.setVariableOptions,\n setVariableDefinitions: s.setVariableDefinitions,\n setVariableDefaultValues: s.setVariableDefaultValues,\n getSavedVariablesStatus: s.getSavedVariablesStatus,\n };\n },\n shallow\n );\n}\n\nexport function useVariableDefinitions(): VariableDefinition[] {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => s.variableDefinitions);\n}\n\nexport function useExternalVariableDefinitions(): ExternalVariableDefinition[] {\n const store = useVariableDefinitionStoreCtx();\n return useStore(store, (s) => s.externalVariableDefinitions);\n}\n\ninterface PluginProviderProps {\n children: ReactNode;\n builtinVariables?: BuiltinVariableDefinition[];\n}\n\nfunction PluginProvider({ children, builtinVariables }: PluginProviderProps): ReactElement {\n const originalValues = useVariableDefinitionStates();\n const definitions = useVariableDefinitions();\n const externalDefinitions = useExternalVariableDefinitions();\n const { absoluteTimeRange } = useTimeRange();\n\n const values = useMemo(() => {\n const contextValues: VariableStateMap = {};\n\n // This will loop through all the current variables values\n // and update any variables that have ALL_VALUE as their current value\n // to include all options.\n Object.keys(originalValues).forEach((name) => {\n const v = { ...originalValues[name] } as VariableState;\n\n if (v.value === ALL_VALUE) {\n const definition = findVariableDefinitionByName(name, definitions, externalDefinitions);\n // If the variable is a list variable and has a custom all value, then use that value instead\n if (definition?.kind === 'ListVariable' && definition.spec.customAllValue) {\n v.value = definition.spec.customAllValue;\n } else {\n v.value = v.options?.map((o: { value: string }) => o.value) ?? null;\n }\n }\n contextValues[name] = v;\n });\n return contextValues;\n }, [originalValues, definitions, externalDefinitions]);\n\n const allBuiltinVariables: BuiltinVariableDefinition[] = useMemo(() => {\n const result: BuiltinVariableDefinition[] = [\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__from',\n value: () => absoluteTimeRange.start.valueOf().toString(),\n source: 'Dashboard',\n display: {\n name: '__from',\n description: 'Start time of the current time range in unix millisecond epoch',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__to',\n value: () => absoluteTimeRange.end.valueOf().toString(),\n source: 'Dashboard',\n display: {\n name: '__to',\n description: 'End time of the current time range in unix millisecond epoch',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range',\n value: () => formatDuration(intervalToPrometheusDuration(absoluteTimeRange)),\n source: 'Dashboard',\n display: {\n name: '__range',\n description: 'The range for the current dashboard in human readable format',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range_s',\n value: () => ((absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf()) / 1000).toString(),\n source: 'Dashboard',\n display: {\n name: '__range_s',\n description: 'The range for the current dashboard in second',\n hidden: true,\n },\n },\n },\n {\n kind: 'BuiltinVariable',\n spec: {\n name: '__range_ms',\n value: () => (absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf()).toString(),\n source: 'Dashboard',\n display: {\n name: '__range_ms',\n description: 'The range for the current dashboard in millisecond',\n hidden: true,\n },\n },\n },\n ];\n builtinVariables?.forEach((def) => result.push(def));\n return result;\n }, [absoluteTimeRange, builtinVariables]);\n\n return (\n <BuiltinVariableContext.Provider value={{ variables: allBuiltinVariables }}>\n <VariableContext.Provider value={{ state: values }}>{children}</VariableContext.Provider>\n </BuiltinVariableContext.Provider>\n );\n}\n\ninterface VariableDefinitionStoreArgs {\n initialVariableDefinitions?: VariableDefinition[];\n externalVariableDefinitions?: ExternalVariableDefinition[];\n queryParams?: ReturnType<typeof useVariableQueryParams>;\n}\n\nfunction createVariableDefinitionStore({\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n queryParams,\n}: VariableDefinitionStoreArgs): StoreApi<VariableDefinitionStore> {\n const initialParams = getInitalValuesFromQueryParameters(queryParams ? queryParams[0] : {});\n const store = createStore<VariableDefinitionStore>()(\n devtools(\n immer((set, get) => ({\n variableState: hydrateVariableDefinitionStates(\n initialVariableDefinitions,\n initialParams,\n externalVariableDefinitions\n ),\n variableDefinitions: initialVariableDefinitions,\n externalVariableDefinitions: externalVariableDefinitions,\n setVariableDefinitions(definitions: VariableDefinition[]): void {\n set(\n (state) => {\n state.variableDefinitions = definitions;\n state.variableState = hydrateVariableDefinitionStates(\n definitions,\n initialParams,\n externalVariableDefinitions\n );\n },\n false,\n '[Variables] setVariableDefinitions' // Used for action name in Redux devtools\n );\n },\n setVariableOptions(name, options, source?: string): void {\n set(\n (state) => {\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n varState.options = options;\n },\n false,\n '[Variables] setVariableOptions'\n );\n },\n setVariableLoading(name, loading, source?: string): void {\n set(\n (state) => {\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n varState.loading = loading;\n },\n false,\n '[Variables] setVariableLoading'\n );\n },\n setVariableValue: (name, value, source?: string): void =>\n set(\n (state) => {\n let val = value;\n const varState = state.variableState.get({ name, source });\n if (!varState) {\n return;\n }\n\n // Make sure there is only one all value\n if (Array.isArray(val) && val.includes(ALL_VALUE)) {\n if (val.at(-1) === ALL_VALUE) {\n val = ALL_VALUE;\n } else {\n val = val.filter((v) => v !== ALL_VALUE);\n }\n }\n if (queryParams) {\n const setQueryParams = queryParams[1];\n setQueryParams({ [getURLQueryParamName(name)]: val });\n }\n varState.value = val;\n },\n false,\n '[Variables] setVariableValue'\n ),\n setVariableDefaultValues: (): VariableDefinition[] => {\n const variableDefinitions = get().variableDefinitions;\n const variableState = get().variableState;\n const updatedVariables = produce(variableDefinitions, (draft) => {\n draft.forEach((variable, index) => {\n const name = variable.spec.name;\n if (variable.kind === 'ListVariable') {\n const currentVariable = variableState.get({ name });\n if (currentVariable?.value !== undefined) {\n draft[index] = {\n kind: 'ListVariable',\n spec: produce(variable.spec, (specDraft) => {\n specDraft.defaultValue = currentVariable.value;\n }),\n };\n }\n } else if (variable.kind === 'TextVariable') {\n const currentVariable = variableState.get({ name });\n const currentVariableValue = typeof currentVariable?.value === 'string' ? currentVariable.value : '';\n if (currentVariable?.value !== undefined) {\n draft[index] = {\n kind: 'TextVariable',\n spec: produce(variable.spec, (specDraft) => {\n specDraft.value = currentVariableValue;\n }),\n };\n }\n }\n });\n });\n set(\n (state) => {\n state.variableDefinitions = updatedVariables;\n },\n false,\n '[Variables] setVariableDefaultValues'\n );\n return updatedVariables;\n },\n getSavedVariablesStatus: (): {\n modifiedVariableNames: string[];\n isSavedVariableModified: boolean;\n } => {\n return checkSavedDefaultVariableStatus(get().variableDefinitions, get().variableState);\n },\n }))\n )\n );\n\n return store as unknown as StoreApi<VariableDefinitionStore>; // TODO: @Gladorme check if we can avoid this cast\n}\n\n/**\n * The external variables allow you to give to the provider some additional variables, not defined in the dashboard and static.\n * It means that you won´t be able to update them from the dashboard itself, but you will see them appear and will be able\n * to modify their runtime value as any other variable.\n * If one of the external variable has the same name as a local one, it will be marked as overridden.\n * You can define one list of variable definition by source and as many source as you want.\n * The order of the sources is important as first one will take precedence on the following ones, in case they have same names.\n */\nexport type ExternalVariableDefinition = {\n source: string;\n tooltip?: {\n title?: string;\n description?: string;\n };\n editLink?: string;\n definitions: VariableDefinition[];\n};\n\nexport interface VariableProviderProps {\n children: ReactNode;\n initialVariableDefinitions?: VariableDefinition[];\n externalVariableDefinitions?: ExternalVariableDefinition[];\n builtinVariableDefinitions?: BuiltinVariableDefinition[];\n}\n\n// TODO: merge the different providers related to Variables under a single one (and keep \"VariableProvider\" as a name)\nexport function VariableProvider({\n children,\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n builtinVariableDefinitions = [],\n}: VariableProviderProps): ReactElement {\n const [store] = useState(() =>\n createVariableDefinitionStore({ initialVariableDefinitions, externalVariableDefinitions })\n );\n\n return (\n <VariableDefinitionStoreContext.Provider value={store}>\n <PluginProvider builtinVariables={builtinVariableDefinitions}>{children}</PluginProvider>\n </VariableDefinitionStoreContext.Provider>\n );\n}\n\nexport function VariableProviderWithQueryParams({\n children,\n initialVariableDefinitions = [],\n externalVariableDefinitions = [],\n builtinVariableDefinitions: builtinVariables = [],\n}: VariableProviderProps): ReactElement {\n const allVariableDefs = mergeVariableDefinitions(initialVariableDefinitions, externalVariableDefinitions);\n const queryParams = useVariableQueryParams(allVariableDefs);\n const [store] = useState(() =>\n createVariableDefinitionStore({ initialVariableDefinitions, externalVariableDefinitions, queryParams })\n );\n\n return (\n <VariableDefinitionStoreContext.Provider value={store}>\n <PluginProvider builtinVariables={builtinVariables}>{children}</PluginProvider>\n </VariableDefinitionStoreContext.Provider>\n );\n}\n"],"names":["createContext","useContext","useMemo","useState","createStore","useStore","useStoreWithEqualityFn","immer","devtools","shallow","produce","VariableContext","BuiltinVariableContext","useTimeRange","DEFAULT_ALL_VALUE","ALL_VALUE","formatDuration","intervalToPrometheusDuration","checkSavedDefaultVariableStatus","findVariableDefinitionByName","mergeVariableDefinitions","hydrateVariableDefinitionStates","getInitalValuesFromQueryParameters","getURLQueryParamName","useVariableQueryParams","VariableDefinitionStoreContext","undefined","useVariableDefinitionStoreCtx","context","Error","useVariableDefinitionStates","variableNames","store","s","varStates","names","variableDefinitions","map","value","spec","name","forEach","varState","variableState","get","overridden","externalVariableDefinitions","d","source","definitions","left","right","JSON","stringify","useVariableDefinitionAndState","state","find","v","definition","useVariableDefinitionActions","setVariableValue","setVariableLoading","setVariableOptions","setVariableDefinitions","setVariableDefaultValues","getSavedVariablesStatus","useVariableDefinitions","useExternalVariableDefinitions","PluginProvider","children","builtinVariables","originalValues","externalDefinitions","absoluteTimeRange","values","contextValues","Object","keys","kind","customAllValue","options","o","allBuiltinVariables","result","start","valueOf","toString","display","description","hidden","end","def","push","Provider","variables","createVariableDefinitionStore","initialVariableDefinitions","queryParams","initialParams","set","loading","val","Array","isArray","includes","at","filter","setQueryParams","updatedVariables","draft","variable","index","currentVariable","specDraft","defaultValue","currentVariableValue","VariableProvider","builtinVariableDefinitions","VariableProviderWithQueryParams","allVariableDefs"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@perses-dev/dashboards",
|
|
3
|
-
"version": "0.50.
|
|
3
|
+
"version": "0.50.3",
|
|
4
4
|
"description": "The dashboards feature in Perses",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"homepage": "https://github.com/perses/perses/blob/main/README.md",
|
|
@@ -29,9 +29,9 @@
|
|
|
29
29
|
"lint:fix": "eslint --fix src --ext .ts,.tsx"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@perses-dev/components": "0.50.
|
|
33
|
-
"@perses-dev/core": "0.50.
|
|
34
|
-
"@perses-dev/plugin-system": "0.50.
|
|
32
|
+
"@perses-dev/components": "0.50.3",
|
|
33
|
+
"@perses-dev/core": "0.50.3",
|
|
34
|
+
"@perses-dev/plugin-system": "0.50.3",
|
|
35
35
|
"@types/react-grid-layout": "^1.3.2",
|
|
36
36
|
"date-fns": "^2.28.0",
|
|
37
37
|
"immer": "^9.0.15",
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
"zustand": "^4.3.3"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@perses-dev/internal-utils": "0.50.
|
|
50
|
-
"@perses-dev/storybook": "0.50.
|
|
49
|
+
"@perses-dev/internal-utils": "0.50.3",
|
|
50
|
+
"@perses-dev/storybook": "0.50.3",
|
|
51
51
|
"history": "^5.3.0",
|
|
52
52
|
"intersection-observer": "^0.12.2"
|
|
53
53
|
},
|