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

package/dist/cjs/context/DashboardProvider/DashboardProviderWithQueryParams.js

@@ -0,0 +1,36 @@
+// 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
+});
+Object.defineProperty(exports, "DashboardProviderWithQueryParams", {
+    enumerable: true,
+    get: function() {
+        return DashboardProviderWithQueryParams;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _usequeryparams = require("use-query-params");
+const _DashboardProvider = require("./DashboardProvider");
+function DashboardProviderWithQueryParams({ children, initialState }) {
+    const [viewPanelRef, setViewPanelRef] = (0, _usequeryparams.useQueryParam)('viewPanelRef', _usequeryparams.StringParam);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_DashboardProvider.DashboardProvider, {
+        initialState: {
+            viewPanelRef: viewPanelRef ?? undefined,
+            setViewPanelRef: setViewPanelRef,
+            ...initialState
+        },
+        children: children
+    });
+}

package/dist/cjs/context/DashboardProvider/common.js

@@ -43,8 +43,8 @@ function createPanelDefinition(defaultPanelKind, defaultPanelSpec) {
                 description: undefined
             },
             plugin: {
-                kind: defaultPanelKind !== null && defaultPanelKind !== void 0 ? defaultPanelKind : '',
-                spec: defaultPanelSpec !== null && defaultPanelSpec !== void 0 ? defaultPanelSpec : {}
+                kind: defaultPanelKind ?? '',
+                spec: defaultPanelSpec ?? {}
             },
             queries: []
         }

package/dist/cjs/context/DashboardProvider/dashboard-provider-api.js

@@ -68,6 +68,9 @@ _export(exports, {
     },
     useSaveChangesConfirmationDialog: function() {
         return useSaveChangesConfirmationDialog;
+    },
+    useViewPanel: function() {
+        return useViewPanel;
     }
 });
 const _react = require("react");
@@ -183,8 +186,7 @@ function useDeletePanelGroupDialog() {
 function usePanel(panelGroupItemId) {
     const { panelGroupId, panelGroupItemLayoutId: panelGroupLayoutId } = panelGroupItemId;
     const panel = (0, _DashboardProvider.useDashboardStore)((0, _react.useCallback)((store)=>{
-        var _store_panelGroups_panelGroupId;
-        const panelKey = (_store_panelGroups_panelGroupId = store.panelGroups[panelGroupId]) === null || _store_panelGroups_panelGroupId === void 0 ? void 0 : _store_panelGroups_panelGroupId.itemPanelKeys[panelGroupLayoutId];
+        const panelKey = store.panelGroups[panelGroupId]?.itemPanelKeys[panelGroupLayoutId];
         if (panelKey === undefined) return;
         return store.panels[panelKey];
     }, [
@@ -196,17 +198,19 @@ function usePanel(panelGroupItemId) {
     }
     return panel;
 }
-const selectPanelActions = ({ openEditPanel, openDeletePanelDialog, duplicatePanel })=>({
+const selectPanelActions = ({ openEditPanel, openDeletePanelDialog, duplicatePanel, setViewPanel })=>({
         openEditPanel,
         openDeletePanelDialog,
-        duplicatePanel
+        duplicatePanel,
+        setViewPanel
     });
 function usePanelActions(panelGroupItemId) {
-    const { openEditPanel, openDeletePanelDialog, duplicatePanel } = (0, _DashboardProvider.useDashboardStore)(selectPanelActions);
+    const { openEditPanel, openDeletePanelDialog, duplicatePanel, setViewPanel } = (0, _DashboardProvider.useDashboardStore)(selectPanelActions);
     return {
         openEditPanel: ()=>openEditPanel(panelGroupItemId),
         openDeletePanelDialog: ()=>openDeletePanelDialog(panelGroupItemId),
-        duplicatePanel: ()=>duplicatePanel(panelGroupItemId)
+        duplicatePanel: ()=>duplicatePanel(panelGroupItemId),
+        viewPanel: (panelGroupItemId)=>setViewPanel(panelGroupItemId)
     };
 }
 const selectPanelEditor = (state)=>state.panelEditor;
@@ -226,6 +230,10 @@ const selectDashboardDuration = (state)=>state.duration;
 function useDashboardDuration() {
     return (0, _DashboardProvider.useDashboardStore)(selectDashboardDuration);
 }
+const selectViewPanel = (state)=>state.getViewPanel();
+function useViewPanel() {
+    return (0, _DashboardProvider.useDashboardStore)(selectViewPanel);
+}
 const selectSaveChangesConfirmationDialog = ({ saveChangesConfirmationDialog, openSaveChangesConfirmationDialog, closeSaveChangesConfirmationDialog })=>({
         saveChangesConfirmationDialog,
         openSaveChangesConfirmationDialog,

package/dist/cjs/context/DashboardProvider/delete-panel-slice.js

@@ -60,11 +60,10 @@ function createDeletePanelSlice() {
                     throw new Error(`Could not find panel ${panelKey}`);
                 }
                 set((state)=>{
-                    var _panelGroup_title;
                     state.deletePanelDialog = {
                         panelGroupItemId: panelGroupItemId,
                         panelName: panel.spec.display.name,
-                        panelGroupName: (_panelGroup_title = panelGroup.title) !== null && _panelGroup_title !== void 0 ? _panelGroup_title : ''
+                        panelGroupName: panelGroup.title ?? ''
                     };
                 });
             },

package/dist/cjs/context/DashboardProvider/panel-editor-slice.js

@@ -20,7 +20,7 @@ Object.defineProperty(exports, "createPanelEditorSlice", {
         return createPanelEditorSlice;
     }
 });
-const _panelUtils = require("../../utils/panelUtils");
+const _utils = require("../../utils");
 const _common = require("./common");
 const _panelgroupslice = require("./panel-group-slice");
 function createPanelEditorSlice() {
@@ -28,11 +28,10 @@ function createPanelEditorSlice() {
     return (set, get)=>({
             panelEditor: undefined,
             openEditPanel (panelGroupItemId) {
-                var _panelGroups_panelGroupId;
                 const { panels, panelGroups } = get();
                 // Figure out the panel key at that location
                 const { panelGroupId, panelGroupItemLayoutId: panelGroupLayoutId } = panelGroupItemId;
-                const panelKey = (_panelGroups_panelGroupId = panelGroups[panelGroupId]) === null || _panelGroups_panelGroupId === void 0 ? void 0 : _panelGroups_panelGroupId.itemPanelKeys[panelGroupLayoutId];
+                const panelKey = panelGroups[panelGroupId]?.itemPanelKeys[panelGroupLayoutId];
                 if (panelKey === undefined) {
                     throw new Error(`Could not find Panel Group item ${panelGroupItemId}`);
                 }
@@ -76,7 +75,7 @@ function createPanelEditorSlice() {
                             newGroup.itemLayouts.push({
                                 i: existingLayout.i,
                                 x: 0,
-                                y: (0, _panelUtils.getYForNewRow)(newGroup),
+                                y: (0, _utils.getYForNewRow)(newGroup),
                                 w: existingLayout.w,
                                 h: existingLayout.h
                             });
@@ -95,25 +94,23 @@ function createPanelEditorSlice() {
                 });
             },
             openAddPanel (panelGroupId) {
-                var _get_initialValues;
                 // If a panel group isn't supplied, add to the first group or create a group if there aren't any
                 let newGroup = undefined;
-                panelGroupId !== null && panelGroupId !== void 0 ? panelGroupId : panelGroupId = get().panelGroupOrder[0];
+                panelGroupId ??= get().panelGroupOrder[0];
                 if (panelGroupId === undefined) {
                     newGroup = (0, _panelgroupslice.createEmptyPanelGroup)();
                     newGroup.title = 'Panel Group';
                     panelGroupId = newGroup.id;
                 }
-                var _get_initialValues_panelDefinition;
                 const editorState = {
                     mode: 'create',
                     initialValues: {
                         groupId: panelGroupId,
-                        panelDefinition: (_get_initialValues_panelDefinition = (_get_initialValues = get().initialValues) === null || _get_initialValues === void 0 ? void 0 : _get_initialValues.panelDefinition) !== null && _get_initialValues_panelDefinition !== void 0 ? _get_initialValues_panelDefinition : (0, _common.createPanelDefinition)()
+                        panelDefinition: get().initialValues?.panelDefinition ?? (0, _common.createPanelDefinition)()
                     },
                     applyChanges: (next)=>{
                         const name = next.panelDefinition.spec.display.name;
-                        const panelKey = (0, _panelUtils.getValidPanelKey)(name, get().panels);
+                        const panelKey = (0, _utils.getValidPanelKey)(name, get().panels);
                         set((state)=>{
                             // Add a panel
                             state.panels[panelKey] = next.panelDefinition;
@@ -125,7 +122,7 @@ function createPanelEditorSlice() {
                             const layout = {
                                 i: (0, _common.generateId)().toString(),
                                 x: 0,
-                                y: (0, _panelUtils.getYForNewRow)(group),
+                                y: (0, _utils.getYForNewRow)(group),
                                 w: 12,
                                 h: 6
                             };

package/dist/cjs/context/DashboardProvider/panel-group-editor-slice.js

@@ -55,12 +55,11 @@ const createPanelGroupEditorSlice = (set, get)=>({
             if (existingGroup === undefined) {
                 throw new Error(`Panel group with Id ${panelGroupId} does not exist`);
             }
-            var _existingGroup_title;
             // Create the editor state
             const editor = {
                 mode: 'Edit',
                 initialValues: {
-                    title: (_existingGroup_title = existingGroup.title) !== null && _existingGroup_title !== void 0 ? _existingGroup_title : '',
+                    title: existingGroup.title ?? '',
                     isCollapsed: existingGroup.isCollapsed
                 },
                 applyChanges (next) {

package/dist/cjs/context/DashboardProvider/panel-group-slice.js

@@ -32,10 +32,16 @@ _export(exports, {
     },
     createPanelGroupSlice: function() {
         return createPanelGroupSlice;
+    },
+    isPanelGroupItemIdEqual: function() {
+        return isPanelGroupItemIdEqual;
     }
 });
 const _core = require("@perses-dev/core");
 const _common = require("./common");
+function isPanelGroupItemIdEqual(a, b) {
+    return a?.panelGroupId === b?.panelGroupId && a?.panelGroupItemLayoutId === b?.panelGroupItemLayoutId;
+}
 function createPanelGroupSlice(layouts) {
     const { panelGroups, panelGroupOrder } = convertLayoutsToPanelGroups(layouts);
     // Return the state creator function for Zustand
@@ -75,7 +81,6 @@ function convertLayoutsToPanelGroups(layouts) {
     const panelGroups = {};
     const panelGroupIdOrder = [];
     for (const layout of layouts){
-        var _layout_spec_display_collapse, _layout_spec_display, _layout_spec_display1;
         const itemLayouts = [];
         const itemPanelKeys = {};
         // Split layout information from panel keys to make it easier to update just layouts on move/resize of panels
@@ -94,8 +99,8 @@ function convertLayoutsToPanelGroups(layouts) {
         const panelGroupId = (0, _common.generateId)();
         panelGroups[panelGroupId] = {
             id: panelGroupId,
-            isCollapsed: ((_layout_spec_display = layout.spec.display) === null || _layout_spec_display === void 0 ? void 0 : (_layout_spec_display_collapse = _layout_spec_display.collapse) === null || _layout_spec_display_collapse === void 0 ? void 0 : _layout_spec_display_collapse.open) === false,
-            title: (_layout_spec_display1 = layout.spec.display) === null || _layout_spec_display1 === void 0 ? void 0 : _layout_spec_display1.title,
+            isCollapsed: layout.spec.display?.collapse?.open === false,
+            title: layout.spec.display?.title,
             itemLayouts,
             itemPanelKeys
         };

package/dist/cjs/context/DashboardProvider/view-panel-slice.js

@@ -0,0 +1,79 @@
+// 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
+});
+Object.defineProperty(exports, "createViewPanelSlice", {
+    enumerable: true,
+    get: function() {
+        return createViewPanelSlice;
+    }
+});
+function createViewPanelSlice(viewPanelRef, setViewPanelRef) {
+    return (set, get)=>({
+            viewPanel: {
+                panelGroupItemId: undefined,
+                panelRef: viewPanelRef
+            },
+            getViewPanel () {
+                return getViewPanelGroupId(get().panelGroups, get().viewPanel.panelGroupItemId, get().viewPanel.panelRef);
+            },
+            setViewPanel (panelGroupItemId) {
+                set((state)=>{
+                    state.viewPanel = {
+                        panelRef: undefined,
+                        panelGroupItemId: panelGroupItemId
+                    };
+                    const panelRef = findPanelRefOfPanelGroupItemId(get().panelGroups, panelGroupItemId);
+                    if (setViewPanelRef) {
+                        setViewPanelRef(panelRef);
+                    }
+                });
+            }
+        });
+}
+function getViewPanelGroupId(panelGroups, panelGroupItemId, panelRef) {
+    if (panelGroupItemId) {
+        return panelGroupItemId;
+    }
+    if (panelRef) {
+        return findPanelGroupItemIdOfPanelRef(panelGroups, panelRef);
+    }
+    return undefined;
+}
+// Find the PanelGroupItemId of a Panel from a PanelRef
+function findPanelGroupItemIdOfPanelRef(panelGroups, panelRef) {
+    for (const panelGroup of Object.values(panelGroups)){
+        const itemPanel = Object.entries(panelGroup.itemPanelKeys ?? []).find(([_, value])=>value === panelRef);
+        if (itemPanel) {
+            const [key] = itemPanel;
+            return {
+                panelGroupId: panelGroup.id,
+                panelGroupItemLayoutId: key
+            };
+        }
+    }
+    return undefined;
+}
+// Find the PanelRef from a PanelGroupItemId
+function findPanelRefOfPanelGroupItemId(panelGroups, panelGroupItemId) {
+    if (!panelGroupItemId) {
+        return undefined;
+    }
+    const panelGroup = panelGroups[panelGroupItemId.panelGroupId];
+    if (panelGroup) {
+        return panelGroup.itemPanelKeys[panelGroupItemId.panelGroupItemLayoutId];
+    }
+    return undefined;
+}

package/dist/cjs/context/DatasourceStoreProvider.js

@@ -27,9 +27,8 @@ const _pluginsystem = require("@perses-dev/plugin-system");
 function DatasourceStoreProvider(props) {
     const { projectName, datasourceApi, onCreate, children } = props;
     const [dashboardResource, setDashboardResource] = (0, _react.useState)(props.dashboardResource);
-    var _props_savedDatasources;
-    const [savedDatasources, setSavedDatasources] = (0, _react.useState)((_props_savedDatasources = props.savedDatasources) !== null && _props_savedDatasources !== void 0 ? _props_savedDatasources : {});
-    const project = projectName !== null && projectName !== void 0 ? projectName : dashboardResource === null || dashboardResource === void 0 ? void 0 : dashboardResource.metadata.project;
+    const [savedDatasources, setSavedDatasources] = (0, _react.useState)(props.savedDatasources ?? {});
+    const project = projectName ?? dashboardResource?.metadata.project;
     const { getPlugin, listPluginMetadata } = (0, _pluginsystem.usePluginRegistry)();
     const findDatasource = (0, _core.useEvent)(async (selector)=>{
         // Try to find it in dashboard spec
@@ -99,24 +98,26 @@ function DatasourceStoreProvider(props) {
         getPlugin,
         onCreate
     ]);
-    const listDatasourceSelectItems = (0, _core.useEvent)(async (datasourcePluginKind)=>{
+    const listDatasourceSelectItems = (0, _core.useEvent)(async (datasourcePluginName)=>{
         const [pluginMetadata, datasources, globalDatasources] = await Promise.all([
-            listPluginMetadata('Datasource'),
-            project ? datasourceApi.listDatasources(project, datasourcePluginKind) : [],
-            datasourceApi.listGlobalDatasources(datasourcePluginKind)
+            listPluginMetadata([
+                'Datasource'
+            ]),
+            project ? datasourceApi.listDatasources(project, datasourcePluginName) : [],
+            datasourceApi.listGlobalDatasources(datasourcePluginName)
         ]);
         // Find the metadata for the plugin type they asked for, so we can use it for the name of the default datasource
-        const datasourcePluginMetadata = pluginMetadata.find((metadata)=>metadata.kind === datasourcePluginKind);
+        const datasourcePluginMetadata = pluginMetadata.find((metadata)=>metadata.spec.name === datasourcePluginName);
         if (datasourcePluginMetadata === undefined) {
-            throw new Error(`Could not find a Datasource plugin with kind '${datasourcePluginKind}'`);
+            throw new Error(`Could not find a Datasource plugin with kind '${datasourcePluginName}'`);
         }
         // Get helper for computing results properly
-        const { results, addItem } = buildDatasourceSelectItemGroups(datasourcePluginMetadata.display.name);
+        const { results, addItem } = buildDatasourceSelectItemGroups(datasourcePluginMetadata.spec.display.name);
         // Start with dashboard datasources with the highest precedence
-        if (dashboardResource === null || dashboardResource === void 0 ? void 0 : dashboardResource.spec.datasources) {
+        if (dashboardResource?.spec.datasources) {
             for(const selectorName in dashboardResource.spec.datasources){
                 const spec = dashboardResource.spec.datasources[selectorName];
-                if (spec === undefined || spec.plugin.kind !== datasourcePluginKind) continue;
+                if (spec === undefined || spec.plugin.kind !== datasourcePluginName) continue;
                 const saved = selectorName in savedDatasources;
                 addItem({
                     spec,
@@ -149,8 +150,7 @@ function DatasourceStoreProvider(props) {
         return results;
     });
     const getLocalDatasources = (0, _react.useCallback)(()=>{
-        var _dashboardResource_spec_datasources;
-        return (_dashboardResource_spec_datasources = dashboardResource === null || dashboardResource === void 0 ? void 0 : dashboardResource.spec.datasources) !== null && _dashboardResource_spec_datasources !== void 0 ? _dashboardResource_spec_datasources : {};
+        return dashboardResource?.spec.datasources ?? {};
     }, [
         dashboardResource
     ]);
@@ -236,8 +236,7 @@ function findDashboardDatasource(dashboardDatasources, selector) {
     const groupIndices = {};
     let currentGroupIndex = 1; // 0 is the default group, always there as it contains at least the first item.
     const addItem = ({ spec, selectorName, selectorGroup: group, editLink, saved })=>{
-        var _spec_display;
-        group = group !== null && group !== void 0 ? group : '';
+        group = group ?? '';
         // Ensure the default group is always present as soon as an item is added.
         if (isFirst) {
             results.push({
@@ -245,9 +244,8 @@ function findDashboardDatasource(dashboardDatasources, selector) {
                 items: []
             });
         }
-        var _groupIndices_group;
         // Create the group if necessary
-        let selectItemGroup = results[(_groupIndices_group = groupIndices[group]) !== null && _groupIndices_group !== void 0 ? _groupIndices_group : -1];
+        let selectItemGroup = results[groupIndices[group] ?? -1];
         if (!selectItemGroup) {
             groupIndices[group] = currentGroupIndex;
             selectItemGroup = {
@@ -260,9 +258,8 @@ function findDashboardDatasource(dashboardDatasources, selector) {
         }
         // Add item to the group
         const isOverridden = usedNames.has(selectorName);
-        var _spec_display_name;
         selectItemGroup.items.push({
-            name: (_spec_display_name = (_spec_display = spec.display) === null || _spec_display === void 0 ? void 0 : _spec_display.name) !== null && _spec_display_name !== void 0 ? _spec_display_name : selectorName,
+            name: spec.display?.name ?? selectorName,
             overridden: isOverridden,
             saved,
             selector: {
@@ -291,9 +288,7 @@ function findDashboardDatasource(dashboardDatasources, selector) {
         // At the end, we make sure the overriding item(s) is well flagged so
         if (isOverridden) {
             for(let i = explicitDefaultAdded ? 1 : 0; i < currentGroupIndex; i++){
-                var _results_i;
-                var _results_i_items;
-                ((_results_i_items = (_results_i = results[i]) === null || _results_i === void 0 ? void 0 : _results_i.items) !== null && _results_i_items !== void 0 ? _results_i_items : []).filter((item)=>item.selector.name === selectorName).forEach((item)=>{
+                (results[i]?.items ?? []).filter((item)=>item.selector.name === selectorName).forEach((item)=>{
                     item.overriding = true;
                 });
             }