Auto-generate: Optimize panel title / description generation (#77661)

Co-authored-by: nmarrs <nathanielmarrs@gmail.com>

.betterer.results

@@ -3010,6 +3010,9 @@ exports[`better eslint`] = {
     "public/app/features/dashboard/components/DeleteDashboard/DeleteDashboardModal.tsx:5381": [
       [0, 0, 0, "Styles should be written using objects.", "0"]
     ],
+    "public/app/features/dashboard/components/GenAI/utils.ts:5381": [
+      [0, 0, 0, "Unexpected any. Specify a different type.", "0"]
+    ],
     "public/app/features/dashboard/components/HelpWizard/HelpWizard.tsx:5381": [
       [0, 0, 0, "Styles should be written using objects.", "0"],
       [0, 0, 0, "Styles should be written using objects.", "1"],

public/app/features/dashboard/components/GenAI/GenAIPanelDescriptionButton.tsx

@@ -5,7 +5,7 @@ import { PanelModel } from '../../state';
 
 import { GenAIButton } from './GenAIButton';
 import { EventTrackingSrc } from './tracking';
-import { Message, Role } from './utils';
+import { Message, Role, getFilteredPanelString } from './utils';
 
 interface GenAIPanelDescriptionButtonProps {
   onGenerate: (description: string) => void;
@@ -39,6 +39,7 @@ export const GenAIPanelDescriptionButton = ({ onGenerate, panel }: GenAIPanelDes
 
 function getMessages(panel: PanelModel): Message[] {
   const dashboard = getDashboardSrv().getCurrent()!;
+  const panelString = getFilteredPanelString(panel);
 
   return [
     {
@@ -54,7 +55,7 @@ function getMessages(panel: PanelModel): Message[] {
       role: Role.system,
     },
     {
-      content: `This is the JSON which defines the panel: ${JSON.stringify(panel.getSaveModel())}`,
+      content: `This is the JSON which defines the panel: ${panelString}`,
       role: Role.user,
     },
   ];

public/app/features/dashboard/components/GenAI/GenAIPanelTitleButton.tsx

@@ -5,7 +5,7 @@ import { PanelModel } from '../../state';
 
 import { GenAIButton } from './GenAIButton';
 import { EventTrackingSrc } from './tracking';
-import { Message, Role } from './utils';
+import { Message, Role, getFilteredPanelString } from './utils';
 
 interface GenAIPanelTitleButtonProps {
   onGenerate: (title: string) => void;
@@ -35,6 +35,7 @@ export const GenAIPanelTitleButton = ({ onGenerate, panel }: GenAIPanelTitleButt
 
 function getMessages(panel: PanelModel): Message[] {
   const dashboard = getDashboardSrv().getCurrent()!;
+  const panelString = getFilteredPanelString(panel);
 
   return [
     {
@@ -50,7 +51,7 @@ function getMessages(panel: PanelModel): Message[] {
       role: Role.system,
     },
     {
-      content: `Use this JSON object which defines the panel: ${JSON.stringify(panel.getSaveModel())}`,
+      content: `Use this JSON object which defines the panel: ${panelString}`,
       role: Role.system,
     },
   ];

public/app/features/dashboard/components/GenAI/utils.ts

@@ -86,11 +86,9 @@ export const getFeedbackMessage = (previousResponse: string, feedback: string |
  * @returns String for inclusion in prompts stating what the dashboard's panels are
  */
 export function getDashboardPanelPrompt(dashboard: DashboardModel): string {
-  const getPanelString = (panel: PanelModel, idx: number) => `
+  const getPanelString = (panel: PanelModel, idx: number) =>
-  - Panel ${idx}\n
+    `- Panel ${idx}
-  - Title: ${panel.title}\n
+- Title: ${panel.title}${panel.description ? `\n- Description: ${panel.description}` : ''}`;
-  ${panel.description ? `- Description: ${panel.description}` : ''}
-  `;
 
   const panelStrings: string[] = dashboard.panels.map(getPanelString);
   let panelPrompt: string;
@@ -121,3 +119,29 @@ export function getDashboardPanelPrompt(dashboard: DashboardModel): string {
   // So it is possibly that if we can condense it further it would be better
   return panelPrompt;
 }
+
+export function getFilteredPanelString(panel: PanelModel): string {
+  const panelObj = panel.getSaveModel();
+
+  const keysToKeep = new Set([
+    'id',
+    'datasource',
+    'title',
+    'description',
+    'targets',
+    'thresholds',
+    'type',
+    'xaxis',
+    'yaxes',
+  ]);
+
+  // This cannot avoid the use of any because the type of panelObj is any
+  const panelObjFiltered = Object.keys(panelObj).reduce((obj: { [key: string]: any }, key) => {
+    if (keysToKeep.has(key)) {
+      obj[key] = panelObj[key];
+    }
+    return obj;
+  }, {});
+
+  return JSON.stringify(panelObjFiltered, null, 2);
+}