mirror of
https://github.com/grafana/grafana.git
synced 2025-02-16 18:34:52 -06:00
4dc556445c
* feat(catalog): introduce id and href to PluginDetailsTabs * feat(catalog): add hrefs and ids to PluginDetails tabs. Pass queryParams to PluginDetailsBody * feat(catalog): pass queryParams to PluginsDetailsBody and add page param to PluginListCard * fix(catalog): prevent flicker of content by waiting for fetch details to finish loading * feat(catalog): add tab icons to PluginDetails page * feat(catalog): make breadcrumbs in PluginDetailsHeader aware of page queryparam * fix(catalog): fix deeplinking to PluginDetails by comparing tabs length * test(catalog): update tests with correct props and wrap in router
68 lines
2.0 KiB
TypeScript
68 lines
2.0 KiB
TypeScript
import { useMemo } from 'react';
|
|
import { useLocation } from 'react-router-dom';
|
|
import { PluginIncludeType, PluginType } from '@grafana/data';
|
|
import { CatalogPlugin, PluginDetailsTab, PluginTabIds } from '../types';
|
|
import { isOrgAdmin } from '../helpers';
|
|
import { usePluginConfig } from '../hooks/usePluginConfig';
|
|
|
|
type ReturnType = {
|
|
error: Error | undefined;
|
|
loading: boolean;
|
|
tabs: PluginDetailsTab[];
|
|
};
|
|
|
|
export const usePluginDetailsTabs = (plugin?: CatalogPlugin, defaultTabs: PluginDetailsTab[] = []): ReturnType => {
|
|
const { loading, error, value: pluginConfig } = usePluginConfig(plugin);
|
|
const { pathname } = useLocation();
|
|
const tabs = useMemo(() => {
|
|
const canConfigurePlugins = isOrgAdmin();
|
|
const tabs: PluginDetailsTab[] = [...defaultTabs];
|
|
|
|
// Not extending the tabs with the config pages if the plugin is not installed
|
|
if (!pluginConfig) {
|
|
return tabs;
|
|
}
|
|
|
|
if (canConfigurePlugins) {
|
|
if (pluginConfig.meta.type === PluginType.app) {
|
|
if (pluginConfig.angularConfigCtrl) {
|
|
tabs.push({
|
|
label: 'Config',
|
|
icon: 'cog',
|
|
id: PluginTabIds.CONFIG,
|
|
href: `${pathname}?page=${PluginTabIds.CONFIG}`,
|
|
});
|
|
}
|
|
|
|
if (pluginConfig.configPages) {
|
|
for (const page of pluginConfig.configPages) {
|
|
tabs.push({
|
|
label: page.title,
|
|
icon: page.icon,
|
|
id: page.id,
|
|
href: `${pathname}?page=${page.id}`,
|
|
});
|
|
}
|
|
}
|
|
|
|
if (pluginConfig.meta.includes?.find((include) => include.type === PluginIncludeType.dashboard)) {
|
|
tabs.push({
|
|
label: 'Dashboards',
|
|
icon: 'apps',
|
|
id: PluginTabIds.DASHBOARDS,
|
|
href: `${pathname}?page=${PluginTabIds.DASHBOARDS}`,
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
return tabs;
|
|
}, [pluginConfig, defaultTabs, pathname]);
|
|
|
|
return {
|
|
error,
|
|
loading,
|
|
tabs,
|
|
};
|
|
};
|