@perses-dev/dashboards 0.10.0 → 0.12.0

package/dist/test/render.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { RenderOptions } from '@testing-library/react';
+import { MemoryHistory } from 'history';
 /**
  * Test helper to render a React component with some common app-level providers wrapped around it.
  */
-export declare function renderWithContext(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries'>): import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;
+export declare function renderWithContext(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries'>, history?: MemoryHistory): import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;
 //# sourceMappingURL=render.d.ts.map

package/dist/test/render.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/test/render.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAU,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAG/D;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,EAAE,KAAK,CAAC,YAAY,EAAE,OAAO,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC,gIAIjG"}
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/test/render.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAU,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAE/D,OAAO,EAAuB,aAAa,EAAE,MAAM,SAAS,CAAC;AAM7D;;GAEG;AACH,wBAAgB,iBAAiB,CAC/B,EAAE,EAAE,KAAK,CAAC,YAAY,EACtB,OAAO,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC,EACxC,OAAO,CAAC,EAAE,aAAa,gIAsBxB"}

package/dist/test/render.js

@@ -12,10 +12,15 @@
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
 import { render } from '@testing-library/react';
+import { unstable_HistoryRouter } from 'react-router-dom';
+import { createMemoryHistory } from 'history';
+import { QueryParamProvider } from 'use-query-params';
+import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ChartsThemeProvider, testChartsTheme } from '@perses-dev/components';
 /**
  * Test helper to render a React component with some common app-level providers wrapped around it.
- */ export function renderWithContext(ui, options) {
+ */ export function renderWithContext(ui, options, history) {
     // Create a new QueryClient for each test to avoid caching issues
     const queryClient = new QueryClient({
         defaultOptions: {
@@ -25,10 +30,25 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
             }
         }
     });
-    return render(/*#__PURE__*/ _jsx(QueryClientProvider, {
-        client: queryClient,
-        children: ui
-    }), options);
+    const BaseRender = ()=>{
+        const HistoryRouter = unstable_HistoryRouter;
+        history = history !== null && history !== void 0 ? history : createMemoryHistory();
+        return /*#__PURE__*/ _jsx(HistoryRouter, {
+            history: history,
+            children: /*#__PURE__*/ _jsx(QueryClientProvider, {
+                client: queryClient,
+                children: /*#__PURE__*/ _jsx(QueryParamProvider, {
+                    adapter: ReactRouter6Adapter,
+                    children: /*#__PURE__*/ _jsx(ChartsThemeProvider, {
+                        themeName: "perses",
+                        chartsTheme: testChartsTheme,
+                        children: ui
+                    })
+                })
+            })
+        });
+    };
+    return render(/*#__PURE__*/ _jsx(BaseRender, {}), options);
 }
 
 //# sourceMappingURL=render.js.map

package/dist/test/render.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/test/render.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 { render, RenderOptions } from '@testing-library/react';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\n\n/**\n * Test helper to render a React component with some common app-level providers wrapped around it.\n */\nexport function renderWithContext(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries'>) {\n  // Create a new QueryClient for each test to avoid caching issues\n  const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } });\n  return render(<QueryClientProvider client={queryClient}>{ui}</QueryClientProvider>, options);\n}\n"],"names":["render","QueryClient","QueryClientProvider","renderWithContext","ui","options","queryClient","defaultOptions","queries","refetchOnWindowFocus","retry","client"],"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,MAAM,QAAuB,wBAAwB,CAAC;AAC/D,SAASC,WAAW,EAAEC,mBAAmB,QAAQ,uBAAuB,CAAC;AAEzE;;CAEC,GACD,OAAO,SAASC,iBAAiB,CAACC,EAAsB,EAAEC,OAAwC,EAAE;IAClG,iEAAiE;IACjE,MAAMC,WAAW,GAAG,IAAIL,WAAW,CAAC;QAAEM,cAAc,EAAE;YAAEC,OAAO,EAAE;gBAAEC,oBAAoB,EAAE,KAAK;gBAAEC,KAAK,EAAE,KAAK;aAAE;SAAE;KAAE,CAAC,AAAC;IACpH,OAAOV,MAAM,eAAC,KAACE,mBAAmB;QAACS,MAAM,EAAEL,WAAW;kBAAGF,EAAE;MAAuB,EAAEC,OAAO,CAAC,CAAC;AAC/F,CAAC"}
+{"version":3,"sources":["../../src/test/render.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 { render, RenderOptions } from '@testing-library/react';\nimport { unstable_HistoryRouter } from 'react-router-dom';\nimport { createMemoryHistory, MemoryHistory } from 'history';\nimport { QueryParamProvider } from 'use-query-params';\nimport { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { ChartsThemeProvider, testChartsTheme } from '@perses-dev/components';\n\n/**\n * Test helper to render a React component with some common app-level providers wrapped around it.\n */\nexport function renderWithContext(\n  ui: React.ReactElement,\n  options?: Omit<RenderOptions, 'queries'>,\n  history?: MemoryHistory\n) {\n  // Create a new QueryClient for each test to avoid caching issues\n  const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } });\n\n  const BaseRender = () => {\n    const HistoryRouter = unstable_HistoryRouter;\n    history = history ?? createMemoryHistory();\n    return (\n      <HistoryRouter history={history}>\n        <QueryClientProvider client={queryClient}>\n          <QueryParamProvider adapter={ReactRouter6Adapter}>\n            <ChartsThemeProvider themeName=\"perses\" chartsTheme={testChartsTheme}>\n              {ui}\n            </ChartsThemeProvider>\n          </QueryParamProvider>\n        </QueryClientProvider>\n      </HistoryRouter>\n    );\n  };\n\n  return render(<BaseRender />, options);\n}\n"],"names":["render","unstable_HistoryRouter","createMemoryHistory","QueryParamProvider","ReactRouter6Adapter","QueryClient","QueryClientProvider","ChartsThemeProvider","testChartsTheme","renderWithContext","ui","options","history","queryClient","defaultOptions","queries","refetchOnWindowFocus","retry","BaseRender","HistoryRouter","client","adapter","themeName","chartsTheme"],"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,MAAM,QAAuB,wBAAwB,CAAC;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB,CAAC;AAC1D,SAASC,mBAAmB,QAAuB,SAAS,CAAC;AAC7D,SAASC,kBAAkB,QAAQ,kBAAkB,CAAC;AACtD,SAASC,mBAAmB,QAAQ,0CAA0C,CAAC;AAC/E,SAASC,WAAW,EAAEC,mBAAmB,QAAQ,uBAAuB,CAAC;AACzE,SAASC,mBAAmB,EAAEC,eAAe,QAAQ,wBAAwB,CAAC;AAE9E;;CAEC,GACD,OAAO,SAASC,iBAAiB,CAC/BC,EAAsB,EACtBC,OAAwC,EACxCC,OAAuB,EACvB;IACA,iEAAiE;IACjE,MAAMC,WAAW,GAAG,IAAIR,WAAW,CAAC;QAAES,cAAc,EAAE;YAAEC,OAAO,EAAE;gBAAEC,oBAAoB,EAAE,KAAK;gBAAEC,KAAK,EAAE,KAAK;aAAE;SAAE;KAAE,CAAC,AAAC;IAEpH,MAAMC,UAAU,GAAG,IAAM;QACvB,MAAMC,aAAa,GAAGlB,sBAAsB,AAAC;QAC7CW,OAAO,GAAGA,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIV,mBAAmB,EAAE,CAAC;QAC3C,qBACE,KAACiB,aAAa;YAACP,OAAO,EAAEA,OAAO;sBAC7B,cAAA,KAACN,mBAAmB;gBAACc,MAAM,EAAEP,WAAW;0BACtC,cAAA,KAACV,kBAAkB;oBAACkB,OAAO,EAAEjB,mBAAmB;8BAC9C,cAAA,KAACG,mBAAmB;wBAACe,SAAS,EAAC,QAAQ;wBAACC,WAAW,EAAEf,eAAe;kCACjEE,EAAE;sBACiB;kBACH;cACD;UACR,CAChB;IACJ,CAAC,AAAC;IAEF,OAAOV,MAAM,eAAC,KAACkB,UAAU,KAAG,EAAEP,OAAO,CAAC,CAAC;AACzC,CAAC"}

package/dist/test/setup-tests.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setup-tests.d.ts","sourceRoot":"","sources":["../../src/test/setup-tests.ts"],"names":[],"mappings":"AAcA,OAAO,yCAAyC,CAAC"}
+{"version":3,"file":"setup-tests.d.ts","sourceRoot":"","sources":["../../src/test/setup-tests.ts"],"names":[],"mappings":"AAgBA,OAAO,yCAAyC,CAAC"}

package/dist/test/setup-tests.js

@@ -10,9 +10,13 @@
 // 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 { defaultFallbackInView } from 'react-intersection-observer';
 // Add testing library assertions
 import '@testing-library/jest-dom/extend-expect';
 // Always mock e-charts during tests since we don't have a proper canvas in jsdom
 jest.mock('echarts/core');
+// Tell react-intersection-observer that everything should be considered in-view for tests (see package documentation
+// for other options)
+defaultFallbackInView(true);
 
 //# sourceMappingURL=setup-tests.js.map

package/dist/test/setup-tests.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/test/setup-tests.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\n// Add testing library assertions\nimport '@testing-library/jest-dom/extend-expect';\n\n// Always mock e-charts during tests since we don't have a proper canvas in jsdom\njest.mock('echarts/core');\n"],"names":["jest","mock"],"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,iCAAiC;AACjC,OAAO,yCAAyC,CAAC;AAEjD,iFAAiF;AACjFA,IAAI,CAACC,IAAI,CAAC,cAAc,CAAC,CAAC"}
+{"version":3,"sources":["../../src/test/setup-tests.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 { defaultFallbackInView } from 'react-intersection-observer';\n\n// Add testing library assertions\nimport '@testing-library/jest-dom/extend-expect';\n\n// Always mock e-charts during tests since we don't have a proper canvas in jsdom\njest.mock('echarts/core');\n\n// Tell react-intersection-observer that everything should be considered in-view for tests (see package documentation\n// for other options)\ndefaultFallbackInView(true);\n"],"names":["defaultFallbackInView","jest","mock"],"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,qBAAqB,QAAQ,6BAA6B,CAAC;AAEpE,iCAAiC;AACjC,OAAO,yCAAyC,CAAC;AAEjD,iFAAiF;AACjFC,IAAI,CAACC,IAAI,CAAC,cAAc,CAAC,CAAC;AAE1B,qHAAqH;AACrH,qBAAqB;AACrBF,qBAAqB,CAAC,IAAI,CAAC,CAAC"}

package/dist/test/testDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testDashboard.d.ts","sourceRoot":"","sources":["../../src/test/testDashboard.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,QAAA,MAAM,aAAa,EAAE,iBAwPpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"testDashboard.d.ts","sourceRoot":"","sources":["../../src/test/testDashboard.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,QAAA,MAAM,aAAa,EAAE,iBAyPpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/test/testDashboard.js

@@ -20,7 +20,7 @@ const testDashboard = {
         version: 0
     },
     spec: {
-        duration: '24h',
+        duration: '5m',
         variables: [
             {
                 kind: 'TextVariable',
@@ -136,6 +136,7 @@ const testDashboard = {
                     }
                 }
             },
+            // This panel is referenced in more than one layout below
             diskIO: {
                 kind: 'Panel',
                 spec: {
@@ -234,6 +235,15 @@ const testDashboard = {
                 kind: 'Grid',
                 spec: {
                     items: [
+                        {
+                            x: 0,
+                            y: 0,
+                            width: 6,
+                            height: 2,
+                            content: {
+                                $ref: '#/spec/panels/diskIO'
+                            }
+                        },
                         {
                             x: 8,
                             y: 0,
@@ -257,15 +267,6 @@ const testDashboard = {
                         }
                     },
                     items: [
-                        {
-                            x: 0,
-                            y: 0,
-                            width: 6,
-                            height: 2,
-                            content: {
-                                $ref: '#/spec/panels/diskIO'
-                            }
-                        },
                         {
                             x: 18,
                             y: 0,

package/dist/test/testDashboard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/test/testDashboard.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 { DashboardResource } from '@perses-dev/core';\n\nconst testDashboard: DashboardResource = {\n  kind: 'Dashboard',\n  metadata: {\n    name: 'Node Stats',\n    project: 'perses',\n    created_at: '2021-11-09',\n    updated_at: '2021-11-09',\n    version: 0,\n  },\n  spec: {\n    duration: '24h',\n    variables: [\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'job',\n          value: 'node',\n        },\n      },\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'instance',\n          value: 'demo.do.prometheus.io:9100',\n        },\n      },\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'interval',\n          value: '1m',\n        },\n      },\n    ],\n    panels: {\n      cpu: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'CPU' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'avg without (cpu)(rate(node_cpu_seconds_total{job=\"node\",instance=\"$instance\",mode!=\"idle\"}[$interval]))',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: '%' },\n            },\n          },\n        },\n      },\n      memory: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Memory' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'node_memory_MemTotal_bytes{job=\"node\",instance=\"$instance\"} - node_memory_MemFree_bytes{job=\"node\",instance=\"$instance\"} - node_memory_Buffers_bytes{job=\"node\",instance=\"$instance\"} - node_memory_Cached_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_Buffers_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_Cached_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_MemFree_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Bytes' },\n            },\n          },\n        },\n      },\n      diskIO: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Disk I/O Utilization' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'rate(node_disk_io_time_seconds_total{job=\"node\",instance=\"$instance\",device!~\"^(md\\\\\\\\d+$|dm-)\"}[$interval])',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Percent' },\n            },\n          },\n        },\n      },\n      filesystemFullness: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Filesystem Fullness' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          '1 - node_filesystem_free_bytes{job=\"node\",instance=\"$instance\",fstype!=\"rootfs\",mountpoint!~\"/(run|var).*\",mountpoint!=\"\"} / node_filesystem_size_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Percent' },\n            },\n          },\n        },\n      },\n    },\n    layouts: [\n      // Regular Title, no collapse enabled\n      {\n        kind: 'Grid',\n        spec: {\n          display: {\n            title: 'CPU Stats',\n            collapse: {\n              open: true,\n            },\n          },\n          items: [\n            // First Row\n            {\n              x: 0,\n              y: 0,\n              width: 12,\n              height: 4,\n              content: { $ref: '#/spec/panels/cpu' },\n            },\n            {\n              x: 0,\n              y: 5,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/diskIO' },\n            },\n          ],\n        },\n      },\n      // No title,\n      {\n        kind: 'Grid',\n        spec: {\n          items: [\n            {\n              x: 8,\n              y: 0,\n              width: 8,\n              height: 3,\n              content: { $ref: '#/spec/panels/memory' },\n            },\n          ],\n        },\n      },\n      // Collapsed\n      {\n        kind: 'Grid',\n        spec: {\n          display: {\n            title: 'Disk Stats',\n            collapse: {\n              open: false,\n            },\n          },\n          items: [\n            {\n              x: 0,\n              y: 0,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/diskIO' },\n            },\n            {\n              x: 18,\n              y: 0,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/filesystemFullness' },\n            },\n          ],\n        },\n      },\n    ],\n  },\n};\n\nexport default testDashboard;\n"],"names":["testDashboard","kind","metadata","name","project","created_at","updated_at","version","spec","duration","variables","value","panels","cpu","display","plugin","queries","query","unit","memory","diskIO","filesystemFullness","layouts","title","collapse","open","items","x","y","width","height","content","$ref"],"mappings":"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"}
+{"version":3,"sources":["../../src/test/testDashboard.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 { DashboardResource } from '@perses-dev/core';\n\nconst testDashboard: DashboardResource = {\n  kind: 'Dashboard',\n  metadata: {\n    name: 'Node Stats',\n    project: 'perses',\n    created_at: '2021-11-09',\n    updated_at: '2021-11-09',\n    version: 0,\n  },\n  spec: {\n    duration: '5m',\n    variables: [\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'job',\n          value: 'node',\n        },\n      },\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'instance',\n          value: 'demo.do.prometheus.io:9100',\n        },\n      },\n      {\n        kind: 'TextVariable',\n        spec: {\n          name: 'interval',\n          value: '1m',\n        },\n      },\n    ],\n    panels: {\n      cpu: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'CPU' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'avg without (cpu)(rate(node_cpu_seconds_total{job=\"node\",instance=\"$instance\",mode!=\"idle\"}[$interval]))',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: '%' },\n            },\n          },\n        },\n      },\n      memory: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Memory' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'node_memory_MemTotal_bytes{job=\"node\",instance=\"$instance\"} - node_memory_MemFree_bytes{job=\"node\",instance=\"$instance\"} - node_memory_Buffers_bytes{job=\"node\",instance=\"$instance\"} - node_memory_Cached_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_Buffers_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_Cached_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query: 'node_memory_MemFree_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Bytes' },\n            },\n          },\n        },\n      },\n      // This panel is referenced in more than one layout below\n      diskIO: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Disk I/O Utilization' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          'rate(node_disk_io_time_seconds_total{job=\"node\",instance=\"$instance\",device!~\"^(md\\\\\\\\d+$|dm-)\"}[$interval])',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Percent' },\n            },\n          },\n        },\n      },\n      filesystemFullness: {\n        kind: 'Panel',\n        spec: {\n          display: { name: 'Filesystem Fullness' },\n          plugin: {\n            kind: 'TimeSeriesChart',\n            spec: {\n              queries: [\n                {\n                  kind: 'TimeSeriesQuery',\n                  spec: {\n                    plugin: {\n                      kind: 'PrometheusTimeSeriesQuery',\n                      spec: {\n                        query:\n                          '1 - node_filesystem_free_bytes{job=\"node\",instance=\"$instance\",fstype!=\"rootfs\",mountpoint!~\"/(run|var).*\",mountpoint!=\"\"} / node_filesystem_size_bytes{job=\"node\",instance=\"$instance\"}',\n                      },\n                    },\n                  },\n                },\n              ],\n              unit: { kind: 'Percent' },\n            },\n          },\n        },\n      },\n    },\n    layouts: [\n      // Regular Title, no collapse enabled\n      {\n        kind: 'Grid',\n        spec: {\n          display: {\n            title: 'CPU Stats',\n            collapse: {\n              open: true,\n            },\n          },\n          items: [\n            // First Row\n            {\n              x: 0,\n              y: 0,\n              width: 12,\n              height: 4,\n              content: { $ref: '#/spec/panels/cpu' },\n            },\n            {\n              x: 0,\n              y: 5,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/diskIO' },\n            },\n          ],\n        },\n      },\n      // No title,\n      {\n        kind: 'Grid',\n        spec: {\n          items: [\n            {\n              x: 0,\n              y: 0,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/diskIO' },\n            },\n            {\n              x: 8,\n              y: 0,\n              width: 8,\n              height: 3,\n              content: { $ref: '#/spec/panels/memory' },\n            },\n          ],\n        },\n      },\n      // Collapsed\n      {\n        kind: 'Grid',\n        spec: {\n          display: {\n            title: 'Disk Stats',\n            collapse: {\n              open: false,\n            },\n          },\n          items: [\n            {\n              x: 18,\n              y: 0,\n              width: 6,\n              height: 2,\n              content: { $ref: '#/spec/panels/filesystemFullness' },\n            },\n          ],\n        },\n      },\n    ],\n  },\n};\n\nexport default testDashboard;\n"],"names":["testDashboard","kind","metadata","name","project","created_at","updated_at","version","spec","duration","variables","value","panels","cpu","display","plugin","queries","query","unit","memory","diskIO","filesystemFullness","layouts","title","collapse","open","items","x","y","width","height","content","$ref"],"mappings":"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"}

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './time-range-params';
+//# sourceMappingURL=index.d.ts.map

package/dist/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAaA,cAAc,qBAAqB,CAAC"}

package/dist/utils/index.js

@@ -0,0 +1,15 @@
+// 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.
+export * from './time-range-params';
+
+//# sourceMappingURL=index.js.map

package/dist/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/index.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\nexport * from './time-range-params';\n"],"names":[],"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,cAAc,qBAAqB,CAAC"}

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

@@ -0,0 +1,25 @@
+import { QueryParamConfig } from 'use-query-params';
+import { TimeRangeValue, DurationString } from '@perses-dev/core';
+import { TimeRange } from '@perses-dev/plugin-system';
+export declare type TimeOptionValue = Date | DurationString | null | undefined;
+export declare function encodeTimeRangeValue(timeOptionValue: TimeOptionValue): string | null | undefined;
+export declare function decodeTimeRangeValue(input: string | Array<string | null> | null | undefined): Date | DurationString | null | undefined;
+/**
+ * Custom TimeRangeValue param type
+ * See: https://github.com/pbeshai/use-query-params/tree/master/packages/serialize-query-params#param-types
+ */
+export declare const TimeRangeParam: QueryParamConfig<TimeOptionValue, TimeOptionValue>;
+export declare const timeRangeQueryConfig: {
+    start: QueryParamConfig<TimeOptionValue, TimeOptionValue>;
+    end: QueryParamConfig<TimeOptionValue, TimeOptionValue>;
+};
+/**
+ * Gets the initial time range taking into account URL params and dashboard JSON duration
+ * Sets start query param if it is empty on page load
+ */
+export declare function useInitialTimeRange(dashboardDuration: DurationString): TimeRangeValue;
+/**
+ * Returns time range getter and setter, set paramsEnabled to false to disable query string serialization
+ */
+export declare function useSetTimeRangeParams(initialTimeRange: TimeRangeValue, paramsEnabled?: boolean): TimeRange;
+//# sourceMappingURL=time-range-params.d.ts.map

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

@@ -0,0 +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,CA+BvG"}

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

@@ -0,0 +1,143 @@
+// 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.
+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';
+/* 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 !== '')) {
+        return null;
+    }
+    const str = input instanceof Array ? input[0] : input;
+    if (str == null) {
+        return str;
+    }
+    if (!allowEmptyString && str === '') {
+        return null;
+    }
+    return str;
+}
+/* Encodes individual TimeRangeValue as a string, depends on whether start is relative or absolute */ export function encodeTimeRangeValue(timeOptionValue) {
+    if (!timeOptionValue) {
+        return timeOptionValue;
+    }
+    if (typeof timeOptionValue === 'string') {
+        if (isDurationString(timeOptionValue)) {
+            return timeOptionValue;
+        }
+    }
+    return (getUnixTime(timeOptionValue) * 1000).toString();
+}
+/* Converts param input to supported relative or absolute time range format */ export function decodeTimeRangeValue(input) {
+    const paramString = getEncodedValue(input);
+    if (paramString == null) return paramString;
+    return isDurationString(paramString) ? paramString : new Date(Number(paramString));
+}
+/**
+ * Custom TimeRangeValue param type
+ * See: https://github.com/pbeshai/use-query-params/tree/master/packages/serialize-query-params#param-types
+ */ export const TimeRangeParam = {
+    encode: encodeTimeRangeValue,
+    decode: decodeTimeRangeValue,
+    equals: (valueA, valueB)=>{
+        if (valueA === valueB) return true;
+        if (valueA == null || valueB == null) return valueA === valueB;
+        return valueA.valueOf() === valueB.valueOf();
+    }
+};
+export const timeRangeQueryConfig = {
+    start: TimeRangeParam,
+    end: TimeRangeParam
+};
+/**
+ * Gets the initial time range taking into account URL params and dashboard JSON duration
+ * Sets start query param if it is empty on page load
+ */ export function useInitialTimeRange(dashboardDuration) {
+    const [query] = useQueryParams(timeRangeQueryConfig);
+    const { start , end  } = query;
+    return useMemo(()=>{
+        let initialTimeRange = {
+            pastDuration: dashboardDuration
+        };
+        if (!start) {
+            return initialTimeRange;
+        }
+        const startStr = start.toString();
+        if (isDurationString(startStr)) {
+            initialTimeRange = {
+                pastDuration: startStr
+            };
+        } else if (isDate(start) && isDate(end)) {
+            initialTimeRange = {
+                start: start,
+                end: end
+            };
+        }
+        return initialTimeRange;
+    }, [
+        start,
+        end,
+        dashboardDuration
+    ]);
+}
+/**
+ * Returns time range getter and setter, set paramsEnabled to false to disable query string serialization
+ */ export function useSetTimeRangeParams(initialTimeRange, paramsEnabled = true) {
+    const [query, setQuery] = useQueryParams(timeRangeQueryConfig);
+    // fallback when app does not want query string as source of truth
+    const [timeRangeState, setTimeRangeState] = useState(initialTimeRange);
+    const { start  } = query;
+    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({
+                start: value.pastDuration,
+                end: undefined
+            });
+        } else {
+            setQuery(value);
+        }
+    }, [
+        setQuery
+    ]);
+    if (!paramsEnabled) {
+        return {
+            timeRange: timeRangeState,
+            setTimeRange: setTimeRangeState
+        };
+    }
+    return {
+        timeRange: initialTimeRange,
+        setTimeRange: setTimeRange
+    };
+}
+
+//# sourceMappingURL=time-range-params.js.map

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

@@ -0,0 +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, 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":"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"}

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;AAOrD,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

@@ -13,16 +13,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box } from '@mui/material';
 import { ErrorAlert, ErrorBoundary } from '@perses-dev/components';
-import { PanelDrawer, Dashboard } from '../../components';
-import PanelGroupDialog from '../../components/PanelGroupDialog/PanelGroupDialog';
+import { PanelDrawer, Dashboard, PanelGroupDialog, DeletePanelGroupDialog } from '../../components';
 import { DashboardToolbar } from '../../components/DashboardToolbar';
-import DeletePanelGroupDialog from '../../components/PanelGroupDialog/DeletePanelGroupDialog';
 import DeletePanelDialog from '../../components/Panel/DeletePanelDialog';
 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 } from '../../components';\nimport PanelGroupDialog from '../../components/PanelGroupDialog/PanelGroupDialog';\nimport { DashboardToolbar } from '../../components/DashboardToolbar';\nimport DeletePanelGroupDialog from '../../components/PanelGroupDialog/DeletePanelGroupDialog';\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","DashboardToolbar","DeletePanelGroupDialog","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,QAAQ,kBAAkB,CAAC;AAC1D,OAAOC,gBAAgB,MAAM,oDAAoD,CAAC;AAClF,SAASC,gBAAgB,QAAQ,mCAAmC,CAAC;AACrE,OAAOC,sBAAsB,MAAM,0DAA0D,CAAC;AAC9F,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,KAACd,gBAAgB;gBAACe,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,KAACE,sBAAsB,KAAG;kCAC1B,KAACC,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/dist/views/ViewDashboard/ViewDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewDashboard.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAO,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAuB,MAAM,kBAAkB,CAAC;AAG1E,OAAO,EAIL,4BAA4B,EAE7B,MAAM,eAAe,CAAC;AAGvB,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC;IACpE,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,aAAa,EAAE,4BAA4B,CAAC,eAAe,CAAC,CAAC;CAC9D;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eA8CtD"}
+{"version":3,"file":"ViewDashboard.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAO,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,EAIL,4BAA4B,EAE7B,MAAM,eAAe,CAAC;AAIvB,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC;IACpE,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,aAAa,EAAE,4BAA4B,CAAC,eAAe,CAAC,CAAC;CAC9D;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAkCtD"}

package/dist/views/ViewDashboard/ViewDashboard.js

@@ -11,38 +11,20 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from 'react';
 import { Box } from '@mui/material';
-import { getDefaultTimeRange } from '@perses-dev/core';
-import { useQueryString } from '@perses-dev/plugin-system';
 import { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';
 import { TimeRangeProvider, TemplateVariableProvider, DashboardProvider, DatasourceStoreProvider } from '../../context';
+import { useInitialTimeRange, useSetTimeRangeParams } from '../../utils';
 import { DashboardApp } from './DashboardApp';
 /**
  * The View for displaying a Dashboard, along with the UI for selecting variable values.
  */ export function ViewDashboard(props) {
     const { dashboardResource , datasourceApi , sx , ...others } = props;
     const { spec  } = dashboardResource;
-    const { queryString , setQueryString  } = useQueryString();
     var _duration;
     const dashboardDuration = (_duration = spec.duration) !== null && _duration !== void 0 ? _duration : '1h';
-    const defaultTimeRange = getDefaultTimeRange(dashboardDuration, queryString);
-    // TODO: add reusable sync query string or no-op util
-    useEffect(()=>{
-        const currentParams = Object.fromEntries([
-            ...queryString
-        ]);
-        // if app does not provide query string implementation, setTimeRange is used instead
-        if (!currentParams.start && setQueryString) {
-            // default to duration in dashboard definition if start param is not already set
-            queryString.set('start', dashboardDuration);
-            setQueryString(queryString);
-        }
-    }, [
-        dashboardDuration,
-        queryString,
-        setQueryString
-    ]);
+    const initialTimeRange = useInitialTimeRange(dashboardDuration);
+    const { timeRange , setTimeRange  } = useSetTimeRangeParams(initialTimeRange, true);
     return /*#__PURE__*/ _jsx(DatasourceStoreProvider, {
         dashboardResource: dashboardResource,
         datasourceApi: datasourceApi,
@@ -51,7 +33,8 @@ import { DashboardApp } from './DashboardApp';
                 dashboardSpec: spec
             },
             children: /*#__PURE__*/ _jsx(TimeRangeProvider, {
-                initialTimeRange: defaultTimeRange,
+                timeRange: timeRange,
+                setTimeRange: setTimeRange,
                 children: /*#__PURE__*/ _jsx(TemplateVariableProvider, {
                     initialVariableDefinitions: spec.variables,
                     children: /*#__PURE__*/ _jsx(Box, {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/ViewDashboard/ViewDashboard.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 { useEffect } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { DashboardResource, getDefaultTimeRange } from '@perses-dev/core';\nimport { useQueryString } from '@perses-dev/plugin-system';\nimport { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';\nimport {\n  TimeRangeProvider,\n  TemplateVariableProvider,\n  DashboardProvider,\n  DatasourceStoreProviderProps,\n  DatasourceStoreProvider,\n} from '../../context';\nimport { DashboardApp } from './DashboardApp';\n\nexport interface ViewDashboardProps extends Omit<BoxProps, 'children'> {\n  dashboardResource: DashboardResource;\n  datasourceApi: DatasourceStoreProviderProps['datasourceApi'];\n}\n\n/**\n * The View for displaying a Dashboard, along with the UI for selecting variable values.\n */\nexport function ViewDashboard(props: ViewDashboardProps) {\n  const { dashboardResource, datasourceApi, sx, ...others } = props;\n  const { spec } = dashboardResource;\n\n  const { queryString, setQueryString } = useQueryString();\n  const dashboardDuration = spec.duration ?? '1h';\n  const defaultTimeRange = getDefaultTimeRange(dashboardDuration, queryString);\n\n  // TODO: add reusable sync query string or no-op util\n  useEffect(() => {\n    const currentParams = Object.fromEntries([...queryString]);\n    // if app does not provide query string implementation, setTimeRange is used instead\n    if (!currentParams.start && setQueryString) {\n      // default to duration in dashboard definition if start param is not already set\n      queryString.set('start', dashboardDuration);\n      setQueryString(queryString);\n    }\n  }, [dashboardDuration, queryString, setQueryString]);\n\n  return (\n    <DatasourceStoreProvider dashboardResource={dashboardResource} datasourceApi={datasourceApi}>\n      <DashboardProvider initialState={{ dashboardSpec: spec }}>\n        <TimeRangeProvider initialTimeRange={defaultTimeRange}>\n          <TemplateVariableProvider initialVariableDefinitions={spec.variables}>\n            <Box\n              sx={combineSx(\n                {\n                  display: 'flex',\n                  width: '100%',\n                  height: '100%',\n                  position: 'relative',\n                  overflow: 'hidden',\n                },\n                sx\n              )}\n              {...others}\n            >\n              <ErrorBoundary FallbackComponent={ErrorAlert}>\n                <DashboardApp dashboardResource={dashboardResource} />\n              </ErrorBoundary>\n            </Box>\n          </TemplateVariableProvider>\n        </TimeRangeProvider>\n      </DashboardProvider>\n    </DatasourceStoreProvider>\n  );\n}\n"],"names":["useEffect","Box","getDefaultTimeRange","useQueryString","ErrorBoundary","ErrorAlert","combineSx","TimeRangeProvider","TemplateVariableProvider","DashboardProvider","DatasourceStoreProvider","DashboardApp","ViewDashboard","props","dashboardResource","datasourceApi","sx","others","spec","queryString","setQueryString","dashboardDuration","duration","defaultTimeRange","currentParams","Object","fromEntries","start","set","initialState","dashboardSpec","initialTimeRange","initialVariableDefinitions","variables","display","width","height","position","overflow","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,SAAS,QAAQ,OAAO,CAAC;AAClC,SAASC,GAAG,QAAkB,eAAe,CAAC;AAC9C,SAA4BC,mBAAmB,QAAQ,kBAAkB,CAAC;AAC1E,SAASC,cAAc,QAAQ,2BAA2B,CAAC;AAC3D,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,QAAQ,wBAAwB,CAAC;AAC9E,SACEC,iBAAiB,EACjBC,wBAAwB,EACxBC,iBAAiB,EAEjBC,uBAAuB,QAClB,eAAe,CAAC;AACvB,SAASC,YAAY,QAAQ,gBAAgB,CAAC;AAO9C;;CAEC,GACD,OAAO,SAASC,aAAa,CAACC,KAAyB,EAAE;IACvD,MAAM,EAAEC,iBAAiB,CAAA,EAAEC,aAAa,CAAA,EAAEC,EAAE,CAAA,EAAE,GAAGC,MAAM,EAAE,GAAGJ,KAAK,AAAC;IAClE,MAAM,EAAEK,IAAI,CAAA,EAAE,GAAGJ,iBAAiB,AAAC;IAEnC,MAAM,EAAEK,WAAW,CAAA,EAAEC,cAAc,CAAA,EAAE,GAAGjB,cAAc,EAAE,AAAC;QAC/Be,SAAa;IAAvC,MAAMG,iBAAiB,GAAGH,CAAAA,SAAa,GAAbA,IAAI,CAACI,QAAQ,cAAbJ,SAAa,cAAbA,SAAa,GAAI,IAAI,AAAC;IAChD,MAAMK,gBAAgB,GAAGrB,mBAAmB,CAACmB,iBAAiB,EAAEF,WAAW,CAAC,AAAC;IAE7E,qDAAqD;IACrDnB,SAAS,CAAC,IAAM;QACd,MAAMwB,aAAa,GAAGC,MAAM,CAACC,WAAW,CAAC;eAAIP,WAAW;SAAC,CAAC,AAAC;QAC3D,oFAAoF;QACpF,IAAI,CAACK,aAAa,CAACG,KAAK,IAAIP,cAAc,EAAE;YAC1C,gFAAgF;YAChFD,WAAW,CAACS,GAAG,CAAC,OAAO,EAAEP,iBAAiB,CAAC,CAAC;YAC5CD,cAAc,CAACD,WAAW,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE;QAACE,iBAAiB;QAAEF,WAAW;QAAEC,cAAc;KAAC,CAAC,CAAC;IAErD,qBACE,KAACV,uBAAuB;QAACI,iBAAiB,EAAEA,iBAAiB;QAAEC,aAAa,EAAEA,aAAa;kBACzF,cAAA,KAACN,iBAAiB;YAACoB,YAAY,EAAE;gBAAEC,aAAa,EAAEZ,IAAI;aAAE;sBACtD,cAAA,KAACX,iBAAiB;gBAACwB,gBAAgB,EAAER,gBAAgB;0BACnD,cAAA,KAACf,wBAAwB;oBAACwB,0BAA0B,EAAEd,IAAI,CAACe,SAAS;8BAClE,cAAA,KAAChC,GAAG;wBACFe,EAAE,EAAEV,SAAS,CACX;4BACE4B,OAAO,EAAE,MAAM;4BACfC,KAAK,EAAE,MAAM;4BACbC,MAAM,EAAE,MAAM;4BACdC,QAAQ,EAAE,UAAU;4BACpBC,QAAQ,EAAE,QAAQ;yBACnB,EACDtB,EAAE,CACH;wBACA,GAAGC,MAAM;kCAEV,cAAA,KAACb,aAAa;4BAACmC,iBAAiB,EAAElC,UAAU;sCAC1C,cAAA,KAACM,YAAY;gCAACG,iBAAiB,EAAEA,iBAAiB;8BAAI;0BACxC;sBACZ;kBACmB;cACT;UACF;MACI,CAC1B;AACJ,CAAC"}
+{"version":3,"sources":["../../../src/views/ViewDashboard/ViewDashboard.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, BoxProps } from '@mui/material';\nimport { DashboardResource } from '@perses-dev/core';\nimport { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';\nimport {\n  TimeRangeProvider,\n  TemplateVariableProvider,\n  DashboardProvider,\n  DatasourceStoreProviderProps,\n  DatasourceStoreProvider,\n} from '../../context';\nimport { useInitialTimeRange, useSetTimeRangeParams } from '../../utils';\nimport { DashboardApp } from './DashboardApp';\n\nexport interface ViewDashboardProps extends Omit<BoxProps, 'children'> {\n  dashboardResource: DashboardResource;\n  datasourceApi: DatasourceStoreProviderProps['datasourceApi'];\n}\n\n/**\n * The View for displaying a Dashboard, along with the UI for selecting variable values.\n */\nexport function ViewDashboard(props: ViewDashboardProps) {\n  const { dashboardResource, datasourceApi, sx, ...others } = props;\n  const { spec } = dashboardResource;\n  const dashboardDuration = spec.duration ?? '1h';\n  const initialTimeRange = useInitialTimeRange(dashboardDuration);\n  const { timeRange, setTimeRange } = useSetTimeRangeParams(initialTimeRange, true);\n\n  return (\n    <DatasourceStoreProvider dashboardResource={dashboardResource} datasourceApi={datasourceApi}>\n      <DashboardProvider initialState={{ dashboardSpec: spec }}>\n        <TimeRangeProvider timeRange={timeRange} setTimeRange={setTimeRange}>\n          <TemplateVariableProvider initialVariableDefinitions={spec.variables}>\n            <Box\n              sx={combineSx(\n                {\n                  display: 'flex',\n                  width: '100%',\n                  height: '100%',\n                  position: 'relative',\n                  overflow: 'hidden',\n                },\n                sx\n              )}\n              {...others}\n            >\n              <ErrorBoundary FallbackComponent={ErrorAlert}>\n                <DashboardApp dashboardResource={dashboardResource} />\n              </ErrorBoundary>\n            </Box>\n          </TemplateVariableProvider>\n        </TimeRangeProvider>\n      </DashboardProvider>\n    </DatasourceStoreProvider>\n  );\n}\n"],"names":["Box","ErrorBoundary","ErrorAlert","combineSx","TimeRangeProvider","TemplateVariableProvider","DashboardProvider","DatasourceStoreProvider","useInitialTimeRange","useSetTimeRangeParams","DashboardApp","ViewDashboard","props","dashboardResource","datasourceApi","sx","others","spec","dashboardDuration","duration","initialTimeRange","timeRange","setTimeRange","initialState","dashboardSpec","initialVariableDefinitions","variables","display","width","height","position","overflow","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,QAAkB,eAAe,CAAC;AAE9C,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,QAAQ,wBAAwB,CAAC;AAC9E,SACEC,iBAAiB,EACjBC,wBAAwB,EACxBC,iBAAiB,EAEjBC,uBAAuB,QAClB,eAAe,CAAC;AACvB,SAASC,mBAAmB,EAAEC,qBAAqB,QAAQ,aAAa,CAAC;AACzE,SAASC,YAAY,QAAQ,gBAAgB,CAAC;AAO9C;;CAEC,GACD,OAAO,SAASC,aAAa,CAACC,KAAyB,EAAE;IACvD,MAAM,EAAEC,iBAAiB,CAAA,EAAEC,aAAa,CAAA,EAAEC,EAAE,CAAA,EAAE,GAAGC,MAAM,EAAE,GAAGJ,KAAK,AAAC;IAClE,MAAM,EAAEK,IAAI,CAAA,EAAE,GAAGJ,iBAAiB,AAAC;QACTI,SAAa;IAAvC,MAAMC,iBAAiB,GAAGD,CAAAA,SAAa,GAAbA,IAAI,CAACE,QAAQ,cAAbF,SAAa,cAAbA,SAAa,GAAI,IAAI,AAAC;IAChD,MAAMG,gBAAgB,GAAGZ,mBAAmB,CAACU,iBAAiB,CAAC,AAAC;IAChE,MAAM,EAAEG,SAAS,CAAA,EAAEC,YAAY,CAAA,EAAE,GAAGb,qBAAqB,CAACW,gBAAgB,EAAE,IAAI,CAAC,AAAC;IAElF,qBACE,KAACb,uBAAuB;QAACM,iBAAiB,EAAEA,iBAAiB;QAAEC,aAAa,EAAEA,aAAa;kBACzF,cAAA,KAACR,iBAAiB;YAACiB,YAAY,EAAE;gBAAEC,aAAa,EAAEP,IAAI;aAAE;sBACtD,cAAA,KAACb,iBAAiB;gBAACiB,SAAS,EAAEA,SAAS;gBAAEC,YAAY,EAAEA,YAAY;0BACjE,cAAA,KAACjB,wBAAwB;oBAACoB,0BAA0B,EAAER,IAAI,CAACS,SAAS;8BAClE,cAAA,KAAC1B,GAAG;wBACFe,EAAE,EAAEZ,SAAS,CACX;4BACEwB,OAAO,EAAE,MAAM;4BACfC,KAAK,EAAE,MAAM;4BACbC,MAAM,EAAE,MAAM;4BACdC,QAAQ,EAAE,UAAU;4BACpBC,QAAQ,EAAE,QAAQ;yBACnB,EACDhB,EAAE,CACH;wBACA,GAAGC,MAAM;kCAEV,cAAA,KAACf,aAAa;4BAAC+B,iBAAiB,EAAE9B,UAAU;sCAC1C,cAAA,KAACQ,YAAY;gCAACG,iBAAiB,EAAEA,iBAAiB;8BAAI;0BACxC;sBACZ;kBACmB;cACT;UACF;MACI,CAC1B;AACJ,CAAC"}