@perses-dev/dashboards 0.8.1 → 0.10.0

package/dist/context/DatasourceStoreProvider.js

@@ -0,0 +1,166 @@
+// 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 { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useMemo } from 'react';
+import { useEvent } from '@perses-dev/core';
+import { DatasourceStoreContext, usePluginRegistry } from '@perses-dev/plugin-system';
+/**
+ * A `DatasourceContext` provider that uses an external API to resolve datasource selectors.
+ */ export function DatasourceStoreProvider(props) {
+    const { dashboardResource , datasourceApi , children  } = props;
+    const { project  } = dashboardResource.metadata;
+    const { getPlugin , listPluginMetadata  } = usePluginRegistry();
+    const findDatasource = useEvent(async (selector)=>{
+        // Try to find it in dashboard spec
+        const { datasources  } = dashboardResource.spec;
+        const dashboardDatasource = findDashboardDatasource(datasources, selector);
+        if (dashboardDatasource !== undefined) {
+            return {
+                spec: dashboardDatasource,
+                proxyUrl: undefined
+            };
+        }
+        // Try to find it at the project level as a Datasource resource
+        const datasource = await datasourceApi.getDatasource(project, selector);
+        if (datasource !== undefined) {
+            return {
+                spec: datasource.resource.spec,
+                proxyUrl: datasource.proxyUrl
+            };
+        }
+        // Try to find it at the global level as a GlobalDatasource resource
+        const globalDatasource = await datasourceApi.getGlobalDatasource(selector);
+        if (globalDatasource !== undefined) {
+            return {
+                spec: globalDatasource.resource.spec,
+                proxyUrl: globalDatasource.proxyUrl
+            };
+        }
+        throw new Error(`No datasource found for kind '${selector.kind}' and name '${selector.name}'`);
+    });
+    // Gets a datasource spec for a given selector
+    const getDatasource = useCallback(async (selector)=>{
+        const { spec  } = await findDatasource(selector);
+        return spec;
+    }, [
+        findDatasource
+    ]);
+    // Given a Datasource selector, finds the spec for it and then uses its corresponding plugin the create a client
+    const getDatasourceClient = useCallback(async function getClient(selector) {
+        const { kind  } = selector;
+        const [{ spec , proxyUrl  }, plugin] = await Promise.all([
+            findDatasource(selector),
+            getPlugin('Datasource', kind)
+        ]);
+        return plugin.createClient(spec.plugin.spec, {
+            proxyUrl
+        });
+    }, [
+        findDatasource,
+        getPlugin
+    ]);
+    const listDatasourceMetadata = useEvent(async (datasourcePluginKind)=>{
+        const [pluginMetadata, datasources, globalDatasources] = await Promise.all([
+            listPluginMetadata('Datasource'),
+            datasourceApi.listDatasources(project, datasourcePluginKind),
+            datasourceApi.listGlobalDatasources(datasourcePluginKind)
+        ]);
+        // Find the metadata for the plugin type they asked for so we can use it for the name of the default datasource
+        const datasourcePluginMetadata = pluginMetadata.find((metadata)=>metadata.kind === datasourcePluginKind);
+        if (datasourcePluginMetadata === undefined) {
+            throw new Error(`Could not find a Datasource plugin with kind '${datasourcePluginKind}'`);
+        }
+        // Get helper for de-duping results properly
+        const { results , addResult  } = buildListDatasourceMetadataResults(datasourcePluginMetadata.display.name);
+        // Start with dashboard datasources that have highest precedence
+        if (dashboardResource.spec.datasources !== undefined) {
+            for(const selectorName in dashboardResource.spec.datasources){
+                const spec = dashboardResource.spec.datasources[selectorName];
+                if (spec === undefined || spec.plugin.kind !== datasourcePluginKind) continue;
+                addResult(spec, selectorName);
+            }
+        }
+        // Now look at project-level datasources
+        for (const datasource of datasources){
+            const selectorName1 = datasource.metadata.name;
+            addResult(datasource.spec, selectorName1);
+        }
+        // And finally global datasources
+        for (const globalDatasource of globalDatasources){
+            const selectorName2 = globalDatasource.metadata.name;
+            addResult(globalDatasource.spec, selectorName2);
+        }
+        return results;
+    });
+    const ctxValue = useMemo(()=>({
+            getDatasource,
+            getDatasourceClient,
+            listDatasourceMetadata
+        }), [
+        getDatasource,
+        getDatasourceClient,
+        listDatasourceMetadata
+    ]);
+    return /*#__PURE__*/ _jsx(DatasourceStoreContext.Provider, {
+        value: ctxValue,
+        children: children
+    });
+}
+// Helper to find a datasource in the list embedded in a dashboard spec
+function findDashboardDatasource(dashboardDatasources, selector) {
+    if (dashboardDatasources === undefined) return undefined;
+    // If using a name in the selector...
+    if (selector.name !== undefined) {
+        const named = dashboardDatasources[selector.name];
+        if (named === undefined) return undefined;
+        return named.plugin.kind === selector.kind ? named : undefined;
+    }
+    // If only using a kind, try to find one with that kind that is the default
+    return Object.values(dashboardDatasources).find((ds)=>ds.plugin.kind === selector.kind && ds.default === true);
+}
+// Helper for building a list of DatasourceMetadata results that will take care of de-duping already used selectors
+function buildListDatasourceMetadataResults(pluginDisplayName) {
+    const results = [];
+    const usedNames = new Set();
+    let defaultAdded = false;
+    const addResult = (spec, selectorName)=>{
+        var ref;
+        // If we haven't added a default yet and this is a default, add default option to the beginning of the results
+        if (spec.default && defaultAdded === false) {
+            results.unshift({
+                name: `Default ${pluginDisplayName}`,
+                selector: {
+                    kind: spec.plugin.kind
+                }
+            });
+            defaultAdded = true;
+        }
+        // If we already have a datasource with this selector name, ignore it, otherwise add to end of list
+        if (usedNames.has(selectorName)) return;
+        var ref1;
+        results.push({
+            name: (ref1 = (ref = spec.display) === null || ref === void 0 ? void 0 : ref.name) !== null && ref1 !== void 0 ? ref1 : selectorName,
+            selector: {
+                kind: spec.plugin.kind,
+                name: selectorName
+            }
+        });
+        usedNames.add(selectorName);
+    };
+    return {
+        results,
+        addResult
+    };
+}
+
+//# sourceMappingURL=DatasourceStoreProvider.js.map

package/dist/context/DatasourceStoreProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/DatasourceStoreProvider.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 { useCallback, useMemo } from 'react';\nimport {\n  DashboardResource,\n  DashboardSpec,\n  Datasource,\n  DatasourceSelector,\n  DatasourceSpec,\n  GlobalDatasource,\n  useEvent,\n} from '@perses-dev/core';\nimport {\n  DatasourceStoreContext,\n  DatasourceStore,\n  usePluginRegistry,\n  DatasourceMetadata,\n} from '@perses-dev/plugin-system';\n\nexport interface DatasourceStoreProviderProps {\n  dashboardResource: DashboardResource;\n  datasourceApi: DatasourceApi;\n  children?: React.ReactNode;\n}\n\n// The external API for fetching datasource resources\nexport interface DatasourceApi {\n  getDatasource: (\n    project: string,\n    selector: DatasourceSelector\n  ) => Promise<{ resource: Datasource; proxyUrl: string } | undefined>;\n\n  getGlobalDatasource: (\n    selector: DatasourceSelector\n  ) => Promise<{ resource: GlobalDatasource; proxyUrl: string } | undefined>;\n\n  listDatasources: (project: string, pluginKind?: string) => Promise<Datasource[]>;\n\n  listGlobalDatasources: (pluginKind?: string) => Promise<GlobalDatasource[]>;\n}\n\n/**\n * A `DatasourceContext` provider that uses an external API to resolve datasource selectors.\n */\nexport function DatasourceStoreProvider(props: DatasourceStoreProviderProps) {\n  const { dashboardResource, datasourceApi, children } = props;\n  const { project } = dashboardResource.metadata;\n\n  const { getPlugin, listPluginMetadata } = usePluginRegistry();\n\n  const findDatasource = useEvent(async (selector: DatasourceSelector) => {\n    // Try to find it in dashboard spec\n    const { datasources } = dashboardResource.spec;\n    const dashboardDatasource = findDashboardDatasource(datasources, selector);\n    if (dashboardDatasource !== undefined) {\n      return { spec: dashboardDatasource, proxyUrl: undefined };\n    }\n\n    // Try to find it at the project level as a Datasource resource\n    const datasource = await datasourceApi.getDatasource(project, selector);\n    if (datasource !== undefined) {\n      return { spec: datasource.resource.spec, proxyUrl: datasource.proxyUrl };\n    }\n\n    // Try to find it at the global level as a GlobalDatasource resource\n    const globalDatasource = await datasourceApi.getGlobalDatasource(selector);\n    if (globalDatasource !== undefined) {\n      return { spec: globalDatasource.resource.spec, proxyUrl: globalDatasource.proxyUrl };\n    }\n\n    throw new Error(`No datasource found for kind '${selector.kind}' and name '${selector.name}'`);\n  });\n\n  // Gets a datasource spec for a given selector\n  const getDatasource = useCallback(\n    async (selector: DatasourceSelector): Promise<DatasourceSpec> => {\n      const { spec } = await findDatasource(selector);\n      return spec;\n    },\n    [findDatasource]\n  );\n\n  // Given a Datasource selector, finds the spec for it and then uses its corresponding plugin the create a client\n  const getDatasourceClient = useCallback(\n    async function getClient<Client>(selector: DatasourceSelector): Promise<Client> {\n      const { kind } = selector;\n      const [{ spec, proxyUrl }, plugin] = await Promise.all([findDatasource(selector), getPlugin('Datasource', kind)]);\n      return plugin.createClient(spec.plugin.spec, { proxyUrl }) as Client;\n    },\n    [findDatasource, getPlugin]\n  );\n\n  const listDatasourceMetadata = useEvent(async (datasourcePluginKind: string): Promise<DatasourceMetadata[]> => {\n    const [pluginMetadata, datasources, globalDatasources] = await Promise.all([\n      listPluginMetadata('Datasource'),\n      datasourceApi.listDatasources(project, datasourcePluginKind),\n      datasourceApi.listGlobalDatasources(datasourcePluginKind),\n    ]);\n\n    // Find the metadata for the plugin type they asked for so we can use it for the name of the default datasource\n    const datasourcePluginMetadata = pluginMetadata.find((metadata) => metadata.kind === datasourcePluginKind);\n    if (datasourcePluginMetadata === undefined) {\n      throw new Error(`Could not find a Datasource plugin with kind '${datasourcePluginKind}'`);\n    }\n\n    // Get helper for de-duping results properly\n    const { results, addResult } = buildListDatasourceMetadataResults(datasourcePluginMetadata.display.name);\n\n    // Start with dashboard datasources that have highest precedence\n    if (dashboardResource.spec.datasources !== undefined) {\n      for (const selectorName in dashboardResource.spec.datasources) {\n        const spec = dashboardResource.spec.datasources[selectorName];\n        if (spec === undefined || spec.plugin.kind !== datasourcePluginKind) continue;\n        addResult(spec, selectorName);\n      }\n    }\n\n    // Now look at project-level datasources\n    for (const datasource of datasources) {\n      const selectorName = datasource.metadata.name;\n      addResult(datasource.spec, selectorName);\n    }\n\n    // And finally global datasources\n    for (const globalDatasource of globalDatasources) {\n      const selectorName = globalDatasource.metadata.name;\n      addResult(globalDatasource.spec, selectorName);\n    }\n\n    return results;\n  });\n\n  const ctxValue: DatasourceStore = useMemo(\n    () => ({\n      getDatasource,\n      getDatasourceClient,\n      listDatasourceMetadata,\n    }),\n    [getDatasource, getDatasourceClient, listDatasourceMetadata]\n  );\n\n  return <DatasourceStoreContext.Provider value={ctxValue}>{children}</DatasourceStoreContext.Provider>;\n}\n\n// Helper to find a datasource in the list embedded in a dashboard spec\nfunction findDashboardDatasource(dashboardDatasources: DashboardSpec['datasources'], selector: DatasourceSelector) {\n  if (dashboardDatasources === undefined) return undefined;\n\n  // If using a name in the selector...\n  if (selector.name !== undefined) {\n    const named = dashboardDatasources[selector.name];\n    if (named === undefined) return undefined;\n    return named.plugin.kind === selector.kind ? named : undefined;\n  }\n\n  // If only using a kind, try to find one with that kind that is the default\n  return Object.values(dashboardDatasources).find((ds) => ds.plugin.kind === selector.kind && ds.default === true);\n}\n\n// Helper for building a list of DatasourceMetadata results that will take care of de-duping already used selectors\nfunction buildListDatasourceMetadataResults(pluginDisplayName: string) {\n  const results: DatasourceMetadata[] = [];\n  const usedNames = new Set<string>();\n  let defaultAdded = false;\n  const addResult = (spec: DatasourceSpec, selectorName: string) => {\n    // If we haven't added a default yet and this is a default, add default option to the beginning of the results\n    if (spec.default && defaultAdded === false) {\n      results.unshift({\n        name: `Default ${pluginDisplayName}`,\n        selector: {\n          kind: spec.plugin.kind,\n        },\n      });\n      defaultAdded = true;\n    }\n\n    // If we already have a datasource with this selector name, ignore it, otherwise add to end of list\n    if (usedNames.has(selectorName)) return;\n\n    results.push({\n      name: spec.display?.name ?? selectorName,\n      selector: {\n        kind: spec.plugin.kind,\n        name: selectorName,\n      },\n    });\n    usedNames.add(selectorName);\n  };\n\n  return { results, addResult };\n}\n"],"names":["useCallback","useMemo","useEvent","DatasourceStoreContext","usePluginRegistry","DatasourceStoreProvider","props","dashboardResource","datasourceApi","children","project","metadata","getPlugin","listPluginMetadata","findDatasource","selector","datasources","spec","dashboardDatasource","findDashboardDatasource","undefined","proxyUrl","datasource","getDatasource","resource","globalDatasource","getGlobalDatasource","Error","kind","name","getDatasourceClient","getClient","plugin","Promise","all","createClient","listDatasourceMetadata","datasourcePluginKind","pluginMetadata","globalDatasources","listDatasources","listGlobalDatasources","datasourcePluginMetadata","find","results","addResult","buildListDatasourceMetadataResults","display","selectorName","ctxValue","Provider","value","dashboardDatasources","named","Object","values","ds","default","pluginDisplayName","usedNames","Set","defaultAdded","unshift","has","push","add"],"mappings":"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"}

package/dist/context/QueryStringProvider.js

@@ -1 +1,40 @@
-import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useMemo}from"react";import{QueryStringContext}from"@perses-dev/plugin-system";export function QueryStringProvider(r){const{queryString:e,setQueryString:t,children:n}=r,o=useMemo((()=>({queryString:e,setQueryString:t})),[e,t]);return _jsx(QueryStringContext.Provider,{value:o,children:n})}export function useQueryString(){const r=useContext(QueryStringContext);if(void 0===r)throw new Error("No QueryStringContext found. Did you forget a Provider?");return r}
+// 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 { jsx as _jsx } from "react/jsx-runtime";
+import React, { useContext, useMemo } from 'react';
+import { QueryStringContext } from '@perses-dev/plugin-system';
+/**
+ * Allows apps to provide their own query string implementations
+ */ export function QueryStringProvider(props) {
+    const { queryString , setQueryString , children  } = props;
+    const ctx = useMemo(()=>({
+            queryString,
+            setQueryString
+        }), [
+        queryString,
+        setQueryString
+    ]);
+    return /*#__PURE__*/ _jsx(QueryStringContext.Provider, {
+        value: ctx,
+        children: children
+    });
+}
+export function useQueryString() {
+    const ctx = useContext(QueryStringContext);
+    if (ctx === undefined) {
+        throw new Error('No QueryStringContext found. Did you forget a Provider?');
+    }
+    return ctx;
+}
+
+//# sourceMappingURL=QueryStringProvider.js.map

package/dist/context/QueryStringProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/QueryStringProvider.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 React, { useContext, useMemo } from 'react';\nimport { QueryString, QueryStringContext } from '@perses-dev/plugin-system';\n\nexport interface QueryStringProviderProps {\n  queryString: URLSearchParams;\n  setQueryString?: (queryString: URLSearchParams) => void;\n  children?: React.ReactNode;\n}\n\n/**\n * Allows apps to provide their own query string implementations\n */\nexport function QueryStringProvider(props: QueryStringProviderProps) {\n  const { queryString, setQueryString, children } = props;\n\n  const ctx = useMemo(() => ({ queryString, setQueryString }), [queryString, setQueryString]);\n\n  return <QueryStringContext.Provider value={ctx}>{children}</QueryStringContext.Provider>;\n}\n\nexport function useQueryString(): QueryString {\n  const ctx = useContext(QueryStringContext);\n  if (ctx === undefined) {\n    throw new Error('No QueryStringContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n"],"names":["React","useContext","useMemo","QueryStringContext","QueryStringProvider","props","queryString","setQueryString","children","ctx","Provider","value","useQueryString","undefined","Error"],"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,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO,CAAC;AACnD,SAAsBC,kBAAkB,QAAQ,2BAA2B,CAAC;AAQ5E;;CAEC,GACD,OAAO,SAASC,mBAAmB,CAACC,KAA+B,EAAE;IACnE,MAAM,EAAEC,WAAW,CAAA,EAAEC,cAAc,CAAA,EAAEC,QAAQ,CAAA,EAAE,GAAGH,KAAK,AAAC;IAExD,MAAMI,GAAG,GAAGP,OAAO,CAAC,IAAO,CAAA;YAAEI,WAAW;YAAEC,cAAc;SAAE,CAAA,AAAC,EAAE;QAACD,WAAW;QAAEC,cAAc;KAAC,CAAC,AAAC;IAE5F,qBAAO,KAACJ,kBAAkB,CAACO,QAAQ;QAACC,KAAK,EAAEF,GAAG;kBAAGD,QAAQ;MAA+B,CAAC;AAC3F,CAAC;AAED,OAAO,SAASI,cAAc,GAAgB;IAC5C,MAAMH,GAAG,GAAGR,UAAU,CAACE,kBAAkB,CAAC,AAAC;IAC3C,IAAIM,GAAG,KAAKI,SAAS,EAAE;QACrB,MAAM,IAAIC,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IACD,OAAOL,GAAG,CAAC;AACb,CAAC"}

package/dist/context/TemplateVariableProvider.d.ts

@@ -1,10 +1,13 @@
 /// <reference types="react" />
-import { VariableStateMap, VariableState, VariableName, VariableValue, VariableDefinition } from '@perses-dev/core';
+import { VariableStateMap, VariableState, VariableOption } from '@perses-dev/plugin-system';
+import { VariableName, VariableValue, VariableDefinition } from '@perses-dev/core';
 declare type TemplateVariableStore = {
     variableDefinitions: VariableDefinition[];
     variableState: VariableStateMap;
     setVariableValue: (variableName: VariableName, value: VariableValue) => void;
-    loadTemplateVariable: (name: VariableName) => Promise<void>;
+    setVariableOptions: (name: VariableName, options: VariableOption[]) => void;
+    setVariableLoading: (name: VariableName, loading: boolean) => void;
+    setVariableDefinitions: (definitions: VariableDefinition[]) => void;
 };
 export declare function useTemplateVariableValues(variableNames?: string[]): VariableStateMap;
 export declare function useTemplateVariable(name: string): {
@@ -13,7 +16,9 @@ export declare function useTemplateVariable(name: string): {
 };
 export declare function useTemplateVariableActions(): {
     setVariableValue: (variableName: string, value: VariableValue) => void;
-    loadTemplateVariable: (name: string) => Promise<void>;
+    setVariableLoading: (name: string, loading: boolean) => void;
+    setVariableOptions: (name: string, options: VariableOption[]) => void;
+    setVariableDefinitions: (definitions: VariableDefinition[]) => void;
 };
 export declare function useTemplateVariableDefinitions(): VariableDefinition[];
 export declare function useTemplateVariableStore(): TemplateVariableStore;

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

@@ -1 +1 @@
-{"version":3,"file":"TemplateVariableProvider.d.ts","sourceRoot":"","sources":["../../src/context/TemplateVariableProvider.tsx"],"names":[],"mappings":";AAkBA,OAAO,EACL,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,aAAa,EAEb,kBAAkB,EAEnB,MAAM,kBAAkB,CAAC;AAE1B,aAAK,qBAAqB,GAAG;IAC3B,mBAAmB,EAAE,kBAAkB,EAAE,CAAC;IAC1C,aAAa,EAAE,gBAAgB,CAAC;IAChC,gBAAgB,EAAE,CAAC,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7E,oBAAoB,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7D,CAAC;AAaF,wBAAgB,yBAAyB,CAAC,aAAa,CAAC,EAAE,MAAM,EAAE,oBAqBjE;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,MAAM;;;EAU/C;AAED,wBAAgB,0BAA0B;;;EAQzC;AAED,wBAAgB,8BAA8B,yBAG7C;AAED,wBAAgB,wBAAwB,0BAGvC;AA0ED,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,0BAA+B,GAChC,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0BAA0B,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACnD,eAQA"}
+{"version":3,"file":"TemplateVariableProvider.d.ts","sourceRoot":"","sources":["../../src/context/TemplateVariableProvider.tsx"],"names":[],"mappings":";AAiBA,OAAO,EAEL,gBAAgB,EAChB,aAAa,EACb,cAAc,EAEf,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAEnF,aAAK,qBAAqB,GAAG;IAC3B,mBAAmB,EAAE,kBAAkB,EAAE,CAAC;IAC1C,aAAa,EAAE,gBAAgB,CAAC;IAChC,gBAAgB,EAAE,CAAC,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7E,kBAAkB,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,IAAI,CAAC;IAC5E,kBAAkB,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACnE,sBAAsB,EAAE,CAAC,WAAW,EAAE,kBAAkB,EAAE,KAAK,IAAI,CAAC;CACrE,CAAC;AAaF,wBAAgB,yBAAyB,CAAC,aAAa,CAAC,EAAE,MAAM,EAAE,oBAqBjE;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,MAAM;;;EAU/C;AAED,wBAAgB,0BAA0B;;;;;EAUzC;AAED,wBAAgB,8BAA8B,yBAG7C;AAED,wBAAgB,wBAAwB,0BAGvC;AAoFD,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,0BAA+B,GAChC,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0BAA0B,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACnD,eAQA"}

package/dist/context/TemplateVariableProvider.js

@@ -1 +1,199 @@
-import{jsx as _jsx}from"react/jsx-runtime";import{createContext,useContext}from"react";import{createStore,useStore}from"zustand";import{immer}from"zustand/middleware/immer";import{devtools}from"zustand/middleware";import{TemplateVariableContext}from"@perses-dev/plugin-system";import{DEFAULT_ALL_VALUE as ALL_VALUE}from"@perses-dev/core";const TemplateVariableStoreContext=createContext(void 0);function useTemplateVariableStoreCtx(){const e=useContext(TemplateVariableStoreContext);if(!e)throw new Error("TemplateVariableStoreContext not initialized");return e}export function useTemplateVariableValues(e){const t=useTemplateVariableStoreCtx();return useStore(t,(t=>{const a=null!=e?e:Object.keys(t.variableState),r={};return a.forEach((e=>{const a=t.variableState[e];a&&(r[e]=a)})),r}),((e,t)=>JSON.stringify(e)===JSON.stringify(t)))}export function useTemplateVariable(e){const t=useTemplateVariableStoreCtx();return useStore(t,(t=>({state:t.variableState[e],definition:t.variableDefinitions.find((t=>t.name===e))})))}export function useTemplateVariableActions(){const e=useTemplateVariableStoreCtx();return useStore(e,(e=>({setVariableValue:e.setVariableValue,loadTemplateVariable:e.loadTemplateVariable})))}export function useTemplateVariableDefinitions(){const e=useTemplateVariableStoreCtx();return useStore(e,(e=>e.variableDefinitions))}export function useTemplateVariableStore(){const e=useTemplateVariableStoreCtx();return useStore(e)}function PluginProvider({children:e}){const t=useTemplateVariableValues();return _jsx(TemplateVariableContext.Provider,{value:{state:t},children:e})}function createTemplateVariableSrvStore({initialVariableDefinitions:e=[]}){return createStore()(devtools(immer(((t,a)=>({variableState:hydrateTemplateVariableStates(e),variableDefinitions:e,loadTemplateVariable:async e=>{const r=a().variableDefinitions.find((t=>t.name===e));if(!r)return;t((t=>{const a=t.variableState[e];a&&(a.loading=!0)}));const{data:i}=await loadTemplateVariables();r.options.allowAllValue&&i.unshift(getAllOption()),t((t=>{const a=t.variableState[e];a&&(a.options=i,a.loading=!1)}))},setVariableValue:(e,a)=>t((t=>{let r=a;const i=t.variableState[e];i&&(Array.isArray(r)&&r.includes(ALL_VALUE)&&(r=r.at(-1)===ALL_VALUE?[ALL_VALUE]:r.filter((e=>e!==ALL_VALUE))),i.value=r)}))})))))}export function TemplateVariableProvider({children:e,initialVariableDefinitions:t=[]}){const a=createTemplateVariableSrvStore({initialVariableDefinitions:t});return _jsx(TemplateVariableStoreContext.Provider,{value:a,children:_jsx(PluginProvider,{children:e})})}async function loadTemplateVariables(){const e=Math.floor(1e4*Math.random())+1e3;return await new Promise((t=>setTimeout(t,e))),{data:["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"].map((e=>({label:e,value:e})))}}function getAllOption(){return{label:"All",value:ALL_VALUE}}function hydrateTemplateVariableState(e){var t,a;const r=e,i={value:null,loading:!1};switch(r.kind){case"TextVariable":i.value=r.options.value;break;case"ListVariable":if(i.options=[],r.options.allowAllValue&&i.options.unshift({label:"All",value:ALL_VALUE}),i.options.length>0&&!i.value){const e=null!==(a=null===(t=i.options[0])||void 0===t?void 0:t.value)&&void 0!==a?a:null;null!==e&&(i.value=r.options.allowMultiple?[e]:e)}}return i}function hydrateTemplateVariableStates(e){const t={};return e.forEach((e=>{t[e.name]=hydrateTemplateVariableState(e)})),t}
+// 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 { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo, useState } from 'react';
+import { createStore, useStore } from 'zustand';
+import { immer } from 'zustand/middleware/immer';
+import { devtools } from 'zustand/middleware';
+import { TemplateVariableContext, DEFAULT_ALL_VALUE as ALL_VALUE } from '@perses-dev/plugin-system';
+const TemplateVariableStoreContext = /*#__PURE__*/ createContext(undefined);
+function useTemplateVariableStoreCtx() {
+    const context = useContext(TemplateVariableStoreContext);
+    if (!context) {
+        throw new Error('TemplateVariableStoreContext not initialized');
+    }
+    return context;
+}
+export function useTemplateVariableValues(variableNames) {
+    const store = useTemplateVariableStoreCtx();
+    const state = useStore(store, (s)=>{
+        const names = variableNames !== null && variableNames !== void 0 ? variableNames : Object.keys(s.variableState);
+        const vars = {};
+        names.forEach((name)=>{
+            const varState = s.variableState[name];
+            if (!varState) {
+                return;
+            }
+            vars[name] = varState;
+        });
+        return vars;
+    }, (left, right)=>{
+        return JSON.stringify(left) === JSON.stringify(right);
+    });
+    return state;
+}
+export function useTemplateVariable(name) {
+    const store = useTemplateVariableStoreCtx();
+    return useStore(store, (s)=>{
+        const variableState = s.variableState[name];
+        const definition = s.variableDefinitions.find((v)=>v.spec.name === name);
+        return {
+            state: variableState,
+            definition
+        };
+    });
+}
+export function useTemplateVariableActions() {
+    const store = useTemplateVariableStoreCtx();
+    return useStore(store, (s)=>{
+        return {
+            setVariableValue: s.setVariableValue,
+            setVariableLoading: s.setVariableLoading,
+            setVariableOptions: s.setVariableOptions,
+            setVariableDefinitions: s.setVariableDefinitions
+        };
+    });
+}
+export function useTemplateVariableDefinitions() {
+    const store = useTemplateVariableStoreCtx();
+    return useStore(store, (s)=>s.variableDefinitions);
+}
+export function useTemplateVariableStore() {
+    const store = useTemplateVariableStoreCtx();
+    return useStore(store);
+}
+function PluginProvider({ children  }) {
+    const originalValues = useTemplateVariableValues();
+    const values = useMemo(()=>{
+        const contextValues = {};
+        // This will loop through all the current variables values
+        // and update any variables that have ALL_VALUE as their current value
+        // to include all options.
+        Object.keys(originalValues).forEach((name)=>{
+            const v = {
+                ...originalValues[name]
+            };
+            if (v.value === ALL_VALUE) {
+                var ref;
+                var ref1;
+                v.value = (ref1 = (ref = v.options) === null || ref === void 0 ? void 0 : ref.map((o)=>o.value)) !== null && ref1 !== void 0 ? ref1 : null;
+            }
+            contextValues[name] = v;
+        });
+        return contextValues;
+    }, [
+        originalValues
+    ]);
+    return /*#__PURE__*/ _jsx(TemplateVariableContext.Provider, {
+        value: {
+            state: values
+        },
+        children: children
+    });
+}
+function createTemplateVariableSrvStore({ initialVariableDefinitions =[]  }) {
+    const store = createStore()(devtools(immer((set)=>({
+            variableState: hydrateTemplateVariableStates(initialVariableDefinitions),
+            variableDefinitions: initialVariableDefinitions,
+            setVariableDefinitions (definitions) {
+                set((state)=>{
+                    state.variableDefinitions = definitions;
+                    state.variableState = hydrateTemplateVariableStates(definitions);
+                });
+            },
+            setVariableOptions (name, options) {
+                set((state)=>{
+                    const varState = state.variableState[name];
+                    if (!varState) {
+                        return;
+                    }
+                    varState.options = options;
+                });
+            },
+            setVariableLoading (name, loading) {
+                set((state)=>{
+                    const varState = state.variableState[name];
+                    if (!varState) {
+                        return;
+                    }
+                    varState.loading = loading;
+                });
+            },
+            setVariableValue: (name, value)=>set((state)=>{
+                    let val = value;
+                    const varState = state.variableState[name];
+                    if (!varState) {
+                        return;
+                    }
+                    // Make sure there is only one all value
+                    if (Array.isArray(val) && val.includes(ALL_VALUE)) {
+                        if (val.at(-1) === ALL_VALUE) {
+                            val = ALL_VALUE;
+                        } else {
+                            val = val.filter((v)=>v !== ALL_VALUE);
+                        }
+                    }
+                    varState.value = val;
+                })
+        }))));
+    return store;
+}
+export function TemplateVariableProvider({ children , initialVariableDefinitions =[]  }) {
+    const [store] = useState(createTemplateVariableSrvStore({
+        initialVariableDefinitions
+    }));
+    return /*#__PURE__*/ _jsx(TemplateVariableStoreContext.Provider, {
+        value: store,
+        children: /*#__PURE__*/ _jsx(PluginProvider, {
+            children: children
+        })
+    });
+}
+/** Helpers */ function hydrateTemplateVariableState(definition) {
+    const v = definition;
+    var _default_value;
+    const varState = {
+        value: (_default_value = v.spec.default_value) !== null && _default_value !== void 0 ? _default_value : null,
+        loading: false
+    };
+    switch(v.kind){
+        case 'TextVariable':
+            varState.value = v.spec.value;
+            break;
+        case 'ListVariable':
+            varState.options = [];
+            if (varState.options.length > 0 && !varState.value) {
+                var ref;
+                var ref1;
+                const firstOptionValue = (ref1 = (ref = varState.options[0]) === null || ref === void 0 ? void 0 : ref.value) !== null && ref1 !== void 0 ? ref1 : null;
+                if (firstOptionValue !== null) {
+                    varState.value = v.spec.allow_multiple ? [
+                        firstOptionValue
+                    ] : firstOptionValue;
+                }
+            }
+            break;
+        default:
+            break;
+    }
+    return varState;
+}
+function hydrateTemplateVariableStates(definitions) {
+    const state = {};
+    definitions.forEach((v)=>{
+        state[v.spec.name] = hydrateTemplateVariableState(v);
+    });
+    return state;
+}
+
+//# sourceMappingURL=TemplateVariableProvider.js.map

package/dist/context/TemplateVariableProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/TemplateVariableProvider.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 { createContext, useContext, useMemo, useState } from 'react';\nimport { createStore, useStore } from 'zustand';\nimport { immer } from 'zustand/middleware/immer';\nimport { devtools } from 'zustand/middleware';\nimport {\n  TemplateVariableContext,\n  VariableStateMap,\n  VariableState,\n  VariableOption,\n  DEFAULT_ALL_VALUE as ALL_VALUE,\n} from '@perses-dev/plugin-system';\nimport { VariableName, VariableValue, VariableDefinition } from '@perses-dev/core';\n\ntype TemplateVariableStore = {\n  variableDefinitions: VariableDefinition[];\n  variableState: VariableStateMap;\n  setVariableValue: (variableName: VariableName, value: VariableValue) => void;\n  setVariableOptions: (name: VariableName, options: VariableOption[]) => void;\n  setVariableLoading: (name: VariableName, loading: boolean) => void;\n  setVariableDefinitions: (definitions: VariableDefinition[]) => void;\n};\n\nconst TemplateVariableStoreContext = createContext<ReturnType<typeof createTemplateVariableSrvStore> | undefined>(\n  undefined\n);\nfunction useTemplateVariableStoreCtx() {\n  const context = useContext(TemplateVariableStoreContext);\n  if (!context) {\n    throw new Error('TemplateVariableStoreContext not initialized');\n  }\n  return context;\n}\n\nexport function useTemplateVariableValues(variableNames?: string[]) {\n  const store = useTemplateVariableStoreCtx();\n  const state = useStore(\n    store,\n    (s) => {\n      const names = variableNames ?? Object.keys(s.variableState);\n      const vars: VariableStateMap = {};\n      names.forEach((name) => {\n        const varState = s.variableState[name];\n        if (!varState) {\n          return;\n        }\n        vars[name] = varState;\n      });\n      return vars;\n    },\n    (left, right) => {\n      return JSON.stringify(left) === JSON.stringify(right);\n    }\n  );\n  return state;\n}\n\nexport function useTemplateVariable(name: string) {\n  const store = useTemplateVariableStoreCtx();\n  return useStore(store, (s) => {\n    const variableState = s.variableState[name];\n    const definition = s.variableDefinitions.find((v) => v.spec.name === name);\n    return {\n      state: variableState,\n      definition,\n    };\n  });\n}\n\nexport function useTemplateVariableActions() {\n  const store = useTemplateVariableStoreCtx();\n  return useStore(store, (s) => {\n    return {\n      setVariableValue: s.setVariableValue,\n      setVariableLoading: s.setVariableLoading,\n      setVariableOptions: s.setVariableOptions,\n      setVariableDefinitions: s.setVariableDefinitions,\n    };\n  });\n}\n\nexport function useTemplateVariableDefinitions() {\n  const store = useTemplateVariableStoreCtx();\n  return useStore(store, (s) => s.variableDefinitions);\n}\n\nexport function useTemplateVariableStore() {\n  const store = useTemplateVariableStoreCtx();\n  return useStore(store);\n}\n\nfunction PluginProvider({ children }: { children: React.ReactNode }) {\n  const originalValues = useTemplateVariableValues();\n\n  const values = useMemo(() => {\n    const contextValues: VariableStateMap = {};\n\n    // This will loop through all the current variables values\n    // and update any variables that have ALL_VALUE as their current value\n    // to include all options.\n    Object.keys(originalValues).forEach((name) => {\n      const v = { ...originalValues[name] } as VariableState;\n      if (v.value === ALL_VALUE) {\n        v.value = v.options?.map((o: { value: string }) => o.value) ?? null;\n      }\n      contextValues[name] = v;\n    });\n    return contextValues;\n  }, [originalValues]);\n\n  return <TemplateVariableContext.Provider value={{ state: values }}>{children}</TemplateVariableContext.Provider>;\n}\n\ninterface TemplateVariableSrvArgs {\n  initialVariableDefinitions?: VariableDefinition[];\n}\n\nfunction createTemplateVariableSrvStore({ initialVariableDefinitions = [] }: TemplateVariableSrvArgs) {\n  const store = createStore<TemplateVariableStore>()(\n    devtools(\n      immer((set) => ({\n        variableState: hydrateTemplateVariableStates(initialVariableDefinitions),\n        variableDefinitions: initialVariableDefinitions,\n        setVariableDefinitions(definitions: VariableDefinition[]) {\n          set((state) => {\n            state.variableDefinitions = definitions;\n            state.variableState = hydrateTemplateVariableStates(definitions);\n          });\n        },\n        setVariableOptions(name, options) {\n          set((state) => {\n            const varState = state.variableState[name];\n            if (!varState) {\n              return;\n            }\n            varState.options = options;\n          });\n        },\n        setVariableLoading(name, loading) {\n          set((state) => {\n            const varState = state.variableState[name];\n            if (!varState) {\n              return;\n            }\n            varState.loading = loading;\n          });\n        },\n\n        setVariableValue: (name, value) =>\n          set((state) => {\n            let val = value;\n            const varState = state.variableState[name];\n            if (!varState) {\n              return;\n            }\n\n            // Make sure there is only one all value\n            if (Array.isArray(val) && val.includes(ALL_VALUE)) {\n              if (val.at(-1) === ALL_VALUE) {\n                val = ALL_VALUE;\n              } else {\n                val = val.filter((v) => v !== ALL_VALUE);\n              }\n            }\n            varState.value = val;\n          }),\n      }))\n    )\n  );\n\n  return store;\n}\n\nexport function TemplateVariableProvider({\n  children,\n  initialVariableDefinitions = [],\n}: {\n  children: React.ReactNode;\n  initialVariableDefinitions?: VariableDefinition[];\n}) {\n  const [store] = useState(createTemplateVariableSrvStore({ initialVariableDefinitions }));\n\n  return (\n    <TemplateVariableStoreContext.Provider value={store}>\n      <PluginProvider>{children}</PluginProvider>\n    </TemplateVariableStoreContext.Provider>\n  );\n}\n\n/** Helpers */\n\nfunction hydrateTemplateVariableState(definition: VariableDefinition) {\n  const v = definition;\n  const varState: VariableState = {\n    value: v.spec.default_value ?? null,\n    loading: false,\n  };\n  switch (v.kind) {\n    case 'TextVariable':\n      varState.value = v.spec.value;\n      break;\n    case 'ListVariable':\n      varState.options = [];\n      if (varState.options.length > 0 && !varState.value) {\n        const firstOptionValue = varState.options[0]?.value ?? null;\n        if (firstOptionValue !== null) {\n          varState.value = v.spec.allow_multiple ? [firstOptionValue] : firstOptionValue;\n        }\n      }\n      break;\n    default:\n      break;\n  }\n  return varState;\n}\n\nfunction hydrateTemplateVariableStates(definitions: VariableDefinition[]): VariableStateMap {\n  const state: VariableStateMap = {};\n  definitions.forEach((v) => {\n    state[v.spec.name] = hydrateTemplateVariableState(v);\n  });\n  return state;\n}\n"],"names":["createContext","useContext","useMemo","useState","createStore","useStore","immer","devtools","TemplateVariableContext","DEFAULT_ALL_VALUE","ALL_VALUE","TemplateVariableStoreContext","undefined","useTemplateVariableStoreCtx","context","Error","useTemplateVariableValues","variableNames","store","state","s","names","Object","keys","variableState","vars","forEach","name","varState","left","right","JSON","stringify","useTemplateVariable","definition","variableDefinitions","find","v","spec","useTemplateVariableActions","setVariableValue","setVariableLoading","setVariableOptions","setVariableDefinitions","useTemplateVariableDefinitions","useTemplateVariableStore","PluginProvider","children","originalValues","values","contextValues","value","options","map","o","Provider","createTemplateVariableSrvStore","initialVariableDefinitions","set","hydrateTemplateVariableStates","definitions","loading","val","Array","isArray","includes","at","filter","TemplateVariableProvider","hydrateTemplateVariableState","default_value","kind","length","firstOptionValue","allow_multiple"],"mappings":"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"}

package/dist/context/TimeRangeProvider.js

@@ -1 +1,72 @@
-import{jsx as _jsx}from"react/jsx-runtime";import{useState,useMemo,useCallback}from"react";import{getUnixTime}from"date-fns";import{toAbsoluteTimeRange,isRelativeTimeRange}from"@perses-dev/core";import{TimeRangeContext,useQueryString}from"@perses-dev/plugin-system";export function TimeRangeProvider(e){const{initialTimeRange:t,children:i,onTimeRangeChange:n}=e,{queryString:s,setQueryString:r}=useQueryString(),a=isRelativeTimeRange(t)?toAbsoluteTimeRange(t):t,[o,m]=useState(a),g=useCallback((e=>{if(void 0===n)if(isRelativeTimeRange(e))r?(s.set("start",e.pastDuration),s.delete("end"),r(s)):m(toAbsoluteTimeRange(e));else if(r){const t=1e3*getUnixTime(e.start),i=1e3*getUnixTime(e.end);s.set("start",t.toString()),s.set("end",i.toString()),r(s)}else m(e);else n(e)}),[s,r,n]),u=useMemo((()=>({timeRange:o,setTimeRange:g})),[o,g]);return _jsx(TimeRangeContext.Provider,{value:u,children:i})}
+// 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 { jsx as _jsx } from "react/jsx-runtime";
+import React, { useState, useMemo, useCallback } from 'react';
+import { getUnixTime } from 'date-fns';
+import { toAbsoluteTimeRange, isRelativeTimeRange } from '@perses-dev/core';
+import { TimeRangeContext, useQueryString } from '@perses-dev/plugin-system';
+/**
+ * Provider implementation that supplies the time range state at runtime.
+ */ export function TimeRangeProvider(props) {
+    const { initialTimeRange , children , onTimeRangeChange  } = props;
+    const { queryString , setQueryString  } = useQueryString();
+    const defaultTimeRange = isRelativeTimeRange(initialTimeRange) ? toAbsoluteTimeRange(initialTimeRange) : initialTimeRange;
+    const [timeRange, setActiveTimeRange] = useState(defaultTimeRange);
+    const setTimeRange = useCallback((value)=>{
+        if (onTimeRangeChange !== undefined) {
+            // optional callback to override default behavior
+            onTimeRangeChange(value);
+            return;
+        }
+        if (isRelativeTimeRange(value)) {
+            if (setQueryString) {
+                queryString.set('start', value.pastDuration);
+                // end not required for relative time but may have been set by AbsoluteTimePicker or zoom
+                queryString.delete('end');
+                setQueryString(queryString);
+            } else {
+                setActiveTimeRange(toAbsoluteTimeRange(value));
+            }
+            return;
+        }
+        // allows app to specify whether query params should be source of truth for active time range
+        if (setQueryString) {
+            // Absolute URL example) ?start=1663707045000&end=1663713330000
+            // currently set from ViewDashboard initial queryString, AbsoluteTimePicker, or LineChart panel onDataZoom
+            const startUnixMs = getUnixTime(value.start) * 1000;
+            const endUnixMs = getUnixTime(value.end) * 1000;
+            queryString.set('start', startUnixMs.toString());
+            queryString.set('end', endUnixMs.toString());
+            setQueryString(queryString);
+        } else {
+            setActiveTimeRange(value);
+        }
+    }, [
+        queryString,
+        setQueryString,
+        onTimeRangeChange
+    ]);
+    const ctx = useMemo(()=>({
+            timeRange,
+            setTimeRange
+        }), [
+        timeRange,
+        setTimeRange
+    ]);
+    return /*#__PURE__*/ _jsx(TimeRangeContext.Provider, {
+        value: ctx,
+        children: children
+    });
+}
+
+//# sourceMappingURL=TimeRangeProvider.js.map

package/dist/context/TimeRangeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/TimeRangeProvider.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 React, { useState, useMemo, useCallback } from 'react';\nimport { getUnixTime } from 'date-fns';\nimport { TimeRangeValue, AbsoluteTimeRange, toAbsoluteTimeRange, isRelativeTimeRange } from '@perses-dev/core';\nimport { TimeRange, TimeRangeContext, useQueryString } from '@perses-dev/plugin-system';\n\nexport interface TimeRangeProviderProps {\n  initialTimeRange: TimeRangeValue;\n  children?: React.ReactNode;\n  onTimeRangeChange?: (e: TimeRangeValue) => void;\n}\n\n/**\n * Provider implementation that supplies the time range state at runtime.\n */\nexport function TimeRangeProvider(props: TimeRangeProviderProps) {\n  const { initialTimeRange, children, onTimeRangeChange } = props;\n\n  const { queryString, setQueryString } = useQueryString();\n\n  const defaultTimeRange: AbsoluteTimeRange = isRelativeTimeRange(initialTimeRange)\n    ? toAbsoluteTimeRange(initialTimeRange)\n    : initialTimeRange;\n\n  const [timeRange, setActiveTimeRange] = useState<AbsoluteTimeRange>(defaultTimeRange);\n\n  const setTimeRange: TimeRange['setTimeRange'] = useCallback(\n    (value: TimeRangeValue) => {\n      if (onTimeRangeChange !== undefined) {\n        // optional callback to override default behavior\n        onTimeRangeChange(value);\n        return;\n      }\n\n      if (isRelativeTimeRange(value)) {\n        if (setQueryString) {\n          queryString.set('start', value.pastDuration);\n          // end not required for relative time but may have been set by AbsoluteTimePicker or zoom\n          queryString.delete('end');\n          setQueryString(queryString);\n        } else {\n          setActiveTimeRange(toAbsoluteTimeRange(value));\n        }\n        return;\n      }\n\n      // allows app to specify whether query params should be source of truth for active time range\n      if (setQueryString) {\n        // Absolute URL example) ?start=1663707045000&end=1663713330000\n        // currently set from ViewDashboard initial queryString, AbsoluteTimePicker, or LineChart panel onDataZoom\n        const startUnixMs = getUnixTime(value.start) * 1000;\n        const endUnixMs = getUnixTime(value.end) * 1000;\n        queryString.set('start', startUnixMs.toString());\n        queryString.set('end', endUnixMs.toString());\n        setQueryString(queryString);\n      } else {\n        setActiveTimeRange(value);\n      }\n    },\n    [queryString, setQueryString, onTimeRangeChange]\n  );\n\n  const ctx = useMemo(() => ({ timeRange, setTimeRange }), [timeRange, setTimeRange]);\n\n  return <TimeRangeContext.Provider value={ctx}>{children}</TimeRangeContext.Provider>;\n}\n"],"names":["React","useState","useMemo","useCallback","getUnixTime","toAbsoluteTimeRange","isRelativeTimeRange","TimeRangeContext","useQueryString","TimeRangeProvider","props","initialTimeRange","children","onTimeRangeChange","queryString","setQueryString","defaultTimeRange","timeRange","setActiveTimeRange","setTimeRange","value","undefined","set","pastDuration","delete","startUnixMs","start","endUnixMs","end","toString","ctx","Provider"],"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,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,OAAO,EAAEC,WAAW,QAAQ,OAAO,CAAC;AAC9D,SAASC,WAAW,QAAQ,UAAU,CAAC;AACvC,SAA4CC,mBAAmB,EAAEC,mBAAmB,QAAQ,kBAAkB,CAAC;AAC/G,SAAoBC,gBAAgB,EAAEC,cAAc,QAAQ,2BAA2B,CAAC;AAQxF;;CAEC,GACD,OAAO,SAASC,iBAAiB,CAACC,KAA6B,EAAE;IAC/D,MAAM,EAAEC,gBAAgB,CAAA,EAAEC,QAAQ,CAAA,EAAEC,iBAAiB,CAAA,EAAE,GAAGH,KAAK,AAAC;IAEhE,MAAM,EAAEI,WAAW,CAAA,EAAEC,cAAc,CAAA,EAAE,GAAGP,cAAc,EAAE,AAAC;IAEzD,MAAMQ,gBAAgB,GAAsBV,mBAAmB,CAACK,gBAAgB,CAAC,GAC7EN,mBAAmB,CAACM,gBAAgB,CAAC,GACrCA,gBAAgB,AAAC;IAErB,MAAM,CAACM,SAAS,EAAEC,kBAAkB,CAAC,GAAGjB,QAAQ,CAAoBe,gBAAgB,CAAC,AAAC;IAEtF,MAAMG,YAAY,GAA8BhB,WAAW,CACzD,CAACiB,KAAqB,GAAK;QACzB,IAAIP,iBAAiB,KAAKQ,SAAS,EAAE;YACnC,iDAAiD;YACjDR,iBAAiB,CAACO,KAAK,CAAC,CAAC;YACzB,OAAO;QACT,CAAC;QAED,IAAId,mBAAmB,CAACc,KAAK,CAAC,EAAE;YAC9B,IAAIL,cAAc,EAAE;gBAClBD,WAAW,CAACQ,GAAG,CAAC,OAAO,EAAEF,KAAK,CAACG,YAAY,CAAC,CAAC;gBAC7C,yFAAyF;gBACzFT,WAAW,CAACU,MAAM,CAAC,KAAK,CAAC,CAAC;gBAC1BT,cAAc,CAACD,WAAW,CAAC,CAAC;YAC9B,OAAO;gBACLI,kBAAkB,CAACb,mBAAmB,CAACe,KAAK,CAAC,CAAC,CAAC;YACjD,CAAC;YACD,OAAO;QACT,CAAC;QAED,6FAA6F;QAC7F,IAAIL,cAAc,EAAE;YAClB,+DAA+D;YAC/D,0GAA0G;YAC1G,MAAMU,WAAW,GAAGrB,WAAW,CAACgB,KAAK,CAACM,KAAK,CAAC,GAAG,IAAI,AAAC;YACpD,MAAMC,SAAS,GAAGvB,WAAW,CAACgB,KAAK,CAACQ,GAAG,CAAC,GAAG,IAAI,AAAC;YAChDd,WAAW,CAACQ,GAAG,CAAC,OAAO,EAAEG,WAAW,CAACI,QAAQ,EAAE,CAAC,CAAC;YACjDf,WAAW,CAACQ,GAAG,CAAC,KAAK,EAAEK,SAAS,CAACE,QAAQ,EAAE,CAAC,CAAC;YAC7Cd,cAAc,CAACD,WAAW,CAAC,CAAC;QAC9B,OAAO;YACLI,kBAAkB,CAACE,KAAK,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC,EACD;QAACN,WAAW;QAAEC,cAAc;QAAEF,iBAAiB;KAAC,CACjD,AAAC;IAEF,MAAMiB,GAAG,GAAG5B,OAAO,CAAC,IAAO,CAAA;YAAEe,SAAS;YAAEE,YAAY;SAAE,CAAA,AAAC,EAAE;QAACF,SAAS;QAAEE,YAAY;KAAC,CAAC,AAAC;IAEpF,qBAAO,KAACZ,gBAAgB,CAACwB,QAAQ;QAACX,KAAK,EAAEU,GAAG;kBAAGlB,QAAQ;MAA6B,CAAC;AACvF,CAAC"}

package/dist/context/index.d.ts

@@ -1,7 +1,6 @@
-export * from './DashboardAppSlice';
-export * from './LayoutsSlice';
-export * from './TemplateVariableProvider';
 export * from './DashboardProvider';
-export * from './TimeRangeProvider';
+export * from './DatasourceStoreProvider';
 export * from './QueryStringProvider';
+export * from './TemplateVariableProvider';
+export * from './TimeRangeProvider';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAaA,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAaA,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC"}