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,
    },
  ];
}