Allow the docs plugin to use the sidebar (#106905)

This commit is contained in:
Jack Baldry 2025-06-24 15:10:28 +01:00 committed by GitHub
parent 27a5bab1c1
commit 10b6dd97f8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 24 additions and 4 deletions

View File

@ -11,7 +11,12 @@ import { DEFAULT_EXTENSION_SIDEBAR_WIDTH } from './ExtensionSidebar';
export const EXTENSION_SIDEBAR_EXTENSION_POINT_ID = 'grafana/extension-sidebar/v0-alpha';
export const EXTENSION_SIDEBAR_DOCKED_LOCAL_STORAGE_KEY = 'grafana.navigation.extensionSidebarDocked';
export const EXTENSION_SIDEBAR_WIDTH_LOCAL_STORAGE_KEY = 'grafana.navigation.extensionSidebarWidth';
const PERMITTED_EXTENSION_SIDEBAR_PLUGINS = ['grafana-investigations-app', 'grafana-assistant-app', 'grafana-dash-app'];
const PERMITTED_EXTENSION_SIDEBAR_PLUGINS = [
'grafana-investigations-app',
'grafana-assistant-app',
'grafana-dash-app',
'grafana-grafanadocsplugin-app',
];
type ExtensionSidebarContextType = {
/**

View File

@ -14,10 +14,12 @@ export function ExtensionToolbarItem() {
useExtensionSidebarContext();
let dockedComponentTitle = '';
let dockedPluginId = '';
if (dockedComponentId) {
const dockedComponent = getComponentMetaFromComponentId(dockedComponentId);
if (dockedComponent) {
dockedComponentTitle = dockedComponent.componentTitle;
dockedPluginId = dockedComponent.pluginId;
}
}
@ -47,6 +49,7 @@ export function ExtensionToolbarItem() {
setDockedComponentId(getComponentIdFromComponentMeta(components[0].pluginId, components[0]));
}
}}
pluginId={components[0].pluginId}
/>
<NavToolbarSeparator />
</>
@ -85,6 +88,7 @@ export function ExtensionToolbarItem() {
setDockedComponentId(undefined);
}
}}
pluginId={dockedPluginId}
/>
) : (
<Dropdown overlay={MenuItems} placement="bottom-end">

View File

@ -9,13 +9,24 @@ interface ToolbarItemButtonProps {
isOpen: boolean;
title?: string;
onClick?: () => void;
pluginId?: string;
}
function getPluginIcon(pluginId?: string): string {
switch (pluginId) {
case 'grafana-grafanadocsplugin-app':
return 'book';
default:
return 'ai-sparkle';
}
}
function ExtensionToolbarItemButtonComponent(
{ isOpen, title, onClick }: ToolbarItemButtonProps,
{ isOpen, title, onClick, pluginId }: ToolbarItemButtonProps,
ref: React.ForwardedRef<HTMLButtonElement>
) {
const styles = useStyles2(getStyles);
const icon = getPluginIcon(pluginId);
if (isOpen) {
// render button to close the sidebar
@ -23,7 +34,7 @@ function ExtensionToolbarItemButtonComponent(
<ToolbarButton
ref={ref}
className={cx(styles.button, styles.buttonActive)}
icon="ai-sparkle"
icon={icon}
data-testid="extension-toolbar-button-close"
variant="default"
onClick={onClick}
@ -40,7 +51,7 @@ function ExtensionToolbarItemButtonComponent(
<ToolbarButton
ref={ref}
className={cx(styles.button)}
icon="ai-sparkle"
icon={icon}
data-testid="extension-toolbar-button-open"
variant="default"
onClick={onClick}