Panel: omit query API call when the panel is a row (#75847)

public/app/features/dashboard/dashgrid/PanelStateWrapper.test.tsx

@@ -137,6 +137,70 @@ describe('PanelStateWrapper', () => {
       });
     });
   });
+
+  describe('Panel row', () => {
+    it('should call query runner when it is not a row panel', async () => {
+      const subject: ReplaySubject<PanelData> = new ReplaySubject<PanelData>();
+
+      const panelQueryRunner = {
+        getData: () => subject,
+        run: jest.fn(),
+      } as unknown as PanelQueryRunner;
+
+      const options = {
+        panel: new PanelModel({
+          id: 123,
+          events: new EventBusSrv(),
+          getQueryRunner: () => panelQueryRunner,
+          getOptions: jest.fn(),
+          getDisplayTitle: jest.fn(),
+        }),
+        dashboard: {
+          panelInitialized: (panel: PanelModel) => panel.refresh(),
+          getTimezone: () => 'browser',
+          events: new EventBusSrv(),
+          canAddAnnotations: jest.fn(),
+          canEditAnnotations: jest.fn(),
+          canDeleteAnnotations: jest.fn(),
+        } as unknown as DashboardModel,
+        isInView: true,
+      };
+      const { props } = setupTestContext(options);
+
+      expect(props.panel.getQueryRunner().run).toHaveBeenCalled();
+    });
+    it('should not call query runner when it is a row panel', async () => {
+      const subject: ReplaySubject<PanelData> = new ReplaySubject<PanelData>();
+
+      const panelQueryRunner = {
+        getData: () => subject,
+        run: jest.fn(),
+      } as unknown as PanelQueryRunner;
+
+      const options = {
+        panel: new PanelModel({
+          id: 123,
+          events: new EventBusSrv(),
+          getQueryRunner: () => panelQueryRunner,
+          getOptions: jest.fn(),
+          getDisplayTitle: jest.fn(),
+          type: 'row',
+        }),
+        dashboard: {
+          panelInitialized: (panel: PanelModel) => panel.refresh(),
+          getTimezone: () => 'browser',
+          events: new EventBusSrv(),
+          canAddAnnotations: jest.fn(),
+          canEditAnnotations: jest.fn(),
+          canDeleteAnnotations: jest.fn(),
+        } as unknown as DashboardModel,
+        isInView: true,
+      };
+      const { props } = setupTestContext(options);
+
+      expect(props.panel.getQueryRunner().run).not.toHaveBeenCalled();
+    });
+  });
 });
 
 const TestPanelComponent = () => <div>Plugin Panel to Render</div>;

public/app/features/dashboard/state/PanelModel.test.ts

@@ -590,6 +590,15 @@ describe('PanelModel', () => {
 
         expect(model.getQueryRunner).toBeCalled();
       });
+      it('when called then it should not call all pending queries if the panel is a row', () => {
+        model.getQueryRunner = jest.fn().mockReturnValue({
+          run: jest.fn(),
+        });
+        model.type = 'row';
+        model.runAllPanelQueries({});
+
+        expect(model.getQueryRunner).not.toBeCalled();
+      });
     });
   });
 });

public/app/features/dashboard/state/PanelModel.ts

@@ -360,6 +360,9 @@ export class PanelModel implements DataConfigSource, IPanelModel {
   }
 
   runAllPanelQueries({ dashboardUID, dashboardTimezone, timeData, width }: RunPanelQueryOptions) {
+    if (this.type === 'row') {
+      return;
+    }
     this.getQueryRunner().run({
       datasource: this.datasource,
       queries: this.targets,