@perses-dev/dashboards 0.11.0 → 0.12.0

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

@@ -0,0 +1,32 @@
+// Copyright 2022 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.
+/**
+ * Curried function for creating the PanelSlice.
+ */ export function createPanelSlice(panels) {
+    return (set)=>({
+            panels,
+            previousPanels: panels,
+            resetPanels () {
+                set((state)=>{
+                    state.panels = state.previousPanels;
+                });
+            },
+            savePanels () {
+                set((state)=>{
+                    state.previousPanels = state.panels;
+                });
+            }
+        });
+}
+
+//# sourceMappingURL=panel-slice.js.map

package/dist/context/DashboardProvider/panel-slice.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/DashboardProvider/panel-slice.ts"],"sourcesContent":["// Copyright 2022 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 { PanelDefinition } from '@perses-dev/core';\nimport { StateCreator } from 'zustand';\nimport { Middleware } from './common';\n\n/**\n * Slice with the state of Panels, along with any actions that modify only the Panels state.\n */\nexport interface PanelSlice {\n  panels: Record<string, PanelDefinition>;\n  previousPanels: Record<string, PanelDefinition>;\n\n  /**\n   * Reset panels to previous state\n   */\n  resetPanels: () => void;\n\n  /**\n   * Save panels\n   */\n  savePanels: () => void;\n}\n\n/**\n * Curried function for creating the PanelSlice.\n */\nexport function createPanelSlice(panels: PanelSlice['panels']): StateCreator<PanelSlice, Middleware, [], PanelSlice> {\n  return (set) => ({\n    panels,\n    previousPanels: panels,\n\n    resetPanels() {\n      set((state) => {\n        state.panels = state.previousPanels;\n      });\n    },\n\n    savePanels() {\n      set((state) => {\n        state.previousPanels = state.panels;\n      });\n    },\n  });\n}\n"],"names":["createPanelSlice","panels","set","previousPanels","resetPanels","state","savePanels"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAwBjC;;CAEC,GACD,OAAO,SAASA,gBAAgB,CAACC,MAA4B,EAAwD;IACnH,OAAO,CAACC,GAAG,GAAM,CAAA;YACfD,MAAM;YACNE,cAAc,EAAEF,MAAM;YAEtBG,WAAW,IAAG;gBACZF,GAAG,CAAC,CAACG,KAAK,GAAK;oBACbA,KAAK,CAACJ,MAAM,GAAGI,KAAK,CAACF,cAAc,CAAC;gBACtC,CAAC,CAAC,CAAC;YACL,CAAC;YAEDG,UAAU,IAAG;gBACXJ,GAAG,CAAC,CAACG,KAAK,GAAK;oBACbA,KAAK,CAACF,cAAc,GAAGE,KAAK,CAACJ,MAAM,CAAC;gBACtC,CAAC,CAAC,CAAC;YACL,CAAC;SACF,CAAA,AAAC,CAAC;AACL,CAAC"}

package/dist/context/useDashboardSpec.d.ts

@@ -1,3 +1,11 @@
-import { DashboardSpec } from '@perses-dev/core';
-export declare function useDashboardSpec(): DashboardSpec;
+import { DashboardSpec, GridDefinition } from '@perses-dev/core';
+export declare function useDashboardSpec(): {
+    spec: {
+        panels: Record<string, import("@perses-dev/core").PanelDefinition<import("@perses-dev/core").UnknownSpec>>;
+        layouts: GridDefinition[];
+        variables: import("@perses-dev/core").VariableDefinition[];
+        duration: import("@perses-dev/core").DurationString;
+    };
+    resetSpec: (spec: DashboardSpec) => void;
+};
 //# sourceMappingURL=useDashboardSpec.d.ts.map

package/dist/context/useDashboardSpec.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDashboardSpec.d.ts","sourceRoot":"","sources":["../../src/context/useDashboardSpec.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,aAAa,EAAkB,MAAM,kBAAkB,CAAC;AAIjE,wBAAgB,gBAAgB,IAAI,aAAa,CAehD"}
+{"version":3,"file":"useDashboardSpec.d.ts","sourceRoot":"","sources":["../../src/context/useDashboardSpec.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAkB,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIjF,wBAAgB,gBAAgB;;;;;;;sBAyBL,aAAa;EAUvC"}

package/dist/context/useDashboardSpec.js

@@ -10,27 +10,44 @@
 // 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.
+import { createPanelRef } from '@perses-dev/core';
 import { useDashboardStore } from './DashboardProvider';
-import { useTemplateVariableDefinitions } from './TemplateVariableProvider';
+import { useTemplateVariableActions, useTemplateVariableDefinitions } from './TemplateVariableProvider';
 export function useDashboardSpec() {
-    const { panels , panelGroups , defaultTimeRange  } = useDashboardStore(({ panels , panelGroups , defaultTimeRange  })=>({
+    const { panels , panelGroups , panelGroupOrder , defaultTimeRange , reset: resetDashboardStore ,  } = useDashboardStore(({ panels , panelGroups , panelGroupOrder , defaultTimeRange , reset  })=>({
             panels,
             panelGroups,
-            defaultTimeRange
+            panelGroupOrder,
+            defaultTimeRange,
+            reset
         }));
+    const { setVariableDefinitions  } = useTemplateVariableActions();
     const variables = useTemplateVariableDefinitions();
-    const layouts = convertPanelGroupsToLayouts(panelGroups);
-    return {
+    const layouts = convertPanelGroupsToLayouts(panelGroups, panelGroupOrder);
+    const spec = {
         panels,
         layouts,
         variables,
         duration: defaultTimeRange.pastDuration
     };
+    const resetSpec = (spec)=>{
+        setVariableDefinitions(spec.variables);
+        // TODO: Should we call reset on the dashboard store with the spec?
+        resetDashboardStore();
+    };
+    return {
+        spec,
+        resetSpec
+    };
 }
-function convertPanelGroupsToLayouts(panelGroups) {
+function convertPanelGroupsToLayouts(panelGroups, panelGroupOrder) {
     const layouts = [];
-    Object.values(panelGroups).forEach((group)=>{
-        const { title , isCollapsed , items  } = group;
+    panelGroupOrder.map((groupOrderId)=>{
+        const group = panelGroups[groupOrderId];
+        if (group === undefined) {
+            throw new Error('panel group not found');
+        }
+        const { title , isCollapsed , itemLayouts , itemPanelKeys  } = group;
         let display = undefined;
         if (title) {
             display = {
@@ -44,7 +61,19 @@ function convertPanelGroupsToLayouts(panelGroups) {
             kind: 'Grid',
             spec: {
                 display,
-                items
+                items: itemLayouts.map((layout)=>{
+                    const panelKey = itemPanelKeys[layout.i];
+                    if (panelKey === undefined) {
+                        throw new Error(`Missing panel key of layout ${layout.i}`);
+                    }
+                    return {
+                        x: layout.x,
+                        y: layout.y,
+                        width: layout.w,
+                        height: layout.h,
+                        content: createPanelRef(panelKey)
+                    };
+                })
             }
         };
         layouts.push(layout);

package/dist/context/useDashboardSpec.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/context/useDashboardSpec.tsx"],"sourcesContent":["// Copyright 2022 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 { DashboardSpec, GridDefinition } from '@perses-dev/core';\nimport { PanelGroupDefinition, useDashboardStore } from './DashboardProvider';\nimport { useTemplateVariableDefinitions } from './TemplateVariableProvider';\n\nexport function useDashboardSpec(): DashboardSpec {\n  const { panels, panelGroups, defaultTimeRange } = useDashboardStore(({ panels, panelGroups, defaultTimeRange }) => ({\n    panels,\n    panelGroups,\n    defaultTimeRange,\n  }));\n  const variables = useTemplateVariableDefinitions();\n  const layouts = convertPanelGroupsToLayouts(panelGroups);\n\n  return {\n    panels,\n    layouts,\n    variables,\n    duration: defaultTimeRange.pastDuration,\n  };\n}\n\nfunction convertPanelGroupsToLayouts(panelGroups: Record<number, PanelGroupDefinition>): GridDefinition[] {\n  const layouts: GridDefinition[] = [];\n  Object.values(panelGroups).forEach((group) => {\n    const { title, isCollapsed, items } = group;\n    let display = undefined;\n    if (title) {\n      display = {\n        title,\n        collapse: {\n          open: !isCollapsed,\n        },\n      };\n    }\n    const layout: GridDefinition = {\n      kind: 'Grid',\n      spec: {\n        display,\n        items,\n      },\n    };\n    layouts.push(layout);\n  });\n  return layouts;\n}\n"],"names":["useDashboardStore","useTemplateVariableDefinitions","useDashboardSpec","panels","panelGroups","defaultTimeRange","variables","layouts","convertPanelGroupsToLayouts","duration","pastDuration","Object","values","forEach","group","title","isCollapsed","items","display","undefined","collapse","open","layout","kind","spec","push"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAGjC,SAA+BA,iBAAiB,QAAQ,qBAAqB,CAAC;AAC9E,SAASC,8BAA8B,QAAQ,4BAA4B,CAAC;AAE5E,OAAO,SAASC,gBAAgB,GAAkB;IAChD,MAAM,EAAEC,MAAM,CAAA,EAAEC,WAAW,CAAA,EAAEC,gBAAgB,CAAA,EAAE,GAAGL,iBAAiB,CAAC,CAAC,EAAEG,MAAM,CAAA,EAAEC,WAAW,CAAA,EAAEC,gBAAgB,CAAA,EAAE,GAAM,CAAA;YAClHF,MAAM;YACNC,WAAW;YACXC,gBAAgB;SACjB,CAAA,AAAC,CAAC,AAAC;IACJ,MAAMC,SAAS,GAAGL,8BAA8B,EAAE,AAAC;IACnD,MAAMM,OAAO,GAAGC,2BAA2B,CAACJ,WAAW,CAAC,AAAC;IAEzD,OAAO;QACLD,MAAM;QACNI,OAAO;QACPD,SAAS;QACTG,QAAQ,EAAEJ,gBAAgB,CAACK,YAAY;KACxC,CAAC;AACJ,CAAC;AAED,SAASF,2BAA2B,CAACJ,WAAiD,EAAoB;IACxG,MAAMG,OAAO,GAAqB,EAAE,AAAC;IACrCI,MAAM,CAACC,MAAM,CAACR,WAAW,CAAC,CAACS,OAAO,CAAC,CAACC,KAAK,GAAK;QAC5C,MAAM,EAAEC,KAAK,CAAA,EAAEC,WAAW,CAAA,EAAEC,KAAK,CAAA,EAAE,GAAGH,KAAK,AAAC;QAC5C,IAAII,OAAO,GAAGC,SAAS,AAAC;QACxB,IAAIJ,KAAK,EAAE;YACTG,OAAO,GAAG;gBACRH,KAAK;gBACLK,QAAQ,EAAE;oBACRC,IAAI,EAAE,CAACL,WAAW;iBACnB;aACF,CAAC;QACJ,CAAC;QACD,MAAMM,MAAM,GAAmB;YAC7BC,IAAI,EAAE,MAAM;YACZC,IAAI,EAAE;gBACJN,OAAO;gBACPD,KAAK;aACN;SACF,AAAC;QACFV,OAAO,CAACkB,IAAI,CAACH,MAAM,CAAC,CAAC;IACvB,CAAC,CAAC,CAAC;IACH,OAAOf,OAAO,CAAC;AACjB,CAAC"}
+{"version":3,"sources":["../../src/context/useDashboardSpec.tsx"],"sourcesContent":["// Copyright 2022 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 { createPanelRef, DashboardSpec, GridDefinition } from '@perses-dev/core';\nimport { PanelGroupDefinition, PanelGroupId, useDashboardStore } from './DashboardProvider';\nimport { useTemplateVariableActions, useTemplateVariableDefinitions } from './TemplateVariableProvider';\n\nexport function useDashboardSpec() {\n  const {\n    panels,\n    panelGroups,\n    panelGroupOrder,\n    defaultTimeRange,\n    reset: resetDashboardStore,\n  } = useDashboardStore(({ panels, panelGroups, panelGroupOrder, defaultTimeRange, reset }) => ({\n    panels,\n    panelGroups,\n    panelGroupOrder,\n    defaultTimeRange,\n    reset,\n  }));\n  const { setVariableDefinitions } = useTemplateVariableActions();\n  const variables = useTemplateVariableDefinitions();\n  const layouts = convertPanelGroupsToLayouts(panelGroups, panelGroupOrder);\n\n  const spec = {\n    panels,\n    layouts,\n    variables,\n    duration: defaultTimeRange.pastDuration,\n  };\n\n  const resetSpec = (spec: DashboardSpec) => {\n    setVariableDefinitions(spec.variables);\n    // TODO: Should we call reset on the dashboard store with the spec?\n    resetDashboardStore();\n  };\n\n  return {\n    spec,\n    resetSpec,\n  };\n}\n\nfunction convertPanelGroupsToLayouts(\n  panelGroups: Record<number, PanelGroupDefinition>,\n  panelGroupOrder: PanelGroupId[]\n): GridDefinition[] {\n  const layouts: GridDefinition[] = [];\n  panelGroupOrder.map((groupOrderId) => {\n    const group = panelGroups[groupOrderId];\n    if (group === undefined) {\n      throw new Error('panel group not found');\n    }\n    const { title, isCollapsed, itemLayouts, itemPanelKeys } = group;\n    let display = undefined;\n    if (title) {\n      display = {\n        title,\n        collapse: {\n          open: !isCollapsed,\n        },\n      };\n    }\n    const layout: GridDefinition = {\n      kind: 'Grid',\n      spec: {\n        display,\n        items: itemLayouts.map((layout) => {\n          const panelKey = itemPanelKeys[layout.i];\n          if (panelKey === undefined) {\n            throw new Error(`Missing panel key of layout ${layout.i}`);\n          }\n          return {\n            x: layout.x,\n            y: layout.y,\n            width: layout.w,\n            height: layout.h,\n            content: createPanelRef(panelKey),\n          };\n        }),\n      },\n    };\n    layouts.push(layout);\n  });\n\n  return layouts;\n}\n"],"names":["createPanelRef","useDashboardStore","useTemplateVariableActions","useTemplateVariableDefinitions","useDashboardSpec","panels","panelGroups","panelGroupOrder","defaultTimeRange","reset","resetDashboardStore","setVariableDefinitions","variables","layouts","convertPanelGroupsToLayouts","spec","duration","pastDuration","resetSpec","map","groupOrderId","group","undefined","Error","title","isCollapsed","itemLayouts","itemPanelKeys","display","collapse","open","layout","kind","items","panelKey","i","x","y","width","w","height","h","content","push"],"mappings":"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"}

package/dist/utils/time-range-params.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"time-range-params.d.ts","sourceRoot":"","sources":["../../src/utils/time-range-params.ts"],"names":[],"mappings":"AAcA,OAAO,EAAkB,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEpE,OAAO,EACL,cAAc,EAGd,cAAc,EAEf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAEtD,oBAAY,eAAe,GAAG,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,SAAS,CAAC;AA2BvE,wBAAgB,oBAAoB,CAAC,eAAe,EAAE,eAAe,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAWhG;AAGD,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,IAAI,GAAG,SAAS,GACtD,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,SAAS,CAI1C;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,gBAAgB,CAAC,eAAe,EAAE,eAAe,CAQ7E,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;CAGhC,CAAC;AAEF;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,iBAAiB,EAAE,cAAc,GAAG,cAAc,CAgBrF;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,gBAAgB,EAAE,cAAc,EAAE,aAAa,UAAO,GAAG,SAAS,CA8BvG"}
+{"version":3,"file":"time-range-params.d.ts","sourceRoot":"","sources":["../../src/utils/time-range-params.ts"],"names":[],"mappings":"AAcA,OAAO,EAAkB,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEpE,OAAO,EACL,cAAc,EAGd,cAAc,EAEf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAEtD,oBAAY,eAAe,GAAG,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,SAAS,CAAC;AA2BvE,wBAAgB,oBAAoB,CAAC,eAAe,EAAE,eAAe,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAWhG;AAGD,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,IAAI,GAAG,SAAS,GACtD,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,SAAS,CAI1C;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,gBAAgB,CAAC,eAAe,EAAE,eAAe,CAQ7E,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;CAGhC,CAAC;AAEF;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,iBAAiB,EAAE,cAAc,GAAG,cAAc,CAgBrF;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,gBAAgB,EAAE,cAAc,EAAE,aAAa,UAAO,GAAG,SAAS,CA+BvG"}

package/dist/utils/time-range-params.js

@@ -10,7 +10,7 @@
 // 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.
-import { useMemo, useCallback, useState } from 'react';
+import { useMemo, useCallback, useEffect, useState } from 'react';
 import { useQueryParams } from 'use-query-params';
 import { getUnixTime, isDate } from 'date-fns';
 import { isRelativeTimeRange, isDurationString } from '@perses-dev/core';
@@ -101,15 +101,21 @@ export const timeRangeQueryConfig = {
     // fallback when app does not want query string as source of truth
     const [timeRangeState, setTimeRangeState] = useState(initialTimeRange);
     const { start  } = query;
-    // set start param on page load if empty
-    if (paramsEnabled && !start) {
-        if (isRelativeTimeRange(initialTimeRange)) {
-            setQuery({
-                start: initialTimeRange.pastDuration,
-                end: undefined
-            });
+    useEffect(()=>{
+        if (paramsEnabled && !start) {
+            if (isRelativeTimeRange(initialTimeRange)) {
+                setQuery({
+                    start: initialTimeRange.pastDuration,
+                    end: undefined
+                });
+            }
         }
-    }
+    }, [
+        initialTimeRange,
+        paramsEnabled,
+        start,
+        setQuery
+    ]);
     const setTimeRange = useCallback((value)=>{
         if (isRelativeTimeRange(value)) {
             setQuery({

package/dist/utils/time-range-params.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/time-range-params.ts"],"sourcesContent":["// Copyright 2022 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 { useMemo, useCallback, useState } from 'react';\nimport { useQueryParams, QueryParamConfig } from 'use-query-params';\nimport { getUnixTime, isDate } from 'date-fns';\nimport {\n  TimeRangeValue,\n  isRelativeTimeRange,\n  isDurationString,\n  DurationString,\n  AbsoluteTimeRange,\n} from '@perses-dev/core';\nimport { TimeRange } from '@perses-dev/plugin-system';\n\nexport type TimeOptionValue = Date | DurationString | null | undefined;\n\n/* Interprets an encoded string and returns either the string or null/undefined if not available */\nfunction getEncodedValue(\n  input: string | Array<string | null> | null | undefined,\n  allowEmptyString?: boolean\n): string | null | undefined {\n  if (input == null) {\n    return input;\n  }\n  // '' or []\n  if (input.length === 0 && (!allowEmptyString || (allowEmptyString && input !== ''))) {\n    return null;\n  }\n\n  const str = input instanceof Array ? input[0] : input;\n  if (str == null) {\n    return str;\n  }\n  if (!allowEmptyString && str === '') {\n    return null;\n  }\n\n  return str;\n}\n\n/* Encodes individual TimeRangeValue as a string, depends on whether start is relative or absolute */\nexport function encodeTimeRangeValue(timeOptionValue: TimeOptionValue): string | null | undefined {\n  if (!timeOptionValue) {\n    return timeOptionValue;\n  }\n\n  if (typeof timeOptionValue === 'string') {\n    if (isDurationString(timeOptionValue)) {\n      return timeOptionValue;\n    }\n  }\n  return (getUnixTime(timeOptionValue) * 1000).toString();\n}\n\n/* Converts param input to supported relative or absolute time range format */\nexport function decodeTimeRangeValue(\n  input: string | Array<string | null> | null | undefined\n): Date | DurationString | null | undefined {\n  const paramString = getEncodedValue(input);\n  if (paramString == null) return paramString;\n  return isDurationString(paramString) ? paramString : new Date(Number(paramString));\n}\n\n/**\n * Custom TimeRangeValue param type\n * See: https://github.com/pbeshai/use-query-params/tree/master/packages/serialize-query-params#param-types\n */\nexport const TimeRangeParam: QueryParamConfig<TimeOptionValue, TimeOptionValue> = {\n  encode: encodeTimeRangeValue,\n  decode: decodeTimeRangeValue,\n  equals: (valueA: TimeOptionValue, valueB: TimeOptionValue) => {\n    if (valueA === valueB) return true;\n    if (valueA == null || valueB == null) return valueA === valueB;\n    return valueA.valueOf() === valueB.valueOf();\n  },\n};\n\nexport const timeRangeQueryConfig = {\n  start: TimeRangeParam,\n  end: TimeRangeParam,\n};\n\n/**\n * Gets the initial time range taking into account URL params and dashboard JSON duration\n * Sets start query param if it is empty on page load\n */\nexport function useInitialTimeRange(dashboardDuration: DurationString): TimeRangeValue {\n  const [query] = useQueryParams(timeRangeQueryConfig);\n  const { start, end } = query;\n  return useMemo(() => {\n    let initialTimeRange: TimeRangeValue = { pastDuration: dashboardDuration };\n    if (!start) {\n      return initialTimeRange;\n    }\n    const startStr = start.toString();\n    if (isDurationString(startStr)) {\n      initialTimeRange = { pastDuration: startStr };\n    } else if (isDate(start) && isDate(end)) {\n      initialTimeRange = { start: start, end: end } as AbsoluteTimeRange;\n    }\n    return initialTimeRange;\n  }, [start, end, dashboardDuration]);\n}\n\n/**\n * Returns time range getter and setter, set paramsEnabled to false to disable query string serialization\n */\nexport function useSetTimeRangeParams(initialTimeRange: TimeRangeValue, paramsEnabled = true): TimeRange {\n  const [query, setQuery] = useQueryParams(timeRangeQueryConfig);\n\n  // fallback when app does not want query string as source of truth\n  const [timeRangeState, setTimeRangeState] = useState<TimeRangeValue>(initialTimeRange);\n\n  const { start } = query;\n\n  // set start param on page load if empty\n  if (paramsEnabled && !start) {\n    if (isRelativeTimeRange(initialTimeRange)) {\n      setQuery({ start: initialTimeRange.pastDuration, end: undefined });\n    }\n  }\n\n  const setTimeRange: TimeRange['setTimeRange'] = useCallback(\n    (value: TimeRangeValue) => {\n      if (isRelativeTimeRange(value)) {\n        setQuery({ start: value.pastDuration, end: undefined });\n      } else {\n        setQuery(value);\n      }\n    },\n    [setQuery]\n  );\n\n  if (!paramsEnabled) {\n    return { timeRange: timeRangeState, setTimeRange: setTimeRangeState };\n  }\n  return { timeRange: initialTimeRange, setTimeRange: setTimeRange };\n}\n"],"names":["useMemo","useCallback","useState","useQueryParams","getUnixTime","isDate","isRelativeTimeRange","isDurationString","getEncodedValue","input","allowEmptyString","length","str","Array","encodeTimeRangeValue","timeOptionValue","toString","decodeTimeRangeValue","paramString","Date","Number","TimeRangeParam","encode","decode","equals","valueA","valueB","valueOf","timeRangeQueryConfig","start","end","useInitialTimeRange","dashboardDuration","query","initialTimeRange","pastDuration","startStr","useSetTimeRangeParams","paramsEnabled","setQuery","timeRangeState","setTimeRangeState","undefined","setTimeRange","value","timeRange"],"mappings":"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"}
+{"version":3,"sources":["../../src/utils/time-range-params.ts"],"sourcesContent":["// Copyright 2022 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 { useMemo, useCallback, useEffect, useState } from 'react';\nimport { useQueryParams, QueryParamConfig } from 'use-query-params';\nimport { getUnixTime, isDate } from 'date-fns';\nimport {\n  TimeRangeValue,\n  isRelativeTimeRange,\n  isDurationString,\n  DurationString,\n  AbsoluteTimeRange,\n} from '@perses-dev/core';\nimport { TimeRange } from '@perses-dev/plugin-system';\n\nexport type TimeOptionValue = Date | DurationString | null | undefined;\n\n/* Interprets an encoded string and returns either the string or null/undefined if not available */\nfunction getEncodedValue(\n  input: string | Array<string | null> | null | undefined,\n  allowEmptyString?: boolean\n): string | null | undefined {\n  if (input == null) {\n    return input;\n  }\n  // '' or []\n  if (input.length === 0 && (!allowEmptyString || (allowEmptyString && input !== ''))) {\n    return null;\n  }\n\n  const str = input instanceof Array ? input[0] : input;\n  if (str == null) {\n    return str;\n  }\n  if (!allowEmptyString && str === '') {\n    return null;\n  }\n\n  return str;\n}\n\n/* Encodes individual TimeRangeValue as a string, depends on whether start is relative or absolute */\nexport function encodeTimeRangeValue(timeOptionValue: TimeOptionValue): string | null | undefined {\n  if (!timeOptionValue) {\n    return timeOptionValue;\n  }\n\n  if (typeof timeOptionValue === 'string') {\n    if (isDurationString(timeOptionValue)) {\n      return timeOptionValue;\n    }\n  }\n  return (getUnixTime(timeOptionValue) * 1000).toString();\n}\n\n/* Converts param input to supported relative or absolute time range format */\nexport function decodeTimeRangeValue(\n  input: string | Array<string | null> | null | undefined\n): Date | DurationString | null | undefined {\n  const paramString = getEncodedValue(input);\n  if (paramString == null) return paramString;\n  return isDurationString(paramString) ? paramString : new Date(Number(paramString));\n}\n\n/**\n * Custom TimeRangeValue param type\n * See: https://github.com/pbeshai/use-query-params/tree/master/packages/serialize-query-params#param-types\n */\nexport const TimeRangeParam: QueryParamConfig<TimeOptionValue, TimeOptionValue> = {\n  encode: encodeTimeRangeValue,\n  decode: decodeTimeRangeValue,\n  equals: (valueA: TimeOptionValue, valueB: TimeOptionValue) => {\n    if (valueA === valueB) return true;\n    if (valueA == null || valueB == null) return valueA === valueB;\n    return valueA.valueOf() === valueB.valueOf();\n  },\n};\n\nexport const timeRangeQueryConfig = {\n  start: TimeRangeParam,\n  end: TimeRangeParam,\n};\n\n/**\n * Gets the initial time range taking into account URL params and dashboard JSON duration\n * Sets start query param if it is empty on page load\n */\nexport function useInitialTimeRange(dashboardDuration: DurationString): TimeRangeValue {\n  const [query] = useQueryParams(timeRangeQueryConfig);\n  const { start, end } = query;\n  return useMemo(() => {\n    let initialTimeRange: TimeRangeValue = { pastDuration: dashboardDuration };\n    if (!start) {\n      return initialTimeRange;\n    }\n    const startStr = start.toString();\n    if (isDurationString(startStr)) {\n      initialTimeRange = { pastDuration: startStr };\n    } else if (isDate(start) && isDate(end)) {\n      initialTimeRange = { start: start, end: end } as AbsoluteTimeRange;\n    }\n    return initialTimeRange;\n  }, [start, end, dashboardDuration]);\n}\n\n/**\n * Returns time range getter and setter, set paramsEnabled to false to disable query string serialization\n */\nexport function useSetTimeRangeParams(initialTimeRange: TimeRangeValue, paramsEnabled = true): TimeRange {\n  const [query, setQuery] = useQueryParams(timeRangeQueryConfig);\n\n  // fallback when app does not want query string as source of truth\n  const [timeRangeState, setTimeRangeState] = useState<TimeRangeValue>(initialTimeRange);\n\n  const { start } = query;\n\n  useEffect(() => {\n    if (paramsEnabled && !start) {\n      if (isRelativeTimeRange(initialTimeRange)) {\n        setQuery({ start: initialTimeRange.pastDuration, end: undefined });\n      }\n    }\n  }, [initialTimeRange, paramsEnabled, start, setQuery]);\n\n  const setTimeRange: TimeRange['setTimeRange'] = useCallback(\n    (value: TimeRangeValue) => {\n      if (isRelativeTimeRange(value)) {\n        setQuery({ start: value.pastDuration, end: undefined });\n      } else {\n        setQuery(value);\n      }\n    },\n    [setQuery]\n  );\n\n  if (!paramsEnabled) {\n    return { timeRange: timeRangeState, setTimeRange: setTimeRangeState };\n  }\n  return { timeRange: initialTimeRange, setTimeRange: setTimeRange };\n}\n"],"names":["useMemo","useCallback","useEffect","useState","useQueryParams","getUnixTime","isDate","isRelativeTimeRange","isDurationString","getEncodedValue","input","allowEmptyString","length","str","Array","encodeTimeRangeValue","timeOptionValue","toString","decodeTimeRangeValue","paramString","Date","Number","TimeRangeParam","encode","decode","equals","valueA","valueB","valueOf","timeRangeQueryConfig","start","end","useInitialTimeRange","dashboardDuration","query","initialTimeRange","pastDuration","startStr","useSetTimeRangeParams","paramsEnabled","setQuery","timeRangeState","setTimeRangeState","undefined","setTimeRange","value","timeRange"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,OAAO,EAAEC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AAClE,SAASC,cAAc,QAA0B,kBAAkB,CAAC;AACpE,SAASC,WAAW,EAAEC,MAAM,QAAQ,UAAU,CAAC;AAC/C,SAEEC,mBAAmB,EACnBC,gBAAgB,QAGX,kBAAkB,CAAC;AAK1B,iGAAiG,GACjG,SAASC,eAAe,CACtBC,KAAuD,EACvDC,gBAA0B,EACC;IAC3B,IAAID,KAAK,IAAI,IAAI,EAAE;QACjB,OAAOA,KAAK,CAAC;IACf,CAAC;IACD,WAAW;IACX,IAAIA,KAAK,CAACE,MAAM,KAAK,CAAC,IAAK,CAAA,CAACD,gBAAgB,IAAKA,gBAAgB,IAAID,KAAK,KAAK,EAAE,AAAC,CAAA,AAAC,EAAE;QACnF,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAMG,GAAG,GAAGH,KAAK,YAAYI,KAAK,GAAGJ,KAAK,CAAC,CAAC,CAAC,GAAGA,KAAK,AAAC;IACtD,IAAIG,GAAG,IAAI,IAAI,EAAE;QACf,OAAOA,GAAG,CAAC;IACb,CAAC;IACD,IAAI,CAACF,gBAAgB,IAAIE,GAAG,KAAK,EAAE,EAAE;QACnC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAOA,GAAG,CAAC;AACb,CAAC;AAED,mGAAmG,GACnG,OAAO,SAASE,oBAAoB,CAACC,eAAgC,EAA6B;IAChG,IAAI,CAACA,eAAe,EAAE;QACpB,OAAOA,eAAe,CAAC;IACzB,CAAC;IAED,IAAI,OAAOA,eAAe,KAAK,QAAQ,EAAE;QACvC,IAAIR,gBAAgB,CAACQ,eAAe,CAAC,EAAE;YACrC,OAAOA,eAAe,CAAC;QACzB,CAAC;IACH,CAAC;IACD,OAAO,AAACX,CAAAA,WAAW,CAACW,eAAe,CAAC,GAAG,IAAI,CAAA,CAAEC,QAAQ,EAAE,CAAC;AAC1D,CAAC;AAED,4EAA4E,GAC5E,OAAO,SAASC,oBAAoB,CAClCR,KAAuD,EACb;IAC1C,MAAMS,WAAW,GAAGV,eAAe,CAACC,KAAK,CAAC,AAAC;IAC3C,IAAIS,WAAW,IAAI,IAAI,EAAE,OAAOA,WAAW,CAAC;IAC5C,OAAOX,gBAAgB,CAACW,WAAW,CAAC,GAAGA,WAAW,GAAG,IAAIC,IAAI,CAACC,MAAM,CAACF,WAAW,CAAC,CAAC,CAAC;AACrF,CAAC;AAED;;;CAGC,GACD,OAAO,MAAMG,cAAc,GAAuD;IAChFC,MAAM,EAAER,oBAAoB;IAC5BS,MAAM,EAAEN,oBAAoB;IAC5BO,MAAM,EAAE,CAACC,MAAuB,EAAEC,MAAuB,GAAK;QAC5D,IAAID,MAAM,KAAKC,MAAM,EAAE,OAAO,IAAI,CAAC;QACnC,IAAID,MAAM,IAAI,IAAI,IAAIC,MAAM,IAAI,IAAI,EAAE,OAAOD,MAAM,KAAKC,MAAM,CAAC;QAC/D,OAAOD,MAAM,CAACE,OAAO,EAAE,KAAKD,MAAM,CAACC,OAAO,EAAE,CAAC;IAC/C,CAAC;CACF,CAAC;AAEF,OAAO,MAAMC,oBAAoB,GAAG;IAClCC,KAAK,EAAER,cAAc;IACrBS,GAAG,EAAET,cAAc;CACpB,CAAC;AAEF;;;CAGC,GACD,OAAO,SAASU,mBAAmB,CAACC,iBAAiC,EAAkB;IACrF,MAAM,CAACC,KAAK,CAAC,GAAG9B,cAAc,CAACyB,oBAAoB,CAAC,AAAC;IACrD,MAAM,EAAEC,KAAK,CAAA,EAAEC,GAAG,CAAA,EAAE,GAAGG,KAAK,AAAC;IAC7B,OAAOlC,OAAO,CAAC,IAAM;QACnB,IAAImC,gBAAgB,GAAmB;YAAEC,YAAY,EAAEH,iBAAiB;SAAE,AAAC;QAC3E,IAAI,CAACH,KAAK,EAAE;YACV,OAAOK,gBAAgB,CAAC;QAC1B,CAAC;QACD,MAAME,QAAQ,GAAGP,KAAK,CAACb,QAAQ,EAAE,AAAC;QAClC,IAAIT,gBAAgB,CAAC6B,QAAQ,CAAC,EAAE;YAC9BF,gBAAgB,GAAG;gBAAEC,YAAY,EAAEC,QAAQ;aAAE,CAAC;QAChD,OAAO,IAAI/B,MAAM,CAACwB,KAAK,CAAC,IAAIxB,MAAM,CAACyB,GAAG,CAAC,EAAE;YACvCI,gBAAgB,GAAG;gBAAEL,KAAK,EAAEA,KAAK;gBAAEC,GAAG,EAAEA,GAAG;aAAE,AAAqB,CAAC;QACrE,CAAC;QACD,OAAOI,gBAAgB,CAAC;IAC1B,CAAC,EAAE;QAACL,KAAK;QAAEC,GAAG;QAAEE,iBAAiB;KAAC,CAAC,CAAC;AACtC,CAAC;AAED;;CAEC,GACD,OAAO,SAASK,qBAAqB,CAACH,gBAAgC,EAAEI,aAAa,GAAG,IAAI,EAAa;IACvG,MAAM,CAACL,KAAK,EAAEM,QAAQ,CAAC,GAAGpC,cAAc,CAACyB,oBAAoB,CAAC,AAAC;IAE/D,kEAAkE;IAClE,MAAM,CAACY,cAAc,EAAEC,iBAAiB,CAAC,GAAGvC,QAAQ,CAAiBgC,gBAAgB,CAAC,AAAC;IAEvF,MAAM,EAAEL,KAAK,CAAA,EAAE,GAAGI,KAAK,AAAC;IAExBhC,SAAS,CAAC,IAAM;QACd,IAAIqC,aAAa,IAAI,CAACT,KAAK,EAAE;YAC3B,IAAIvB,mBAAmB,CAAC4B,gBAAgB,CAAC,EAAE;gBACzCK,QAAQ,CAAC;oBAAEV,KAAK,EAAEK,gBAAgB,CAACC,YAAY;oBAAEL,GAAG,EAAEY,SAAS;iBAAE,CAAC,CAAC;YACrE,CAAC;QACH,CAAC;IACH,CAAC,EAAE;QAACR,gBAAgB;QAAEI,aAAa;QAAET,KAAK;QAAEU,QAAQ;KAAC,CAAC,CAAC;IAEvD,MAAMI,YAAY,GAA8B3C,WAAW,CACzD,CAAC4C,KAAqB,GAAK;QACzB,IAAItC,mBAAmB,CAACsC,KAAK,CAAC,EAAE;YAC9BL,QAAQ,CAAC;gBAAEV,KAAK,EAAEe,KAAK,CAACT,YAAY;gBAAEL,GAAG,EAAEY,SAAS;aAAE,CAAC,CAAC;QAC1D,OAAO;YACLH,QAAQ,CAACK,KAAK,CAAC,CAAC;QAClB,CAAC;IACH,CAAC,EACD;QAACL,QAAQ;KAAC,CACX,AAAC;IAEF,IAAI,CAACD,aAAa,EAAE;QAClB,OAAO;YAAEO,SAAS,EAAEL,cAAc;YAAEG,YAAY,EAAEF,iBAAiB;SAAE,CAAC;IACxE,CAAC;IACD,OAAO;QAAEI,SAAS,EAAEX,gBAAgB;QAAES,YAAY,EAAEA,YAAY;KAAE,CAAC;AACrE,CAAC"}

package/dist/views/ViewDashboard/DashboardApp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardApp.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAKrD,MAAM,WAAW,iBAAiB;IAChC,iBAAiB,EAAE,iBAAiB,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,UAAW,iBAAiB,gBAyBpD,CAAC"}
+{"version":3,"file":"DashboardApp.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAKrD,MAAM,WAAW,iBAAiB;IAChC,iBAAiB,EAAE,iBAAiB,CAAC;CACtC;AAED,eAAO,MAAM,YAAY,UAAW,iBAAiB,gBAwBpD,CAAC"}

package/dist/views/ViewDashboard/DashboardApp.js

@@ -20,7 +20,6 @@ export const DashboardApp = (props)=>{
     const { dashboardResource  } = props;
     return /*#__PURE__*/ _jsxs(Box, {
         sx: {
-            padding: (theme)=>theme.spacing(1, 0),
             flexGrow: 1,
             overflowX: 'hidden',
             overflowY: 'auto',

package/dist/views/ViewDashboard/DashboardApp.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"sourcesContent":["// Copyright 2022 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 { Box } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport { DashboardResource } from '@perses-dev/core';\nimport { PanelDrawer, Dashboard, PanelGroupDialog, DeletePanelGroupDialog } from '../../components';\nimport { DashboardToolbar } from '../../components/DashboardToolbar';\nimport DeletePanelDialog from '../../components/Panel/DeletePanelDialog';\n\nexport interface DashboardAppProps {\n  dashboardResource: DashboardResource;\n}\n\nexport const DashboardApp = (props: DashboardAppProps) => {\n  const { dashboardResource } = props;\n  return (\n    <Box\n      sx={{\n        padding: (theme) => theme.spacing(1, 0),\n        flexGrow: 1,\n        overflowX: 'hidden',\n        overflowY: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n      }}\n    >\n      <DashboardToolbar dashboardName={dashboardResource.metadata.name} />\n      <Box sx={{ padding: (theme) => theme.spacing(2) }}>\n        <ErrorBoundary FallbackComponent={ErrorAlert}>\n          <Dashboard />\n        </ErrorBoundary>\n        <PanelDrawer />\n        <PanelGroupDialog />\n        <DeletePanelGroupDialog />\n        <DeletePanelDialog />\n      </Box>\n    </Box>\n  );\n};\n"],"names":["Box","ErrorAlert","ErrorBoundary","PanelDrawer","Dashboard","PanelGroupDialog","DeletePanelGroupDialog","DashboardToolbar","DeletePanelDialog","DashboardApp","props","dashboardResource","sx","padding","theme","spacing","flexGrow","overflowX","overflowY","display","flexDirection","dashboardName","metadata","name","FallbackComponent"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,QAAQ,eAAe,CAAC;AACpC,SAASC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB,CAAC;AAEnE,SAASC,WAAW,EAAEC,SAAS,EAAEC,gBAAgB,EAAEC,sBAAsB,QAAQ,kBAAkB,CAAC;AACpG,SAASC,gBAAgB,QAAQ,mCAAmC,CAAC;AACrE,OAAOC,iBAAiB,MAAM,0CAA0C,CAAC;AAMzE,OAAO,MAAMC,YAAY,GAAG,CAACC,KAAwB,GAAK;IACxD,MAAM,EAAEC,iBAAiB,CAAA,EAAE,GAAGD,KAAK,AAAC;IACpC,qBACE,MAACV,GAAG;QACFY,EAAE,EAAE;YACFC,OAAO,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;YACvCC,QAAQ,EAAE,CAAC;YACXC,SAAS,EAAE,QAAQ;YACnBC,SAAS,EAAE,MAAM;YACjBC,OAAO,EAAE,MAAM;YACfC,aAAa,EAAE,QAAQ;SACxB;;0BAED,KAACb,gBAAgB;gBAACc,aAAa,EAAEV,iBAAiB,CAACW,QAAQ,CAACC,IAAI;cAAI;0BACpE,MAACvB,GAAG;gBAACY,EAAE,EAAE;oBAAEC,OAAO,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,CAAC;iBAAE;;kCAC/C,KAACb,aAAa;wBAACsB,iBAAiB,EAAEvB,UAAU;kCAC1C,cAAA,KAACG,SAAS,KAAG;sBACC;kCAChB,KAACD,WAAW,KAAG;kCACf,KAACE,gBAAgB,KAAG;kCACpB,KAACC,sBAAsB,KAAG;kCAC1B,KAACE,iBAAiB,KAAG;;cACjB;;MACF,CACN;AACJ,CAAC,CAAC"}
+{"version":3,"sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"sourcesContent":["// Copyright 2022 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 { Box } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport { DashboardResource } from '@perses-dev/core';\nimport { PanelDrawer, Dashboard, PanelGroupDialog, DeletePanelGroupDialog } from '../../components';\nimport { DashboardToolbar } from '../../components/DashboardToolbar';\nimport DeletePanelDialog from '../../components/Panel/DeletePanelDialog';\n\nexport interface DashboardAppProps {\n  dashboardResource: DashboardResource;\n}\n\nexport const DashboardApp = (props: DashboardAppProps) => {\n  const { dashboardResource } = props;\n  return (\n    <Box\n      sx={{\n        flexGrow: 1,\n        overflowX: 'hidden',\n        overflowY: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n      }}\n    >\n      <DashboardToolbar dashboardName={dashboardResource.metadata.name} />\n      <Box sx={{ padding: (theme) => theme.spacing(2) }}>\n        <ErrorBoundary FallbackComponent={ErrorAlert}>\n          <Dashboard />\n        </ErrorBoundary>\n        <PanelDrawer />\n        <PanelGroupDialog />\n        <DeletePanelGroupDialog />\n        <DeletePanelDialog />\n      </Box>\n    </Box>\n  );\n};\n"],"names":["Box","ErrorAlert","ErrorBoundary","PanelDrawer","Dashboard","PanelGroupDialog","DeletePanelGroupDialog","DashboardToolbar","DeletePanelDialog","DashboardApp","props","dashboardResource","sx","flexGrow","overflowX","overflowY","display","flexDirection","dashboardName","metadata","name","padding","theme","spacing","FallbackComponent"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,QAAQ,eAAe,CAAC;AACpC,SAASC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB,CAAC;AAEnE,SAASC,WAAW,EAAEC,SAAS,EAAEC,gBAAgB,EAAEC,sBAAsB,QAAQ,kBAAkB,CAAC;AACpG,SAASC,gBAAgB,QAAQ,mCAAmC,CAAC;AACrE,OAAOC,iBAAiB,MAAM,0CAA0C,CAAC;AAMzE,OAAO,MAAMC,YAAY,GAAG,CAACC,KAAwB,GAAK;IACxD,MAAM,EAAEC,iBAAiB,CAAA,EAAE,GAAGD,KAAK,AAAC;IACpC,qBACE,MAACV,GAAG;QACFY,EAAE,EAAE;YACFC,QAAQ,EAAE,CAAC;YACXC,SAAS,EAAE,QAAQ;YACnBC,SAAS,EAAE,MAAM;YACjBC,OAAO,EAAE,MAAM;YACfC,aAAa,EAAE,QAAQ;SACxB;;0BAED,KAACV,gBAAgB;gBAACW,aAAa,EAAEP,iBAAiB,CAACQ,QAAQ,CAACC,IAAI;cAAI;0BACpE,MAACpB,GAAG;gBAACY,EAAE,EAAE;oBAAES,OAAO,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,CAAC;iBAAE;;kCAC/C,KAACrB,aAAa;wBAACsB,iBAAiB,EAAEvB,UAAU;kCAC1C,cAAA,KAACG,SAAS,KAAG;sBACC;kCAChB,KAACD,WAAW,KAAG;kCACf,KAACE,gBAAgB,KAAG;kCACpB,KAACC,sBAAsB,KAAG;kCAC1B,KAACE,iBAAiB,KAAG;;cACjB;;MACF,CACN;AACJ,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/dashboards",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "The dashboards feature in Perses",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -27,9 +27,9 @@
     "lint:fix": "eslint --fix src --ext .ts,.tsx"
   },
   "dependencies": {
-    "@perses-dev/components": "^0.11.0",
-    "@perses-dev/core": "^0.11.0",
-    "@perses-dev/plugin-system": "^0.11.0",
+    "@perses-dev/components": "^0.12.0",
+    "@perses-dev/core": "^0.12.0",
+    "@perses-dev/plugin-system": "^0.12.0",
     "@types/react-grid-layout": "^1.3.2",
     "date-fns": "^2.28.0",
     "immer": "^9.0.15",