mirror of https://github.com/grafana/grafana.git
Allow the docs plugin to use the sidebar (#106905)
This commit is contained in:
parent
27a5bab1c1
commit
10b6dd97f8
|
|
@ -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_EXTENSION_POINT_ID = 'grafana/extension-sidebar/v0-alpha';
|
||||||
export const EXTENSION_SIDEBAR_DOCKED_LOCAL_STORAGE_KEY = 'grafana.navigation.extensionSidebarDocked';
|
export const EXTENSION_SIDEBAR_DOCKED_LOCAL_STORAGE_KEY = 'grafana.navigation.extensionSidebarDocked';
|
||||||
export const EXTENSION_SIDEBAR_WIDTH_LOCAL_STORAGE_KEY = 'grafana.navigation.extensionSidebarWidth';
|
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 = {
|
type ExtensionSidebarContextType = {
|
||||||
/**
|
/**
|
||||||
|
|
|
||||||
|
|
@ -14,10 +14,12 @@ export function ExtensionToolbarItem() {
|
||||||
useExtensionSidebarContext();
|
useExtensionSidebarContext();
|
||||||
|
|
||||||
let dockedComponentTitle = '';
|
let dockedComponentTitle = '';
|
||||||
|
let dockedPluginId = '';
|
||||||
if (dockedComponentId) {
|
if (dockedComponentId) {
|
||||||
const dockedComponent = getComponentMetaFromComponentId(dockedComponentId);
|
const dockedComponent = getComponentMetaFromComponentId(dockedComponentId);
|
||||||
if (dockedComponent) {
|
if (dockedComponent) {
|
||||||
dockedComponentTitle = dockedComponent.componentTitle;
|
dockedComponentTitle = dockedComponent.componentTitle;
|
||||||
|
dockedPluginId = dockedComponent.pluginId;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -47,6 +49,7 @@ export function ExtensionToolbarItem() {
|
||||||
setDockedComponentId(getComponentIdFromComponentMeta(components[0].pluginId, components[0]));
|
setDockedComponentId(getComponentIdFromComponentMeta(components[0].pluginId, components[0]));
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
pluginId={components[0].pluginId}
|
||||||
/>
|
/>
|
||||||
<NavToolbarSeparator />
|
<NavToolbarSeparator />
|
||||||
</>
|
</>
|
||||||
|
|
@ -85,6 +88,7 @@ export function ExtensionToolbarItem() {
|
||||||
setDockedComponentId(undefined);
|
setDockedComponentId(undefined);
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
pluginId={dockedPluginId}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<Dropdown overlay={MenuItems} placement="bottom-end">
|
<Dropdown overlay={MenuItems} placement="bottom-end">
|
||||||
|
|
|
||||||
|
|
@ -9,13 +9,24 @@ interface ToolbarItemButtonProps {
|
||||||
isOpen: boolean;
|
isOpen: boolean;
|
||||||
title?: string;
|
title?: string;
|
||||||
onClick?: () => void;
|
onClick?: () => void;
|
||||||
|
pluginId?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPluginIcon(pluginId?: string): string {
|
||||||
|
switch (pluginId) {
|
||||||
|
case 'grafana-grafanadocsplugin-app':
|
||||||
|
return 'book';
|
||||||
|
default:
|
||||||
|
return 'ai-sparkle';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function ExtensionToolbarItemButtonComponent(
|
function ExtensionToolbarItemButtonComponent(
|
||||||
{ isOpen, title, onClick }: ToolbarItemButtonProps,
|
{ isOpen, title, onClick, pluginId }: ToolbarItemButtonProps,
|
||||||
ref: React.ForwardedRef<HTMLButtonElement>
|
ref: React.ForwardedRef<HTMLButtonElement>
|
||||||
) {
|
) {
|
||||||
const styles = useStyles2(getStyles);
|
const styles = useStyles2(getStyles);
|
||||||
|
const icon = getPluginIcon(pluginId);
|
||||||
|
|
||||||
if (isOpen) {
|
if (isOpen) {
|
||||||
// render button to close the sidebar
|
// render button to close the sidebar
|
||||||
|
|
@ -23,7 +34,7 @@ function ExtensionToolbarItemButtonComponent(
|
||||||
<ToolbarButton
|
<ToolbarButton
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className={cx(styles.button, styles.buttonActive)}
|
className={cx(styles.button, styles.buttonActive)}
|
||||||
icon="ai-sparkle"
|
icon={icon}
|
||||||
data-testid="extension-toolbar-button-close"
|
data-testid="extension-toolbar-button-close"
|
||||||
variant="default"
|
variant="default"
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
|
|
@ -40,7 +51,7 @@ function ExtensionToolbarItemButtonComponent(
|
||||||
<ToolbarButton
|
<ToolbarButton
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className={cx(styles.button)}
|
className={cx(styles.button)}
|
||||||
icon="ai-sparkle"
|
icon={icon}
|
||||||
data-testid="extension-toolbar-button-open"
|
data-testid="extension-toolbar-button-open"
|
||||||
variant="default"
|
variant="default"
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue