From c969a7251e4d9d60bb2db7ee0e871c3159aefb35 Mon Sep 17 00:00:00 2001 From: Marcus Andersson Date: Thu, 20 Feb 2025 15:22:27 +0100 Subject: [PATCH] PluginExtensions: Fixed so we expose the proper types for usePluginComponents (#100949) * Fixed usage of incorrect type in the 'usePluginComponents' hook. * improved betterer. * Changed import path of usePluginLinks types. * improved betterer result. --- .betterer.results | 6 +-- .../grafana-runtime/src/services/index.ts | 30 ++++++++++--- .../pluginExtensions/getPluginExtensions.ts | 44 +------------------ .../pluginExtensions/usePluginComponent.ts | 11 +++-- .../pluginExtensions/usePluginComponents.ts | 18 ++++++-- .../pluginExtensions/usePluginFunctions.ts | 12 ++++- .../pluginExtensions/usePluginLinks.ts | 13 +++++- .../extensions/usePluginComponents.tsx | 7 +-- .../plugins/extensions/usePluginLinks.tsx | 5 +-- 9 files changed, 72 insertions(+), 74 deletions(-) diff --git a/.betterer.results b/.betterer.results index 42f02a2db9f..106ccbad80f 100644 --- a/.betterer.results +++ b/.betterer.results @@ -5599,15 +5599,11 @@ exports[`better eslint`] = { [0, 0, 0, "\'@grafana/data/src/types/pluginExtensions\' import is restricted from being used by a pattern. Import from the public export instead.", "0"] ], "public/app/features/plugins/extensions/usePluginComponents.tsx:5381": [ - [0, 0, 0, "\'@grafana/runtime/src/services/pluginExtensions/getPluginExtensions\' import is restricted from being used by a pattern. Import from the public export instead.", "0"], - [0, 0, 0, "Do not use any type assertions.", "1"] + [0, 0, 0, "Do not use any type assertions.", "0"] ], "public/app/features/plugins/extensions/usePluginFunctions.tsx:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], - "public/app/features/plugins/extensions/usePluginLinks.tsx:5381": [ - [0, 0, 0, "\'@grafana/runtime/src/services/pluginExtensions/getPluginExtensions\' import is restricted from being used by a pattern. Import from the public export instead.", "0"] - ], "public/app/features/plugins/extensions/validators.ts:5381": [ [0, 0, 0, "\'@grafana/data/src/types/pluginExtensions\' import is restricted from being used by a pattern. Import from the public export instead.", "0"] ], diff --git a/packages/grafana-runtime/src/services/index.ts b/packages/grafana-runtime/src/services/index.ts index 5e8892c5cc7..3ceef02923a 100644 --- a/packages/grafana-runtime/src/services/index.ts +++ b/packages/grafana-runtime/src/services/index.ts @@ -21,9 +21,6 @@ export { type GetPluginExtensionsResult, type UsePluginExtensions, type UsePluginExtensionsResult, - type UsePluginComponentResult, - type UsePluginFunctionsOptions, - type UsePluginFunctionsResult, } from './pluginExtensions/getPluginExtensions'; export { setPluginExtensionsHook, @@ -32,10 +29,29 @@ export { usePluginComponentExtensions, } from './pluginExtensions/usePluginExtensions'; -export { setPluginComponentHook, usePluginComponent } from './pluginExtensions/usePluginComponent'; -export { setPluginComponentsHook, usePluginComponents } from './pluginExtensions/usePluginComponents'; -export { setPluginLinksHook, usePluginLinks } from './pluginExtensions/usePluginLinks'; -export { setPluginFunctionsHook, usePluginFunctions } from './pluginExtensions/usePluginFunctions'; +export { + setPluginComponentHook, + usePluginComponent, + type UsePluginComponentResult, +} from './pluginExtensions/usePluginComponent'; +export { + setPluginComponentsHook, + usePluginComponents, + type UsePluginComponentsResult, + type UsePluginComponentsOptions, +} from './pluginExtensions/usePluginComponents'; +export { + setPluginLinksHook, + usePluginLinks, + type UsePluginLinksOptions, + type UsePluginLinksResult, +} from './pluginExtensions/usePluginLinks'; +export { + setPluginFunctionsHook, + usePluginFunctions, + type UsePluginFunctionsOptions, + type UsePluginFunctionsResult, +} from './pluginExtensions/usePluginFunctions'; export { isPluginExtensionLink, isPluginExtensionComponent } from './pluginExtensions/utils'; export { setCurrentUser } from './user'; diff --git a/packages/grafana-runtime/src/services/pluginExtensions/getPluginExtensions.ts b/packages/grafana-runtime/src/services/pluginExtensions/getPluginExtensions.ts index 3d5de8ab3dc..edc5a48db6b 100644 --- a/packages/grafana-runtime/src/services/pluginExtensions/getPluginExtensions.ts +++ b/packages/grafana-runtime/src/services/pluginExtensions/getPluginExtensions.ts @@ -1,10 +1,4 @@ -import type { - PluginExtension, - PluginExtensionLink, - PluginExtensionComponent, - PluginExtensionFunction, - PluginExtensionComponentMeta, -} from '@grafana/data'; +import type { PluginExtension, PluginExtensionLink, PluginExtensionComponent } from '@grafana/data'; import { isPluginExtensionComponent, isPluginExtensionLink } from './utils'; @@ -23,11 +17,6 @@ export type GetPluginExtensionsOptions = { limitPerPlugin?: number; }; -export type UsePluginComponentOptions = { - extensionPointId: string; - limitPerPlugin?: number; -}; - export type GetPluginExtensionsResult = { extensions: T[]; }; @@ -37,37 +26,6 @@ export type UsePluginExtensionsResult = { isLoading: boolean; }; -export type UsePluginComponentResult = { - component: React.ComponentType | undefined | null; - isLoading: boolean; -}; - -export type UsePluginComponentsResult = { - components: Array & { meta: PluginExtensionComponentMeta }>; - isLoading: boolean; -}; - -export type UsePluginLinksOptions = { - extensionPointId: string; - context?: object | Record; - limitPerPlugin?: number; -}; - -export type UsePluginLinksResult = { - isLoading: boolean; - links: PluginExtensionLink[]; -}; - -export type UsePluginFunctionsOptions = { - extensionPointId: string; - limitPerPlugin?: number; -}; - -export type UsePluginFunctionsResult = { - isLoading: boolean; - functions: Array>; -}; - let singleton: GetPluginExtensions | undefined; export function setPluginExtensionGetter(instance: GetPluginExtensions): void { diff --git a/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponent.ts b/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponent.ts index a11a37389c3..40fb6b24880 100644 --- a/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponent.ts +++ b/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponent.ts @@ -1,6 +1,9 @@ -import { UsePluginComponentResult } from './getPluginExtensions'; +export type UsePluginComponent = (componentId: string) => UsePluginComponentResult; -export type UsePluginComponent = (id: string) => UsePluginComponentResult; +export type UsePluginComponentResult = { + component: React.ComponentType | undefined | null; + isLoading: boolean; +}; let singleton: UsePluginComponent | undefined; @@ -12,9 +15,9 @@ export function setPluginComponentHook(hook: UsePluginComponent): void { singleton = hook; } -export function usePluginComponent(id: string): UsePluginComponentResult { +export function usePluginComponent(componentId: string): UsePluginComponentResult { if (!singleton) { throw new Error('setPluginComponentHook(options) can only be used after the Grafana instance has started.'); } - return singleton(id) as UsePluginComponentResult; + return singleton(componentId) as UsePluginComponentResult; } diff --git a/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponents.ts b/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponents.ts index aafe2bb8aac..649c54d0414 100644 --- a/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponents.ts +++ b/packages/grafana-runtime/src/services/pluginExtensions/usePluginComponents.ts @@ -1,13 +1,23 @@ -import { GetPluginExtensionsOptions, UsePluginComponentsResult } from './getPluginExtensions'; +import { PluginExtensionComponentMeta } from '@grafana/data'; + +export type UsePluginComponentsOptions = { + extensionPointId: string; + limitPerPlugin?: number; +}; + +export type UsePluginComponentsResult = { + components: Array & { meta: PluginExtensionComponentMeta }>; + isLoading: boolean; +}; export type UsePluginComponents = ( - options: GetPluginExtensionsOptions + options: UsePluginComponentsOptions ) => UsePluginComponentsResult; let singleton: UsePluginComponents | undefined; export function setPluginComponentsHook(hook: UsePluginComponents): void { - // We allow overriding the registry in tests + // We allow overriding the hook in tests if (singleton && process.env.NODE_ENV !== 'test') { throw new Error('setPluginComponentsHook() function should only be called once, when Grafana is starting.'); } @@ -15,7 +25,7 @@ export function setPluginComponentsHook(hook: UsePluginComponents): void { } export function usePluginComponents( - options: GetPluginExtensionsOptions + options: UsePluginComponentsOptions ): UsePluginComponentsResult { if (!singleton) { throw new Error('setPluginComponentsHook(options) can only be used after the Grafana instance has started.'); diff --git a/packages/grafana-runtime/src/services/pluginExtensions/usePluginFunctions.ts b/packages/grafana-runtime/src/services/pluginExtensions/usePluginFunctions.ts index 1eb86b70e14..2e480855b38 100644 --- a/packages/grafana-runtime/src/services/pluginExtensions/usePluginFunctions.ts +++ b/packages/grafana-runtime/src/services/pluginExtensions/usePluginFunctions.ts @@ -1,4 +1,14 @@ -import { UsePluginFunctionsOptions, UsePluginFunctionsResult } from './getPluginExtensions'; +import { PluginExtensionFunction } from '@grafana/data'; + +export type UsePluginFunctionsOptions = { + extensionPointId: string; + limitPerPlugin?: number; +}; + +export type UsePluginFunctionsResult = { + isLoading: boolean; + functions: Array>; +}; export type UsePluginFunctions = (options: UsePluginFunctionsOptions) => UsePluginFunctionsResult; diff --git a/packages/grafana-runtime/src/services/pluginExtensions/usePluginLinks.ts b/packages/grafana-runtime/src/services/pluginExtensions/usePluginLinks.ts index d90d88cf4f7..d4940127f61 100644 --- a/packages/grafana-runtime/src/services/pluginExtensions/usePluginLinks.ts +++ b/packages/grafana-runtime/src/services/pluginExtensions/usePluginLinks.ts @@ -1,4 +1,15 @@ -import { UsePluginLinksOptions, UsePluginLinksResult } from './getPluginExtensions'; +import { PluginExtensionLink } from '@grafana/data'; + +export type UsePluginLinksOptions = { + extensionPointId: string; + context?: object | Record; + limitPerPlugin?: number; +}; + +export type UsePluginLinksResult = { + isLoading: boolean; + links: PluginExtensionLink[]; +}; export type UsePluginLinks = (options: UsePluginLinksOptions) => UsePluginLinksResult; diff --git a/public/app/features/plugins/extensions/usePluginComponents.tsx b/public/app/features/plugins/extensions/usePluginComponents.tsx index 0e59834db94..d5259a85c41 100644 --- a/public/app/features/plugins/extensions/usePluginComponents.tsx +++ b/public/app/features/plugins/extensions/usePluginComponents.tsx @@ -2,10 +2,7 @@ import { useMemo } from 'react'; import { useObservable } from 'react-use'; import { PluginExtensionComponentMeta, PluginExtensionTypes, usePluginContext } from '@grafana/data'; -import { - UsePluginComponentOptions, - UsePluginComponentsResult, -} from '@grafana/runtime/src/services/pluginExtensions/getPluginExtensions'; +import { UsePluginComponentsOptions, UsePluginComponentsResult } from '@grafana/runtime'; import { useAddedComponentsRegistry } from './ExtensionRegistriesContext'; import * as errors from './errors'; @@ -19,7 +16,7 @@ import { isExtensionPointIdValid, isExtensionPointMetaInfoMissing } from './vali export function usePluginComponents({ limitPerPlugin, extensionPointId, -}: UsePluginComponentOptions): UsePluginComponentsResult { +}: UsePluginComponentsOptions): UsePluginComponentsResult { const registry = useAddedComponentsRegistry(); const registryState = useObservable(registry.asObservable()); const pluginContext = usePluginContext(); diff --git a/public/app/features/plugins/extensions/usePluginLinks.tsx b/public/app/features/plugins/extensions/usePluginLinks.tsx index 58efcc4e3e6..6ecaf6b71b9 100644 --- a/public/app/features/plugins/extensions/usePluginLinks.tsx +++ b/public/app/features/plugins/extensions/usePluginLinks.tsx @@ -3,10 +3,7 @@ import { useMemo } from 'react'; import { useObservable } from 'react-use'; import { PluginExtensionLink, PluginExtensionTypes, usePluginContext } from '@grafana/data'; -import { - UsePluginLinksOptions, - UsePluginLinksResult, -} from '@grafana/runtime/src/services/pluginExtensions/getPluginExtensions'; +import { UsePluginLinksOptions, UsePluginLinksResult } from '@grafana/runtime'; import { useAddedLinksRegistry } from './ExtensionRegistriesContext'; import * as errors from './errors';