From dad16637cef54ebcbb7f28413bf48f7b7e33aa77 Mon Sep 17 00:00:00 2001
From: "Grot (@grafanabot)" <43478413+grafanabot@users.noreply.github.com>
Date: Tue, 12 Oct 2021 12:16:41 +0100
Subject: [PATCH] fix rule form crashing when extra query editor actions are
 provided (#40319) (#40322)

(cherry picked from commit b1f56b4863bb487a7c37a5b0d22ec1702f8e244b)

Co-authored-by: Domas <domas.lapinskas@grafana.com>
---
 .../alerting/unified/components/rule-editor/QueryRows.tsx  | 7 +++++--
 .../unified/components/rule-editor/QueryWrapper.tsx        | 3 ++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
index e142b24ebf2..d6377747a12 100644
--- a/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
@@ -3,6 +3,7 @@ import { DragDropContext, Droppable, DropResult } from 'react-beautiful-dnd';
 import {
   DataQuery,
   DataSourceInstanceSettings,
+  LoadingState,
   PanelData,
   RelativeTimeRange,
   ThresholdsConfig,
@@ -230,13 +231,15 @@ export class QueryRows extends PureComponent<Props, State> {
             return (
               <div ref={provided.innerRef} {...provided.droppableProps}>
                 {queries.map((query, index) => {
-                  const data = this.props.data ? this.props.data[query.refId] : ({} as PanelData);
+                  const data: PanelData = this.props.data?.[query.refId] ?? {
+                    series: [],
+                    state: LoadingState.NotStarted,
+                  };
                   const dsSettings = this.getDataSourceSettings(query);
 
                   if (!dsSettings) {
                     return null;
                   }
-
                   return (
                     <QueryWrapper
                       index={index}
diff --git a/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
index 1b1da1170a0..f0695f0cc15 100644
--- a/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
@@ -6,6 +6,7 @@ import {
   DataSourceInstanceSettings,
   getDefaultRelativeTimeRange,
   GrafanaTheme2,
+  LoadingState,
   PanelData,
   RelativeTimeRange,
   ThresholdsConfig,
@@ -83,7 +84,7 @@ export const QueryWrapper: FC<Props> = ({
         queries={queries}
         renderHeaderExtras={() => renderTimePicker(query, index)}
         visualization={
-          data ? (
+          data.state !== LoadingState.NotStarted ? (
             <VizWrapper
               data={data}
               changePanel={changePluginId}