@perses-dev/plugin-system 0.0.0-snapshot-scatterplot-fix-imports-95e1b59 → 0.0.0-snapshot-explorer-plugin-c4a7621

package/dist/cjs/components/PluginRegistry/PluginRegistry.js

@@ -42,31 +42,30 @@ function PluginRegistry(props) {
         }
         return request;
     });
-    const getPlugin = (0, _react.useCallback)(async (pluginType, kind)=>{
+    const getPlugin = (0, _react.useCallback)(async (kind, name)=>{
         // Get the indexes of the installed plugins
         const pluginIndexes = await getPluginIndexes();
         // Figure out what module the plugin is in by looking in the index
-        const typeAndKindKey = (0, _pluginindexes.getTypeAndKindKey)(pluginType, kind);
-        const resource = pluginIndexes.pluginResourcesByTypeAndKind.get(typeAndKindKey);
+        const typeAndKindKey = (0, _pluginindexes.getTypeAndKindKey)(kind, name);
+        const resource = pluginIndexes.pluginResourcesByNameAndKind.get(typeAndKindKey);
         if (resource === undefined) {
-            throw new Error(`A ${pluginType} plugin for kind '${kind}' is not installed`);
+            throw new Error(`A ${name} plugin for kind '${kind}' is not installed`);
         }
         // Treat the plugin module as a bunch of named exports that have plugins
         const pluginModule = await loadPluginModule(resource);
         // We currently assume that plugin modules will have named exports that match the kinds they handle
-        const plugin = pluginModule[kind];
+        const plugin = pluginModule[name];
         if (plugin === undefined) {
-            throw new Error(`The ${pluginType} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`);
+            throw new Error(`The ${name} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`);
         }
         return plugin;
     }, [
         getPluginIndexes,
         loadPluginModule
     ]);
-    const listPluginMetadata = (0, _react.useCallback)(async (pluginType)=>{
+    const listPluginMetadata = (0, _react.useCallback)(async (pluginTypes)=>{
         const pluginIndexes = await getPluginIndexes();
-        var _pluginIndexes_pluginMetadataByType_get;
-        return (_pluginIndexes_pluginMetadataByType_get = pluginIndexes.pluginMetadataByType.get(pluginType)) !== null && _pluginIndexes_pluginMetadataByType_get !== void 0 ? _pluginIndexes_pluginMetadataByType_get : [];
+        return pluginTypes.flatMap((type)=>pluginIndexes.pluginMetadataByKind.get(type) ?? []);
     }, [
         getPluginIndexes
     ]);

package/dist/cjs/components/PluginRegistry/plugin-indexes.js

@@ -36,29 +36,32 @@ function usePluginIndexes(getInstalledPlugins) {
     const createPluginIndexes = (0, _core.useEvent)(async ()=>{
         const installedPlugins = await getInstalledPlugins();
         // Create the two indexes from the installed plugins
-        const pluginResourcesByTypeAndKind = new Map();
-        const pluginMetadataByType = new Map();
+        const pluginResourcesByNameAndKind = new Map();
+        const pluginMetadataByKind = new Map();
         for (const resource of installedPlugins){
             for (const pluginMetadata of resource.spec.plugins){
-                const { pluginType, kind } = pluginMetadata;
+                const { kind, spec: { name } } = pluginMetadata;
                 // Index the plugin by type and kind to point at the module that contains it
-                const key = getTypeAndKindKey(pluginType, kind);
-                if (pluginResourcesByTypeAndKind.has(key)) {
-                    console.warn(`Got more than one ${pluginType} plugin for kind ${kind}`);
+                const key = getTypeAndKindKey(kind, name);
+                if (pluginResourcesByNameAndKind.has(key)) {
+                    console.warn(`Got more than one ${kind} plugin for kind ${name}`);
                 }
-                pluginResourcesByTypeAndKind.set(key, resource);
+                pluginResourcesByNameAndKind.set(key, resource);
                 // Index the metadata by plugin type
-                let list = pluginMetadataByType.get(pluginType);
+                let list = pluginMetadataByKind.get(kind);
                 if (list === undefined) {
                     list = [];
-                    pluginMetadataByType.set(pluginType, list);
+                    pluginMetadataByKind.set(kind, list);
                 }
-                list.push(pluginMetadata);
+                list.push({
+                    ...pluginMetadata,
+                    module: resource.metadata
+                });
             }
         }
         return {
-            pluginResourcesByTypeAndKind,
-            pluginMetadataByType
+            pluginResourcesByNameAndKind,
+            pluginMetadataByKind
         };
     });
     // De-dupe creating plugin indexes (i.e. requests to get installed plugins)
@@ -77,6 +80,6 @@ function usePluginIndexes(getInstalledPlugins) {
     ]);
     return getPluginIndexes;
 }
-function getTypeAndKindKey(pluginType, kind) {
-    return `${pluginType}:${kind}`;
+function getTypeAndKindKey(kind, name) {
+    return `${kind}:${name}`;
 }

package/dist/cjs/components/PluginSpecEditor/PluginSpecEditor.js

@@ -24,7 +24,7 @@ const _jsxruntime = require("react/jsx-runtime");
 const _components = require("@perses-dev/components");
 const _runtime = require("../../runtime");
 function PluginSpecEditor(props) {
-    const { pluginType, pluginKind, ...others } = props;
+    const { pluginSelection: { type: pluginType, kind: pluginKind }, ...others } = props;
     const { data: plugin, isLoading, error } = (0, _runtime.usePlugin)(pluginType, pluginKind);
     if (error) {
         return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.ErrorAlert, {

package/dist/cjs/components/ProjectSelect.js

@@ -44,7 +44,7 @@ function ProjectSelect(props) {
         onChange: handleChange,
         children: [
             /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
-                value: 'none',
+                value: "none",
                 children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {
                     direction: "row",
                     alignItems: "center",
@@ -56,7 +56,7 @@ function ProjectSelect(props) {
                     })
                 })
             }),
-            data === null || data === void 0 ? void 0 : data.map((project)=>[
+            data?.map((project)=>[
                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
                         value: project.metadata.name,
                         children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {
@@ -79,8 +79,7 @@ function ProjectSelect(props) {
  * returns a string value that can be used as a Select input value.
  * @param selector
  */ function projectToOptionValue(project) {
-    var _project_metadata_name;
-    return (_project_metadata_name = project.metadata.name) !== null && _project_metadata_name !== void 0 ? _project_metadata_name : 'none';
+    return project.metadata.name ?? 'none';
 }
 /**
  * Given an option value name,
@@ -91,6 +90,7 @@ function ProjectSelect(props) {
         kind: 'Project',
         metadata: {
             name: optionValue
-        }
+        },
+        spec: {}
     };
 }

package/dist/cjs/components/TimeRangeControls/TimeRangeControls.js

@@ -1,4 +1,4 @@
-// Copyright 2023 The Perses Authors
+// Copyright 2024 The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
 // You may obtain a copy of the License at
@@ -24,9 +24,6 @@ _export(exports, {
     DEFAULT_REFRESH_INTERVAL_OPTIONS: function() {
         return DEFAULT_REFRESH_INTERVAL_OPTIONS;
     },
-    DEFAULT_TIME_RANGE_OPTIONS: function() {
-        return DEFAULT_TIME_RANGE_OPTIONS;
-    },
     TimeRangeControls: function() {
         return TimeRangeControls;
     }
@@ -43,62 +40,6 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
-const DEFAULT_TIME_RANGE_OPTIONS = [
-    {
-        value: {
-            pastDuration: '5m'
-        },
-        display: 'Last 5 minutes'
-    },
-    {
-        value: {
-            pastDuration: '15m'
-        },
-        display: 'Last 15 minutes'
-    },
-    {
-        value: {
-            pastDuration: '30m'
-        },
-        display: 'Last 30 minutes'
-    },
-    {
-        value: {
-            pastDuration: '1h'
-        },
-        display: 'Last 1 hour'
-    },
-    {
-        value: {
-            pastDuration: '6h'
-        },
-        display: 'Last 6 hours'
-    },
-    {
-        value: {
-            pastDuration: '12h'
-        },
-        display: 'Last 12 hours'
-    },
-    {
-        value: {
-            pastDuration: '24h'
-        },
-        display: 'Last 1 day'
-    },
-    {
-        value: {
-            pastDuration: '7d'
-        },
-        display: 'Last 7 days'
-    },
-    {
-        value: {
-            pastDuration: '14d'
-        },
-        display: 'Last 14 days'
-    }
-];
 const DEFAULT_REFRESH_INTERVAL_OPTIONS = [
     {
         value: {
@@ -138,18 +79,15 @@ const DEFAULT_REFRESH_INTERVAL_OPTIONS = [
     }
 ];
 const DEFAULT_HEIGHT = '34px';
-function TimeRangeControls({ heightPx, showTimeRangeSelector = true, showRefreshButton = true, showRefreshInterval = true, timePresets = DEFAULT_TIME_RANGE_OPTIONS }) {
+function TimeRangeControls({ heightPx, showTimeRangeSelector = true, showRefreshButton = true, showRefreshInterval = true, showCustomTimeRange, timePresets }) {
     const { timeRange, setTimeRange, refresh, refreshInterval, setRefreshInterval } = (0, _runtime.useTimeRange)();
+    const showCustomTimeRangeValue = (0, _runtime.useShowCustomTimeRangeSetting)(showCustomTimeRange);
+    const timePresetsValue = (0, _runtime.useTimeRangeOptionsSetting)(timePresets);
     // Convert height to a string, then use the string for styling
     const height = heightPx === undefined ? DEFAULT_HEIGHT : `${heightPx}px`;
     // add time preset if one does not match duration given in time range
-    if ('pastDuration' in timeRange && !timePresets.some((option)=>option.value.pastDuration === timeRange['pastDuration'])) {
-        timePresets.push({
-            value: {
-                pastDuration: timeRange['pastDuration']
-            },
-            display: `Last ${timeRange['pastDuration']}`
-        });
+    if ('pastDuration' in timeRange && !timePresetsValue.some((option)=>option.value.pastDuration === timeRange['pastDuration'])) {
+        timePresetsValue.push((0, _components.buildRelativeTimeOption)(timeRange['pastDuration']));
     }
     // set the new refresh interval both in the dashboard context & as query param
     const handleRefreshIntervalChange = (0, _react.useCallback)((duration)=>{
@@ -161,11 +99,12 @@ function TimeRangeControls({ heightPx, showTimeRangeSelector = true, showRefresh
         direction: "row",
         spacing: 1,
         children: [
-            showTimeRangeSelector && /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.DateTimeRangePicker, {
-                timeOptions: timePresets,
+            showTimeRangeSelector && /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.TimeRangeSelector, {
+                timeOptions: timePresetsValue,
                 value: timeRange,
                 onChange: setTimeRange,
-                height: height
+                height: height,
+                showCustomTimeRange: showCustomTimeRangeValue
             }),
             showRefreshButton && /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.InfoTooltip, {
                 description: _constants.TOOLTIP_TEXT.refresh,