48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { Dashboard, Panel } from '@grafana/schema';
|
|
|
|
import { GenAIButton } from './GenAIButton';
|
|
import { EventTrackingSrc } from './tracking';
|
|
import { Message, Role, getFilteredPanelString } from './utils';
|
|
|
|
interface GenAIPanelTitleButtonProps {
|
|
onGenerate: (title: string) => void;
|
|
panel: Panel;
|
|
dashboard: Dashboard;
|
|
}
|
|
|
|
const PANEL_TITLE_CHAR_LIMIT = 50;
|
|
|
|
const TITLE_GENERATION_STANDARD_PROMPT =
|
|
'You are an expert in creating Grafana Panels.' +
|
|
'Your goal is to write short, descriptive, and concise panel title.' +
|
|
`The title should be shorter than ${PANEL_TITLE_CHAR_LIMIT} characters.`;
|
|
|
|
export const GenAIPanelTitleButton = ({ onGenerate, panel, dashboard }: GenAIPanelTitleButtonProps) => {
|
|
return (
|
|
<GenAIButton
|
|
messages={() => getMessages(panel, dashboard)}
|
|
onGenerate={onGenerate}
|
|
eventTrackingSrc={EventTrackingSrc.panelTitle}
|
|
toggleTipTitle={'Improve your panel title'}
|
|
/>
|
|
);
|
|
};
|
|
|
|
function getMessages(panel: Panel, dashboard: Dashboard): Message[] {
|
|
const panelString = getFilteredPanelString(panel);
|
|
|
|
return [
|
|
{
|
|
content: TITLE_GENERATION_STANDARD_PROMPT,
|
|
role: Role.system,
|
|
},
|
|
{
|
|
content:
|
|
`The panel is part of a dashboard with the title: ${dashboard.title}\n` +
|
|
`The panel is part of a dashboard with the description: ${dashboard.description}\n` +
|
|
`Use this JSON object which defines the panel: ${panelString}`,
|
|
role: Role.user,
|
|
},
|
|
];
|
|
}
|