@perses-dev/plugin-system 0.0.0-snapshot-explorer-plugin-c4a7621 → 0.0.0-snapshot-histogram-types-78c5104

package/dist/cjs/components/HTTPSettingsEditor/HTTPSettingsEditor.js

@@ -498,14 +498,20 @@ function HTTPSettingsEditor(props) {
     const handleModeChange = (v)=>{
         if (tabs[v]?.label === strDirect) {
             setPreviousSpecProxy(value);
+            // Copy all settings (for example, scrapeInterval), except 'proxy'
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            const { proxy, ...newValue } = value;
             onChange({
-                ...value,
+                ...newValue,
                 directUrl: previousSpecDirect.directUrl
             });
         } else if (tabs[v]?.label === strProxy) {
             setPreviousSpecDirect(value);
+            // Copy all settings (for example, scrapeInterval), except 'directUrl'
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            const { directUrl, ...newValue } = value;
             onChange({
-                ...value,
+                ...newValue,
                 proxy: previousSpecProxy.proxy
             });
         }

package/dist/cjs/components/MultiQueryEditor/MultiQueryEditor.js

@@ -39,7 +39,7 @@ function useDefaultQueryDefinition(queryTypes) {
     const defaultQueryType = queryTypes[0];
     // Then the default plugin kind
     // Use as default the plugin kind explicitly set as default or the first in the list
-    const { data: queryPlugins } = (0, _runtime.useListPluginMetadata)(queryTypes);
+    const { data: queryPlugins, isLoading } = (0, _runtime.useListPluginMetadata)(queryTypes);
     const { defaultPluginKinds } = (0, _runtime.usePluginRegistry)();
     const defaultQueryKind = defaultPluginKinds?.[defaultQueryType] ?? queryPlugins?.[0]?.spec.name ?? '';
     const { data: defaultQueryPlugin } = (0, _runtime.usePlugin)(defaultQueryType, defaultQueryKind, {
@@ -48,17 +48,20 @@ function useDefaultQueryDefinition(queryTypes) {
     });
     // This default query definition is used if no query is provided initially or when we add a new query
     return {
-        kind: defaultQueryType,
-        spec: {
-            plugin: {
-                kind: defaultQueryKind,
-                spec: defaultQueryPlugin?.createInitialOptions() || {}
+        defaultInitialQueryDefinition: {
+            kind: defaultQueryType,
+            spec: {
+                plugin: {
+                    kind: defaultQueryKind,
+                    spec: defaultQueryPlugin?.createInitialOptions() || {}
+                }
             }
-        }
+        },
+        isLoading
     };
 }
 function MultiQueryEditor({ queryTypes, queries = [], onChange }) {
-    const defaultInitialQueryDefinition = useDefaultQueryDefinition(queryTypes);
+    const { defaultInitialQueryDefinition, isLoading } = useDefaultQueryDefinition(queryTypes);
     // State for which queries are collapsed
     const [queriesCollapsed, setQueriesCollapsed] = (0, _react.useState)(queries.map(()=>false));
     // Query handlers
@@ -111,9 +114,9 @@ function MultiQueryEditor({ queryTypes, queries = [], onChange }) {
         });
     };
     // show one query input if queries is empty
-    const queryDefinitions = queries.length ? queries : [
+    const queryDefinitions = queries.length ? queries : !isLoading ? [
         defaultInitialQueryDefinition
-    ];
+    ] : [];
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
             /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {

package/dist/cjs/components/MultiQueryEditor/QueryEditorContainer.js

@@ -21,7 +21,7 @@ Object.defineProperty(exports, "QueryEditorContainer", {
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
-const _immer = /*#__PURE__*/ _interop_require_default(require("immer"));
+const _immer = require("immer");
 const _material = require("@mui/material");
 const _DeleteOutline = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/DeleteOutline"));
 const _ChevronDown = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/ChevronDown"));
@@ -84,7 +84,7 @@ const QueryEditorContainer = ({ queryTypes, index, query, isCollapsed, onDelete,
  */ function QueryEditor(props) {
     const { value, onChange, queryTypes, ...others } = props;
     const handlePluginChange = (next)=>{
-        onChange((0, _immer.default)(value, (draft)=>{
+        onChange((0, _immer.produce)(value, (draft)=>{
             draft.kind = next.selection.type;
             draft.spec.plugin.kind = next.selection.kind;
             draft.spec.plugin.spec = next.spec;

package/dist/cjs/remote/PluginRuntime.js

@@ -24,9 +24,6 @@ _export(exports, {
     loadPlugin: function() {
         return loadPlugin;
     },
-    pluginRuntime: function() {
-        return pluginRuntime;
-    },
     usePluginRuntime: function() {
         return usePluginRuntime;
     }
@@ -35,8 +32,8 @@ const _runtime = require("@module-federation/enhanced/runtime");
 const _reactquery = /*#__PURE__*/ _interop_require_wildcard(require("@tanstack/react-query"));
 const _react = /*#__PURE__*/ _interop_require_default(require("react"));
 const _reactdom = /*#__PURE__*/ _interop_require_default(require("react-dom"));
-const _reactrouterdom = /*#__PURE__*/ _interop_require_wildcard(require("react-router-dom"));
 const _reacthookform = /*#__PURE__*/ _interop_require_wildcard(require("react-hook-form"));
+const _reactrouterdom = /*#__PURE__*/ _interop_require_wildcard(require("react-router-dom"));
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -83,166 +80,175 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const pluginRuntime = (0, _runtime.init)({
-    name: '@perses/perses-ui-host',
-    remotes: [],
-    shared: {
-        react: {
-            version: _react.default.version,
-            lib: ()=>_react.default,
-            shareConfig: {
-                singleton: true,
-                requiredVersion: `^${_react.default.version}`
-            }
-        },
-        'react-dom': {
-            version: '18.3.1',
-            lib: ()=>_reactdom.default,
-            shareConfig: {
-                singleton: true,
-                requiredVersion: `^18.3.1`
-            }
-        },
-        'react-router-dom': {
-            version: '6.26.0',
-            lib: ()=>_reactrouterdom,
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^6.26.0'
-            }
-        },
-        '@tanstack/react-query': {
-            version: '4.36.1',
-            lib: ()=>_reactquery,
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^4.36.1'
-            }
-        },
-        'react-hook-form': {
-            version: '7.52.2',
-            lib: ()=>_reacthookform,
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^7.52.2'
-            }
-        },
-        echarts: {
-            version: '5.5.0',
-            lib: ()=>require('echarts'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^5.5.0'
-            }
-        },
-        '@perses-dev/components': {
-            version: '0.50.0',
-            lib: ()=>require('@perses-dev/components'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^0.50.0'
-            }
-        },
-        '@perses-dev/plugin-system': {
-            version: '0.50.0',
-            lib: ()=>require('@perses-dev/plugin-system'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^0.50.0'
-            }
-        },
-        '@perses-dev/explore': {
-            version: '0.50.0',
-            lib: ()=>require('@perses-dev/explore'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^0.50.0'
-            }
-        },
-        '@perses-dev/dashboards': {
-            version: '0.50.0',
-            lib: ()=>require('@perses-dev/dashboards'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^0.50.0'
+let instance = null;
+const getPluginRuntime = ()=>{
+    if (instance === null) {
+        const pluginRuntime = (0, _runtime.init)({
+            name: '@perses/perses-ui-host',
+            remotes: [],
+            shared: {
+                react: {
+                    version: _react.default.version,
+                    lib: ()=>_react.default,
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: `^${_react.default.version}`
+                    }
+                },
+                'react-dom': {
+                    version: '18.3.1',
+                    lib: ()=>_reactdom.default,
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: `^18.3.1`
+                    }
+                },
+                'react-router-dom': {
+                    version: '6.26.0',
+                    lib: ()=>_reactrouterdom,
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^6.26.0'
+                    }
+                },
+                '@tanstack/react-query': {
+                    version: '5.64.2',
+                    lib: ()=>_reactquery,
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^5.64.2'
+                    }
+                },
+                'react-hook-form': {
+                    version: '7.52.2',
+                    lib: ()=>_reacthookform,
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^7.52.2'
+                    }
+                },
+                echarts: {
+                    version: '5.5.0',
+                    lib: ()=>require('echarts'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^5.5.0'
+                    }
+                },
+                '@perses-dev/components': {
+                    version: '0.51.0-beta.0',
+                    lib: ()=>require('@perses-dev/components'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^0.51.0-beta.0'
+                    }
+                },
+                '@perses-dev/plugin-system': {
+                    version: '0.51.0-beta.0',
+                    lib: ()=>require('@perses-dev/plugin-system'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^0.51.0-beta.0'
+                    }
+                },
+                '@perses-dev/explore': {
+                    version: '0.51.0-beta.0',
+                    lib: ()=>require('@perses-dev/explore'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^0.51.0-beta.0'
+                    }
+                },
+                '@perses-dev/dashboards': {
+                    version: '0.51.0-beta.0',
+                    lib: ()=>require('@perses-dev/dashboards'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^0.51.0-beta.0'
+                    }
+                },
+                // Below are the shared modules that are used by the plugins, this can be part of the SDK
+                'date-fns': {
+                    version: '4.1.0',
+                    lib: ()=>require('date-fns'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^4.1.0'
+                    }
+                },
+                'date-fns-tz': {
+                    version: '3.2.0',
+                    lib: ()=>require('date-fns-tz'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^3.2.0'
+                    }
+                },
+                lodash: {
+                    version: '4.17.21',
+                    lib: ()=>require('lodash'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^4.17.21'
+                    }
+                },
+                '@emotion/react': {
+                    version: '11.11.3',
+                    lib: ()=>require('@emotion/react'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^11.11.3'
+                    }
+                },
+                '@emotion/styled': {
+                    version: '11.11.0',
+                    lib: ()=>require('@emotion/styled'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^11.11.0'
+                    }
+                },
+                '@hookform/resolvers/zod': {
+                    version: '3.3.4',
+                    lib: ()=>require('@hookform/resolvers/zod'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^3.3.4'
+                    }
+                },
+                'use-resize-observer': {
+                    version: '9.1.0',
+                    lib: ()=>require('use-resize-observer'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^9.1.0'
+                    }
+                },
+                'mdi-material-ui': {
+                    version: '7.4.0',
+                    lib: ()=>require('mdi-material-ui'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^7.4.0'
+                    }
+                },
+                immer: {
+                    version: '10.1.1',
+                    lib: ()=>require('immer'),
+                    shareConfig: {
+                        singleton: true,
+                        requiredVersion: '^10.1.1'
+                    }
+                }
             }
-        },
-        // Below are the shared modules that are used by the plugins, this can be part of the SDK
-        'date-fns': {
-            version: '2.29.3',
-            lib: ()=>require('date-fns'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^2.29.3'
-            }
-        },
-        'date-fns-tz': {
-            version: '1.3.8',
-            lib: ()=>require('date-fns-tz'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^1.3.8'
-            }
-        },
-        lodash: {
-            version: '4.17.21',
-            lib: ()=>require('lodash'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^4.17.21'
-            }
-        },
-        '@emotion/react': {
-            version: '11.11.3',
-            lib: ()=>require('@emotion/react'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^11.11.3'
-            }
-        },
-        '@emotion/styled': {
-            version: '11.11.0',
-            lib: ()=>require('@emotion/styled'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^11.11.0'
-            }
-        },
-        '@hookform/resolvers/zod': {
-            version: '3.3.4',
-            lib: ()=>require('@hookform/resolvers/zod'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^3.3.4'
-            }
-        },
-        'use-resize-observer': {
-            version: '9.1.0',
-            lib: ()=>require('use-resize-observer'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^9.1.0'
-            }
-        },
-        'mdi-material-ui': {
-            version: '7.4.0',
-            lib: ()=>require('mdi-material-ui'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^7.4.0'
-            }
-        },
-        immer: {
-            version: '9.0.15',
-            lib: ()=>require('immer'),
-            shareConfig: {
-                singleton: true,
-                requiredVersion: '^9.0.15'
-            }
-        }
+        });
+        instance = pluginRuntime;
+        return instance;
     }
-});
+    return instance;
+};
 const registerRemote = (name, baseURL)=>{
+    const pluginRuntime = getPluginRuntime();
     const existingRemote = pluginRuntime.options.remotes.find((remote)=>remote.name === name);
     if (!existingRemote) {
         const remoteEntryURL = baseURL ? `${baseURL}/${name}/mf-manifest.json` : `/plugins/${name}/mf-manifest.json`;
@@ -261,7 +267,7 @@ const loadPlugin = async (moduleName, pluginName, baseURL)=>{
 };
 function usePluginRuntime({ plugin }) {
     return {
-        pluginRuntime,
+        pluginRuntime: getPluginRuntime(),
         loadPlugin: ()=>loadPlugin(plugin.moduleName, plugin.name, plugin.baseURL)
     };
 }

package/dist/cjs/runtime/DataQueriesProvider/model.js

@@ -78,7 +78,7 @@ function useQueryType() {
                 case 'TempoTraceQuery':
                     return isTraceQueryPluginLoading;
             }
-            throw new Error(`Unable to determine the query type: ${pluginKind}`);
+            return isTraceQueryPluginLoading || isTimeSeriesQueryLoading;
         };
         if (isLoading(pluginKind)) {
             return undefined;

package/dist/cjs/runtime/plugin-registry.js

@@ -69,18 +69,27 @@ function usePlugin(pluginType, kind, options) {
 }
 function usePlugins(pluginType, plugins) {
     const { getPlugin } = usePluginRegistry();
-    return (0, _reactquery.useQueries)({
-        queries: plugins.map((p)=>{
+    // useQueries() does not support queries with duplicate keys, therefore we de-duplicate the plugin kinds before running useQueries()
+    // This resolves the following warning in the JS console: "[QueriesObserver]: Duplicate Queries found. This might result in unexpected behavior."
+    // https://github.com/TanStack/query/issues/8224#issuecomment-2523554831
+    // https://github.com/TanStack/query/issues/4187#issuecomment-1256336901
+    const kinds = [
+        ...new Set(plugins.map((p)=>p.kind))
+    ];
+    const result = (0, _reactquery.useQueries)({
+        queries: kinds.map((kind)=>{
             return {
                 queryKey: [
                     'getPlugin',
                     pluginType,
-                    p.kind
+                    kind
                 ],
-                queryFn: ()=>getPlugin(pluginType, p.kind)
+                queryFn: ()=>getPlugin(pluginType, kind)
             };
         })
     });
+    // Re-assemble array in original order
+    return plugins.map((p)=>result[kinds.indexOf(p.kind)]);
 }
 function useListPluginMetadata(pluginTypes, options) {
     const { listPluginMetadata } = usePluginRegistry();

package/dist/cjs/runtime/trace-queries.js

@@ -68,11 +68,7 @@ function useTraceQueries(definitions) {
                     const plugin = await getPlugin(TRACE_QUERY_KEY, traceQueryKind);
                     const data = await plugin.getTraceData(definition.spec.plugin.spec, context);
                     return data;
-                },
-                // The data returned by getTraceData() contains circular dependencies (a span has a reference to the parent span, and the parent span has an array of child spans)
-                // Therefore structuralSharing must be turned off, otherwise the query is stuck in the 'fetching' state on re-fetch.
-                // Ref: https://github.com/TanStack/query/issues/6954#issuecomment-1962321426
-                structuralSharing: false
+                }
             };
         })
     });

package/dist/components/DatasourceEditorForm/DatasourceEditorForm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DatasourceEditorForm/DatasourceEditorForm.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 { zodResolver } from '@hookform/resolvers/zod';\nimport { Box, Divider, FormControlLabel, Grid, Stack, Switch, TextField, Typography } from '@mui/material';\nimport { DiscardChangesConfirmationDialog, FormActions } from '@perses-dev/components';\nimport { Action, DatasourceDefinition } from '@perses-dev/core';\nimport { DispatchWithoutAction, ReactElement, useState } from 'react';\nimport { Controller, FormProvider, SubmitHandler, useForm } from 'react-hook-form';\nimport { useValidationSchemas } from '../../context';\nimport { getSubmitText, getTitleAction } from '../../utils';\nimport { PluginEditor } from '../PluginEditor';\n\ninterface DatasourceEditorFormProps {\n  initialDatasourceDefinition: DatasourceDefinition;\n  action: Action;\n  isDraft: boolean;\n  isReadonly?: boolean;\n  onActionChange?: (action: Action) => void;\n  onSave: (def: DatasourceDefinition) => void;\n  onClose: DispatchWithoutAction;\n  onDelete?: DispatchWithoutAction;\n}\n\nexport function DatasourceEditorForm(props: DatasourceEditorFormProps): ReactElement {\n  const { initialDatasourceDefinition, action, isDraft, isReadonly, onActionChange, onSave, onClose, onDelete } = props;\n\n  const [isDiscardDialogOpened, setDiscardDialogOpened] = useState<boolean>(false);\n  const titleAction = getTitleAction(action, isDraft);\n  const submitText = getSubmitText(action, isDraft);\n\n  const { datasourceEditorSchema } = useValidationSchemas();\n  const form = useForm<DatasourceDefinition>({\n    resolver: zodResolver(datasourceEditorSchema),\n    mode: 'onBlur',\n    defaultValues: initialDatasourceDefinition,\n  });\n\n  /*\n   * Remove empty fields that are optional\n   */\n  function clearFormData(data: DatasourceDefinition): DatasourceDefinition {\n    const result = { ...data };\n    if (result.spec.display?.name === undefined && result.spec.display?.description === undefined) {\n      delete result.spec.display;\n    }\n    return result;\n  }\n\n  const processForm: SubmitHandler<DatasourceDefinition> = (data: DatasourceDefinition) => {\n    onSave(clearFormData(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(initialDatasourceDefinition) !== JSON.stringify(clearFormData(form.getValues()))) {\n      setDiscardDialogOpened(true);\n    } else {\n      onClose();\n    }\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} Datasource</Typography>\n        <FormActions\n          action={action}\n          submitText={submitText}\n          isReadonly={isReadonly}\n          isValid={form.formState.isValid}\n          onActionChange={onActionChange}\n          onSubmit={form.handleSubmit(processForm)}\n          onDelete={onDelete}\n          onCancel={handleCancel}\n        />\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Grid container spacing={2} mb={2}>\n          <Grid item xs={4}>\n            <Controller\n              control={form.control}\n              name=\"name\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  required\n                  fullWidth\n                  name=\"name\"\n                  label=\"Name\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    disabled: action === 'update' && !isDraft,\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={8}>\n            <Controller\n              control={form.control}\n              name=\"spec.display.name\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  fullWidth\n                  name=\"title\"\n                  label=\"Display Label\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={12}>\n            <Controller\n              control={form.control}\n              name=\"spec.display.description\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  fullWidth\n                  name=\"description\"\n                  label=\"Description\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={6} sx={{ paddingTop: '5px !important' }}>\n            <Stack>\n              <Controller\n                control={form.control}\n                name=\"spec.default\"\n                render={({ field }) => (\n                  <FormControlLabel\n                    label=\"Set as default\"\n                    control={\n                      <Switch\n                        {...field}\n                        checked={!!field.value}\n                        readOnly={action === 'read'}\n                        onChange={(event) => {\n                          if (action === 'read') return; // ReadOnly prop is not blocking user interaction...\n                          field.onChange(event);\n                        }}\n                      />\n                    }\n                  />\n                )}\n              />\n              <Typography variant=\"caption\">\n                Whether this datasource should be the default {form.getValues().spec.plugin.kind} to be used\n              </Typography>\n            </Stack>\n          </Grid>\n        </Grid>\n        <Divider />\n        <Typography py={1} variant=\"h3\">\n          Plugin Options\n        </Typography>\n        <Controller\n          control={form.control}\n          name=\"spec.plugin\"\n          render={({ field }) => (\n            <PluginEditor\n              width=\"100%\"\n              pluginTypes={['Datasource']}\n              pluginKindLabel=\"Source\"\n              value={{\n                selection: {\n                  type: 'Datasource',\n                  kind: field.value.kind,\n                },\n                spec: field.value.spec,\n              }}\n              isReadonly={action === 'read'}\n              onChange={(v) => {\n                field.onChange({ kind: v.selection.kind, spec: v.spec });\n              }}\n            />\n          )}\n        />\n      </Box>\n      <DiscardChangesConfirmationDialog\n        description=\"Are you sure you want to discard your changes? Changes cannot be recovered.\"\n        isOpen={isDiscardDialogOpened}\n        onCancel={() => setDiscardDialogOpened(false)}\n        onDiscardChanges={() => {\n          setDiscardDialogOpened(false);\n          onClose();\n        }}\n      />\n    </FormProvider>\n  );\n}\n"],"names":["zodResolver","Box","Divider","FormControlLabel","Grid","Stack","Switch","TextField","Typography","DiscardChangesConfirmationDialog","FormActions","useState","Controller","FormProvider","useForm","useValidationSchemas","getSubmitText","getTitleAction","PluginEditor","DatasourceEditorForm","props","initialDatasourceDefinition","action","isDraft","isReadonly","onActionChange","onSave","onClose","onDelete","isDiscardDialogOpened","setDiscardDialogOpened","titleAction","submitText","datasourceEditorSchema","form","resolver","mode","defaultValues","clearFormData","data","result","spec","display","name","undefined","description","processForm","handleCancel","JSON","stringify","getValues","sx","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","isValid","formState","onSubmit","handleSubmit","onCancel","overflowY","container","mb","item","xs","control","render","field","fieldState","required","fullWidth","label","InputLabelProps","shrink","InputProps","disabled","readOnly","error","helperText","message","value","onChange","event","paddingTop","checked","plugin","kind","py","width","pluginTypes","pluginKindLabel","selection","type","v","isOpen","onDiscardChanges"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DatasourceEditorForm/DatasourceEditorForm.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 { zodResolver } from '@hookform/resolvers/zod';\nimport { Box, Divider, FormControlLabel, Grid, Stack, Switch, TextField, Typography } from '@mui/material';\nimport { DiscardChangesConfirmationDialog, FormActions } from '@perses-dev/components';\nimport { Action, DatasourceDefinition } from '@perses-dev/core';\nimport { DispatchWithoutAction, ReactElement, useState } from 'react';\nimport { Controller, FormProvider, SubmitHandler, useForm } from 'react-hook-form';\nimport { useValidationSchemas } from '../../context';\nimport { getSubmitText, getTitleAction } from '../../utils';\nimport { PluginEditor } from '../PluginEditor';\n\ninterface DatasourceEditorFormProps {\n  initialDatasourceDefinition: DatasourceDefinition;\n  action: Action;\n  isDraft: boolean;\n  isReadonly?: boolean;\n  onActionChange?: (action: Action) => void;\n  onSave: (def: DatasourceDefinition) => void;\n  onClose: DispatchWithoutAction;\n  onDelete?: DispatchWithoutAction;\n}\n\nexport function DatasourceEditorForm(props: DatasourceEditorFormProps): ReactElement {\n  const { initialDatasourceDefinition, action, isDraft, isReadonly, onActionChange, onSave, onClose, onDelete } = props;\n\n  const [isDiscardDialogOpened, setDiscardDialogOpened] = useState<boolean>(false);\n  const titleAction = getTitleAction(action, isDraft);\n  const submitText = getSubmitText(action, isDraft);\n\n  const { datasourceEditorSchema } = useValidationSchemas();\n  const form = useForm<DatasourceDefinition>({\n    resolver: zodResolver(datasourceEditorSchema),\n    mode: 'onBlur',\n    defaultValues: initialDatasourceDefinition,\n  });\n\n  /*\n   * Remove empty fields that are optional\n   */\n  function clearFormData(data: DatasourceDefinition): DatasourceDefinition {\n    const result = { ...data };\n    if (result.spec.display?.name === undefined && result.spec.display?.description === undefined) {\n      delete result.spec.display;\n    }\n    return result;\n  }\n\n  const processForm: SubmitHandler<DatasourceDefinition> = (data: DatasourceDefinition) => {\n    onSave(clearFormData(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(initialDatasourceDefinition) !== JSON.stringify(clearFormData(form.getValues()))) {\n      setDiscardDialogOpened(true);\n    } else {\n      onClose();\n    }\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} Datasource</Typography>\n        <FormActions\n          action={action}\n          submitText={submitText}\n          isReadonly={isReadonly}\n          isValid={form.formState.isValid}\n          onActionChange={onActionChange}\n          onSubmit={form.handleSubmit(processForm)}\n          onDelete={onDelete}\n          onCancel={handleCancel}\n        />\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Grid container spacing={2} mb={2}>\n          <Grid item xs={4}>\n            <Controller\n              control={form.control}\n              name=\"name\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  required\n                  fullWidth\n                  name=\"name\"\n                  label=\"Name\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    disabled: action === 'update' && !isDraft,\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={8}>\n            <Controller\n              control={form.control}\n              name=\"spec.display.name\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  fullWidth\n                  name=\"title\"\n                  label=\"Display Label\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={12}>\n            <Controller\n              control={form.control}\n              name=\"spec.display.description\"\n              render={({ field, fieldState }) => (\n                <TextField\n                  {...field}\n                  fullWidth\n                  name=\"description\"\n                  label=\"Description\"\n                  InputLabelProps={{ shrink: action === 'read' ? true : undefined }}\n                  InputProps={{\n                    readOnly: action === 'read',\n                  }}\n                  error={!!fieldState.error}\n                  helperText={fieldState.error?.message}\n                  value={field.value ?? ''}\n                  onChange={(event) => {\n                    field.onChange(event);\n                  }}\n                />\n              )}\n            />\n          </Grid>\n          <Grid item xs={6} sx={{ paddingTop: '5px !important' }}>\n            <Stack>\n              <Controller\n                control={form.control}\n                name=\"spec.default\"\n                render={({ field }) => (\n                  <FormControlLabel\n                    label=\"Set as default\"\n                    control={\n                      <Switch\n                        {...field}\n                        checked={!!field.value}\n                        readOnly={action === 'read'}\n                        onChange={(event) => {\n                          if (action === 'read') return; // ReadOnly prop is not blocking user interaction...\n                          field.onChange(event);\n                        }}\n                      />\n                    }\n                  />\n                )}\n              />\n              <Typography variant=\"caption\">\n                Whether this datasource should be the default {form.getValues().spec.plugin.kind} to be used\n              </Typography>\n            </Stack>\n          </Grid>\n        </Grid>\n        <Divider />\n        <Typography py={1} variant=\"h3\">\n          Plugin Options\n        </Typography>\n        <Controller\n          control={form.control}\n          name=\"spec.plugin\"\n          render={({ field }) => (\n            <PluginEditor\n              width=\"100%\"\n              pluginTypes={['Datasource']}\n              pluginKindLabel=\"Source\"\n              value={{\n                selection: {\n                  type: 'Datasource',\n                  kind: field.value.kind,\n                },\n                spec: field.value.spec,\n              }}\n              isReadonly={action === 'read'}\n              onChange={(v) => {\n                field.onChange({ kind: v.selection.kind, spec: v.spec });\n              }}\n            />\n          )}\n        />\n      </Box>\n      <DiscardChangesConfirmationDialog\n        description=\"Are you sure you want to discard your changes? Changes cannot be recovered.\"\n        isOpen={isDiscardDialogOpened}\n        onCancel={() => setDiscardDialogOpened(false)}\n        onDiscardChanges={() => {\n          setDiscardDialogOpened(false);\n          onClose();\n        }}\n      />\n    </FormProvider>\n  );\n}\n"],"names":["zodResolver","Box","Divider","FormControlLabel","Grid","Stack","Switch","TextField","Typography","DiscardChangesConfirmationDialog","FormActions","useState","Controller","FormProvider","useForm","useValidationSchemas","getSubmitText","getTitleAction","PluginEditor","DatasourceEditorForm","props","initialDatasourceDefinition","action","isDraft","isReadonly","onActionChange","onSave","onClose","onDelete","isDiscardDialogOpened","setDiscardDialogOpened","titleAction","submitText","datasourceEditorSchema","form","resolver","mode","defaultValues","clearFormData","data","result","spec","display","name","undefined","description","processForm","handleCancel","JSON","stringify","getValues","sx","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","isValid","formState","onSubmit","handleSubmit","onCancel","overflowY","container","mb","item","xs","control","render","field","fieldState","required","fullWidth","label","InputLabelProps","shrink","InputProps","disabled","readOnly","error","helperText","message","value","onChange","event","paddingTop","checked","plugin","kind","py","width","pluginTypes","pluginKindLabel","selection","type","v","isOpen","onDiscardChanges"],"mappings":"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"}

package/dist/components/DatasourceSelect.d.ts

@@ -1,8 +1,8 @@
-import { SelectProps } from '@mui/material';
+import { OutlinedSelectProps, BaseSelectProps } from '@mui/material';
 import { DatasourceSelector } from '@perses-dev/core';
 import { ReactElement } from 'react';
 type OmittedMuiProps = 'children' | 'value' | 'onChange';
-export interface DatasourceSelectProps extends Omit<SelectProps<string>, OmittedMuiProps> {
+export interface DatasourceSelectProps extends Omit<OutlinedSelectProps & BaseSelectProps<string>, OmittedMuiProps> {
     value: DatasourceSelector;
     onChange: (next: DatasourceSelector) => void;
     datasourcePluginKind: string;

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

@@ -1 +1 @@
-{"version":3,"file":"DatasourceSelect.d.ts","sourceRoot":"","sources":["../../src/components/DatasourceSelect.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAU,WAAW,EAAiE,MAAM,eAAe,CAAC;AACnH,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAK9C,KAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE,eAAe,CAAC;IACvF,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,YAAY,CAuF3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,YAAY,CAahH"}
+{"version":3,"file":"DatasourceSelect.d.ts","sourceRoot":"","sources":["../../src/components/DatasourceSelect.tsx"],"names":[],"mappings":"AAcA,OAAO,EAUL,mBAAmB,EACnB,eAAe,EAChB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAK9C,KAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,mBAAmB,GAAG,eAAe,CAAC,MAAM,CAAC,EAAE,eAAe,CAAC;IACjH,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,YAAY,CAuF3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,YAAY,CAahH"}