@perses-dev/plugin-system 0.50.1 → 0.51.0-beta.0

package/dist/components/PluginRegistry/PluginRegistry.js

@@ -35,21 +35,21 @@ import { usePluginIndexes, getTypeAndKindKey } from './plugin-indexes';
         }
         return request;
     });
-    const getPlugin = useCallback(async (pluginType, kind)=>{
+    const getPlugin = useCallback(async (kind, name)=>{
         // Get the indexes of the installed plugins
         const pluginIndexes = await getPluginIndexes();
         // Figure out what module the plugin is in by looking in the index
-        const typeAndKindKey = getTypeAndKindKey(pluginType, kind);
-        const resource = pluginIndexes.pluginResourcesByTypeAndKind.get(typeAndKindKey);
+        const typeAndKindKey = getTypeAndKindKey(kind, name);
+        const resource = pluginIndexes.pluginResourcesByNameAndKind.get(typeAndKindKey);
         if (resource === undefined) {
-            throw new Error(`A ${pluginType} plugin for kind '${kind}' is not installed`);
+            throw new Error(`A ${name} plugin for kind '${kind}' is not installed`);
         }
         // Treat the plugin module as a bunch of named exports that have plugins
         const pluginModule = await loadPluginModule(resource);
         // We currently assume that plugin modules will have named exports that match the kinds they handle
-        const plugin = pluginModule[kind];
+        const plugin = pluginModule[name];
         if (plugin === undefined) {
-            throw new Error(`The ${pluginType} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`);
+            throw new Error(`The ${name} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`);
         }
         return plugin;
     }, [
@@ -58,10 +58,7 @@ import { usePluginIndexes, getTypeAndKindKey } from './plugin-indexes';
     ]);
     const listPluginMetadata = useCallback(async (pluginTypes)=>{
         const pluginIndexes = await getPluginIndexes();
-        return pluginTypes.flatMap((type)=>{
-            var _pluginIndexes_pluginMetadataByType_get;
-            return (_pluginIndexes_pluginMetadataByType_get = pluginIndexes.pluginMetadataByType.get(type)) !== null && _pluginIndexes_pluginMetadataByType_get !== void 0 ? _pluginIndexes_pluginMetadataByType_get : [];
-        });
+        return pluginTypes.flatMap((type)=>pluginIndexes.pluginMetadataByKind.get(type) ?? []);
     }, [
         getPluginIndexes
     ]);

package/dist/components/PluginRegistry/PluginRegistry.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginRegistry/PluginRegistry.tsx"],"sourcesContent":["// Copyright 2023 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 { UnknownSpec, useEvent } from '@perses-dev/core';\nimport { useRef, useCallback, useMemo, ReactNode, ReactElement } from 'react';\nimport {\n  PluginModuleResource,\n  PluginType,\n  PluginImplementation,\n  Plugin,\n  PluginLoader,\n  DefaultPluginKinds,\n} from '../../model';\nimport { PluginRegistryContext } from '../../runtime';\nimport { usePluginIndexes, getTypeAndKindKey } from './plugin-indexes';\n\nexport interface PluginRegistryProps {\n  pluginLoader: PluginLoader;\n  defaultPluginKinds?: DefaultPluginKinds;\n  children?: ReactNode;\n}\n\n/**\n * PluginRegistryContext provider that keeps track of all available plugins and provides an API for getting them or\n * querying the metadata about them.\n */\nexport function PluginRegistry(props: PluginRegistryProps): ReactElement {\n  const {\n    pluginLoader: { getInstalledPlugins, importPluginModule },\n    children,\n    defaultPluginKinds,\n  } = props;\n\n  const getPluginIndexes = usePluginIndexes(getInstalledPlugins);\n\n  // De-dupe calls to import plugin modules\n  const importCache = useRef(new Map<PluginModuleResource, Promise<unknown>>());\n\n  // Do useEvent here since this accesses the importPluginModule prop and we want a stable reference to it for the\n  // callback below\n  const loadPluginModule = useEvent((resource: PluginModuleResource) => {\n    let request = importCache.current.get(resource);\n    if (request === undefined) {\n      request = importPluginModule(resource);\n      importCache.current.set(resource, request);\n\n      // Remove failed requests from the cache so they can potentially be retried\n      request.catch(() => importCache.current.delete(resource));\n    }\n    return request;\n  });\n\n  const getPlugin = useCallback(\n    async <T extends PluginType>(pluginType: T, kind: string): Promise<PluginImplementation<T>> => {\n      // Get the indexes of the installed plugins\n      const pluginIndexes = await getPluginIndexes();\n\n      // Figure out what module the plugin is in by looking in the index\n      const typeAndKindKey = getTypeAndKindKey(pluginType, kind);\n      const resource = pluginIndexes.pluginResourcesByTypeAndKind.get(typeAndKindKey);\n      if (resource === undefined) {\n        throw new Error(`A ${pluginType} plugin for kind '${kind}' is not installed`);\n      }\n\n      // Treat the plugin module as a bunch of named exports that have plugins\n      const pluginModule = (await loadPluginModule(resource)) as Record<string, Plugin<UnknownSpec>>;\n\n      // We currently assume that plugin modules will have named exports that match the kinds they handle\n      const plugin = pluginModule[kind];\n      if (plugin === undefined) {\n        throw new Error(\n          `The ${pluginType} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`\n        );\n      }\n\n      return plugin as PluginImplementation<T>;\n    },\n    [getPluginIndexes, loadPluginModule]\n  );\n\n  const listPluginMetadata = useCallback(\n    async (pluginTypes: PluginType[]) => {\n      const pluginIndexes = await getPluginIndexes();\n      return pluginTypes.flatMap((type) => pluginIndexes.pluginMetadataByType.get(type) ?? []);\n    },\n    [getPluginIndexes]\n  );\n\n  // Create the registry's context value and render\n  const context = useMemo(\n    () => ({ getPlugin, listPluginMetadata, defaultPluginKinds }),\n    [getPlugin, listPluginMetadata, defaultPluginKinds]\n  );\n  return <PluginRegistryContext.Provider value={context}>{children}</PluginRegistryContext.Provider>;\n}\n"],"names":["useEvent","useRef","useCallback","useMemo","PluginRegistryContext","usePluginIndexes","getTypeAndKindKey","PluginRegistry","props","pluginLoader","getInstalledPlugins","importPluginModule","children","defaultPluginKinds","getPluginIndexes","importCache","Map","loadPluginModule","resource","request","current","get","undefined","set","catch","delete","getPlugin","pluginType","kind","pluginIndexes","typeAndKindKey","pluginResourcesByTypeAndKind","Error","pluginModule","plugin","metadata","name","listPluginMetadata","pluginTypes","flatMap","type","pluginMetadataByType","context","Provider","value"],"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,SAAsBA,QAAQ,QAAQ,mBAAmB;AACzD,SAASC,MAAM,EAAEC,WAAW,EAAEC,OAAO,QAAiC,QAAQ;AAS9E,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,gBAAgB,EAAEC,iBAAiB,QAAQ,mBAAmB;AAQvE;;;CAGC,GACD,OAAO,SAASC,eAAeC,KAA0B;IACvD,MAAM,EACJC,cAAc,EAAEC,mBAAmB,EAAEC,kBAAkB,EAAE,EACzDC,QAAQ,EACRC,kBAAkB,EACnB,GAAGL;IAEJ,MAAMM,mBAAmBT,iBAAiBK;IAE1C,yCAAyC;IACzC,MAAMK,cAAcd,OAAO,IAAIe;IAE/B,gHAAgH;IAChH,iBAAiB;IACjB,MAAMC,mBAAmBjB,SAAS,CAACkB;QACjC,IAAIC,UAAUJ,YAAYK,OAAO,CAACC,GAAG,CAACH;QACtC,IAAIC,YAAYG,WAAW;YACzBH,UAAUR,mBAAmBO;YAC7BH,YAAYK,OAAO,CAACG,GAAG,CAACL,UAAUC;YAElC,2EAA2E;YAC3EA,QAAQK,KAAK,CAAC,IAAMT,YAAYK,OAAO,CAACK,MAAM,CAACP;QACjD;QACA,OAAOC;IACT;IAEA,MAAMO,YAAYxB,YAChB,OAA6ByB,YAAeC;QAC1C,2CAA2C;QAC3C,MAAMC,gBAAgB,MAAMf;QAE5B,kEAAkE;QAClE,MAAMgB,iBAAiBxB,kBAAkBqB,YAAYC;QACrD,MAAMV,WAAWW,cAAcE,4BAA4B,CAACV,GAAG,CAACS;QAChE,IAAIZ,aAAaI,WAAW;YAC1B,MAAM,IAAIU,MAAM,CAAC,EAAE,EAAEL,WAAW,kBAAkB,EAAEC,KAAK,kBAAkB,CAAC;QAC9E;QAEA,wEAAwE;QACxE,MAAMK,eAAgB,MAAMhB,iBAAiBC;QAE7C,mGAAmG;QACnG,MAAMgB,SAASD,YAAY,CAACL,KAAK;QACjC,IAAIM,WAAWZ,WAAW;YACxB,MAAM,IAAIU,MACR,CAAC,IAAI,EAAEL,WAAW,kBAAkB,EAAEC,KAAK,sBAAsB,EAAEV,SAASiB,QAAQ,CAACC,IAAI,CAAC,cAAc,CAAC;QAE7G;QAEA,OAAOF;IACT,GACA;QAACpB;QAAkBG;KAAiB;IAGtC,MAAMoB,qBAAqBnC,YACzB,OAAOoC;QACL,MAAMT,gBAAgB,MAAMf;QAC5B,OAAOwB,YAAYC,OAAO,CAAC,CAACC;gBAASX;mBAAAA,CAAAA,0CAAAA,cAAcY,oBAAoB,CAACpB,GAAG,CAACmB,mBAAvCX,qDAAAA,0CAAgD,EAAE;;IACzF,GACA;QAACf;KAAiB;IAGpB,iDAAiD;IACjD,MAAM4B,UAAUvC,QACd,IAAO,CAAA;YAAEuB;YAAWW;YAAoBxB;QAAmB,CAAA,GAC3D;QAACa;QAAWW;QAAoBxB;KAAmB;IAErD,qBAAO,KAACT,sBAAsBuC,QAAQ;QAACC,OAAOF;kBAAU9B;;AAC1D"}
+{"version":3,"sources":["../../../src/components/PluginRegistry/PluginRegistry.tsx"],"sourcesContent":["// Copyright 2023 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 { UnknownSpec, useEvent } from '@perses-dev/core';\nimport { useRef, useCallback, useMemo, ReactNode, ReactElement } from 'react';\nimport {\n  PluginModuleResource,\n  PluginType,\n  PluginImplementation,\n  Plugin,\n  PluginLoader,\n  DefaultPluginKinds,\n} from '../../model';\nimport { PluginRegistryContext } from '../../runtime';\nimport { usePluginIndexes, getTypeAndKindKey } from './plugin-indexes';\n\nexport interface PluginRegistryProps {\n  pluginLoader: PluginLoader;\n  defaultPluginKinds?: DefaultPluginKinds;\n  children?: ReactNode;\n}\n\n/**\n * PluginRegistryContext provider that keeps track of all available plugins and provides an API for getting them or\n * querying the metadata about them.\n */\nexport function PluginRegistry(props: PluginRegistryProps): ReactElement {\n  const {\n    pluginLoader: { getInstalledPlugins, importPluginModule },\n    children,\n    defaultPluginKinds,\n  } = props;\n\n  const getPluginIndexes = usePluginIndexes(getInstalledPlugins);\n\n  // De-dupe calls to import plugin modules\n  const importCache = useRef(new Map<PluginModuleResource, Promise<unknown>>());\n\n  // Do useEvent here since this accesses the importPluginModule prop and we want a stable reference to it for the\n  // callback below\n  const loadPluginModule = useEvent((resource: PluginModuleResource) => {\n    let request = importCache.current.get(resource);\n    if (request === undefined) {\n      request = importPluginModule(resource);\n      importCache.current.set(resource, request);\n\n      // Remove failed requests from the cache so they can potentially be retried\n      request.catch(() => importCache.current.delete(resource));\n    }\n    return request;\n  });\n\n  const getPlugin = useCallback(\n    async <T extends PluginType>(kind: T, name: string): Promise<PluginImplementation<T>> => {\n      // Get the indexes of the installed plugins\n      const pluginIndexes = await getPluginIndexes();\n\n      // Figure out what module the plugin is in by looking in the index\n      const typeAndKindKey = getTypeAndKindKey(kind, name);\n      const resource = pluginIndexes.pluginResourcesByNameAndKind.get(typeAndKindKey);\n      if (resource === undefined) {\n        throw new Error(`A ${name} plugin for kind '${kind}' is not installed`);\n      }\n\n      // Treat the plugin module as a bunch of named exports that have plugins\n      const pluginModule = (await loadPluginModule(resource)) as Record<string, Plugin<UnknownSpec>>;\n\n      // We currently assume that plugin modules will have named exports that match the kinds they handle\n      const plugin = pluginModule[name];\n      if (plugin === undefined) {\n        throw new Error(\n          `The ${name} plugin for kind '${kind}' is missing from the ${resource.metadata.name} plugin module`\n        );\n      }\n\n      return plugin as PluginImplementation<T>;\n    },\n    [getPluginIndexes, loadPluginModule]\n  );\n\n  const listPluginMetadata = useCallback(\n    async (pluginTypes: string[]) => {\n      const pluginIndexes = await getPluginIndexes();\n      return pluginTypes.flatMap((type) => pluginIndexes.pluginMetadataByKind.get(type) ?? []);\n    },\n    [getPluginIndexes]\n  );\n\n  // Create the registry's context value and render\n  const context = useMemo(\n    () => ({ getPlugin, listPluginMetadata, defaultPluginKinds }),\n    [getPlugin, listPluginMetadata, defaultPluginKinds]\n  );\n  return <PluginRegistryContext.Provider value={context}>{children}</PluginRegistryContext.Provider>;\n}\n"],"names":["useEvent","useRef","useCallback","useMemo","PluginRegistryContext","usePluginIndexes","getTypeAndKindKey","PluginRegistry","props","pluginLoader","getInstalledPlugins","importPluginModule","children","defaultPluginKinds","getPluginIndexes","importCache","Map","loadPluginModule","resource","request","current","get","undefined","set","catch","delete","getPlugin","kind","name","pluginIndexes","typeAndKindKey","pluginResourcesByNameAndKind","Error","pluginModule","plugin","metadata","listPluginMetadata","pluginTypes","flatMap","type","pluginMetadataByKind","context","Provider","value"],"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,SAAsBA,QAAQ,QAAQ,mBAAmB;AACzD,SAASC,MAAM,EAAEC,WAAW,EAAEC,OAAO,QAAiC,QAAQ;AAS9E,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,gBAAgB,EAAEC,iBAAiB,QAAQ,mBAAmB;AAQvE;;;CAGC,GACD,OAAO,SAASC,eAAeC,KAA0B;IACvD,MAAM,EACJC,cAAc,EAAEC,mBAAmB,EAAEC,kBAAkB,EAAE,EACzDC,QAAQ,EACRC,kBAAkB,EACnB,GAAGL;IAEJ,MAAMM,mBAAmBT,iBAAiBK;IAE1C,yCAAyC;IACzC,MAAMK,cAAcd,OAAO,IAAIe;IAE/B,gHAAgH;IAChH,iBAAiB;IACjB,MAAMC,mBAAmBjB,SAAS,CAACkB;QACjC,IAAIC,UAAUJ,YAAYK,OAAO,CAACC,GAAG,CAACH;QACtC,IAAIC,YAAYG,WAAW;YACzBH,UAAUR,mBAAmBO;YAC7BH,YAAYK,OAAO,CAACG,GAAG,CAACL,UAAUC;YAElC,2EAA2E;YAC3EA,QAAQK,KAAK,CAAC,IAAMT,YAAYK,OAAO,CAACK,MAAM,CAACP;QACjD;QACA,OAAOC;IACT;IAEA,MAAMO,YAAYxB,YAChB,OAA6ByB,MAASC;QACpC,2CAA2C;QAC3C,MAAMC,gBAAgB,MAAMf;QAE5B,kEAAkE;QAClE,MAAMgB,iBAAiBxB,kBAAkBqB,MAAMC;QAC/C,MAAMV,WAAWW,cAAcE,4BAA4B,CAACV,GAAG,CAACS;QAChE,IAAIZ,aAAaI,WAAW;YAC1B,MAAM,IAAIU,MAAM,CAAC,EAAE,EAAEJ,KAAK,kBAAkB,EAAED,KAAK,kBAAkB,CAAC;QACxE;QAEA,wEAAwE;QACxE,MAAMM,eAAgB,MAAMhB,iBAAiBC;QAE7C,mGAAmG;QACnG,MAAMgB,SAASD,YAAY,CAACL,KAAK;QACjC,IAAIM,WAAWZ,WAAW;YACxB,MAAM,IAAIU,MACR,CAAC,IAAI,EAAEJ,KAAK,kBAAkB,EAAED,KAAK,sBAAsB,EAAET,SAASiB,QAAQ,CAACP,IAAI,CAAC,cAAc,CAAC;QAEvG;QAEA,OAAOM;IACT,GACA;QAACpB;QAAkBG;KAAiB;IAGtC,MAAMmB,qBAAqBlC,YACzB,OAAOmC;QACL,MAAMR,gBAAgB,MAAMf;QAC5B,OAAOuB,YAAYC,OAAO,CAAC,CAACC,OAASV,cAAcW,oBAAoB,CAACnB,GAAG,CAACkB,SAAS,EAAE;IACzF,GACA;QAACzB;KAAiB;IAGpB,iDAAiD;IACjD,MAAM2B,UAAUtC,QACd,IAAO,CAAA;YAAEuB;YAAWU;YAAoBvB;QAAmB,CAAA,GAC3D;QAACa;QAAWU;QAAoBvB;KAAmB;IAErD,qBAAO,KAACT,sBAAsBsC,QAAQ;QAACC,OAAOF;kBAAU7B;;AAC1D"}

package/dist/components/PluginRegistry/plugin-indexes.d.ts

@@ -1,7 +1,7 @@
-import { PluginLoader, PluginMetadata, PluginModuleResource, PluginType } from '../../model';
+import { PluginLoader, PluginMetadataWithModule, PluginModuleResource, PluginType } from '../../model';
 export interface PluginIndexes {
-    pluginResourcesByTypeAndKind: Map<string, PluginModuleResource>;
-    pluginMetadataByType: Map<PluginType, PluginMetadata[]>;
+    pluginResourcesByNameAndKind: Map<string, PluginModuleResource>;
+    pluginMetadataByKind: Map<string, PluginMetadataWithModule[]>;
 }
 /**
  * Returns an async callback for getting indexes of the installed plugin data.
@@ -10,5 +10,5 @@ export declare function usePluginIndexes(getInstalledPlugins: PluginLoader['getI
 /**
  * Gets a unique key for a plugin type/kind that can be used as a cache key.
  */
-export declare function getTypeAndKindKey(pluginType: PluginType, kind: string): string;
+export declare function getTypeAndKindKey(kind: PluginType, name: string): string;
 //# sourceMappingURL=plugin-indexes.d.ts.map

package/dist/components/PluginRegistry/plugin-indexes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin-indexes.d.ts","sourceRoot":"","sources":["../../../src/components/PluginRegistry/plugin-indexes.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,oBAAoB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE7F,MAAM,WAAW,aAAa;IAE5B,4BAA4B,EAAE,GAAG,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAEhE,oBAAoB,EAAE,GAAG,CAAC,UAAU,EAAE,cAAc,EAAE,CAAC,CAAC;CACzD;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,mBAAmB,EAAE,YAAY,CAAC,qBAAqB,CAAC,GACvD,MAAM,OAAO,CAAC,aAAa,CAAC,CAoD9B;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAE9E"}
+{"version":3,"file":"plugin-indexes.d.ts","sourceRoot":"","sources":["../../../src/components/PluginRegistry/plugin-indexes.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,YAAY,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEvG,MAAM,WAAW,aAAa;IAE5B,4BAA4B,EAAE,GAAG,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAEhE,oBAAoB,EAAE,GAAG,CAAC,MAAM,EAAE,wBAAwB,EAAE,CAAC,CAAC;CAC/D;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,mBAAmB,EAAE,YAAY,CAAC,qBAAqB,CAAC,GACvD,MAAM,OAAO,CAAC,aAAa,CAAC,CAuD9B;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAExE"}

package/dist/components/PluginRegistry/plugin-indexes.js

@@ -20,29 +20,32 @@ import { useCallback, useRef } from 'react';
     const createPluginIndexes = useEvent(async ()=>{
         const installedPlugins = await getInstalledPlugins();
         // Create the two indexes from the installed plugins
-        const pluginResourcesByTypeAndKind = new Map();
-        const pluginMetadataByType = new Map();
+        const pluginResourcesByNameAndKind = new Map();
+        const pluginMetadataByKind = new Map();
         for (const resource of installedPlugins){
             for (const pluginMetadata of resource.spec.plugins){
-                const { pluginType, kind } = pluginMetadata;
+                const { kind, spec: { name } } = pluginMetadata;
                 // Index the plugin by type and kind to point at the module that contains it
-                const key = getTypeAndKindKey(pluginType, kind);
-                if (pluginResourcesByTypeAndKind.has(key)) {
-                    console.warn(`Got more than one ${pluginType} plugin for kind ${kind}`);
+                const key = getTypeAndKindKey(kind, name);
+                if (pluginResourcesByNameAndKind.has(key)) {
+                    console.warn(`Got more than one ${kind} plugin for kind ${name}`);
                 }
-                pluginResourcesByTypeAndKind.set(key, resource);
+                pluginResourcesByNameAndKind.set(key, resource);
                 // Index the metadata by plugin type
-                let list = pluginMetadataByType.get(pluginType);
+                let list = pluginMetadataByKind.get(kind);
                 if (list === undefined) {
                     list = [];
-                    pluginMetadataByType.set(pluginType, list);
+                    pluginMetadataByKind.set(kind, list);
                 }
-                list.push(pluginMetadata);
+                list.push({
+                    ...pluginMetadata,
+                    module: resource.metadata
+                });
             }
         }
         return {
-            pluginResourcesByTypeAndKind,
-            pluginMetadataByType
+            pluginResourcesByNameAndKind,
+            pluginMetadataByKind
         };
     });
     // De-dupe creating plugin indexes (i.e. requests to get installed plugins)
@@ -63,8 +66,8 @@ import { useCallback, useRef } from 'react';
 }
 /**
  * Gets a unique key for a plugin type/kind that can be used as a cache key.
- */ export function getTypeAndKindKey(pluginType, kind) {
-    return `${pluginType}:${kind}`;
+ */ export function getTypeAndKindKey(kind, name) {
+    return `${kind}:${name}`;
 }
 
 //# sourceMappingURL=plugin-indexes.js.map

package/dist/components/PluginRegistry/plugin-indexes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginRegistry/plugin-indexes.ts"],"sourcesContent":["// Copyright 2023 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 { useEvent } from '@perses-dev/core';\nimport { useCallback, useRef } from 'react';\nimport { PluginLoader, PluginMetadata, PluginModuleResource, PluginType } from '../../model';\n\nexport interface PluginIndexes {\n  // Plugin resources by plugin type and kind (i.e. look up what module a plugin type and kind is in)\n  pluginResourcesByTypeAndKind: Map<string, PluginModuleResource>;\n  // Plugin metadata by plugin type\n  pluginMetadataByType: Map<PluginType, PluginMetadata[]>;\n}\n\n/**\n * Returns an async callback for getting indexes of the installed plugin data.\n */\nexport function usePluginIndexes(\n  getInstalledPlugins: PluginLoader['getInstalledPlugins']\n): () => Promise<PluginIndexes> {\n  // Creates indexes from the installed plugins data (does useEvent because this accesses the getInstalledPlugins prop\n  // and we want a stable reference for the callback below)\n  const createPluginIndexes = useEvent(async (): Promise<PluginIndexes> => {\n    const installedPlugins = await getInstalledPlugins();\n\n    // Create the two indexes from the installed plugins\n    const pluginResourcesByTypeAndKind = new Map<string, PluginModuleResource>();\n    const pluginMetadataByType = new Map<PluginType, PluginMetadata[]>();\n\n    for (const resource of installedPlugins) {\n      for (const pluginMetadata of resource.spec.plugins) {\n        const { pluginType, kind } = pluginMetadata;\n\n        // Index the plugin by type and kind to point at the module that contains it\n        const key = getTypeAndKindKey(pluginType, kind);\n        if (pluginResourcesByTypeAndKind.has(key)) {\n          console.warn(`Got more than one ${pluginType} plugin for kind ${kind}`);\n        }\n        pluginResourcesByTypeAndKind.set(key, resource);\n\n        // Index the metadata by plugin type\n        let list = pluginMetadataByType.get(pluginType);\n        if (list === undefined) {\n          list = [];\n          pluginMetadataByType.set(pluginType, list);\n        }\n        list.push(pluginMetadata);\n      }\n    }\n\n    return {\n      pluginResourcesByTypeAndKind,\n      pluginMetadataByType,\n    };\n  });\n\n  // De-dupe creating plugin indexes (i.e. requests to get installed plugins)\n  const pluginIndexesCache = useRef<Promise<PluginIndexes> | undefined>(undefined);\n  const getPluginIndexes = useCallback(() => {\n    let request = pluginIndexesCache.current;\n    if (request === undefined) {\n      request = createPluginIndexes();\n      pluginIndexesCache.current = request;\n\n      // Remove failed requests from the cache so they can potentially be retried\n      request.catch(() => pluginIndexesCache.current === undefined);\n    }\n    return request;\n  }, [createPluginIndexes]);\n\n  return getPluginIndexes;\n}\n\n/**\n * Gets a unique key for a plugin type/kind that can be used as a cache key.\n */\nexport function getTypeAndKindKey(pluginType: PluginType, kind: string): string {\n  return `${pluginType}:${kind}`;\n}\n"],"names":["useEvent","useCallback","useRef","usePluginIndexes","getInstalledPlugins","createPluginIndexes","installedPlugins","pluginResourcesByTypeAndKind","Map","pluginMetadataByType","resource","pluginMetadata","spec","plugins","pluginType","kind","key","getTypeAndKindKey","has","console","warn","set","list","get","undefined","push","pluginIndexesCache","getPluginIndexes","request","current","catch"],"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,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAQ;AAU5C;;CAEC,GACD,OAAO,SAASC,iBACdC,mBAAwD;IAExD,oHAAoH;IACpH,yDAAyD;IACzD,MAAMC,sBAAsBL,SAAS;QACnC,MAAMM,mBAAmB,MAAMF;QAE/B,oDAAoD;QACpD,MAAMG,+BAA+B,IAAIC;QACzC,MAAMC,uBAAuB,IAAID;QAEjC,KAAK,MAAME,YAAYJ,iBAAkB;YACvC,KAAK,MAAMK,kBAAkBD,SAASE,IAAI,CAACC,OAAO,CAAE;gBAClD,MAAM,EAAEC,UAAU,EAAEC,IAAI,EAAE,GAAGJ;gBAE7B,4EAA4E;gBAC5E,MAAMK,MAAMC,kBAAkBH,YAAYC;gBAC1C,IAAIR,6BAA6BW,GAAG,CAACF,MAAM;oBACzCG,QAAQC,IAAI,CAAC,CAAC,kBAAkB,EAAEN,WAAW,iBAAiB,EAAEC,KAAK,CAAC;gBACxE;gBACAR,6BAA6Bc,GAAG,CAACL,KAAKN;gBAEtC,oCAAoC;gBACpC,IAAIY,OAAOb,qBAAqBc,GAAG,CAACT;gBACpC,IAAIQ,SAASE,WAAW;oBACtBF,OAAO,EAAE;oBACTb,qBAAqBY,GAAG,CAACP,YAAYQ;gBACvC;gBACAA,KAAKG,IAAI,CAACd;YACZ;QACF;QAEA,OAAO;YACLJ;YACAE;QACF;IACF;IAEA,2EAA2E;IAC3E,MAAMiB,qBAAqBxB,OAA2CsB;IACtE,MAAMG,mBAAmB1B,YAAY;QACnC,IAAI2B,UAAUF,mBAAmBG,OAAO;QACxC,IAAID,YAAYJ,WAAW;YACzBI,UAAUvB;YACVqB,mBAAmBG,OAAO,GAAGD;YAE7B,2EAA2E;YAC3EA,QAAQE,KAAK,CAAC,IAAMJ,mBAAmBG,OAAO,KAAKL;QACrD;QACA,OAAOI;IACT,GAAG;QAACvB;KAAoB;IAExB,OAAOsB;AACT;AAEA;;CAEC,GACD,OAAO,SAASV,kBAAkBH,UAAsB,EAAEC,IAAY;IACpE,OAAO,CAAC,EAAED,WAAW,CAAC,EAAEC,KAAK,CAAC;AAChC"}
+{"version":3,"sources":["../../../src/components/PluginRegistry/plugin-indexes.ts"],"sourcesContent":["// Copyright 2023 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 { useEvent } from '@perses-dev/core';\nimport { useCallback, useRef } from 'react';\nimport { PluginLoader, PluginMetadataWithModule, PluginModuleResource, PluginType } from '../../model';\n\nexport interface PluginIndexes {\n  // Plugin resources by plugin type and kind (i.e. look up what module a plugin type and kind is in)\n  pluginResourcesByNameAndKind: Map<string, PluginModuleResource>;\n  // Plugin metadata by plugin type\n  pluginMetadataByKind: Map<string, PluginMetadataWithModule[]>;\n}\n\n/**\n * Returns an async callback for getting indexes of the installed plugin data.\n */\nexport function usePluginIndexes(\n  getInstalledPlugins: PluginLoader['getInstalledPlugins']\n): () => Promise<PluginIndexes> {\n  // Creates indexes from the installed plugins data (does useEvent because this accesses the getInstalledPlugins prop\n  // and we want a stable reference for the callback below)\n  const createPluginIndexes = useEvent(async (): Promise<PluginIndexes> => {\n    const installedPlugins = await getInstalledPlugins();\n\n    // Create the two indexes from the installed plugins\n    const pluginResourcesByNameAndKind = new Map<string, PluginModuleResource>();\n    const pluginMetadataByKind = new Map<string, PluginMetadataWithModule[]>();\n\n    for (const resource of installedPlugins) {\n      for (const pluginMetadata of resource.spec.plugins) {\n        const {\n          kind,\n          spec: { name },\n        } = pluginMetadata;\n\n        // Index the plugin by type and kind to point at the module that contains it\n        const key = getTypeAndKindKey(kind, name);\n        if (pluginResourcesByNameAndKind.has(key)) {\n          console.warn(`Got more than one ${kind} plugin for kind ${name}`);\n        }\n        pluginResourcesByNameAndKind.set(key, resource);\n\n        // Index the metadata by plugin type\n        let list = pluginMetadataByKind.get(kind);\n        if (list === undefined) {\n          list = [];\n          pluginMetadataByKind.set(kind, list);\n        }\n        list.push({ ...pluginMetadata, module: resource.metadata });\n      }\n    }\n\n    return {\n      pluginResourcesByNameAndKind,\n      pluginMetadataByKind,\n    };\n  });\n\n  // De-dupe creating plugin indexes (i.e. requests to get installed plugins)\n  const pluginIndexesCache = useRef<Promise<PluginIndexes> | undefined>(undefined);\n  const getPluginIndexes = useCallback(() => {\n    let request = pluginIndexesCache.current;\n    if (request === undefined) {\n      request = createPluginIndexes();\n      pluginIndexesCache.current = request;\n\n      // Remove failed requests from the cache so they can potentially be retried\n      request.catch(() => pluginIndexesCache.current === undefined);\n    }\n    return request;\n  }, [createPluginIndexes]);\n\n  return getPluginIndexes;\n}\n\n/**\n * Gets a unique key for a plugin type/kind that can be used as a cache key.\n */\nexport function getTypeAndKindKey(kind: PluginType, name: string): string {\n  return `${kind}:${name}`;\n}\n"],"names":["useEvent","useCallback","useRef","usePluginIndexes","getInstalledPlugins","createPluginIndexes","installedPlugins","pluginResourcesByNameAndKind","Map","pluginMetadataByKind","resource","pluginMetadata","spec","plugins","kind","name","key","getTypeAndKindKey","has","console","warn","set","list","get","undefined","push","module","metadata","pluginIndexesCache","getPluginIndexes","request","current","catch"],"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,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAQ;AAU5C;;CAEC,GACD,OAAO,SAASC,iBACdC,mBAAwD;IAExD,oHAAoH;IACpH,yDAAyD;IACzD,MAAMC,sBAAsBL,SAAS;QACnC,MAAMM,mBAAmB,MAAMF;QAE/B,oDAAoD;QACpD,MAAMG,+BAA+B,IAAIC;QACzC,MAAMC,uBAAuB,IAAID;QAEjC,KAAK,MAAME,YAAYJ,iBAAkB;YACvC,KAAK,MAAMK,kBAAkBD,SAASE,IAAI,CAACC,OAAO,CAAE;gBAClD,MAAM,EACJC,IAAI,EACJF,MAAM,EAAEG,IAAI,EAAE,EACf,GAAGJ;gBAEJ,4EAA4E;gBAC5E,MAAMK,MAAMC,kBAAkBH,MAAMC;gBACpC,IAAIR,6BAA6BW,GAAG,CAACF,MAAM;oBACzCG,QAAQC,IAAI,CAAC,CAAC,kBAAkB,EAAEN,KAAK,iBAAiB,EAAEC,KAAK,CAAC;gBAClE;gBACAR,6BAA6Bc,GAAG,CAACL,KAAKN;gBAEtC,oCAAoC;gBACpC,IAAIY,OAAOb,qBAAqBc,GAAG,CAACT;gBACpC,IAAIQ,SAASE,WAAW;oBACtBF,OAAO,EAAE;oBACTb,qBAAqBY,GAAG,CAACP,MAAMQ;gBACjC;gBACAA,KAAKG,IAAI,CAAC;oBAAE,GAAGd,cAAc;oBAAEe,QAAQhB,SAASiB,QAAQ;gBAAC;YAC3D;QACF;QAEA,OAAO;YACLpB;YACAE;QACF;IACF;IAEA,2EAA2E;IAC3E,MAAMmB,qBAAqB1B,OAA2CsB;IACtE,MAAMK,mBAAmB5B,YAAY;QACnC,IAAI6B,UAAUF,mBAAmBG,OAAO;QACxC,IAAID,YAAYN,WAAW;YACzBM,UAAUzB;YACVuB,mBAAmBG,OAAO,GAAGD;YAE7B,2EAA2E;YAC3EA,QAAQE,KAAK,CAAC,IAAMJ,mBAAmBG,OAAO,KAAKP;QACrD;QACA,OAAOM;IACT,GAAG;QAACzB;KAAoB;IAExB,OAAOwB;AACT;AAEA;;CAEC,GACD,OAAO,SAASZ,kBAAkBH,IAAgB,EAAEC,IAAY;IAC9D,OAAO,CAAC,EAAED,KAAK,CAAC,EAAEC,KAAK,CAAC;AAC1B"}

package/dist/components/ProjectSelect.js

@@ -49,7 +49,7 @@ import { useProjectList } from '../context';
                     })
                 })
             }),
-            data === null || data === void 0 ? void 0 : data.map((project)=>[
+            data?.map((project)=>[
                     /*#__PURE__*/ _jsx(MenuItem, {
                         value: project.metadata.name,
                         children: /*#__PURE__*/ _jsx(Stack, {
@@ -72,8 +72,7 @@ import { useProjectList } from '../context';
  * returns a string value that can be used as a Select input value.
  * @param selector
  */ function projectToOptionValue(project) {
-    var _project_metadata_name;
-    return (_project_metadata_name = project.metadata.name) !== null && _project_metadata_name !== void 0 ? _project_metadata_name : 'none';
+    return project.metadata.name ?? 'none';
 }
 /**
  * Given an option value name,

package/dist/components/ProjectSelect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/ProjectSelect.tsx"],"sourcesContent":["// Copyright 2023 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 { Select, SelectProps, MenuItem, Stack, ListItemText } from '@mui/material';\nimport { ProjectResource } from '@perses-dev/core';\nimport { ReactElement } from 'react';\nimport { useProjectList } from '../context';\n\n// Props on MUI Select that we don't want people to pass because we're either redefining them or providing them in\n// this component\ntype OmittedMuiProps = 'children' | 'value' | 'onChange';\n\nexport interface ProjectSelectProps extends Omit<SelectProps<string>, OmittedMuiProps> {\n  onChange: (next: ProjectResource) => void;\n  value: ProjectResource;\n}\n\n/**\n * Displays a MUI input for selecting a Project of a particular kind. Note: The 'value' and `onChange` handler for\n * the input deal with a `ProjectSelector`.\n */\nexport function ProjectSelect(props: ProjectSelectProps): ReactElement {\n  const { onChange, value, ...others } = props;\n\n  const { data, isLoading } = useProjectList();\n\n  // While loading available values, just use an empty string so MUI select doesn't warn about values out of range\n  const optionValue = isLoading ? '' : projectToOptionValue(value);\n\n  // When the user makes a selection, convert the string option value back to a DatasourceSelector\n  const handleChange: SelectProps<string>['onChange'] = (e) => {\n    const next = optionValueToSelector(e.target.value);\n    onChange(next);\n  };\n\n  // TODO:\n  //  - Does this need a loading indicator of some kind?\n  //  - The group's edit link is not clickable once selected.\n  //  - The group's edit link is disabled if datasource is overridden.\n  //    Ref: https://github.com/mui/material-ui/issues/36572\n  return (\n    <Select {...others} value={optionValue} onChange={handleChange}>\n      <MenuItem value=\"none\">\n        <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" width=\"100%\" height={32}>\n          <ListItemText>None</ListItemText>\n        </Stack>\n      </MenuItem>\n      {data?.map((project: ProjectResource) => [\n        <MenuItem key={project.metadata.name} value={project.metadata.name}>\n          <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" width=\"100%\" height={32}>\n            <ListItemText>{project.metadata.name}</ListItemText>\n          </Stack>\n        </MenuItem>,\n      ])}\n    </Select>\n  );\n}\n\n/**\n * Given a ProjectSelectItemSelector,\n * returns a string value that can be used as a Select input value.\n * @param selector\n */\nfunction projectToOptionValue(project: ProjectResource): string {\n  return project.metadata.name ?? 'none';\n}\n\n/**\n * Given an option value name,\n * returns a ProjectResource to be used by the query data model.\n * @param optionValue\n */\nfunction optionValueToSelector(optionValue: string): ProjectResource {\n  return {\n    kind: 'Project',\n    metadata: {\n      name: optionValue,\n    },\n    spec: {},\n  };\n}\n"],"names":["Select","MenuItem","Stack","ListItemText","useProjectList","ProjectSelect","props","onChange","value","others","data","isLoading","optionValue","projectToOptionValue","handleChange","e","next","optionValueToSelector","target","direction","alignItems","justifyContent","width","height","map","project","metadata","name","kind","spec"],"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,MAAM,EAAeC,QAAQ,EAAEC,KAAK,EAAEC,YAAY,QAAQ,gBAAgB;AAGnF,SAASC,cAAc,QAAQ,aAAa;AAW5C;;;CAGC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,QAAQ,GAAGH;IAEvC,MAAM,EAAEI,IAAI,EAAEC,SAAS,EAAE,GAAGP;IAE5B,gHAAgH;IAChH,MAAMQ,cAAcD,YAAY,KAAKE,qBAAqBL;IAE1D,gGAAgG;IAChG,MAAMM,eAAgD,CAACC;QACrD,MAAMC,OAAOC,sBAAsBF,EAAEG,MAAM,CAACV,KAAK;QACjDD,SAASS;IACX;IAEA,QAAQ;IACR,sDAAsD;IACtD,2DAA2D;IAC3D,oEAAoE;IACpE,0DAA0D;IAC1D,qBACE,MAAChB;QAAQ,GAAGS,MAAM;QAAED,OAAOI;QAAaL,UAAUO;;0BAChD,KAACb;gBAASO,OAAM;0BACd,cAAA,KAACN;oBAAMiB,WAAU;oBAAMC,YAAW;oBAASC,gBAAe;oBAAgBC,OAAM;oBAAOC,QAAQ;8BAC7F,cAAA,KAACpB;kCAAa;;;;YAGjBO,iBAAAA,2BAAAA,KAAMc,GAAG,CAAC,CAACC,UAA6B;kCACvC,KAACxB;wBAAqCO,OAAOiB,QAAQC,QAAQ,CAACC,IAAI;kCAChE,cAAA,KAACzB;4BAAMiB,WAAU;4BAAMC,YAAW;4BAASC,gBAAe;4BAAgBC,OAAM;4BAAOC,QAAQ;sCAC7F,cAAA,KAACpB;0CAAcsB,QAAQC,QAAQ,CAACC,IAAI;;;uBAFzBF,QAAQC,QAAQ,CAACC,IAAI;iBAKrC;;;AAGP;AAEA;;;;CAIC,GACD,SAASd,qBAAqBY,OAAwB;QAC7CA;IAAP,OAAOA,CAAAA,yBAAAA,QAAQC,QAAQ,CAACC,IAAI,cAArBF,oCAAAA,yBAAyB;AAClC;AAEA;;;;CAIC,GACD,SAASR,sBAAsBL,WAAmB;IAChD,OAAO;QACLgB,MAAM;QACNF,UAAU;YACRC,MAAMf;QACR;QACAiB,MAAM,CAAC;IACT;AACF"}
+{"version":3,"sources":["../../src/components/ProjectSelect.tsx"],"sourcesContent":["// Copyright 2023 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 { Select, SelectProps, MenuItem, Stack, ListItemText } from '@mui/material';\nimport { ProjectResource } from '@perses-dev/core';\nimport { ReactElement } from 'react';\nimport { useProjectList } from '../context';\n\n// Props on MUI Select that we don't want people to pass because we're either redefining them or providing them in\n// this component\ntype OmittedMuiProps = 'children' | 'value' | 'onChange';\n\nexport interface ProjectSelectProps extends Omit<SelectProps<string>, OmittedMuiProps> {\n  onChange: (next: ProjectResource) => void;\n  value: ProjectResource;\n}\n\n/**\n * Displays a MUI input for selecting a Project of a particular kind. Note: The 'value' and `onChange` handler for\n * the input deal with a `ProjectSelector`.\n */\nexport function ProjectSelect(props: ProjectSelectProps): ReactElement {\n  const { onChange, value, ...others } = props;\n\n  const { data, isLoading } = useProjectList();\n\n  // While loading available values, just use an empty string so MUI select doesn't warn about values out of range\n  const optionValue = isLoading ? '' : projectToOptionValue(value);\n\n  // When the user makes a selection, convert the string option value back to a DatasourceSelector\n  const handleChange: SelectProps<string>['onChange'] = (e) => {\n    const next = optionValueToSelector(e.target.value);\n    onChange(next);\n  };\n\n  // TODO:\n  //  - Does this need a loading indicator of some kind?\n  //  - The group's edit link is not clickable once selected.\n  //  - The group's edit link is disabled if datasource is overridden.\n  //    Ref: https://github.com/mui/material-ui/issues/36572\n  return (\n    <Select {...others} value={optionValue} onChange={handleChange}>\n      <MenuItem value=\"none\">\n        <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" width=\"100%\" height={32}>\n          <ListItemText>None</ListItemText>\n        </Stack>\n      </MenuItem>\n      {data?.map((project: ProjectResource) => [\n        <MenuItem key={project.metadata.name} value={project.metadata.name}>\n          <Stack direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" width=\"100%\" height={32}>\n            <ListItemText>{project.metadata.name}</ListItemText>\n          </Stack>\n        </MenuItem>,\n      ])}\n    </Select>\n  );\n}\n\n/**\n * Given a ProjectSelectItemSelector,\n * returns a string value that can be used as a Select input value.\n * @param selector\n */\nfunction projectToOptionValue(project: ProjectResource): string {\n  return project.metadata.name ?? 'none';\n}\n\n/**\n * Given an option value name,\n * returns a ProjectResource to be used by the query data model.\n * @param optionValue\n */\nfunction optionValueToSelector(optionValue: string): ProjectResource {\n  return {\n    kind: 'Project',\n    metadata: {\n      name: optionValue,\n    },\n    spec: {},\n  };\n}\n"],"names":["Select","MenuItem","Stack","ListItemText","useProjectList","ProjectSelect","props","onChange","value","others","data","isLoading","optionValue","projectToOptionValue","handleChange","e","next","optionValueToSelector","target","direction","alignItems","justifyContent","width","height","map","project","metadata","name","kind","spec"],"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,MAAM,EAAeC,QAAQ,EAAEC,KAAK,EAAEC,YAAY,QAAQ,gBAAgB;AAGnF,SAASC,cAAc,QAAQ,aAAa;AAW5C;;;CAGC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGC,QAAQ,GAAGH;IAEvC,MAAM,EAAEI,IAAI,EAAEC,SAAS,EAAE,GAAGP;IAE5B,gHAAgH;IAChH,MAAMQ,cAAcD,YAAY,KAAKE,qBAAqBL;IAE1D,gGAAgG;IAChG,MAAMM,eAAgD,CAACC;QACrD,MAAMC,OAAOC,sBAAsBF,EAAEG,MAAM,CAACV,KAAK;QACjDD,SAASS;IACX;IAEA,QAAQ;IACR,sDAAsD;IACtD,2DAA2D;IAC3D,oEAAoE;IACpE,0DAA0D;IAC1D,qBACE,MAAChB;QAAQ,GAAGS,MAAM;QAAED,OAAOI;QAAaL,UAAUO;;0BAChD,KAACb;gBAASO,OAAM;0BACd,cAAA,KAACN;oBAAMiB,WAAU;oBAAMC,YAAW;oBAASC,gBAAe;oBAAgBC,OAAM;oBAAOC,QAAQ;8BAC7F,cAAA,KAACpB;kCAAa;;;;YAGjBO,MAAMc,IAAI,CAACC,UAA6B;kCACvC,KAACxB;wBAAqCO,OAAOiB,QAAQC,QAAQ,CAACC,IAAI;kCAChE,cAAA,KAACzB;4BAAMiB,WAAU;4BAAMC,YAAW;4BAASC,gBAAe;4BAAgBC,OAAM;4BAAOC,QAAQ;sCAC7F,cAAA,KAACpB;0CAAcsB,QAAQC,QAAQ,CAACC,IAAI;;;uBAFzBF,QAAQC,QAAQ,CAACC,IAAI;iBAKrC;;;AAGP;AAEA;;;;CAIC,GACD,SAASd,qBAAqBY,OAAwB;IACpD,OAAOA,QAAQC,QAAQ,CAACC,IAAI,IAAI;AAClC;AAEA;;;;CAIC,GACD,SAASV,sBAAsBL,WAAmB;IAChD,OAAO;QACLgB,MAAM;QACNF,UAAU;YACRC,MAAMf;QACR;QACAiB,MAAM,CAAC;IACT;AACF"}

package/dist/components/Variables/VariableEditorForm/VariableEditorForm.js

@@ -40,10 +40,7 @@ function TextVariableEditorForm({ action, control }) {
                     /*#__PURE__*/ _jsx(Controller, {
                         control: control,
                         name: "spec.value",
-                        render: ({ field, fieldState })=>{
-                            var _fieldState_error;
-                            var _field_value;
-                            return /*#__PURE__*/ _jsxs(_Fragment, {
+                        render: ({ field, fieldState })=>/*#__PURE__*/ _jsxs(_Fragment, {
                                 children: [
                                     /*#__PURE__*/ _jsx(Box, {
                                         children: /*#__PURE__*/ _jsx(VariablePreview, {
@@ -62,35 +59,31 @@ function TextVariableEditorForm({ action, control }) {
                                             readOnly: action === 'read'
                                         },
                                         error: !!fieldState.error,
-                                        helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                        value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                        helperText: fieldState.error?.message,
+                                        value: field.value ?? '',
                                         onChange: (event)=>{
                                             field.onChange(event);
                                         }
                                     })
                                 ]
-                            });
-                        }
+                            })
                     }),
                     /*#__PURE__*/ _jsx(Controller, {
                         control: control,
                         name: "spec.constant",
-                        render: ({ field })=>{
-                            var _field_value;
-                            return /*#__PURE__*/ _jsx(FormControlLabel, {
+                        render: ({ field })=>/*#__PURE__*/ _jsx(FormControlLabel, {
                                 label: "Constant",
                                 control: /*#__PURE__*/ _jsx(Switch, {
                                     ...field,
                                     checked: !!field.value,
                                     readOnly: action === 'read',
-                                    value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : false,
+                                    value: field.value ?? false,
                                     onChange: (event)=>{
                                         if (action === 'read') return; // ReadOnly prop is not blocking user interaction...
                                         field.onChange(event);
                                     }
                                 })
-                            });
-                        }
+                            })
                     })
                 ]
             })
@@ -159,10 +152,7 @@ function ListVariableEditorForm({ action, control }) {
                                 children: /*#__PURE__*/ _jsx(Controller, {
                                     control: control,
                                     name: "spec.plugin",
-                                    render: ({ field })=>{
-                                        var _field_value, _field_value1;
-                                        var _field_value_kind, _field_value_spec;
-                                        return /*#__PURE__*/ _jsx(PluginEditor, {
+                                    render: ({ field })=>/*#__PURE__*/ _jsx(PluginEditor, {
                                             width: "100%",
                                             pluginTypes: [
                                                 'Variable'
@@ -171,9 +161,9 @@ function ListVariableEditorForm({ action, control }) {
                                             value: {
                                                 selection: {
                                                     type: 'Variable',
-                                                    kind: (_field_value_kind = (_field_value = field.value) === null || _field_value === void 0 ? void 0 : _field_value.kind) !== null && _field_value_kind !== void 0 ? _field_value_kind : 'StaticListVariable'
+                                                    kind: field.value?.kind ?? 'StaticListVariable'
                                                 },
-                                                spec: (_field_value_spec = (_field_value1 = field.value) === null || _field_value1 === void 0 ? void 0 : _field_value1.spec) !== null && _field_value_spec !== void 0 ? _field_value_spec : {
+                                                spec: field.value?.spec ?? {
                                                     values: []
                                                 }
                                             },
@@ -184,8 +174,7 @@ function ListVariableEditorForm({ action, control }) {
                                                     spec: v.spec
                                                 });
                                             }
-                                        });
-                                    }
+                                        })
                                 })
                             })
                         ]
@@ -194,10 +183,7 @@ function ListVariableEditorForm({ action, control }) {
                         children: /*#__PURE__*/ _jsx(Controller, {
                             control: control,
                             name: "spec.capturingRegexp",
-                            render: ({ field, fieldState })=>{
-                                var _fieldState_error;
-                                var _field_value;
-                                return /*#__PURE__*/ _jsx(TextField, {
+                            render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                     ...field,
                                     label: "Capturing Regexp Filter",
                                     InputLabelProps: {
@@ -207,7 +193,7 @@ function ListVariableEditorForm({ action, control }) {
                                         readOnly: action === 'read'
                                     },
                                     error: !!fieldState.error,
-                                    value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                    value: field.value ?? '',
                                     onChange: (event)=>{
                                         if (event.target.value === '') {
                                             field.onChange(undefined);
@@ -215,19 +201,15 @@ function ListVariableEditorForm({ action, control }) {
                                             field.onChange(event);
                                         }
                                     },
-                                    helperText: ((_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message) ? fieldState.error.message : 'Optional, if you want to filter on captured result.'
-                                });
-                            }
+                                    helperText: fieldState.error?.message ? fieldState.error.message : 'Optional, if you want to filter on captured result.'
+                                })
                         })
                     }),
                     /*#__PURE__*/ _jsx(Stack, {
                         children: /*#__PURE__*/ _jsx(Controller, {
                             control: control,
                             name: "spec.sort",
-                            render: ({ field, fieldState })=>{
-                                var _fieldState_error;
-                                var _field_value;
-                                return /*#__PURE__*/ _jsxs(TextField, {
+                            render: ({ field, fieldState })=>/*#__PURE__*/ _jsxs(TextField, {
                                     select: true,
                                     ...field,
                                     fullWidth: true,
@@ -239,8 +221,8 @@ function ListVariableEditorForm({ action, control }) {
                                         readOnly: action === 'read'
                                     },
                                     error: !!fieldState.error,
-                                    helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                    value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : 'none',
+                                    helperText: fieldState.error?.message,
+                                    value: field.value ?? 'none',
                                     onChange: (event)=>{
                                         field.onChange(event);
                                     },
@@ -274,8 +256,7 @@ function ListVariableEditorForm({ action, control }) {
                                             children: "Alphabetical, case-insensitive, desc"
                                         })
                                     ]
-                                });
-                            }
+                                })
                         })
                     })
                 ]
@@ -294,22 +275,19 @@ function ListVariableEditorForm({ action, control }) {
                             /*#__PURE__*/ _jsx(Controller, {
                                 control: control,
                                 name: "spec.allowMultiple",
-                                render: ({ field })=>{
-                                    var _field_value;
-                                    return /*#__PURE__*/ _jsx(FormControlLabel, {
+                                render: ({ field })=>/*#__PURE__*/ _jsx(FormControlLabel, {
                                         label: "Allow Multiple Values",
                                         control: /*#__PURE__*/ _jsx(Switch, {
                                             ...field,
                                             checked: !!field.value,
                                             readOnly: action === 'read',
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : false,
+                                            value: field.value ?? false,
                                             onChange: (event)=>{
                                                 if (action === 'read') return; // ReadOnly prop is not blocking user interaction...
                                                 field.onChange(event);
                                             }
                                         })
-                                    });
-                                }
+                                    })
                             }),
                             /*#__PURE__*/ _jsx(Typography, {
                                 variant: "caption",
@@ -322,22 +300,19 @@ function ListVariableEditorForm({ action, control }) {
                             /*#__PURE__*/ _jsx(Controller, {
                                 control: control,
                                 name: "spec.allowAllValue",
-                                render: ({ field })=>{
-                                    var _field_value;
-                                    return /*#__PURE__*/ _jsx(FormControlLabel, {
+                                render: ({ field })=>/*#__PURE__*/ _jsx(FormControlLabel, {
                                         label: "Allow All option",
                                         control: /*#__PURE__*/ _jsx(Switch, {
                                             ...field,
                                             checked: !!field.value,
                                             readOnly: action === 'read',
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : false,
+                                            value: field.value ?? false,
                                             onChange: (event)=>{
                                                 if (action === 'read') return; // ReadOnly prop is not blocking user interaction...
                                                 field.onChange(event);
                                             }
                                         })
-                                    });
-                                }
+                                    })
                             }),
                             /*#__PURE__*/ _jsx(Typography, {
                                 mb: 1,
@@ -347,10 +322,7 @@ function ListVariableEditorForm({ action, control }) {
                             _allowAllValue && /*#__PURE__*/ _jsx(Controller, {
                                 control: control,
                                 name: "spec.customAllValue",
-                                render: ({ field, fieldState })=>{
-                                    var _fieldState_error;
-                                    var _field_value;
-                                    return /*#__PURE__*/ _jsx(TextField, {
+                                render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                         ...field,
                                         fullWidth: true,
                                         label: "Custom All Value",
@@ -361,8 +333,8 @@ function ListVariableEditorForm({ action, control }) {
                                             readOnly: action === 'read'
                                         },
                                         error: !!fieldState.error,
-                                        helperText: ((_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message) ? fieldState.error.message : 'When All is selected, this value will be used',
-                                        value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                        helperText: fieldState.error?.message ? fieldState.error.message : 'When All is selected, this value will be used',
+                                        value: field.value ?? '',
                                         onChange: (event)=>{
                                             if (event.target.value === '') {
                                                 field.onChange(undefined);
@@ -370,8 +342,7 @@ function ListVariableEditorForm({ action, control }) {
                                                 field.onChange(event);
                                             }
                                         }
-                                    });
-                                }
+                                    })
                             })
                         ]
                     })
@@ -395,11 +366,10 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
         name: 'kind'
     });
     function clearFormData(data) {
-        var _result_spec_display, _result_spec_display1, _result_spec_display2;
         const result = {
             ...data
         };
-        if (((_result_spec_display = result.spec.display) === null || _result_spec_display === void 0 ? void 0 : _result_spec_display.name) === undefined && ((_result_spec_display1 = result.spec.display) === null || _result_spec_display1 === void 0 ? void 0 : _result_spec_display1.description) === undefined && ((_result_spec_display2 = result.spec.display) === null || _result_spec_display2 === void 0 ? void 0 : _result_spec_display2.hidden) === undefined) {
+        if (result.spec.display?.name === undefined && result.spec.display?.description === undefined && result.spec.display?.hidden === undefined) {
             delete result.spec.display;
         }
         return result;
@@ -466,10 +436,7 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                 children: /*#__PURE__*/ _jsx(Controller, {
                                     control: form.control,
                                     name: "spec.name",
-                                    render: ({ field, fieldState })=>{
-                                        var _fieldState_error;
-                                        var _field_value;
-                                        return /*#__PURE__*/ _jsx(TextField, {
+                                    render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                             ...field,
                                             required: true,
                                             fullWidth: true,
@@ -482,13 +449,12 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                                 readOnly: action === 'read'
                                             },
                                             error: !!fieldState.error,
-                                            helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                            helperText: fieldState.error?.message,
+                                            value: field.value ?? '',
                                             onChange: (event)=>{
                                                 field.onChange(event);
                                             }
-                                        });
-                                    }
+                                        })
                                 })
                             }),
                             /*#__PURE__*/ _jsx(Grid, {
@@ -497,10 +463,7 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                 children: /*#__PURE__*/ _jsx(Controller, {
                                     control: form.control,
                                     name: "spec.display.name",
-                                    render: ({ field, fieldState })=>{
-                                        var _fieldState_error;
-                                        var _field_value;
-                                        return /*#__PURE__*/ _jsx(TextField, {
+                                    render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                             ...field,
                                             fullWidth: true,
                                             label: "Display Label",
@@ -511,13 +474,12 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                                 readOnly: action === 'read'
                                             },
                                             error: !!fieldState.error,
-                                            helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                            helperText: fieldState.error?.message,
+                                            value: field.value ?? '',
                                             onChange: (event)=>{
                                                 field.onChange(event);
                                             }
-                                        });
-                                    }
+                                        })
                                 })
                             }),
                             /*#__PURE__*/ _jsx(Grid, {
@@ -526,10 +488,7 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                 children: /*#__PURE__*/ _jsx(Controller, {
                                     control: form.control,
                                     name: "spec.display.description",
-                                    render: ({ field, fieldState })=>{
-                                        var _fieldState_error;
-                                        var _field_value;
-                                        return /*#__PURE__*/ _jsx(TextField, {
+                                    render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                             ...field,
                                             fullWidth: true,
                                             label: "Description",
@@ -540,13 +499,12 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                                 readOnly: action === 'read'
                                             },
                                             error: !!fieldState.error,
-                                            helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : '',
+                                            helperText: fieldState.error?.message,
+                                            value: field.value ?? '',
                                             onChange: (event)=>{
                                                 field.onChange(event);
                                             }
-                                        });
-                                    }
+                                        })
                                 })
                             }),
                             /*#__PURE__*/ _jsx(Grid, {
@@ -555,10 +513,7 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                 children: /*#__PURE__*/ _jsx(Controller, {
                                     control: form.control,
                                     name: "kind",
-                                    render: ({ field, fieldState })=>{
-                                        var _fieldState_error;
-                                        var _field_value;
-                                        return /*#__PURE__*/ _jsx(TextField, {
+                                    render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
                                             select: true,
                                             ...field,
                                             fullWidth: true,
@@ -570,8 +525,8 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                                 readOnly: action === 'read'
                                             },
                                             error: !!fieldState.error,
-                                            helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
-                                            value: (_field_value = field.value) !== null && _field_value !== void 0 ? _field_value : 'TextVariable',
+                                            helperText: fieldState.error?.message,
+                                            value: field.value ?? 'TextVariable',
                                             onChange: (event)=>{
                                                 field.onChange(event);
                                             },
@@ -579,8 +534,7 @@ export function VariableEditorForm({ initialVariableDefinition, action, isDraft,
                                                     value: v.kind,
                                                     children: v.label
                                                 }, v.kind))
-                                        });
-                                    }
+                                        })
                                 })
                             })
                         ]