@perses-dev/plugin-system 0.0.0-snapshot-scatter-chart-embed-8efdfab → 0.0.0-snapshot-explorer-plugin-c4a7621

package/dist/cjs/runtime/TimeRangeProvider/TimeRangeSettingsProvider.js

@@ -0,0 +1,100 @@
+// 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
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    TimeRangeSettingsContext: function() {
+        return TimeRangeSettingsContext;
+    },
+    TimeRangeSettingsProvider: function() {
+        return TimeRangeSettingsProvider;
+    },
+    useShowCustomTimeRangeSetting: function() {
+        return useShowCustomTimeRangeSetting;
+    },
+    useTimeRangeOptionsSetting: function() {
+        return useTimeRangeOptionsSetting;
+    },
+    useTimeRangeSettings: function() {
+        return useTimeRangeSettings;
+    },
+    useTimeRangeSettingsContext: function() {
+        return useTimeRangeSettingsContext;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
+const _components = require("@perses-dev/components");
+const DEFAULT_OPTIONS = [
+    '5m',
+    '15m',
+    '30m',
+    '1h',
+    '6h',
+    '12h',
+    '24h',
+    '7d',
+    '14d'
+];
+const defaultTimeRangeSettings = {
+    showCustom: true,
+    options: DEFAULT_OPTIONS.map((duration)=>(0, _components.buildRelativeTimeOption)(duration))
+};
+const TimeRangeSettingsContext = /*#__PURE__*/ (0, _react.createContext)(defaultTimeRangeSettings);
+function useTimeRangeSettingsContext() {
+    const ctx = (0, _react.useContext)(TimeRangeSettingsContext);
+    if (ctx === undefined) {
+        throw new Error('No TimeRangeContext found. Did you forget a Provider?');
+    }
+    return ctx;
+}
+function useTimeRangeSettings() {
+    return useTimeRangeSettingsContext();
+}
+function useShowCustomTimeRangeSetting(override) {
+    const showCustomTimeRange = useTimeRangeSettings().showCustom;
+    if (override !== undefined) {
+        return override;
+    }
+    return showCustomTimeRange;
+}
+function useTimeRangeOptionsSetting(override) {
+    const showCustomTimeRange = useTimeRangeSettings().options;
+    if (override !== undefined) {
+        return override;
+    }
+    return showCustomTimeRange;
+}
+function TimeRangeSettingsProvider(props) {
+    const ctx = (0, _react.useMemo)(()=>{
+        return {
+            showCustom: props.showCustom === undefined ? defaultTimeRangeSettings.showCustom : props.showCustom,
+            options: props.options === undefined ? defaultTimeRangeSettings.options : props.options
+        };
+    }, [
+        props.showCustom,
+        props.options
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(TimeRangeSettingsContext.Provider, {
+        value: ctx,
+        children: props.children
+    });
+}

package/dist/cjs/runtime/TimeRangeProvider/index.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
@@ -16,6 +16,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 _export_star(require("./TimeRangeProvider"), exports);
 _export_star(require("./TimeRangeProviderWithQueryParams"), exports);
+_export_star(require("./TimeRangeSettingsProvider"), exports);
 _export_star(require("./query-params"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {

package/dist/cjs/runtime/TimeRangeProvider/query-params.js

@@ -21,32 +21,32 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    encodeTimeRangeValue: function() {
-        return encodeTimeRangeValue;
+    TimeRangeParam: function() {
+        return TimeRangeParam;
     },
     decodeTimeRangeValue: function() {
         return decodeTimeRangeValue;
     },
-    TimeRangeParam: function() {
-        return TimeRangeParam;
-    },
-    timeRangeQueryConfig: function() {
-        return timeRangeQueryConfig;
+    encodeTimeRangeValue: function() {
+        return encodeTimeRangeValue;
     },
     refreshIntervalQueryConfig: function() {
         return refreshIntervalQueryConfig;
     },
-    useInitialTimeRange: function() {
-        return useInitialTimeRange;
-    },
-    useTimeRangeParams: function() {
-        return useTimeRangeParams;
+    timeRangeQueryConfig: function() {
+        return timeRangeQueryConfig;
     },
     useInitialRefreshInterval: function() {
         return useInitialRefreshInterval;
     },
+    useInitialTimeRange: function() {
+        return useInitialTimeRange;
+    },
     useSetRefreshIntervalParams: function() {
         return useSetRefreshIntervalParams;
+    },
+    useTimeRangeParams: function() {
+        return useTimeRangeParams;
     }
 });
 const _react = require("react");
@@ -54,15 +54,12 @@ const _usequeryparams = require("use-query-params");
 const _datefns = require("date-fns");
 const _core = require("@perses-dev/core");
 /* Interprets an encoded string and returns either the string or null/undefined if not available */ function getEncodedValue(input, allowEmptyString) {
-    if (input == null) {
-        return input;
-    }
     // '' or []
-    if (input.length === 0 && (!allowEmptyString || allowEmptyString && input !== '')) {
+    if (!input || input.length === 0 && (!allowEmptyString || allowEmptyString && input !== '')) {
         return null;
     }
     const str = input instanceof Array ? input[0] : input;
-    if (str == null) {
+    if (str === null || str === undefined) {
         return str;
     }
     if (!allowEmptyString && str === '') {
@@ -83,7 +80,7 @@ function encodeTimeRangeValue(timeOptionValue) {
 }
 function decodeTimeRangeValue(input) {
     const paramString = getEncodedValue(input);
-    if (paramString == null) return paramString;
+    if (!paramString) return null;
     return (0, _core.isDurationString)(paramString) ? paramString : new Date(Number(paramString));
 }
 const TimeRangeParam = {
@@ -91,7 +88,7 @@ const TimeRangeParam = {
     decode: decodeTimeRangeValue,
     equals: (valueA, valueB)=>{
         if (valueA === valueB) return true;
-        if (valueA == null || valueB == null) return valueA === valueB;
+        if (!valueA || !valueB) return valueA === valueB;
         return valueA.valueOf() === valueB.valueOf();
     }
 };
@@ -106,7 +103,7 @@ function useInitialTimeRange(dashboardDuration) {
     const [query] = (0, _usequeryparams.useQueryParams)(timeRangeQueryConfig, {
         updateType: 'replaceIn'
     });
-    const { start , end  } = query;
+    const { start, end } = query;
     return (0, _react.useMemo)(()=>{
         let initialTimeRange = {
             pastDuration: dashboardDuration
@@ -138,7 +135,7 @@ function useTimeRangeParams(initialTimeRange) {
     });
     // determine whether initial param had previously been populated to fix back btn
     const [paramsLoaded, setParamsLoaded] = (0, _react.useState)(false);
-    const { start  } = query;
+    const { start } = query;
     (0, _react.useEffect)(()=>{
         // when dashboard loaded with no params, default to dashboard duration
         if (!paramsLoaded && !start) {
@@ -177,7 +174,7 @@ function useInitialRefreshInterval(dashboardDuration) {
     const [query] = (0, _usequeryparams.useQueryParams)(refreshIntervalQueryConfig, {
         updateType: 'replaceIn'
     });
-    const { refresh  } = query;
+    const { refresh } = query;
     return (0, _react.useMemo)(()=>{
         let initialTimeRange = dashboardDuration;
         if (!refresh) {
@@ -199,7 +196,7 @@ function useSetRefreshIntervalParams(initialRefreshInterval) {
     });
     // determine whether initial param had previously been populated to fix back btn
     const [paramsLoaded, setParamsLoaded] = (0, _react.useState)(false);
-    const { refresh  } = query;
+    const { refresh } = query;
     (0, _react.useEffect)(()=>{
         // when dashboard loaded with no params, default to dashboard refresh interval
         if (!paramsLoaded && !refresh) {

package/dist/cjs/runtime/UsageMetricsProvider.js

@@ -0,0 +1,99 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    UsageMetricsContext: function() {
+        return UsageMetricsContext;
+    },
+    UsageMetricsProvider: function() {
+        return UsageMetricsProvider;
+    },
+    useUsageMetrics: function() {
+        return useUsageMetrics;
+    },
+    useUsageMetricsContext: function() {
+        return useUsageMetricsContext;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _core = require("@perses-dev/core");
+const _react = require("react");
+const UsageMetricsContext = /*#__PURE__*/ (0, _react.createContext)(undefined);
+const useUsageMetricsContext = ()=>{
+    return (0, _react.useContext)(UsageMetricsContext);
+};
+const useUsageMetrics = ()=>{
+    const ctx = useUsageMetricsContext();
+    return {
+        markQuery: (definition, newState)=>{
+            if (ctx === undefined) {
+                return;
+            }
+            const definitionKey = JSON.stringify(definition);
+            if (ctx.pendingQueries.has(definitionKey) && newState === 'pending') {
+                // Never allow transitions back to pending, to avoid re-sending stats on a re-render.
+                return;
+            }
+            if (ctx.pendingQueries.get(definitionKey) !== newState) {
+                ctx.pendingQueries.set(definitionKey, newState);
+                if (newState === 'error') {
+                    ctx.renderErrorCount += 1;
+                }
+                const allDone = [
+                    ...ctx.pendingQueries.values()
+                ].every((p)=>p !== 'pending');
+                if (ctx.renderDurationMs === 0 && allDone) {
+                    ctx.renderDurationMs = Date.now() - ctx.startRenderTime;
+                    submitMetrics(ctx);
+                }
+            }
+        }
+    };
+};
+const submitMetrics = async (stats)=>{
+    await (0, _core.fetch)('/api/v1/view', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+            project: stats.project,
+            dashboard: stats.dashboard,
+            render_time: stats.renderDurationMs / 1000,
+            render_errors: stats.renderErrorCount
+        })
+    });
+};
+const UsageMetricsProvider = ({ project, dashboard, children })=>{
+    const ctx = {
+        project: project,
+        dashboard: dashboard,
+        renderErrorCount: 0,
+        startRenderTime: Date.now(),
+        renderDurationMs: 0,
+        pendingQueries: new Map()
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(UsageMetricsContext.Provider, {
+        value: ctx,
+        children: children
+    });
+};

package/dist/cjs/runtime/builtin-variables.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
@@ -27,11 +27,11 @@ _export(exports, {
     useBuiltinVariableContext: function() {
         return useBuiltinVariableContext;
     },
-    useBuiltinVariableValues: function() {
-        return useBuiltinVariableValues;
-    },
     useBuiltinVariableDefinitions: function() {
         return useBuiltinVariableDefinitions;
+    },
+    useBuiltinVariableValues: function() {
+        return useBuiltinVariableValues;
     }
 });
 const _react = require("react");
@@ -44,7 +44,7 @@ function useBuiltinVariableContext() {
     return ctx;
 }
 function useBuiltinVariableValues(names) {
-    const { variables  } = useBuiltinVariableContext();
+    const { variables } = useBuiltinVariableContext();
     const states = (0, _react.useMemo)(()=>{
         const values = {};
         for (const variable of variables){
@@ -59,7 +59,7 @@ function useBuiltinVariableValues(names) {
     ]);
     const values = (0, _react.useMemo)(()=>{
         const values = {};
-        names === null || names === void 0 ? void 0 : names.forEach((name)=>{
+        names?.forEach((name)=>{
             const s = states[name];
             if (s) {
                 values[name] = s;
@@ -76,6 +76,6 @@ function useBuiltinVariableValues(names) {
     return values;
 }
 function useBuiltinVariableDefinitions() {
-    const { variables  } = useBuiltinVariableContext();
+    const { variables } = useBuiltinVariableContext();
     return variables;
 }

package/dist/cjs/runtime/datasources.js

@@ -24,17 +24,17 @@ _export(exports, {
     DatasourceStoreContext: function() {
         return DatasourceStoreContext;
     },
+    useDatasource: function() {
+        return useDatasource;
+    },
+    useDatasourceClient: function() {
+        return useDatasourceClient;
+    },
     useDatasourceStore: function() {
         return useDatasourceStore;
     },
     useListDatasourceSelectItems: function() {
         return useListDatasourceSelectItems;
-    },
-    useDatasourceClient: function() {
-        return useDatasourceClient;
-    },
-    useDatasource: function() {
-        return useDatasource;
     }
 });
 const _reactquery = require("@tanstack/react-query");
@@ -47,25 +47,34 @@ function useDatasourceStore() {
     }
     return ctx;
 }
-function useListDatasourceSelectItems(datasourcePluginKind, project) {
-    const { listDatasourceSelectItems  } = useDatasourceStore();
-    return (0, _reactquery.useQuery)([
-        'listDatasourceSelectItems',
-        datasourcePluginKind,
-        project
-    ], ()=>listDatasourceSelectItems(datasourcePluginKind));
+function useListDatasourceSelectItems(datasourcePluginName, project) {
+    const { listDatasourceSelectItems } = useDatasourceStore();
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'listDatasourceSelectItems',
+            datasourcePluginName,
+            project
+        ],
+        queryFn: ()=>listDatasourceSelectItems(datasourcePluginName)
+    });
 }
 function useDatasourceClient(selector) {
     const store = useDatasourceStore();
-    return (0, _reactquery.useQuery)([
-        'getDatasourceClient',
-        selector
-    ], ()=>store.getDatasourceClient(selector));
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'getDatasourceClient',
+            selector
+        ],
+        queryFn: ()=>store.getDatasourceClient(selector)
+    });
 }
 function useDatasource(selector) {
     const store = useDatasourceStore();
-    return (0, _reactquery.useQuery)([
-        'getDatasource',
-        selector
-    ], ()=>store.getDatasource(selector));
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'getDatasource',
+            selector
+        ],
+        queryFn: ()=>store.getDatasource(selector)
+    });
 }

package/dist/cjs/runtime/index.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
@@ -17,11 +17,13 @@ Object.defineProperty(exports, "__esModule", {
 _export_star(require("./builtin-variables"), exports);
 _export_star(require("./datasources"), exports);
 _export_star(require("./plugin-registry"), exports);
-_export_star(require("./template-variables"), exports);
+_export_star(require("./variables"), exports);
 _export_star(require("./TimeRangeProvider"), exports);
 _export_star(require("./time-series-queries"), exports);
 _export_star(require("./trace-queries"), exports);
 _export_star(require("./DataQueriesProvider"), exports);
+_export_star(require("./QueryCountProvider"), exports);
+_export_star(require("./UsageMetricsProvider"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {

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

@@ -24,24 +24,24 @@ _export(exports, {
     PluginRegistryContext: function() {
         return PluginRegistryContext;
     },
-    usePluginRegistry: function() {
-        return usePluginRegistry;
+    useListPluginMetadata: function() {
+        return useListPluginMetadata;
     },
     usePlugin: function() {
         return usePlugin;
     },
-    usePlugins: function() {
-        return usePlugins;
-    },
-    useListPluginMetadata: function() {
-        return useListPluginMetadata;
-    },
     usePluginBuiltinVariableDefinitions: function() {
         return usePluginBuiltinVariableDefinitions;
+    },
+    usePluginRegistry: function() {
+        return usePluginRegistry;
+    },
+    usePlugins: function() {
+        return usePlugins;
     }
 });
-const _react = require("react");
 const _reactquery = require("@tanstack/react-query");
+const _react = require("react");
 const PluginRegistryContext = (0, _react.createContext)(undefined);
 function usePluginRegistry() {
     const ctx = (0, _react.useContext)(PluginRegistryContext);
@@ -51,21 +51,24 @@ function usePluginRegistry() {
     return ctx;
 }
 function usePlugin(pluginType, kind, options) {
-    var _options_enabled;
     // We never want to ask for a plugin when the kind isn't set yet, so disable those queries automatically
     options = {
         ...options,
-        enabled: ((_options_enabled = options === null || options === void 0 ? void 0 : options.enabled) !== null && _options_enabled !== void 0 ? _options_enabled : true) && kind !== ''
+        enabled: (options?.enabled ?? true) && pluginType !== undefined && kind !== ''
     };
-    const { getPlugin  } = usePluginRegistry();
-    return (0, _reactquery.useQuery)([
-        'getPlugin',
-        pluginType,
-        kind
-    ], ()=>getPlugin(pluginType, kind), options);
+    const { getPlugin } = usePluginRegistry();
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'getPlugin',
+            pluginType,
+            kind
+        ],
+        queryFn: ()=>getPlugin(pluginType, kind),
+        ...options
+    });
 }
 function usePlugins(pluginType, plugins) {
-    const { getPlugin  } = usePluginRegistry();
+    const { getPlugin } = usePluginRegistry();
     return (0, _reactquery.useQueries)({
         queries: plugins.map((p)=>{
             return {
@@ -79,27 +82,36 @@ function usePlugins(pluginType, plugins) {
         })
     });
 }
-function useListPluginMetadata(pluginType, options) {
-    const { listPluginMetadata  } = usePluginRegistry();
-    return (0, _reactquery.useQuery)([
-        'listPluginMetadata',
-        pluginType
-    ], ()=>listPluginMetadata(pluginType), options);
+function useListPluginMetadata(pluginTypes, options) {
+    const { listPluginMetadata } = usePluginRegistry();
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'listPluginMetadata',
+            pluginTypes
+        ],
+        queryFn: ()=>listPluginMetadata(pluginTypes),
+        ...options
+    });
 }
 function usePluginBuiltinVariableDefinitions() {
-    const { getPlugin , listPluginMetadata  } = usePluginRegistry();
-    return (0, _reactquery.useQuery)([
-        'usePluginBuiltinVariableDefinitions'
-    ], async ()=>{
-        const datasources = await listPluginMetadata('Datasource');
-        const datasourceKinds = new Set(datasources.map((datasource)=>datasource.kind));
-        const result = [];
-        for (const kind of datasourceKinds){
-            const plugin = await getPlugin('Datasource', kind);
-            if (plugin.getBuiltinVariableDefinitions) {
-                plugin.getBuiltinVariableDefinitions().forEach((definition)=>result.push(definition));
+    const { getPlugin, listPluginMetadata } = usePluginRegistry();
+    return (0, _reactquery.useQuery)({
+        queryKey: [
+            'usePluginBuiltinVariableDefinitions'
+        ],
+        queryFn: async ()=>{
+            const datasources = await listPluginMetadata([
+                'Datasource'
+            ]);
+            const datasourceNames = new Set(datasources.map((datasource)=>datasource.spec.name));
+            const result = [];
+            for (const name of datasourceNames){
+                const plugin = await getPlugin('Datasource', name);
+                if (plugin.getBuiltinVariableDefinitions) {
+                    plugin.getBuiltinVariableDefinitions().forEach((definition)=>result.push(definition));
+                }
             }
+            return result;
         }
-        return result;
     });
 }