From fd6e33865133db78b195455f8bf7f3cd110f91e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Thu, 20 May 2021 14:09:19 +0200
Subject: [PATCH 01/43] Timeline: Fixes crash when there was only 1 threshold
 step (#34471)

---
 public/app/plugins/panel/state-timeline/utils.ts | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/public/app/plugins/panel/state-timeline/utils.ts b/public/app/plugins/panel/state-timeline/utils.ts
index 99edbe8aa34..9f4f0a1d44b 100644
--- a/public/app/plugins/panel/state-timeline/utils.ts
+++ b/public/app/plugins/panel/state-timeline/utils.ts
@@ -318,15 +318,14 @@ export function prepareTimelineLegendItems(
   }
 
   const items: VizLegendItem[] = [];
-  const first = fields[0].config;
-  const colorMode = first.color?.mode ?? FieldColorModeId.Fixed;
+  const fieldConfig = fields[0].config;
+  const colorMode = fieldConfig.color?.mode ?? FieldColorModeId.Fixed;
+  const thresholds = fieldConfig.thresholds;
 
   // If thresholds are enabled show each step in the legend
-  if (colorMode === FieldColorModeId.Thresholds && first.thresholds?.steps) {
-    const steps = first.thresholds.steps;
-    const disp = getValueFormat(
-      first.thresholds.mode === ThresholdsMode.Percentage ? 'percent' : first.unit ?? 'fixed'
-    );
+  if (colorMode === FieldColorModeId.Thresholds && thresholds?.steps && thresholds.steps.length > 1) {
+    const steps = thresholds.steps;
+    const disp = getValueFormat(thresholds.mode === ThresholdsMode.Percentage ? 'percent' : fieldConfig.unit ?? '');
 
     const fmt = (v: number) => formattedValueToString(disp(v));
 

From 23939eab107443e0dc985195309a7fc732590cce Mon Sep 17 00:00:00 2001
From: Sofia Papagiannaki <papagian@users.noreply.github.com>
Date: Thu, 20 May 2021 15:49:33 +0300
Subject: [PATCH 02/43] [Alerting]: namespace fixes (#34470)

* [Alerting]: forbid viewers for updating rules if viewers can edit

check for CanSave instead of CanEdit

* Clear ngalert tables when deleting the folder

* Apply suggestions from code review

* Log failure to check save permission

Co-authored-by: gotjosh <josue@grafana.com>
---
 pkg/services/ngalert/ngalert.go               |   1 +
 .../ngalert/notifier/alertmanager_test.go     |   3 +
 pkg/services/ngalert/store/alert_rule.go      |   9 +-
 pkg/services/ngalert/store/database.go        |   3 +-
 pkg/services/ngalert/tests/util.go            |   6 +-
 pkg/services/sqlstore/dashboard.go            |  13 +
 .../api/alerting/api_alertmanager_test.go     | 273 +++++++++++++++++-
 .../alerting/api_notification_channel_test.go |   3 +-
 pkg/tests/api/alerting/api_prometheus_test.go |   3 +-
 pkg/tests/api/alerting/api_ruler_test.go      |  14 +-
 pkg/tests/testinfra/testinfra.go              |   8 +
 11 files changed, 315 insertions(+), 21 deletions(-)

diff --git a/pkg/services/ngalert/ngalert.go b/pkg/services/ngalert/ngalert.go
index 96e1e2b6143..e589aa47b07 100644
--- a/pkg/services/ngalert/ngalert.go
+++ b/pkg/services/ngalert/ngalert.go
@@ -69,6 +69,7 @@ func (ng *AlertNG) Init() error {
 		BaseInterval:           baseInterval,
 		DefaultIntervalSeconds: defaultIntervalSeconds,
 		SQLStore:               ng.SQLStore,
+		Logger:                 ng.Log,
 	}
 
 	var err error
diff --git a/pkg/services/ngalert/notifier/alertmanager_test.go b/pkg/services/ngalert/notifier/alertmanager_test.go
index c074b91f06d..2814add0263 100644
--- a/pkg/services/ngalert/notifier/alertmanager_test.go
+++ b/pkg/services/ngalert/notifier/alertmanager_test.go
@@ -9,6 +9,8 @@ import (
 	"testing"
 	"time"
 
+	"github.com/grafana/grafana/pkg/infra/log"
+
 	gokit_log "github.com/go-kit/kit/log"
 	"github.com/go-openapi/strfmt"
 	"github.com/prometheus/alertmanager/api/v2/models"
@@ -42,6 +44,7 @@ func setupAMTest(t *testing.T) *Alertmanager {
 		BaseInterval:           10 * time.Second,
 		DefaultIntervalSeconds: 60,
 		SQLStore:               sqlStore,
+		Logger:                 log.New("alertmanager-test"),
 	}
 
 	am, err := New(cfg, store, m)
diff --git a/pkg/services/ngalert/store/alert_rule.go b/pkg/services/ngalert/store/alert_rule.go
index 0d118902d3e..5cd139c6d95 100644
--- a/pkg/services/ngalert/store/alert_rule.go
+++ b/pkg/services/ngalert/store/alert_rule.go
@@ -368,16 +368,19 @@ func (st DBstore) GetRuleGroupAlertRules(query *ngmodels.ListRuleGroupAlertRules
 }
 
 // GetNamespaceByTitle is a handler for retrieving a namespace by its title. Alerting rules follow a Grafana folder-like structure which we call namespaces.
-func (st DBstore) GetNamespaceByTitle(namespace string, orgID int64, user *models.SignedInUser, withEdit bool) (*models.Folder, error) {
+func (st DBstore) GetNamespaceByTitle(namespace string, orgID int64, user *models.SignedInUser, withCanSave bool) (*models.Folder, error) {
 	s := dashboards.NewFolderService(orgID, user, st.SQLStore)
 	folder, err := s.GetFolderByTitle(namespace)
 	if err != nil {
 		return nil, err
 	}
 
-	if withEdit {
+	if withCanSave {
 		g := guardian.New(folder.Id, orgID, user)
-		if canAdmin, err := g.CanEdit(); err != nil || !canAdmin {
+		if canSave, err := g.CanSave(); err != nil || !canSave {
+			if err != nil {
+				st.Logger.Error("checking can save permission has failed", "userId", user.UserId, "username", user.Login, "namespace", namespace, "orgId", orgID, "error", err)
+			}
 			return nil, ngmodels.ErrCannotEditNamespace
 		}
 	}
diff --git a/pkg/services/ngalert/store/database.go b/pkg/services/ngalert/store/database.go
index 933a1c9e56c..9fdad89718a 100644
--- a/pkg/services/ngalert/store/database.go
+++ b/pkg/services/ngalert/store/database.go
@@ -3,8 +3,8 @@ package store
 import (
 	"time"
 
+	"github.com/grafana/grafana/pkg/infra/log"
 	"github.com/grafana/grafana/pkg/services/ngalert/models"
-
 	"github.com/grafana/grafana/pkg/services/sqlstore"
 )
 
@@ -28,4 +28,5 @@ type DBstore struct {
 	// default alert definiiton interval
 	DefaultIntervalSeconds int64
 	SQLStore               *sqlstore.SQLStore
+	Logger                 log.Logger
 }
diff --git a/pkg/services/ngalert/tests/util.go b/pkg/services/ngalert/tests/util.go
index 610d7fea330..e3044416c44 100644
--- a/pkg/services/ngalert/tests/util.go
+++ b/pkg/services/ngalert/tests/util.go
@@ -38,7 +38,11 @@ func SetupTestEnv(t *testing.T, baseIntervalSeconds int64) *store.DBstore {
 
 	err := ng.Init()
 	require.NoError(t, err)
-	return &store.DBstore{SQLStore: ng.SQLStore, BaseInterval: time.Duration(baseIntervalSeconds) * time.Second}
+	return &store.DBstore{
+		SQLStore:     ng.SQLStore,
+		BaseInterval: time.Duration(baseIntervalSeconds) * time.Second,
+		Logger:       log.New("ngalert-test"),
+	}
 }
 
 func overrideAlertNGInRegistry(t *testing.T, cfg *setting.Cfg) ngalert.AlertNG {
diff --git a/pkg/services/sqlstore/dashboard.go b/pkg/services/sqlstore/dashboard.go
index d9ec5657938..2e9066cc898 100644
--- a/pkg/services/sqlstore/dashboard.go
+++ b/pkg/services/sqlstore/dashboard.go
@@ -465,6 +465,19 @@ func deleteDashboard(cmd *models.DeleteDashboardCommand, sess *DBSession) error
 				}
 			}
 		}
+
+		// clean ngalert tables
+		ngalertDeletes := []string{
+			"DELETE FROM alert_rule WHERE namespace_uid = (SELECT uid FROM dashboard WHERE id = ?)",
+			"DELETE FROM alert_rule_version WHERE rule_namespace_uid = (SELECT uid FROM dashboard WHERE id = ?)",
+		}
+
+		for _, sql := range ngalertDeletes {
+			_, err := sess.Exec(sql, dashboard.Id)
+			if err != nil {
+				return err
+			}
+		}
 	}
 
 	if err := deleteAlertDefinition(dashboard.Id, sess); err != nil {
diff --git a/pkg/tests/api/alerting/api_alertmanager_test.go b/pkg/tests/api/alerting/api_alertmanager_test.go
index cbf99ee12c9..0338ae1fa1e 100644
--- a/pkg/tests/api/alerting/api_alertmanager_test.go
+++ b/pkg/tests/api/alerting/api_alertmanager_test.go
@@ -285,7 +285,6 @@ func TestAMConfigAccess(t *testing.T) {
 				// Fetch Request
 				resp, err := client.Do(req)
 				if err != nil {
-					fmt.Println(err)
 					return
 				}
 				t.Cleanup(func() {
@@ -386,7 +385,8 @@ func TestAlertAndGroupsQuery(t *testing.T) {
 	// Now, let's test the endpoint with some alerts.
 	{
 		// Create the namespace we'll save our alerts to.
-		require.NoError(t, createFolder(t, store, 0, "default"))
+		_, err := createFolder(t, store, 0, "default")
+		require.NoError(t, err)
 	}
 
 	// Create an alert that will fire as quickly as possible
@@ -464,6 +464,255 @@ func TestAlertAndGroupsQuery(t *testing.T) {
 	}
 }
 
+func TestRulerAccess(t *testing.T) {
+	// Setup Grafana and its Database
+	dir, path := testinfra.CreateGrafDir(t, testinfra.GrafanaOpts{
+		EnableFeatureToggles: []string{"ngalert"},
+		EnableQuota:          true,
+		DisableAnonymous:     true,
+		ViewersCanEdit:       true,
+	})
+
+	store := testinfra.SetUpDatabase(t, dir)
+	// override bus to get the GetSignedInUserQuery handler
+	store.Bus = bus.GetBus()
+	grafanaListedAddr := testinfra.StartGrafana(t, dir, path, store)
+
+	// Create the namespace we'll save our alerts to.
+	_, err := createFolder(t, store, 0, "default")
+	require.NoError(t, err)
+
+	// Create a users to make authenticated requests
+	require.NoError(t, createUser(t, store, models.ROLE_VIEWER, "viewer", "viewer"))
+	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "editor", "editor"))
+	require.NoError(t, createUser(t, store, models.ROLE_ADMIN, "admin", "admin"))
+
+	// Now, let's test the access policies.
+	testCases := []struct {
+		desc             string
+		url              string
+		expStatus        int
+		expectedResponse string
+	}{
+		{
+			desc:             "un-authenticated request should fail",
+			url:              "http://%s/api/ruler/grafana/api/v1/rules/default",
+			expStatus:        http.StatusUnauthorized,
+			expectedResponse: `{"message": "Unauthorized"}`,
+		},
+		{
+			desc:             "viewer request should fail",
+			url:              "http://viewer:viewer@%s/api/ruler/grafana/api/v1/rules/default",
+			expStatus:        http.StatusForbidden,
+			expectedResponse: `{"error":"user does not have permissions to edit the namespace", "message":"user does not have permissions to edit the namespace"}`,
+		},
+		{
+			desc:             "editor request should succeed",
+			url:              "http://editor:editor@%s/api/ruler/grafana/api/v1/rules/default",
+			expStatus:        http.StatusAccepted,
+			expectedResponse: `{"message":"rule group updated successfully"}`,
+		},
+		{
+			desc:             "admin request should succeed",
+			url:              "http://admin:admin@%s/api/ruler/grafana/api/v1/rules/default",
+			expStatus:        http.StatusAccepted,
+			expectedResponse: `{"message":"rule group updated successfully"}`,
+		},
+	}
+
+	for i, tc := range testCases {
+		t.Run(tc.desc, func(t *testing.T) {
+			interval, err := model.ParseDuration("1m")
+			require.NoError(t, err)
+
+			rules := apimodels.PostableRuleGroupConfig{
+				Name: "arulegroup",
+				Rules: []apimodels.PostableExtendedRuleNode{
+					{
+						ApiRuleNode: &apimodels.ApiRuleNode{
+							For:         interval,
+							Labels:      map[string]string{"label1": "val1"},
+							Annotations: map[string]string{"annotation1": "val1"},
+						},
+						// this rule does not explicitly set no data and error states
+						// therefore it should get the default values
+						GrafanaManagedAlert: &apimodels.PostableGrafanaRule{
+							Title:     fmt.Sprintf("AlwaysFiring %d", i),
+							Condition: "A",
+							Data: []ngmodels.AlertQuery{
+								{
+									RefID: "A",
+									RelativeTimeRange: ngmodels.RelativeTimeRange{
+										From: ngmodels.Duration(time.Duration(5) * time.Hour),
+										To:   ngmodels.Duration(time.Duration(3) * time.Hour),
+									},
+									DatasourceUID: "-100",
+									Model: json.RawMessage(`{
+								"type": "math",
+								"expression": "2 + 3 > 1"
+								}`),
+								},
+							},
+						},
+					},
+				},
+			}
+			buf := bytes.Buffer{}
+			enc := json.NewEncoder(&buf)
+			err = enc.Encode(&rules)
+			require.NoError(t, err)
+
+			u := fmt.Sprintf(tc.url, grafanaListedAddr)
+			// nolint:gosec
+			resp, err := http.Post(u, "application/json", &buf)
+			require.NoError(t, err)
+			t.Cleanup(func() {
+				err := resp.Body.Close()
+				require.NoError(t, err)
+			})
+			b, err := ioutil.ReadAll(resp.Body)
+			require.NoError(t, err)
+
+			assert.Equal(t, tc.expStatus, resp.StatusCode)
+			require.JSONEq(t, tc.expectedResponse, string(b))
+		})
+	}
+}
+
+func TestDeleteFolderWithRules(t *testing.T) {
+	// Setup Grafana and its Database
+	dir, path := testinfra.CreateGrafDir(t, testinfra.GrafanaOpts{
+		EnableFeatureToggles: []string{"ngalert"},
+		EnableQuota:          true,
+		DisableAnonymous:     true,
+		ViewersCanEdit:       true,
+	})
+
+	store := testinfra.SetUpDatabase(t, dir)
+	// override bus to get the GetSignedInUserQuery handler
+	store.Bus = bus.GetBus()
+	grafanaListedAddr := testinfra.StartGrafana(t, dir, path, store)
+
+	// Create the namespace we'll save our alerts to.
+	namespaceUID, err := createFolder(t, store, 0, "default")
+	require.NoError(t, err)
+
+	require.NoError(t, createUser(t, store, models.ROLE_VIEWER, "viewer", "viewer"))
+	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "editor", "editor"))
+
+	createRule(t, grafanaListedAddr, "default", "editor", "editor")
+
+	// First, let's have an editor create a rule within the folder/namespace.
+	{
+		u := fmt.Sprintf("http://editor:editor@%s/api/ruler/grafana/api/v1/rules", grafanaListedAddr)
+		// nolint:gosec
+		resp, err := http.Get(u)
+		require.NoError(t, err)
+		t.Cleanup(func() {
+			err := resp.Body.Close()
+			require.NoError(t, err)
+		})
+		b, err := ioutil.ReadAll(resp.Body)
+		require.NoError(t, err)
+
+		assert.Equal(t, 202, resp.StatusCode)
+
+		re := regexp.MustCompile(`"uid":"([\w|-]+)"`)
+		b = re.ReplaceAll(b, []byte(`"uid":""`))
+		re = regexp.MustCompile(`"updated":"(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}Z)"`)
+		b = re.ReplaceAll(b, []byte(`"updated":"2021-05-19T19:47:55Z"`))
+
+		expectedGetRulesResponseBody := fmt.Sprintf(`{
+			"default": [
+				{
+					"name": "arulegroup",
+					"interval": "1m",
+					"rules": [
+						{
+							"expr": "",
+							"for": "2m",
+							"labels": {
+								"label1": "val1"
+							},
+							"annotations": {
+								"annotation1": "val1"
+							},
+							"grafana_alert": {
+								"id": 1,
+								"orgId": 1,
+								"title": "rule under folder default",
+								"condition": "A",
+								"data": [
+									{
+										"refId": "A",
+										"queryType": "",
+										"relativeTimeRange": {
+											"from": 18000,
+											"to": 10800
+										},
+										"datasourceUid": "-100",
+										"model": {
+											"expression": "2 + 3 > 1",
+											"intervalMs": 1000,
+											"maxDataPoints": 43200,
+											"type": "math"
+										}
+									}
+								],
+								"updated": "2021-05-19T19:47:55Z",
+								"intervalSeconds": 60,
+								"version": 1,
+								"uid": "",
+								"namespace_uid": %q,
+								"namespace_id": 1,
+								"rule_group": "arulegroup",
+								"no_data_state": "NoData",
+								"exec_err_state": "Alerting"
+							}
+						}
+					]
+				}
+			]
+		}`, namespaceUID)
+		assert.JSONEq(t, expectedGetRulesResponseBody, string(b))
+	}
+
+	// Next, the editor can delete the folder.
+	{
+		u := fmt.Sprintf("http://editor:editor@%s/api/folders/%s", grafanaListedAddr, namespaceUID)
+		req, err := http.NewRequest(http.MethodDelete, u, nil)
+		require.NoError(t, err)
+		client := &http.Client{}
+		resp, err := client.Do(req)
+		require.NoError(t, err)
+		t.Cleanup(func() {
+			err := resp.Body.Close()
+			require.NoError(t, err)
+		})
+		b, err := ioutil.ReadAll(resp.Body)
+		require.NoError(t, err)
+		require.Equal(t, 200, resp.StatusCode)
+		require.JSONEq(t, `{"id":1,"message":"Folder default deleted","title":"default"}`, string(b))
+	}
+
+	// Finally, we ensure the rules were deleted.
+	{
+		u := fmt.Sprintf("http://editor:editor@%s/api/ruler/grafana/api/v1/rules", grafanaListedAddr)
+		// nolint:gosec
+		resp, err := http.Get(u)
+		require.NoError(t, err)
+		t.Cleanup(func() {
+			err := resp.Body.Close()
+			require.NoError(t, err)
+		})
+		b, err := ioutil.ReadAll(resp.Body)
+		require.NoError(t, err)
+
+		assert.Equal(t, 202, resp.StatusCode)
+		assert.JSONEq(t, "{}", string(b))
+	}
+}
+
 func TestAlertRuleCRUD(t *testing.T) {
 	// Setup Grafana and its Database
 	dir, path := testinfra.CreateGrafDir(t, testinfra.GrafanaOpts{
@@ -478,10 +727,12 @@ func TestAlertRuleCRUD(t *testing.T) {
 	grafanaListedAddr := testinfra.StartGrafana(t, dir, path, store)
 
 	err := createUser(t, store, models.ROLE_EDITOR, "grafana", "password")
+
 	require.NoError(t, err)
 
 	// Create the namespace we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "default"))
+	_, err = createFolder(t, store, 0, "default")
+	require.NoError(t, err)
 
 	interval, err := model.ParseDuration("1m")
 	require.NoError(t, err)
@@ -1197,7 +1448,8 @@ func TestQuota(t *testing.T) {
 	grafanaListedAddr := testinfra.StartGrafana(t, dir, path, store)
 
 	// Create the namespace we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "default"))
+	_, err := createFolder(t, store, 0, "default")
+	require.NoError(t, err)
 
 	// Create a user to make authenticated requests
 	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "grafana", "password"))
@@ -1298,7 +1550,8 @@ func TestEval(t *testing.T) {
 	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "grafana", "password"))
 
 	// Create the namespace we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "default"))
+	_, err := createFolder(t, store, 0, "default")
+	require.NoError(t, err)
 
 	// test eval conditions
 	testCases := []struct {
@@ -1641,7 +1894,7 @@ func TestEval(t *testing.T) {
 
 // createFolder creates a folder for storing our alerts under. Grafana uses folders as a replacement for alert namespaces to match its permission model.
 // We use the dashboard command using IsFolder = true to tell it's a folder, it takes the dashboard as the name of the folder.
-func createFolder(t *testing.T, store *sqlstore.SQLStore, folderID int64, folderName string) error {
+func createFolder(t *testing.T, store *sqlstore.SQLStore, folderID int64, folderName string) (string, error) {
 	t.Helper()
 
 	cmd := models.SaveDashboardCommand{
@@ -1652,9 +1905,13 @@ func createFolder(t *testing.T, store *sqlstore.SQLStore, folderID int64, folder
 			"title": folderName,
 		}),
 	}
-	_, err := store.SaveDashboard(cmd)
+	f, err := store.SaveDashboard(cmd)
 
-	return err
+	if err != nil {
+		return "", err
+	}
+
+	return f.Uid, nil
 }
 
 // rulesNamespaceWithoutVariableValues takes a apimodels.NamespaceConfigResponse JSON-based input and makes the dynamic fields static e.g. uid, dates, etc.
diff --git a/pkg/tests/api/alerting/api_notification_channel_test.go b/pkg/tests/api/alerting/api_notification_channel_test.go
index 5b18bc4fb93..885d681c84c 100644
--- a/pkg/tests/api/alerting/api_notification_channel_test.go
+++ b/pkg/tests/api/alerting/api_notification_channel_test.go
@@ -57,7 +57,8 @@ func TestNotificationChannels(t *testing.T) {
 
 	{
 		// Create the namespace we'll save our alerts to.
-		require.NoError(t, createFolder(t, s, 0, "default"))
+		_, err := createFolder(t, s, 0, "default")
+		require.NoError(t, err)
 
 		// Post the alertmanager config.
 		u := fmt.Sprintf("http://grafana:password@%s/api/alertmanager/grafana/config/api/v1/alerts", grafanaListedAddr)
diff --git a/pkg/tests/api/alerting/api_prometheus_test.go b/pkg/tests/api/alerting/api_prometheus_test.go
index d9c4db93bf3..18f535060e1 100644
--- a/pkg/tests/api/alerting/api_prometheus_test.go
+++ b/pkg/tests/api/alerting/api_prometheus_test.go
@@ -30,7 +30,8 @@ func TestPrometheusRules(t *testing.T) {
 	grafanaListedAddr := testinfra.StartGrafana(t, dir, path, store)
 
 	// Create the namespace under default organisation (orgID = 1) where we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "default"))
+	_, err := createFolder(t, store, 0, "default")
+	require.NoError(t, err)
 
 	// Create a user to make authenticated requests
 	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "grafana", "password"))
diff --git a/pkg/tests/api/alerting/api_ruler_test.go b/pkg/tests/api/alerting/api_ruler_test.go
index 531fe7585d8..99da0369d0c 100644
--- a/pkg/tests/api/alerting/api_ruler_test.go
+++ b/pkg/tests/api/alerting/api_ruler_test.go
@@ -34,16 +34,18 @@ func TestAlertRulePermissions(t *testing.T) {
 	require.NoError(t, createUser(t, store, models.ROLE_EDITOR, "grafana", "password"))
 
 	// Create the namespace we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "folder1"))
+	_, err := createFolder(t, store, 0, "folder1")
+	require.NoError(t, err)
 
+	_, err = createFolder(t, store, 0, "folder2")
 	// Create the namespace we'll save our alerts to.
-	require.NoError(t, createFolder(t, store, 0, "folder2"))
+	require.NoError(t, err)
 
 	// Create rule under folder1
-	createRule(t, grafanaListedAddr, "folder1")
+	createRule(t, grafanaListedAddr, "folder1", "grafana", "password")
 
 	// Create rule under folder2
-	createRule(t, grafanaListedAddr, "folder2")
+	createRule(t, grafanaListedAddr, "folder2", "grafana", "password")
 
 	// With the rules created, let's make sure that rule definitions are stored.
 	{
@@ -240,7 +242,7 @@ func TestAlertRulePermissions(t *testing.T) {
 	}
 }
 
-func createRule(t *testing.T, grafanaListedAddr string, folder string) {
+func createRule(t *testing.T, grafanaListedAddr string, folder string, user, password string) {
 	t.Helper()
 
 	interval, err := model.ParseDuration("1m")
@@ -282,7 +284,7 @@ func createRule(t *testing.T, grafanaListedAddr string, folder string) {
 	err = enc.Encode(&rules)
 	require.NoError(t, err)
 
-	u := fmt.Sprintf("http://grafana:password@%s/api/ruler/grafana/api/v1/rules/%s", grafanaListedAddr, folder)
+	u := fmt.Sprintf("http://%s:%s@%s/api/ruler/grafana/api/v1/rules/%s", user, password, grafanaListedAddr, folder)
 	// nolint:gosec
 	resp, err := http.Post(u, "application/json", &buf)
 	require.NoError(t, err)
diff --git a/pkg/tests/testinfra/testinfra.go b/pkg/tests/testinfra/testinfra.go
index 86eceb4959c..aa79c782c5c 100644
--- a/pkg/tests/testinfra/testinfra.go
+++ b/pkg/tests/testinfra/testinfra.go
@@ -239,6 +239,12 @@ func CreateGrafDir(t *testing.T, opts ...GrafanaOpts) (string, string) {
 			_, err = anonSect.NewKey("plugin_admin_enabled", "true")
 			require.NoError(t, err)
 		}
+		if o.ViewersCanEdit {
+			usersSection, err := cfg.NewSection("users")
+			require.NoError(t, err)
+			_, err = usersSection.NewKey("viewers_can_edit", "true")
+			require.NoError(t, err)
+		}
 	}
 
 	cfgPath := filepath.Join(cfgDir, "test.ini")
@@ -257,5 +263,7 @@ type GrafanaOpts struct {
 	AnonymousUserRole    models.RoleType
 	EnableQuota          bool
 	DisableAnonymous     bool
+	CatalogAppEnabled    bool
+	ViewersCanEdit       bool
 	PluginAdminEnabled   bool
 }

From c4dcfdef56791052e1f5366ef398c1866a2b648a Mon Sep 17 00:00:00 2001
From: Will Browne <wbrowne@users.noreply.github.com>
Date: Thu, 20 May 2021 15:11:07 +0200
Subject: [PATCH 03/43] Plugins: Improve plugin installer error messages
 (#34437)

* fix and improve error messages

* enrich error message

* ignore previous changes

* revert manual version bump

* remove condition

* fix version param
---
 pkg/plugins/manager/installer/installer.go | 50 +++++++++++-----------
 1 file changed, 25 insertions(+), 25 deletions(-)

diff --git a/pkg/plugins/manager/installer/installer.go b/pkg/plugins/manager/installer/installer.go
index 52184d79b85..6e2ef50543a 100644
--- a/pkg/plugins/manager/installer/installer.go
+++ b/pkg/plugins/manager/installer/installer.go
@@ -58,32 +58,23 @@ func (e *BadRequestError) Error() string {
 }
 
 type ErrVersionUnsupported struct {
-	PluginID           string
-	RequestedVersion   string
-	RecommendedVersion string
+	PluginID         string
+	RequestedVersion string
+	SystemInfo       string
 }
 
 func (e ErrVersionUnsupported) Error() string {
-	if len(e.RecommendedVersion) > 0 {
-		return fmt.Sprintf("%s v%s is not supported on your architecture and OS, latest suitable version is %s",
-			e.PluginID, e.RequestedVersion, e.RecommendedVersion)
-	}
-	return fmt.Sprintf("%s v%s is not supported on your architecture and OS", e.PluginID, e.RequestedVersion)
+	return fmt.Sprintf("%s v%s is not supported on your system (%s)", e.PluginID, e.RequestedVersion, e.SystemInfo)
 }
 
 type ErrVersionNotFound struct {
-	PluginID           string
-	RequestedVersion   string
-	RecommendedVersion string
+	PluginID         string
+	RequestedVersion string
+	SystemInfo       string
 }
 
 func (e ErrVersionNotFound) Error() string {
-	if len(e.RecommendedVersion) > 0 {
-		return fmt.Sprintf("%s v%s is not supported on your architecture and OS, latest suitable version is %s",
-			e.PluginID, e.RequestedVersion, e.RecommendedVersion)
-	}
-	return fmt.Sprintf("could not find a version %s for %s. The latest suitable version is %s", e.RequestedVersion,
-		e.PluginID, e.RecommendedVersion)
+	return fmt.Sprintf("%s v%s either does not exist or is not supported on your system (%s)", e.PluginID, e.RequestedVersion, e.SystemInfo)
 }
 
 func New(skipTLSVerify bool, grafanaVersion string, logger plugins.PluginInstallerLogger) *Installer {
@@ -114,7 +105,7 @@ func (i *Installer) Install(ctx context.Context, pluginID, version, pluginsDir,
 			return err
 		}
 
-		v, err := selectVersion(&plugin, version)
+		v, err := i.selectVersion(&plugin, version)
 		if err != nil {
 			return err
 		}
@@ -429,7 +420,7 @@ func normalizeVersion(version string) string {
 // selectVersion returns latest version if none is specified or the specified version. If the version string is not
 // matched to existing version it errors out. It also errors out if version that is matched is not available for current
 // os and platform. It expects plugin.Versions to be sorted so the newest version is first.
-func selectVersion(plugin *Plugin, version string) (*Version, error) {
+func (i *Installer) selectVersion(plugin *Plugin, version string) (*Version, error) {
 	var ver Version
 
 	latestForArch := latestSupportedVersion(plugin)
@@ -437,6 +428,7 @@ func selectVersion(plugin *Plugin, version string) (*Version, error) {
 		return nil, ErrVersionUnsupported{
 			PluginID:         plugin.ID,
 			RequestedVersion: version,
+			SystemInfo:       i.fullSystemInfoString(),
 		}
 	}
 
@@ -451,24 +443,32 @@ func selectVersion(plugin *Plugin, version string) (*Version, error) {
 	}
 
 	if len(ver.Version) == 0 {
+		i.log.Debugf("Requested plugin version %s v%s not found but potential fallback version '%s' was found",
+			plugin.ID, version, latestForArch.Version)
 		return nil, ErrVersionNotFound{
-			PluginID:           plugin.ID,
-			RequestedVersion:   version,
-			RecommendedVersion: latestForArch.Version,
+			PluginID:         plugin.ID,
+			RequestedVersion: version,
+			SystemInfo:       i.fullSystemInfoString(),
 		}
 	}
 
 	if !supportsCurrentArch(&ver) {
+		i.log.Debugf("Requested plugin version %s v%s not found but potential fallback version '%s' was found",
+			plugin.ID, version, latestForArch.Version)
 		return nil, ErrVersionUnsupported{
-			PluginID:           plugin.ID,
-			RequestedVersion:   version,
-			RecommendedVersion: latestForArch.Version,
+			PluginID:         plugin.ID,
+			RequestedVersion: version,
+			SystemInfo:       i.fullSystemInfoString(),
 		}
 	}
 
 	return &ver, nil
 }
 
+func (i *Installer) fullSystemInfoString() string {
+	return fmt.Sprintf("Grafana v%s %s", i.grafanaVersion, osAndArchString())
+}
+
 func osAndArchString() string {
 	osString := strings.ToLower(runtime.GOOS)
 	arch := runtime.GOARCH

From a7c5636948036a51fabef3320eef23e9c4dcc288 Mon Sep 17 00:00:00 2001
From: Jack Westbrook <jack.westbrook@gmail.com>
Date: Thu, 20 May 2021 15:33:44 +0200
Subject: [PATCH 04/43] Update _index.md (#34500)

---
 docs/sources/release-notes/_index.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/docs/sources/release-notes/_index.md b/docs/sources/release-notes/_index.md
index 7df0119999e..31476eda7f3 100644
--- a/docs/sources/release-notes/_index.md
+++ b/docs/sources/release-notes/_index.md
@@ -8,6 +8,7 @@ weight = 10000
 Here you can find detailed release notes that list everything that is included in every release as well as notices
 about deprecations, breaking changes as well as changes that relate to plugin development.
 
+- [Release notes for 8.0.0-beta2]({{< relref "release-notes-8-0-0-beta2" >}})
 - [Release notes for 8.0.0-beta1]({{< relref "release-notes-8-0-0-beta1" >}})
 - [Release notes for 7.5.7]({{< relref "release-notes-7-5-7" >}})
 - [Release notes for 7.5.6]({{< relref "release-notes-7-5-6" >}})

From 7580124d500c6b211a9a264deeb9311c9052b48c Mon Sep 17 00:00:00 2001
From: Jack Westbrook <jack.westbrook@gmail.com>
Date: Thu, 20 May 2021 15:53:16 +0200
Subject: [PATCH 05/43] chore: update latest.json to v8-beta2 (#34504)

---
 latest.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/latest.json b/latest.json
index f1538848092..f094d908ff6 100644
--- a/latest.json
+++ b/latest.json
@@ -1,4 +1,4 @@
 {
   "stable": "7.5.7",
-  "testing": "8.0.0-beta1"
+  "testing": "8.0.0-beta2"
 }

From b76dfc8ed02314c6ce9f8611f36f6d7d41539147 Mon Sep 17 00:00:00 2001
From: Marcus Efraimsson <marcus.efraimsson@gmail.com>
Date: Thu, 20 May 2021 16:31:53 +0200
Subject: [PATCH 06/43] Chore: Upgrade loki dependency (#34487)

Upgrades loki dependency to include grafana/loki#3743.
---
 go.mod | 2 +-
 go.sum | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/go.mod b/go.mod
index 7ce3e31d92b..7761246b9ca 100644
--- a/go.mod
+++ b/go.mod
@@ -52,7 +52,7 @@ require (
 	github.com/grafana/grafana-aws-sdk v0.4.0
 	github.com/grafana/grafana-live-sdk v0.0.6
 	github.com/grafana/grafana-plugin-sdk-go v0.99.0
-	github.com/grafana/loki v1.6.2-0.20210510132741-f408e05ad426
+	github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103
 	github.com/grpc-ecosystem/go-grpc-middleware v1.3.0
 	github.com/hashicorp/go-hclog v0.16.0
 	github.com/hashicorp/go-plugin v1.4.0
diff --git a/go.sum b/go.sum
index a8df6025fee..b200f536f05 100644
--- a/go.sum
+++ b/go.sum
@@ -924,8 +924,8 @@ github.com/grafana/grafana-plugin-sdk-go v0.79.0/go.mod h1:NvxLzGkVhnoBKwzkst6CF
 github.com/grafana/grafana-plugin-sdk-go v0.91.0/go.mod h1:Ot3k7nY7P6DXmUsDgKvNB7oG1v7PRyTdmnYVoS554bU=
 github.com/grafana/grafana-plugin-sdk-go v0.99.0 h1:pEmoSSYw7VsF+rhRgG4z+azE3eLwznomxVg9Ezppqzo=
 github.com/grafana/grafana-plugin-sdk-go v0.99.0/go.mod h1:D7x3ah+1d4phNXpbnOaxa/osSaZlwh9/ZUnGGzegRbk=
-github.com/grafana/loki v1.6.2-0.20210510132741-f408e05ad426 h1:fVUMdXAjiHsx71Twl/oie1OLDH+dxL7+mBdQK/H2Wgs=
-github.com/grafana/loki v1.6.2-0.20210510132741-f408e05ad426/go.mod h1:IfQ9BWq2sVAk3iKB4Pahz6QNTs5D4WpfJj/AY8xzmNw=
+github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103 h1:qCmofFVwQR9QnsinstVqI1NPLMVl33jNCnOCXEAVn6E=
+github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103/go.mod h1:GHIsn+EohCChsdu5YouNZewqLeV9L2FNw4DEJU3P9qE=
 github.com/gregjones/httpcache v0.0.0-20180305231024-9cad4c3443a7/go.mod h1:FecbI9+v66THATjSRHfNgh1IVFe/9kFxbXtjV0ctIMA=
 github.com/grpc-ecosystem/go-grpc-middleware v1.0.0/go.mod h1:FiyG127CGDf3tlThmgyCl78X/SZQqEOJBCDaAfeWzPs=
 github.com/grpc-ecosystem/go-grpc-middleware v1.0.1-0.20190118093823-f849b5445de4/go.mod h1:FiyG127CGDf3tlThmgyCl78X/SZQqEOJBCDaAfeWzPs=

From dbe281530c75b6e45e5beacae07353f29069e081 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Thu, 20 May 2021 16:43:19 +0200
Subject: [PATCH 07/43] Timeline: Fix y-axis being cropped (#34508)

---
 public/app/plugins/panel/state-timeline/utils.ts | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/public/app/plugins/panel/state-timeline/utils.ts b/public/app/plugins/panel/state-timeline/utils.ts
index 9f4f0a1d44b..ca58344d077 100644
--- a/public/app/plugins/panel/state-timeline/utils.ts
+++ b/public/app/plugins/panel/state-timeline/utils.ts
@@ -25,7 +25,6 @@ import {
 } from '@grafana/ui';
 import { TimelineCoreOptions, getConfig } from './timeline';
 import { AxisPlacement, ScaleDirection, ScaleOrientation } from '@grafana/ui/src/components/uPlot/config';
-import { measureText } from '@grafana/ui/src/utils/measureText';
 import { TimelineFieldConfig, TimelineOptions } from './types';
 
 const defaultConfig: TimelineFieldConfig = {
@@ -80,14 +79,6 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<TimelineOptions> = ({
     return FALLBACK_COLOR;
   };
 
-  const yAxisWidth =
-    frame.fields.reduce((maxWidth, field) => {
-      return Math.max(
-        maxWidth,
-        measureText(getFieldDisplayName(field, frame), Math.round(10 * devicePixelRatio)).width
-      );
-    }, 0) + 24;
-
   const opts: TimelineCoreOptions = {
     // should expose in panel config
     mode: mode!,
@@ -154,7 +145,6 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<TimelineOptions> = ({
     values: coreConfig.yValues,
     grid: false,
     ticks: false,
-    size: yAxisWidth,
     gap: 16,
     theme,
   });

From d95cc4a08f70720719d816afd23012f953c44593 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A1bor=20Farkas?= <gabor.farkas@gmail.com>
Date: Thu, 20 May 2021 16:46:08 +0200
Subject: [PATCH 08/43] InfluxDB: InfluxQL query editor: generate better HTML
 (#34467)

---
 .../influxdb/components/VisualInfluxQLEditor/Seg.tsx          | 4 +---
 .../components/VisualInfluxQLEditor/TagsSection.test.tsx      | 2 +-
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
index aa2d2e3b6b3..cc94d6c288a 100644
--- a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
+++ b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
@@ -176,11 +176,9 @@ export const Seg = ({
   const [isOpen, setOpen] = useState(false);
   if (!isOpen) {
     const className = cx(defaultButtonClass, buttonClassName);
-    // this should not be a label, this should be a button,
-    // but this is what is used inside a Segment, and i just
-    // want the same look
     return (
       <InlineLabel
+        as="button"
         className={className}
         onClick={() => {
           setOpen(true);
diff --git a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/TagsSection.test.tsx b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/TagsSection.test.tsx
index 15ea1908771..c276373684a 100644
--- a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/TagsSection.test.tsx
+++ b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/TagsSection.test.tsx
@@ -31,7 +31,7 @@ async function assertSegmentSelect(
   callbackValue: unknown
 ) {
   // we find the segment
-  const segs = screen.getAllByText(segmentText, { selector: 'label' });
+  const segs = screen.getAllByRole('button', { name: segmentText });
   expect(segs.length).toBe(1);
   const seg = segs[0];
   expect(seg).toBeInTheDocument();

From e2e78f14d2f6a4e81d435e2fa172408ae4a7328e Mon Sep 17 00:00:00 2001
From: Giordano Ricci <me@giordanoricci.com>
Date: Thu, 20 May 2021 16:13:48 +0100
Subject: [PATCH 09/43] Elasticsearch: fix flaky test (#34517)

---
 .../elasticsearch/time_series_query_test.go   | 127 ++++++++----------
 1 file changed, 58 insertions(+), 69 deletions(-)

diff --git a/pkg/tsdb/elasticsearch/time_series_query_test.go b/pkg/tsdb/elasticsearch/time_series_query_test.go
index 55508123f53..5a3d8a02b5e 100644
--- a/pkg/tsdb/elasticsearch/time_series_query_test.go
+++ b/pkg/tsdb/elasticsearch/time_series_query_test.go
@@ -937,87 +937,76 @@ func TestSettingsCasting(t *testing.T) {
 	t.Run("Inline Script", func(t *testing.T) {
 		t.Run("Correctly handles scripts for ES < 5.6", func(t *testing.T) {
 			c := newFakeClient("5.0.0")
-
-			for key := range scriptableAggType {
-				t.Run("Inline Script", func(t *testing.T) {
-					_, err := executeTsdbQuery(c, `{
-						"timeField": "@timestamp",
-						"bucketAggs": [
-							{ "type": "date_histogram", "field": "@timestamp", "id": "2" }
-						],
-						"metrics": [
-							{
-								"id": "1",
-								"type": "`+key+`",
-								"settings": {
-									"script": "my_script"
-								}
-							},
-							{
-								"id": "3",
-								"type": "`+key+`",
-								"settings": {
-									"script": {
-										"inline": "my_script"
-									}
-								}
+			_, err := executeTsdbQuery(c, `{
+				"timeField": "@timestamp",
+				"bucketAggs": [
+					{ "type": "date_histogram", "field": "@timestamp", "id": "2" }
+				],
+				"metrics": [
+					{
+						"id": "1",
+						"type": "avg",
+						"settings": {
+							"script": "my_script"
+						}
+					},
+					{
+						"id": "3",
+						"type": "avg",
+						"settings": {
+							"script": {
+								"inline": "my_script"
 							}
-						]
-					}`, from, to, 15*time.Second)
+						}
+					}
+				]
+			}`, from, to, 15*time.Second)
 
-					assert.Nil(t, err)
-					sr := c.multisearchRequests[0].Requests[0]
+			assert.Nil(t, err)
+			sr := c.multisearchRequests[0].Requests[0]
 
-					newFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[0].Aggregation.Aggregation.(*es.MetricAggregation).Settings
-					oldFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[1].Aggregation.Aggregation.(*es.MetricAggregation).Settings
+			newFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[0].Aggregation.Aggregation.(*es.MetricAggregation).Settings
+			oldFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[1].Aggregation.Aggregation.(*es.MetricAggregation).Settings
 
-					assert.Equal(t, map[string]interface{}{"inline": "my_script"}, newFormatAggSettings["script"])
-					assert.Equal(t, map[string]interface{}{"inline": "my_script"}, oldFormatAggSettings["script"])
-				})
-			}
+			assert.Equal(t, map[string]interface{}{"inline": "my_script"}, newFormatAggSettings["script"])
+			assert.Equal(t, map[string]interface{}{"inline": "my_script"}, oldFormatAggSettings["script"])
 		})
 
 		t.Run("Correctly handles scripts for ES >= 5.6", func(t *testing.T) {
 			c := newFakeClient("5.6.0")
-
-			for key := range scriptableAggType {
-				fmt.Println(key)
-				t.Run("Inline Script", func(t *testing.T) {
-					_, err := executeTsdbQuery(c, `{
-						"timeField": "@timestamp",
-						"bucketAggs": [
-							{ "type": "date_histogram", "field": "@timestamp", "id": "2" }
-						],
-						"metrics": [
-							{
-								"id": "1",
-								"type": "`+key+`",
-								"settings": {
-									"script": "my_script"
-								}
-							},
-							{ 
-								"id": "3",
-								"type": "`+key+`",
-								"settings": {
-									"script": {
-										"inline": "my_script"
-									}
-								}
+			_, err := executeTsdbQuery(c, `{
+				"timeField": "@timestamp",
+				"bucketAggs": [
+					{ "type": "date_histogram", "field": "@timestamp", "id": "2" }
+				],
+				"metrics": [
+					{
+						"id": "1",
+						"type": "avg",
+						"settings": {
+							"script": "my_script"
+						}
+					},
+					{ 
+						"id": "3",
+						"type": "avg",
+						"settings": {
+							"script": {
+								"inline": "my_script"
 							}
-						]
-					}`, from, to, 15*time.Second)
+						}
+					}
+				]
+			}`, from, to, 15*time.Second)
 
-					assert.Nil(t, err)
-					sr := c.multisearchRequests[0].Requests[0]
+			assert.Nil(t, err)
+			sr := c.multisearchRequests[0].Requests[0]
 
-					newFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[0].Aggregation.Aggregation.(*es.MetricAggregation).Settings
-					oldFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[1].Aggregation.Aggregation.(*es.MetricAggregation).Settings
+			newFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[0].Aggregation.Aggregation.(*es.MetricAggregation).Settings
+			oldFormatAggSettings := sr.Aggs[0].Aggregation.Aggs[1].Aggregation.Aggregation.(*es.MetricAggregation).Settings
 
-					assert.Equal(t, "my_script", newFormatAggSettings["script"])
-					assert.Equal(t, "my_script", oldFormatAggSettings["script"])
-				})
-			}
+			assert.Equal(t, "my_script", newFormatAggSettings["script"])
+			assert.Equal(t, "my_script", oldFormatAggSettings["script"])
 		})
 	})
 }

From aa14621d29f083c58bea6dad07d25a9e517bd663 Mon Sep 17 00:00:00 2001
From: kay delaney <45561153+kaydelaney@users.noreply.github.com>
Date: Thu, 20 May 2021 16:19:24 +0100
Subject: [PATCH 10/43] Chore: Move immutable, is-hotkey, and react-inlinesvg
 deps to grafana-ui (#34290)

---
 package.json                     | 4 ----
 packages/grafana-ui/package.json | 3 +++
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 41b25fe6e75..c4e6f9e88f4 100644
--- a/package.json
+++ b/package.json
@@ -103,7 +103,6 @@
     "@types/file-saver": "2.0.1",
     "@types/history": "^4.7.8",
     "@types/hoist-non-react-statics": "3.3.1",
-    "@types/is-hotkey": "0.1.1",
     "@types/jest": "26.0.15",
     "@types/jquery": "3.3.38",
     "@types/jsurl": "^1.2.28",
@@ -256,8 +255,6 @@
     "history": "4.10.1",
     "hoist-non-react-statics": "3.3.2",
     "immer": "8.0.1",
-    "immutable": "3.8.2",
-    "is-hotkey": "0.1.6",
     "jquery": "3.5.1",
     "json-source-map": "0.6.1",
     "jsurl": "^0.1.5",
@@ -281,7 +278,6 @@
     "react-dom": "17.0.1",
     "react-grid-layout": "1.2.0",
     "react-highlight-words": "0.17.0",
-    "react-inlinesvg": "2.3.0",
     "react-loadable": "5.5.0",
     "react-popper": "2.2.4",
     "react-redux": "7.2.0",
diff --git a/packages/grafana-ui/package.json b/packages/grafana-ui/package.json
index 017edc7526a..8e4a2660c0a 100644
--- a/packages/grafana-ui/package.json
+++ b/packages/grafana-ui/package.json
@@ -45,6 +45,7 @@
     "d3": "5.15.0",
     "hoist-non-react-statics": "3.3.2",
     "immutable": "3.8.2",
+    "is-hotkey": "0.1.6",
     "jquery": "3.5.1",
     "lodash": "4.17.21",
     "moment": "2.29.1",
@@ -62,6 +63,7 @@
     "react-dom": "17.0.1",
     "react-highlight-words": "0.16.0",
     "react-hook-form": "7.5.3",
+    "react-inlinesvg": "2.3.0",
     "react-popper": "2.2.4",
     "react-router-dom": "^5.2.0",
     "react-select": "4.3.0",
@@ -86,6 +88,7 @@
     "@types/common-tags": "^1.8.0",
     "@types/d3": "5.7.2",
     "@types/hoist-non-react-statics": "3.3.1",
+    "@types/is-hotkey": "0.1.1",
     "@types/jest": "26.0.15",
     "@types/jquery": "3.3.38",
     "@types/lodash": "4.14.123",

From d0769397b2707d15693981c64cd4d4072f611b25 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Thu, 20 May 2021 17:36:20 +0200
Subject: [PATCH 11/43] Histogram: Fix crash when state was undefined (when
 combine was enabled) (#34514)

---
 pkg/api/frontendsettings.go                          | 12 +++++++-----
 .../PanelEditor/VisualizationSelectPane.tsx          |  2 +-
 public/app/plugins/panel/histogram/Histogram.tsx     |  3 ++-
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/pkg/api/frontendsettings.go b/pkg/api/frontendsettings.go
index 37c663bf7ee..c430e75b9c7 100644
--- a/pkg/api/frontendsettings.go
+++ b/pkg/api/frontendsettings.go
@@ -285,16 +285,18 @@ func getPanelSort(id string) int {
 		sort = 10
 	case "status-grid":
 		sort = 11
-	case "graph":
+	case "histogram":
 		sort = 12
-	case "text":
+	case "graph":
 		sort = 13
-	case "alertlist":
+	case "text":
 		sort = 14
-	case "dashlist":
+	case "alertlist":
 		sort = 15
-	case "news":
+	case "dashlist":
 		sort = 16
+	case "news":
+		sort = 17
 	}
 	return sort
 }
diff --git a/public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx b/public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx
index 6bdbef91b4a..a5dd75d7e8f 100644
--- a/public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/VisualizationSelectPane.tsx
@@ -57,7 +57,7 @@ export const VisualizationSelectPane: FC<Props> = ({ panel }) => {
         const match = filterPluginList(plugins, query, plugin.meta);
 
         if (match && match.length) {
-          onPluginTypeChange(match[0], true);
+          onPluginTypeChange(match[0], false);
         }
       }
     },
diff --git a/public/app/plugins/panel/histogram/Histogram.tsx b/public/app/plugins/panel/histogram/Histogram.tsx
index 16bfccc3199..f8dfe3776d6 100644
--- a/public/app/plugins/panel/histogram/Histogram.tsx
+++ b/public/app/plugins/panel/histogram/Histogram.tsx
@@ -123,7 +123,8 @@ const prepConfig = (frame: DataFrame, theme: GrafanaTheme2) => {
   for (let i = 2; i < frame.fields.length; i++) {
     const field = frame.fields[i];
 
-    field.state!.seriesIndex = seriesIndex++;
+    field.state = field.state ?? {};
+    field.state.seriesIndex = seriesIndex++;
 
     const customConfig = { ...field.config.custom };
 

From 292789ba2d7a6bb6c9c44badbead0213cc8730b4 Mon Sep 17 00:00:00 2001
From: Dimitris Sotirakis <dimitrios.sotirakis@grafana.com>
Date: Thu, 20 May 2021 18:52:02 +0300
Subject: [PATCH 12/43] Chore: Increase number of backend test retries in
 `grabpl` to 5 in release pipelines (#34493)

* Increase number of backend test retries to 5

* Exclude release-branch pipelines

* Fixes according to reviewer's comments

* Refactor

* Remove unused arguments

* Remove magic number
---
 .drone.yml           | 24 ++++++++++++------------
 scripts/lib.star     | 11 ++++++++---
 scripts/release.star |  7 +++++--
 3 files changed, 25 insertions(+), 17 deletions(-)

diff --git a/.drone.yml b/.drone.yml
index 506649ea05e..1f874631a89 100644
--- a/.drone.yml
+++ b/.drone.yml
@@ -755,8 +755,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition oss
-  - ./bin/grabpl integration-tests --edition oss
+  - ./bin/grabpl test-backend --edition oss --tries 5
+  - ./bin/grabpl integration-tests --edition oss --tries 5
   depends_on:
   - initialize
 
@@ -1130,8 +1130,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition enterprise
-  - ./bin/grabpl integration-tests --edition enterprise
+  - ./bin/grabpl test-backend --edition enterprise --tries 5
+  - ./bin/grabpl integration-tests --edition enterprise --tries 5
   depends_on:
   - initialize
 
@@ -1196,8 +1196,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition enterprise2
-  - ./bin/grabpl integration-tests --edition enterprise2
+  - ./bin/grabpl test-backend --edition enterprise2 --tries 5
+  - ./bin/grabpl integration-tests --edition enterprise2 --tries 5
   depends_on:
   - initialize
 
@@ -1710,8 +1710,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition oss
-  - ./bin/grabpl integration-tests --edition oss
+  - ./bin/grabpl test-backend --edition oss --tries 5
+  - ./bin/grabpl integration-tests --edition oss --tries 5
   depends_on:
   - initialize
 
@@ -2074,8 +2074,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition enterprise
-  - ./bin/grabpl integration-tests --edition enterprise
+  - ./bin/grabpl test-backend --edition enterprise --tries 5
+  - ./bin/grabpl integration-tests --edition enterprise --tries 5
   depends_on:
   - initialize
 
@@ -2140,8 +2140,8 @@ steps:
   image: grafana/build-container:1.4.1
   commands:
   - "[ $(grep FocusConvey -R pkg | wc -l) -eq \"0\" ] || exit 1"
-  - ./bin/grabpl test-backend --edition enterprise2
-  - ./bin/grabpl integration-tests --edition enterprise2
+  - ./bin/grabpl test-backend --edition enterprise2 --tries 5
+  - ./bin/grabpl integration-tests --edition enterprise2 --tries 5
   depends_on:
   - initialize
 
diff --git a/scripts/lib.star b/scripts/lib.star
index 738ccfba059..2ccce14c7c2 100644
--- a/scripts/lib.star
+++ b/scripts/lib.star
@@ -434,7 +434,12 @@ def build_plugins_step(edition, sign=False):
         ],
     }
 
-def test_backend_step(edition):
+def test_backend_step(edition, tries=None):
+    test_backend_cmd = './bin/grabpl test-backend --edition {}'.format(edition)
+    integration_tests_cmd = './bin/grabpl integration-tests --edition {}'.format(edition)
+    if tries:
+        test_backend_cmd += ' --tries {}'.format(tries)
+        integration_tests_cmd += ' --tries {}'.format(tries)
     return {
         'name': 'test-backend' + enterprise2_sfx(edition),
         'image': build_image,
@@ -445,9 +450,9 @@ def test_backend_step(edition):
             # First make sure that there are no tests with FocusConvey
             '[ $(grep FocusConvey -R pkg | wc -l) -eq "0" ] || exit 1',
             # Then execute non-integration tests in parallel, since it should be safe
-            './bin/grabpl test-backend --edition {}'.format(edition),
+            test_backend_cmd,
             # Then execute integration tests in serial
-            './bin/grabpl integration-tests --edition {}'.format(edition),
+            integration_tests_cmd,
         ],
     }
 
diff --git a/scripts/release.star b/scripts/release.star
index dce77e5694e..068081613cd 100644
--- a/scripts/release.star
+++ b/scripts/release.star
@@ -67,11 +67,14 @@ def get_steps(edition, ver_mode):
     should_publish = ver_mode in ('release', 'test-release',)
     should_upload = should_publish or ver_mode in ('release-branch',)
     include_enterprise2 = edition == 'enterprise'
+    tries = None
+    if should_publish:
+        tries = 5
 
     steps = [
         codespell_step(),
         shellcheck_step(),
-        test_backend_step(edition=edition),
+        test_backend_step(edition=edition, tries=tries),
         lint_backend_step(edition=edition),
         test_frontend_step(),
         build_backend_step(edition=edition, ver_mode=ver_mode),
@@ -84,7 +87,7 @@ def get_steps(edition, ver_mode):
     if include_enterprise2:
         edition2 = 'enterprise2'
         steps.extend([
-            test_backend_step(edition=edition2),
+            test_backend_step(edition=edition2, tries=tries),
             lint_backend_step(edition=edition2),
             build_backend_step(edition=edition2, ver_mode=ver_mode, variants=['linux-x64']),
         ])

From 676ddac088aa179bed643582aeadd4d80eef60a0 Mon Sep 17 00:00:00 2001
From: Vardan Torosyan <vardants@gmail.com>
Date: Thu, 20 May 2021 18:53:34 +0200
Subject: [PATCH 13/43] Docs: Document fine-grained access control (#33563)

---
 docs/sources/administration/provisioning.md   |   6 +
 docs/sources/enterprise/_index.md             |   1 +
 .../enterprise/access-control/_index.md       |  60 ++
 .../enterprise/access-control/permissions.md  |  75 +++
 .../enterprise/access-control/provisioning.md | 140 +++++
 .../enterprise/access-control/roles.md        | 101 +++
 .../access-control/usage-scenarios.md         | 226 +++++++
 docs/sources/enterprise/auditing.md           |   2 +-
 .../enterprise/datasource_permissions.md      |   2 +-
 docs/sources/enterprise/enhanced_ldap.md      |   2 +-
 .../enterprise/enterprise-configuration.md    |   2 +-
 docs/sources/enterprise/export-pdf.md         |   2 +-
 docs/sources/enterprise/license/_index.md     |   2 +-
 docs/sources/enterprise/query-caching.md      |   2 +-
 docs/sources/enterprise/reporting.md          |  11 +-
 docs/sources/enterprise/request-security.md   |   2 +-
 docs/sources/enterprise/saml.md               |   2 +-
 docs/sources/enterprise/team-sync.md          |   2 +-
 .../enterprise/usage-insights/_index.md       |   2 +-
 docs/sources/enterprise/vault.md              |   2 +-
 docs/sources/enterprise/white-labeling.md     |   2 +-
 docs/sources/http_api/_index.md               |   1 +
 docs/sources/http_api/access_control.md       | 584 ++++++++++++++++++
 docs/sources/http_api/admin.md                |  69 +++
 docs/sources/http_api/org.md                  |  68 +-
 docs/sources/http_api/reporting.md            |  14 +-
 docs/sources/http_api/user.md                 |  61 +-
 docs/sources/manage-users/_index.md           |   2 +
 docs/sources/permissions/_index.md            |   4 +
 .../sources/permissions/organization_roles.md |   4 +
 .../sources/permissions/restricting-access.md |   2 +
 31 files changed, 1436 insertions(+), 19 deletions(-)
 create mode 100644 docs/sources/enterprise/access-control/_index.md
 create mode 100644 docs/sources/enterprise/access-control/permissions.md
 create mode 100644 docs/sources/enterprise/access-control/provisioning.md
 create mode 100644 docs/sources/enterprise/access-control/roles.md
 create mode 100644 docs/sources/enterprise/access-control/usage-scenarios.md
 create mode 100644 docs/sources/http_api/access_control.md

diff --git a/docs/sources/administration/provisioning.md b/docs/sources/administration/provisioning.md
index a65976dc3f3..ff8d8db8c74 100644
--- a/docs/sources/administration/provisioning.md
+++ b/docs/sources/administration/provisioning.md
@@ -575,3 +575,9 @@ The following sections detail the supported settings and secure settings for eac
 | Name |
 | ---- |
 | url  |
+
+## Grafana Enterprise
+
+Grafana Enterprise supports provisioning for the following resources:
+
+- [Access Control Provisioning]({{< relref "../enterprise/access-control/provisioning.md" >}})
diff --git a/docs/sources/enterprise/_index.md b/docs/sources/enterprise/_index.md
index 778c37cc8e0..ffc761b2eb2 100644
--- a/docs/sources/enterprise/_index.md
+++ b/docs/sources/enterprise/_index.md
@@ -43,6 +43,7 @@ With Grafana Enterprise [enhanced LDAP]({{< relref "enhanced_ldap.md" >}}), you
 
 With Grafana Enterprise, you get access to new features, including:
 
+- [Fine-grained access control]({{< relref "access-control/_index.md" >}}) to control access with fine-grained roles and permissions.
 - [Data source permissions]({{< relref "datasource_permissions.md" >}}) to restrict query access to specific teams and users.
 - [Reporting]({{< relref "reporting.md" >}}) to generate a PDF report from any dashboard and set up a schedule to have it emailed to whoever you choose.
 - [Export dashboard as PDF]({{< relref "export-pdf.md" >}})
diff --git a/docs/sources/enterprise/access-control/_index.md b/docs/sources/enterprise/access-control/_index.md
new file mode 100644
index 00000000000..bf7b02dbcec
--- /dev/null
+++ b/docs/sources/enterprise/access-control/_index.md
@@ -0,0 +1,60 @@
++++
+title = "Fine-grained access control"
+description = "Grant, change, or revoke access to Grafana resources"
+keywords = ["grafana", "fine-grained-access-control", "roles", "permissions", "enterprise"]
+weight = 100
++++
+
+# Fine-grained access control
+
+> **Note:** Fine-grained access control is in beta, and you can expect changes in future releases.
+
+Fine-grained access control provides a standardized way of granting, changing, and revoking access when it comes to viewing and modifying Grafana resources, such as users and reports. 
+Fine-grained access control works alongside the current [Grafana permissions]({{< relref "../../permissions/_index.md" >}}), and it allows you granular control of users’ actions.
+
+To learn more about how fine-grained access control works, refer to [Roles]({{< relref "./roles.md" >}}) and [Permissions]({{< relref "./permissions.md" >}}).
+To use the fine-grained access control system, refer to [Fine-grained access control usage scenarios]({{< relref "./usage-scenarios.md" >}}).
+
+## Access management
+
+Fine-grained access control considers a) _who_ has an access (`identity`), and b) _what they can do_ and on which _Grafana resource_ (`role`).
+
+You can grant, change, or revoke access to _users_ (`identity`). When an authenticated user tries to access a Grafana resource, the authorization system checks the required fine-grained permissions for the resource and determines whether or not the action is allowed. Refer to [Fine-grained permissions]({{< relref "./permissions.md" >}}) for a complete list of available permissions.
+
+To grant or revoke access to your users, create or remove built-in role assignments. For more information, refer to [Built-in role assignments]({{< relref "./roles.md#built-in-role-assignments" >}}).
+
+## Resources with fine-grained permissions
+
+Fine-grained access control is currently available for [Reporting]({{< relref "../reporting.md" >}}) and [Managing Users]({{< relref "../../manage-users/_index.md" >}}).
+To learn more about specific endpoints where you can use access control, refer to [Permissions]({{< relref "./permissions.md" >}}) and to the relevant API guide:
+
+- [Fine-grained access control API]({{< relref "../../http_api/access_control.md" >}})
+- [Admin API]({{< relref "../../http_api/admin.md" >}})
+- [Organization API]({{< relref "../../http_api/org.md" >}})
+- [Reporting API]({{< relref "../../http_api/reporting.md" >}})
+- [User API]({{< relref "../../http_api/user.md" >}})
+
+## Enable fine-grained access control
+
+Fine-grained access control is available behind the `accesscontrol` feature toggle in Grafana Enterprise 8.0+.
+You can enable it either in a [config file](({{< relref "../../administration/configuration.md#fconfig-file-locations" >}})) or by [configuring an environment variable](http://localhost:3002/docs/grafana/next/administration/configuration/#configure-with-environment-variables).
+
+### Enable in config file
+
+In your [config file](({{< relref "../../administration/configuration.md#config-file-locations" >}})), add `accesscontrol` as a [feature_toggle](({{< relref "../../administration/configuration.md#feature_toggle" >}})).
+
+```
+[feature_toggles]
+# enable features, separated by spaces
+enable = accesscontrol
+```
+
+### Enable with an environment variable
+
+You can use `GF_FEATURE_TOGGLES_ENABLE = accesscontrol` environment variable to override the config file configuration and enable fine-grained access control.
+
+Refer to [Configuring with environment variables]({{< relref "../../administration/configuration.md#configure-with-environment-variables" >}}) for more information.
+
+### Verify if enabled
+
+You can verify if fine-grained access control is enabled or not by sending an HTTP request to the [Check endpoint]({{< relref "../../http_api/access_control.md#check-if-enabled" >}}).
diff --git a/docs/sources/enterprise/access-control/permissions.md b/docs/sources/enterprise/access-control/permissions.md
new file mode 100644
index 00000000000..cc75a90b44b
--- /dev/null
+++ b/docs/sources/enterprise/access-control/permissions.md
@@ -0,0 +1,75 @@
++++
+title = "Permissions"
+description = "Understand fine-grained access control permissions"
+keywords = ["grafana", "fine-grained access-control", "roles", "permissions", "enterprise"]
+weight = 115
++++
+
+# Permissions 
+
+Each permission is defined by an action and a scope. When evaluating a fine-grained access decision, consider what specific action a user should be allowed to perform, and on what resources (its scope).
+
+To grant permissions to a user, create built-in role assignments. A built-in role assignment is a *modification* to one of the existing built-in roles in Grafana (Viewer, Editor, Admin) For more information, refer to [Built-in role assignments]({{< relref "./roles.md#built-in-role-assignments" >}}).
+
+To learn more about which permissions are used for which resources, refer to [Resources with fine-grained permissions]({{< relref "./_index.md#resources-with-fine-grained-permissions" >}}).
+
+action
+: The specific action on a resource defines what a user is allowed to perform if they have permission with the relevant action assigned to it.
+
+scope
+: The scope describes where an action can be performed, such as reading a specific user profile. In such case, a permission is associated with the scope `users:<userId>` to the relevant role. Also, you can combine multiple scopes by using the `/` delimiter.
+
+## Action definitions
+
+Note that below list is not exhaustive yet and more permissions will be available with further releases of fine-grained access control.
+
+Action | Applicable scopes | Description
+--- | --- | ---
+roles:list | roles:* | Allows to list available roles without permissions. 
+roles:read | roles:* | Allows to read a specific role with it's permissions.
+roles:write | permissions:delegate | Allows to create or update a custom role.
+roles:delete | permissions:delegate | Allows to delete a custom role.
+roles.builtin:list | roles:* | Allows to list built-in role assignments.
+roles.builtin:add | permissions:delegate | Allows to create a built-in role assignment.
+roles.builtin:remove | permissions:delegate | Allows to delete a built-in role assignment.
+reports.admin:write | reports:* | Allows to create or update reports.
+reports:delete | reports:* | Allows to delete reports.
+reports:read | reports:* | Allows to list all available reports and to get a specific report. 
+reports:send | reports:* | Allows to send report email.
+reports.settings:write | n/a | Allows to update report settings.
+reports.settings:read | n/a | Allows to read report settings.
+provisioning:reload | service:access-control | Allows to reload provisioning files after an update.
+users:read | global:users:* | Allows to read, search user profiles. 
+users:write | global:users:* | Allows to update user profiles.
+users.teams:read | global:users:* | Allows to read user teams.
+users.authtoken:list | global:users:* | Allows to list auth tokens assigned to users.
+users.authtoken:update | global:users:* | Allows to update auth tokens assigned to users.
+users.password:update | global:users:* | Allows to update users password.
+users:delete | global:users:* | Allows to delete users.
+users:create | n/a | Allows to create users.
+users:enable | global:users:* | Allows to enable users.
+users:disable | global:users:* | Allows to disable users.
+users.permissions:update | global:users:* | Allows to update users org level permissions.
+users:logout | global:users:* | Allows to enforce logout for users.
+users.quotas:list | global:users:* | Allows to list user quotas.
+users.quotas:update | global:users:* | Allows to update user quotas.
+org.users.read | users:* | Allows to get user profiles within the organization.
+org.users.add | users:* | Allows to add users to the organization.
+org.users.remove | users:* | Allows to remove users from the organization.
+org.users.role:update | users:* | Allows to update users organization role for the assigned organization.
+ldap.user:read | n/a | Allows to read LDAP users.
+ldap.user:sync | n/a | Allows to sync LDAP users.
+ldap.status:read | n/a | Allows to check LDAP status.
+
+## Scope definitions
+
+Note that below list is not exhaustive yet and more scopes will be available with further releases of fine-grained access control.
+
+Scope | Description
+--- | --- 
+roles:* | Indicates against what roles an action can be performed. For example, `roles:*` assumes any roles, and `roles:randomuid` assumes only a role with UID `randomuid`.  
+permissions:delegate | The scope is only applicable for roles associated with the Access Control itself and indicates that you can delegate your permissions only, or a subset of it, by creating a new role or making an assignment. 
+reports:* | Indicates against what reports an action can be performed.
+service:access-control | Only relevant for provisioning and indicates that the action can be performed only for access control provisioning files.
+global:users:* | Indicates that action can be performed against users globally.
+users:* | Indicates that an action can be performed against users in organization level.
diff --git a/docs/sources/enterprise/access-control/provisioning.md b/docs/sources/enterprise/access-control/provisioning.md
new file mode 100644
index 00000000000..eeaef9f2b63
--- /dev/null
+++ b/docs/sources/enterprise/access-control/provisioning.md
@@ -0,0 +1,140 @@
++++
+title = "Provisioning roles and assignments"
+description = "Understand how to provision roles and assignments in fine-grained access control"
+keywords = ["grafana", "fine-grained-access-control", "roles", "provisioning", "assignments", "permissions", "enterprise"]
+weight = 120
++++
+
+# Provisioning
+ 
+You can create, change or remove [Custom roles]({{< relref "./roles.md#custom-roles" >}}) and create or remove [built-in role assignments]({{< relref "./roles.md#built-in-role-assignments" >}}), by adding one or more YAML configuration files in the [`provisioning/access-control/`]({{< relref "../../administration/configuration/#provisioning" >}}) directory.
+Refer to [Grafana provisioning]({{< relref "../../administration/configuration/#provisioning" >}}) to learn more about provisioning.
+
+If you want to manage roles and built-in role assignments by API, refer to the [Fine-grained access control HTTP API]({{< relref "../../http_api/access_control/" >}}).
+
+## Configuration
+
+The configuration files must be located in the [`provisioning/access-control/`]({{< relref "../../administration/configuration/#provisioning" >}}) directory.
+Grafana performs provisioning during the startup. Refer to the [Reload provisioning configurations]({{< relref "../../http_api/admin/#reload-provisioning-configurations" >}}) to understand how you can reload configuration at runtime.
+
+## Manage custom roles
+
+You can create, update and delete custom roles, as well as create and remove built-in role assignments for them.
+
+### Create or update roles
+
+To create or update custom roles, you can add a list of `roles` in the configuration.
+
+Note that in order to update a role, you would need to increment the [version]({{< relref "./roles.md#custom-roles" >}}). 
+
+It is only possibly to provision [organization local]({{< relref "./roles#role-scopes" >}}) roles. For creating or updating _global_ roles, refer to the [Fine-grained access control HTTP API]({{< relref "../../http_api/access_control.md" >}}).
+
+### Delete roles 
+
+To delete a role, you can add a list of roles under `deleteRoles` section in the configuration file. Note that deletion is performed after role insertion/update.
+
+### Create and remove built-in role assignments
+
+To create a built-in role assignment, you can add list of assignments under `builtInRoles` section in the configuration file, as an element of `roles`. To remove a built-in role assignment, leave `builtInRoles` list empty. 
+
+Note that it is only possibly to provision [organization local]({{< relref "./roles#built-in-role-assignments" >}}) assignments. For creating or updating _global_ assignments, refer to the [Fine-grained access control HTTP API]({{< relref "../../http_api/access_control.md" >}}).
+
+## Manage default built-in role assignments
+
+During the startup, Grafana creates [default built-in role assignments]({{< relref "./roles#default-built-in-role-assignments" >}}) with [predefined roles]({{< relref "./roles#predefined-roles" >}}). You can remove and add back later those assignments by using provisioning.
+
+### Remove default assignment
+
+To remove default built-in role assignment, you can use `removeDefaultAssignments` element in the configuration file. You would need to provide built-in role name and predefined role name.
+
+### Add back default assignment
+
+To add back default built-in role assignment, you can use `addDefaultAssignments` element in the configuration file. You would need to provide built-in role name and predefined role name.
+
+## Example of a role configuration file
+
+```yaml
+# config file version
+apiVersion: 1
+
+# list of default built-in role assignments that should be removed
+removeDefaultAssignments:
+  # <string>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
+  - builtInRole: "Grafana Admin"
+    # <string>, must be one of the existing predefined roles
+    predefinedRole: "grafana:roles:permissions:admin"
+
+# list of default built-in role assignments that should be added back
+addDefaultAssignments:
+  # <string>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
+  - builtInRole: "Admin"
+    # <string>, must be one of the existing predefined roles
+    predefinedRole: "grafana:roles:reporting:admin:read"
+    
+# list of roles that should be deleted
+deleteRoles:
+  # <string> name of the role you want to create. Required if no uid is set
+  - name: ReportEditor
+    # <string> uid of the role. Required if no name
+    uid: reporteditor1
+    # <int> org id. will default to Grafana's default if not specified
+    orgId: 1
+    # <bool> force deletion revoking all grants of the role
+    force: true
+
+# list of roles to insert/update depending on what is available in the database
+roles:
+  # <string, required> name of the role you want to create. Required
+  - name: CustomEditor
+    # <string> uid of the role. Has to be unique for all orgs.
+    uid: customeditor1
+    # <string> description of the role, informative purpose only.
+    description: "Role for our custom user editors"
+    # <int> version of the role, Grafana will update the role when increased
+    version: 2
+    # <int> org id. will default to Grafana's default if not specified
+    orgId: 1    
+    # <list> list of the permissions granted by this role
+    permissions:
+      # <string, required> action allowed
+      - action: "users:read"
+        #<string, required> scope it applies to
+        scope: "users:*"
+      - action: "users:write"
+        scope: "users:*"
+      - action: "users:create"
+        scope: "users:*"
+    # <list> list of builtIn roles the role should be assigned to
+    builtInRoles:
+      # <string, required> name of the builtin role you want to assign the role to
+      - name: "Editor"
+        # <int> org id. will default to the role org id
+        orgId: 1        
+```
+
+## Supported settings
+
+The following sections detail the supported settings for roles and built-in role assignments.
+
+- Refer to [Permissions]({{< relref "./permissions.md#action-definitions" >}}) for full list of valid permissions.
+- Check [Custom roles]({{< relref "./roles.md#custom-roles" >}}) to understand attributes for roles.
+- The [default org ID]({{< relref "../../administration/configuration#auto_assign_org_id" >}}) is used if `orgId` is not specified in any of the configuration blocks.
+
+## Validation rules
+
+A basic set of validation rules are applied to the input `yaml` files.
+
+### Roles
+
+- `name` must not be empty
+- `name` must not have `grafana:roles:` prefix. 
+
+### Built-in role assignments
+
+- `name` must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`. 
+- When `orgId` is not specified, it inherits the `orgId` from `role`.
+- `orgId` in the `role` and in the assignment must be the same.
+
+### Role deletion
+
+- Either the role `name` or `uid` must be provided
diff --git a/docs/sources/enterprise/access-control/roles.md b/docs/sources/enterprise/access-control/roles.md
new file mode 100644
index 00000000000..31595e54ef9
--- /dev/null
+++ b/docs/sources/enterprise/access-control/roles.md
@@ -0,0 +1,101 @@
++++
+title = "Roles"
+description = "Understand roles in fine-grained access control"
+keywords = ["grafana", "fine-grained-access-control", "roles", "predefined-roles", "built-in-role-assignments", "permissions", "enterprise"]
+weight = 105
++++
+
+# Roles
+
+A role represents set of permissions that allow you to perform specific actions on Grafana resources. Refer to [Permissions]({{< relref "./permissions.md" >}}) to understand how permissions work.
+
+There are two types of roles:
+- [Predefined roles]({{< relref "./roles.md#predefined-roles" >}}), which provide granular access for specific resources within Grafana and are managed by the Grafana itself.
+- [Custom roles]({{< relref "./roles.md#custom-roles.md" >}}), which provide granular access based on the user specified set of permissions.
+
+You can use [Fine-grained access control API]({{< relref "../../http_api/access_control.md" >}}) to list available roles and permissions.
+
+## Role scopes
+
+A role can be either _global_ or _organization local_. _Global_ roles are not mapped to any specific organization and can be reused across multiple organizations, whereas _organization local_ roles are only available for that specific organization.
+
+## Predefined roles
+
+Predefined roles provide convenience and guarantee of consistent behaviour by combining relevant [permissions]({{< relref "./permissions.md" >}}) together. Predefined roles are created and updated by the Grafana, during the startup.
+There are few basic rules for predefined roles:
+
+- All predefined roles are _global_ by default
+- All predefined roles have a `grafana:roles:` prefix. 
+- You can’t change or delete a predefined role.
+
+Role name | Permissions | Description
+--- | --- | ---
+grafana:roles:permissions:admin:read | roles:read<br>roles:list<br>roles.builtin:list | Allows to list and get available roles and built-in role assignments.
+grafana:roles:permissions:admin:edit | All permissions from `grafana:roles:permissions:admin:read` and <br>roles:write<br>roles:delete<br>roles.builtin:add<br>roles.builtin:remove | Allows every read action and in addition allows to create, change and delete custom roles and create or remove built-in role assignments.
+grafana:roles:reporting:admin:read | reports:read<br>reports:send<br>reports.settings:read | Allows to read reports and report settings.
+grafana:roles:reporting:admin:edit | All permissions from `grafana:roles:reporting:admin:read` and <br>reports.admin:write<br>reports:delete<br>reports.settings:write | Allows every read action for reports and in addition allows to administer reports. 
+grafana:roles:users:admin:read | users.authtoken:list<br>users.quotas:list<br>users:read<br>users.teams:read | Allows to list and get users and related information.
+grafana:roles:users:admin:edit | All permissions from `grafana:roles:users:admin:read` and <br>users.password:update<br>users:write<br>users:create<br>users:delete<br>users:enable<br>users:disable<br>users.permissions:update<br>users:logout<br>users.authtoken:update<br>users.quotas:update | Allows every read action for users and in addition allows to administer users. 
+grafana:roles:users:org:read | org.users:read | Allows to get user organizations.
+grafana:roles:users:org:edit | All permissions from `grafana:roles:users:org:read` and <br>org.users:add<br>org.users:remove<br>org.users.role:update | Allows every read action for user organizations and in addition allows to administer user organizations.
+grafana:roles:ldap:admin:read | ldap.user:read<br>ldap.status:read | Allows to read LDAP information and status.
+grafana:roles:ldap:admin:edit | All permissions from `grafana:roles:ldap:admin:read` and <br>ldap.user:sync | Allows every read action for LDAP and in addition allows to administer LDAP.
+
+## Custom roles
+
+Custom roles allow you to manage access to your users the way you want, by mapping [fine-grained permissions]({{< relref "./permissions.md" >}}) to it and creating [built-in role assignments]({{< ref "#built-in-role-assignments.md" >}}).
+
+To create, update or delete a custom role, you can use the [Fine-grained access control API]({{< relref "../../http_api/access_control.md" >}}) or [Grafana Provisioning]({{< relref "./provisioning.md" >}}).
+
+##### Role name
+
+A role's name is intended as a human friendly identifier for the role, helping administrators understand the purpose of a role. The name cannot be longer than 190 characters, and we recommend using ASCII characters.
+Role names must be unique within an organization.
+
+Roles with names prefixed by `grafana:roles:` are predefined roles created by Grafana and cannot be created or modified by users.
+
+##### Role version
+
+The version of a role is a positive integer which defines the current version of the role. When updating a role, you can either omit the version field to increment the previous value by 1 or set a new version which must be strictly larger than the previous version for the update to succeed.
+
+##### Permissions
+
+You manage access to Grafana resources by mapping [permissions]({{< relref "./permissions.md" >}}) to roles. You can create and assign roles without any permissions as placeholders.
+
+##### Role UID
+
+Each custom role has a UID defined which is a unique identifier associated with the role allowing you to change or delete the role. You can either generate UID yourself, or let Grafana generate one for you.
+
+The same UID cannot be used for roles in different organizations within the same Grafana instance.
+
+### Create, update and delete roles
+
+You can create, update and delete custom roles by using the [Access Control HTTP API]({{< relref "../../http_api/access_control.md" >}}) or by using [Grafana Provisioning]({{< relref "./provisioning.md" >}}).
+
+By default, Grafana Server Admin has a [built-in role assignment]({{< ref "#built-in-role-assignments" >}}) which allows a user to create, update or delete custom roles.
+If a Grafana Server Admin wants to delegate that privilege to other users, they can create a custom role with relevant [permissions]({{< relref "./permissions.md" >}}) and `permissions:delegate` scope will allow those users to manage roles themselves.
+
+Note that you won't be able to create, update or delete a custom role with permissions which you yourself do not have. For example, if the only permission you have is a `users:create`, you won't be able to create a role with other permissions.
+
+## Built-in role assignments
+
+To control what your users can access or not, you can assign or unassign [Custom roles]({{< ref "#custom-roles" >}}) or [Predefined roles]({{< ref "#predefined-roles" >}}) to the existing [Organization roles]({{< relref "../../permissions/organization_roles.md" >}}) or to [Grafana Server Admin]({{< relref "../../permissions/_index.md#grafana-server-admin-role" >}})  role. 
+These assignments are called built-in role assignments.
+
+During startup, Grafana will create default assignments for you. When you make any changes to the built-on role assignments, Grafana will take them into account and won’t overwrite during next start.
+
+### Create and remove built-in role assignments
+
+You can create or remove built-in role assignments using [Fine-grained access control API]({{< relref "../../http_api/access_control.md" >}}) or using [Grafana Provisioning]({{< relref "./provisioning">}}).
+
+### Scope of assignments
+
+A built-in role assignment can be either _global_ or _organization local_. _Global_ assignments are not mapped to any specific organization and will be applied to all organizations, whereas _organization local_ assignments are only applied for that specific organization.
+You can only create _organization local_ assignments for _organization local_ roles.
+
+### Default built-in role assignments
+
+Built-in role | Associated role | Description
+--- | --- | ---
+Grafana Admin | grafana:roles:permissions:admin:edit<br>grafana:roles:permissions:admin:read<br>grafana:roles:reporting:admin:edit<br>grafana:roles:reporting:admin:read<br>grafana:roles:users:admin:edit<br>grafana:roles:users:admin:read<br>grafana:roles:users:org:edit<br>grafana:roles:users:org:read<br>grafana:roles:ldap:admin:edit<br>grafana:roles:ldap:admin:read | Allows access to resources which [Grafana Server Admin]({{< relref "../../permissions/_index.md#grafana-server-admin-role" >}}) has permissions by default.
+Admin | grafana:roles:users:org:edit<br>grafana:roles:users:org:read<br>grafana:roles:reporting:admin:edit<br>grafana:roles:reporting:admin:read | Allows access to resource which [Admin]({{< relref "../../permissions/organization_roles.md" >}}) has permissions by default.
diff --git a/docs/sources/enterprise/access-control/usage-scenarios.md b/docs/sources/enterprise/access-control/usage-scenarios.md
new file mode 100644
index 00000000000..57a516cccf6
--- /dev/null
+++ b/docs/sources/enterprise/access-control/usage-scenarios.md
@@ -0,0 +1,226 @@
++++
+title = "Fine-grained access control usage scenarios"
+description = "Fine-grained access control usage scenarios"
+keywords = ["grafana", "fine-grained-access-control", "roles", "permissions", "fine-grained-access-control-usage", "enterprise"]
+weight = 125
++++
+
+# Fine-grained access control usage scenarios
+
+This guide contains several examples and usage scenarios of using fine-grained roles and permissions for controlling access to Grafana resources.
+
+Before you get started, make sure to [enable fine-grained access control]({{< relref "./_index.md#enable-fine-grained-access-control" >}}).
+
+## Check all built-in role assignments
+
+You can use the [Fine-grained access control HTTP API]({{< relref "../../http_api/access_control.md#get-all-built-in-role-assignments" >}}) to see all available built-in role assignments. 
+The response contains a mapping between one of the organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin` to the custom or predefined roles.
+
+Example request:
+```
+curl --location --request GET '<grafana_url>/api/access-control/builtin-roles' --header 'Authorization: Basic YWRtaW46cGFzc3dvcmQ='
+```
+
+Example response:
+```
+{
+    "Admin": [
+        ...
+        {
+            "version": 2,
+            "uid": "qQui_LCMk",
+            "name": "grafana:roles:users:org:edit",
+            "description": "Allows every read action for user organizations and in addition allows to administer user organizations.",
+            "global": true,
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },       
+        {
+            "version": 1,
+            "uid": "Kz9m_YjGz",
+            "name": "grafana:roles:reporting:admin:edit",
+            "description": "Gives access to edit any report or the organization's general reporting settings.",
+            "global": true,
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        }
+        ...
+    ],
+    "Grafana Admin": [
+        ...
+        {
+            "version": 2,
+            "uid": "qQui_LCMk",
+            "name": "grafana:roles:users:org:edit",
+            "description": "Allows every read action for user organizations and in addition allows to administer user organizations.",
+            "global": true,
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },               
+        {
+            "version": 2,
+            "uid": "ajum_YjGk",
+            "name": "grafana:roles:users:admin:read",
+            "description": "Allows to list and get users and related information.",
+            "global": true,
+            "updated": "2021-05-17T20:49:17+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },
+        {
+            "version": 2,
+            "uid": "K3um_LCMk",
+            "name": "grafana:roles:users:admin:edit",
+            "description": "Allows every read action for users and in addition allows to administer users.",
+            "global": true,
+            "updated": "2021-05-17T20:49:17+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },        
+        ... 
+    ]
+}
+```
+
+To see what permissions each of the assigned roles have, you can a [Get a role]({{< relref "../../http_api/access_control.md#get-a-role" >}}) by using an HTTP API.
+
+Example request:
+
+```
+curl --location --request GET '<grafana_url>/api/access-control/roles/qQui_LCMk' --header 'Authorization: Basic YWRtaW46cGFzc3dvcmQ='
+```
+
+Example response:
+
+```
+{
+    "version": 2,
+    "uid": "qQui_LCMk",
+    "name": "grafana:roles:users:org:edit",
+    "description": "Allows every read action for user organizations and in addition allows to administer user organizations.",
+    "global": true,
+    "permissions": [
+        {
+            "action": "org.users:add",
+            "scope": "users:*",
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-17T20:49:18+02:00"
+        },
+        {
+            "action": "org.users:read",
+            "scope": "users:*",
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-17T20:49:18+02:00"
+        },
+        {
+            "action": "org.users:remove",
+            "scope": "users:*",
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-17T20:49:18+02:00"
+        },
+        {
+            "action": "org.users.role:update",
+            "scope": "users:*",
+            "updated": "2021-05-17T20:49:18+02:00",
+            "created": "2021-05-17T20:49:18+02:00"
+        }
+    ],
+    "updated": "2021-05-17T20:49:18+02:00",
+    "created": "2021-05-13T16:24:26+02:00"
+}
+```
+
+## Create your first custom role
+
+You can create your custom role by either using an [HTTP API]({{< relref "../../http_api/access_control.md#create-a-new-custom-role" >}}) or by using [Grafana provisioning]({{< relref "./provisioning.md" >}}).
+You can take a look at [actions and scopes]({{< relref "./provisioning.md#action-definitions" >}}) to decide what permissions would you like to map to your role.
+
+Example HTTP request:
+```
+curl --location --request POST '<grafana_url>/api/access-control/roles/' \
+--header 'Authorization: Basic YWRtaW46cGFzc3dvcmQ=' \
+--header 'Content-Type: application/json' \
+--data-raw '{
+    "version": 1,
+    "uid": "jZrmlLCkGksdka",
+    "name": "custom:users:admin",
+    "description": "My custom role which gives users permissions to create users",
+    "global": true,
+    "permissions": [
+        {
+            "action": "users:create"
+        }
+    ]
+}'
+```
+
+Example response:
+
+```
+{
+    "version": 1,
+    "uid": "jZrmlLCkGksdka",
+    "name": "custom:users:admin",
+    "description": "My custom role which gives users permissions to create users",
+    "global": true,
+    "permissions": [
+        {
+            "action": "users:create"            
+            "updated": "2021-05-17T22:07:31.569936+02:00",
+            "created": "2021-05-17T22:07:31.569935+02:00"
+        }
+    ],
+    "updated": "2021-05-17T22:07:31.564403+02:00",
+    "created": "2021-05-17T22:07:31.564403+02:00"
+}
+```
+
+Once the custom role is created, you can create a built-in role assignment by using an [HTTP API]({{< relref "../../http_api/access_control.md#create-a-built-in-role-assignment" >}}). 
+If you created your role using [Grafana provisioning]({{< relref "./provisioning.md" >}}), you can also create the assignment with it.
+
+Example HTTP request:
+
+```
+curl --location --request POST '<grafana_url>/api/access-control/builtin-roles' \
+--header 'Authorization: Basic YWRtaW46cGFzc3dvcmQ=' \
+--header 'Content-Type: application/json' \
+--data-raw '{
+    "roleUid": "jZrmlLCkGksdka",
+    "builtinRole": "Viewer",
+    "global": true
+}'
+```
+
+Example response:
+
+```
+{
+    "message": "Built-in role grant added"
+}
+```
+
+## Allow Viewers to create reports
+
+In order to create reports, you would need to have `reports.admin:write` permission. By default, Grafana Admin's or organization Admin can create reports as there is a [built-in role assignment]({{< relref "./roles#built-in-role-assignments" >}}) which comes with `reports.admin:write` permission.
+
+If you want your users who have `Viewer` organization role to create reports, you have two options:
+
+1. First option is to create a built-in role assignment and map `grafana:roles:reporting:admin:edit` predefined role to the `Viewer` built-in role. Note that `grafana:roles:reporting:admin:edit` predefined role allows doing more than creating reports. Refer to [predefined roles]({{< relref "./roles.md#predefined-roles" >}}) for full list of permission assignments.
+1. Second option is to [create a custom role]({{< ref "#create-your-custom-role" >}}) with `reports.admin:write` permission, and create a built-in role assignment for `Viewer` organization role.
+
+## Prevent Grafana Admin from creating and inviting users
+
+In order to create users, you would need to have `users:create` permission. By default, user with Grafana Admin role can create users as there is a [built-in role assignment]({{< relref "./roles#built-in-role-assignments" >}}) which comes with `users:create` permission.
+
+If you want to prevent Grafana Admin from creating users, you can do the following:
+
+1. [Check all built-in role assignments]({{< ref "#check-all-built-in-role-assignments" >}}) to see what built-in role assignments are available.  
+1. From built-in role assignments, find the role which gives `users:create` permission. Refer to [predefined roles]({{< relref "./roles.md#predefined-roles" >}}) for full list of permission assignments. 
+1. Remove the built-in role assignment by using an [Fine-grained access control HTTP API]({{< relref "../../http_api/access_control.md" >}}) or by using [Grafana provisioning]({{< relref "./provisioning" >}}).
+
+## Allow Editors to create new custom roles
+
+By default, Grafana Server Admin is the only user who can create and manage custom roles. If you want your users to do the same, you have two options:
+
+1. First option is to create a built-in role assignment and map `grafana:roles:permissions:admin:edit` and `grafana:roles:permissions:admin:read` predefined roles to the `Editor` built-in role.
+1. Second option is to [create a custom role]({{< ref "#create-your-custom-role" >}}) with `roles.builtin:add` and `roles:write` permissions, and create a built-in role assignment for `Editor` organization role.
+
+Note that in any scenario, your `Editor` would be able to create and manage roles only with the permissions they have, or with a subset of them. 
diff --git a/docs/sources/enterprise/auditing.md b/docs/sources/enterprise/auditing.md
index b7f76de7eac..b7a2ede145c 100644
--- a/docs/sources/enterprise/auditing.md
+++ b/docs/sources/enterprise/auditing.md
@@ -2,7 +2,7 @@
 title = "Auditing"
 description = "Auditing"
 keywords = ["grafana", "auditing", "audit", "logs"]
-weight = 700
+weight = 1100
 +++
 
 # Auditing
diff --git a/docs/sources/enterprise/datasource_permissions.md b/docs/sources/enterprise/datasource_permissions.md
index af4b80d5237..53074d14ce4 100644
--- a/docs/sources/enterprise/datasource_permissions.md
+++ b/docs/sources/enterprise/datasource_permissions.md
@@ -2,7 +2,7 @@
 title = "Data source permissions"
 description = "Grafana Datasource Permissions Guide "
 keywords = ["grafana", "configuration", "documentation", "datasource", "permissions", "users", "teams", "enterprise"]
-weight = 200
+weight = 500
 +++
 
 # Data source permissions
diff --git a/docs/sources/enterprise/enhanced_ldap.md b/docs/sources/enterprise/enhanced_ldap.md
index b1966d4d497..eebc87ca98c 100644
--- a/docs/sources/enterprise/enhanced_ldap.md
+++ b/docs/sources/enterprise/enhanced_ldap.md
@@ -2,7 +2,7 @@
 title = "Enhanced LDAP Integration"
 description = "Grafana Enhanced LDAP Integration Guide "
 keywords = ["grafana", "configuration", "documentation", "ldap", "active directory", "enterprise"]
-weight = 300
+weight = 600
 +++
 
 # Enhanced LDAP integration
diff --git a/docs/sources/enterprise/enterprise-configuration.md b/docs/sources/enterprise/enterprise-configuration.md
index 7b906018886..5b6ce4b8de6 100644
--- a/docs/sources/enterprise/enterprise-configuration.md
+++ b/docs/sources/enterprise/enterprise-configuration.md
@@ -2,7 +2,7 @@
 title = "Enterprise configuration"
 description = "Enterprise configuration documentation"
 keywords = ["grafana", "configuration", "documentation", "enterprise"]
-weight = 300
+weight = 700
 +++
 
 # Grafana Enterprise configuration
diff --git a/docs/sources/enterprise/export-pdf.md b/docs/sources/enterprise/export-pdf.md
index 4d626b3fa83..9ced0bc2250 100644
--- a/docs/sources/enterprise/export-pdf.md
+++ b/docs/sources/enterprise/export-pdf.md
@@ -2,7 +2,7 @@
 title = "Export dashboard as PDF"
 description = ""
 keywords = ["grafana", "export", "pdf", "share"]
-weight = 900
+weight = 1400
 +++
 
 # Export dashboard as PDF
diff --git a/docs/sources/enterprise/license/_index.md b/docs/sources/enterprise/license/_index.md
index 810af58a0f8..851250186d7 100644
--- a/docs/sources/enterprise/license/_index.md
+++ b/docs/sources/enterprise/license/_index.md
@@ -2,7 +2,7 @@
 title = "Grafana Enterprise license"
 description = "Enterprise license"
 keywords = ["grafana", "licensing", "enterprise"]
-weight = 100
+weight = 10
 +++
 
 # Grafana Enterprise license
diff --git a/docs/sources/enterprise/query-caching.md b/docs/sources/enterprise/query-caching.md
index ac4783504c5..799f2cd0ed1 100644
--- a/docs/sources/enterprise/query-caching.md
+++ b/docs/sources/enterprise/query-caching.md
@@ -2,7 +2,7 @@
 title = "Query caching"
 description = "Grafana Enterprise data source query caching"
 keywords = ["grafana", "plugins", "query", "caching"]
-weight = 110
+weight = 300
 +++
 
 # Query caching
diff --git a/docs/sources/enterprise/reporting.md b/docs/sources/enterprise/reporting.md
index 3f373151e2b..08c7cfe0a15 100644
--- a/docs/sources/enterprise/reporting.md
+++ b/docs/sources/enterprise/reporting.md
@@ -3,7 +3,7 @@ title = "Reporting"
 description = ""
 keywords = ["grafana", "reporting"]
 aliases = ["/docs/grafana/latest/administration/reports"]
-weight = 400
+weight = 800
 +++
 
 # Reporting
@@ -11,6 +11,9 @@ weight = 400
 Reporting allows you to automatically generate PDFs from any of your dashboards and have Grafana email them to interested parties on a schedule.
 
 > Only available in Grafana Enterprise v6.4+.
+ 
+> If you have [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) enabled, for some actions you would need to have relevant permissions.
+Refer to specific guides to understand what permissions are required.
 
 {{< docs-imagebox img="/img/docs/enterprise/reports_list.png" max-width="500px" class="docs-image--no-shadow" >}}
 
@@ -21,9 +24,13 @@ Any changes you make to a dashboard used in a report are reflected the next time
 - SMTP must be configured for reports to be sent. Refer to [SMTP]({{< relref "../administration/configuration.md#smtp" >}}) in [Configuration]({{< relref "../administration/configuration.md" >}}) for more information.
 - The Image Renderer plugin must be installed or the remote rendering service must be set up. Refer to [Image rendering]({{< relref "../administration/image_rendering.md" >}}) for more information.
 
+## Access control
+
+When [Fine-grained access control]({{< relref "../enterprise/access-control/_index.md" >}}) is enabled, you need to have the relevant [Permissions]({{< relref "../enterprise/access-control/permissions.md" >}}) to create and manage reports.
+
 ## Create or update a report
 
-Currently only Organization Admins can create reports.
+Only organization admins can create reports by default. You can customize who can create reports with [fine-grained access control]({{< relref "../enterprise/access-control/_index.md" >}}).
 
 1. Click on the reports icon in the side menu. The Reports tab allows you to view, create, and update your reports.
 1. Enter report information. All fields are required unless otherwise indicated.
diff --git a/docs/sources/enterprise/request-security.md b/docs/sources/enterprise/request-security.md
index b1f6ffc8883..4e6af243d5a 100644
--- a/docs/sources/enterprise/request-security.md
+++ b/docs/sources/enterprise/request-security.md
@@ -2,7 +2,7 @@
 title = "Request security"
 description = "Grafana Enterprise request security"
 keywords = ["grafana", "security", "enterprise"]
-weight = 110
+weight = 400
 +++
 
 # Request security
diff --git a/docs/sources/enterprise/saml.md b/docs/sources/enterprise/saml.md
index b157a4a0d2d..22a4f7e9d79 100644
--- a/docs/sources/enterprise/saml.md
+++ b/docs/sources/enterprise/saml.md
@@ -3,7 +3,7 @@ title = "SAML Authentication"
 description = "Grafana SAML Authentication"
 keywords = ["grafana", "saml", "documentation", "saml-auth"]
 aliases = ["/docs/grafana/latest/auth/saml/"]
-weight = 500
+weight = 900
 +++
 
 # SAML authentication
diff --git a/docs/sources/enterprise/team-sync.md b/docs/sources/enterprise/team-sync.md
index c9e799c845d..21a44913629 100644
--- a/docs/sources/enterprise/team-sync.md
+++ b/docs/sources/enterprise/team-sync.md
@@ -3,7 +3,7 @@ title = "Team sync"
 description = "Grafana Team Sync"
 keywords = ["grafana", "auth", "documentation"]
 aliases = ["/docs/grafana/latest/auth/saml/"]
-weight = 600
+weight = 1000
 +++
 
 # Team sync
diff --git a/docs/sources/enterprise/usage-insights/_index.md b/docs/sources/enterprise/usage-insights/_index.md
index d21a1eccd6f..f536826d1ec 100644
--- a/docs/sources/enterprise/usage-insights/_index.md
+++ b/docs/sources/enterprise/usage-insights/_index.md
@@ -3,7 +3,7 @@ title = "Usage insights"
 description = "Understand how your Grafana instance is used"
 keywords = ["grafana", "usage-insights", "enterprise"]
 aliases = ["/docs/grafana/latest/enterprise/usage-insights/"]
-weight = 100
+weight = 200
 +++
 
 # Usage insights
diff --git a/docs/sources/enterprise/vault.md b/docs/sources/enterprise/vault.md
index b52b9360836..04462e168e7 100644
--- a/docs/sources/enterprise/vault.md
+++ b/docs/sources/enterprise/vault.md
@@ -2,7 +2,7 @@
 title = "Vault"
 description = ""
 keywords = ["grafana", "vault", "configuration"]
-weight = 700
+weight = 1200
 +++
 
 # Vault integration
diff --git a/docs/sources/enterprise/white-labeling.md b/docs/sources/enterprise/white-labeling.md
index 05e1589e3f5..e08b8e1fdba 100644
--- a/docs/sources/enterprise/white-labeling.md
+++ b/docs/sources/enterprise/white-labeling.md
@@ -3,7 +3,7 @@ title = "White labeling"
 description = "Change the look of Grafana to match your corporate brand"
 keywords = ["grafana", "white-labeling", "enterprise"]
 aliases = ["/docs/grafana/latest/enterprise/white-labeling/"]
-weight = 700
+weight = 1300
 +++
 
 # White labeling
diff --git a/docs/sources/http_api/_index.md b/docs/sources/http_api/_index.md
index 3dfd57ac015..b3b6cdac669 100644
--- a/docs/sources/http_api/_index.md
+++ b/docs/sources/http_api/_index.md
@@ -37,6 +37,7 @@ dashboards, creating users and updating data sources.
 
 Grafana Enterprise includes all of the Grafana OSS APIs as well as those that follow:
 
+- [Fine-Grained Access Control API]({{< relref "access_control.md" >}})
 - [Data Source Permissions API]({{< relref "datasource_permissions.md" >}})
 - [External Group Sync API]({{< relref "external_group_sync.md" >}})
 - [License API]({{< relref "licensing.md" >}})
diff --git a/docs/sources/http_api/access_control.md b/docs/sources/http_api/access_control.md
new file mode 100644
index 00000000000..5a092382f71
--- /dev/null
+++ b/docs/sources/http_api/access_control.md
@@ -0,0 +1,584 @@
++++
+title = "Fine-grained access control HTTP API "
+description = "Fine-grained access control API"
+keywords = ["grafana", "http", "documentation", "api", "fine-grained-access-control", "acl", "enterprise"]
+aliases = ["/docs/grafana/latest/http_api/accesscontrol/"]
++++
+
+# Fine-grained access control API
+
+> Fine-grained access control API is only available in Grafana Enterprise. Read more about [Grafana Enterprise]({{< relref "../enterprise" >}}).
+
+The API can be used to create, update, get and list roles, and create or remove built-in role assignments. 
+To use the API, you would need to [enable fine-grained access control]({{< relref "../enterprise/access-control/_index.md#enable-fine-grained-access-control" >}}).
+
+The API does not currently work with an API Token. So in order to use these API endpoints you will have to use [Basic auth]({{< relref "./auth/#basic-auth" >}}).
+
+## Get status
+
+`GET /api/access-control/status`
+
+Returns an indicator to check if fine-grained access control is enabled or not.
+
+### Required permissions
+
+Action | Scope
+--- | --- | 
+status:accesscontrol | services:accesscontrol
+
+#### Example request
+
+```http
+GET /api/access-control/check
+Accept: application/json
+Content-Type: application/json
+```
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+  "enabled": true
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Returned a flag indicating if the fine-grained access control is enabled or no.
+403 | Access denied
+404 | Not found, an indication that fine-grained access control is not available at all.
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+## Create and manage custom roles
+
+### Get all roles
+
+`GET /api/access-control/roles`
+
+Gets all existing roles. The response contains all global and organization local roles, for the organization which user is signed in. 
+Refer to the [Role scopes]({{< relref "../enterprise/access-control/roles.md#built-in-role-assignments" >}}) for more information.  
+
+#### Required permissions
+
+Action | Scope 
+--- | --- | 
+roles:list | roles:* 
+
+#### Example request
+
+```http
+GET /api/access-control/roles
+Accept: application/json
+Content-Type: application/json
+```
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+[
+    {
+        "version": 1,
+        "uid": "Kz9m_YjGz",
+        "name": "grafana:roles:reporting:admin:edit",
+        "description": "Gives access to edit any report or the organization's general reporting settings.",
+        "global": true,
+        "updated": "2021-05-13T16:24:26+02:00",
+        "created": "2021-05-13T16:24:26+02:00"
+    },
+    {
+        "version": 5,
+        "uid": "vi9mlLjGz",
+        "name": "grafana:roles:permissions:admin:read",
+        "description": "Gives access to read and list roles and permissions, as well as built-in role assignments.",
+        "global": true,
+        "updated": "2021-05-13T22:41:49+02:00",
+        "created": "2021-05-13T16:24:26+02:00"
+    }
+]
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Global and organization local roles are returned.
+403 | Access denied
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Get a role
+
+`GET /api/access-control/roles/:uid`
+
+Get a role for the given UID.
+
+#### Required permissions
+
+Action | Scope
+--- | --- | 
+roles:read | roles:*
+
+#### Example request
+
+```http
+GET /api/access-control/roles/PYnDO3rMk
+Accept: application/json
+Content-Type: application/json
+```
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "version": 2,
+    "uid": "jZrmlLCGk",
+    "name": "grafana:roles:permissions:admin:edit",
+    "description": "Gives access to create, update and delete roles, as well as manage built-in role assignments.",
+    "global": true,
+    "permissions": [
+        {
+            "action": "roles:delete",
+            "scope": "permissions:delegate",
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },
+        {
+            "action": "roles:list",
+            "scope": "roles:*",
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        }
+    ],
+    "updated": "2021-05-13T16:24:26+02:00",
+    "created": "2021-05-13T16:24:26+02:00"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role is returned.
+403 | Access denied
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Create a new custom role
+
+`POST /api/access-control/roles`
+
+Creates a new custom role and maps given permissions to that role. Note that roles with the same prefix as [Predefined Roles]({{< relref "../enterprise/access-control/roles.md" >}}) can't be created.
+
+#### Required permissions
+
+`permission:delegate` scope ensures that users can only create custom roles with the same, or a subset of permissions which the user has.
+For example, if a user does not have required permissions for creating users, they won't be able to create a custom role which allows to do that. This is done to prevent escalation of privileges.
+
+Action | Scope
+--- | --- | 
+roles:write | permissions:delegate
+
+#### Example request
+
+```http
+POST /api/access-control/roles
+Accept: application/json
+Content-Type: application/json
+
+{
+    "version": 1,
+    "uid": "jZrmlLCGka",
+    "name": "custom:delete:roles",
+    "description": "My custom role which gives users permissions to delete roles",
+    "global": true,
+    "permissions": [
+        {
+            "action": "roles:delete",
+            "scope": "permissions:delegate"
+        }
+    ]
+}
+```
+
+#### JSON body schema
+
+Field Name | Date Type | Required | Description
+--- | --- | --- | ---
+uid | string | No | UID of the role. If not present, the UID will be automatically created for you and returned in response. Refer to the [Custom roles]({{< relref "../enterprise/access-control/roles.md#custom-roles" >}}) for more information.
+global | boolean | No | A flag indicating if the role is global or not. If set to `false`, the default org ID of the authenticated user will be used from the request. Refer to the [Role scopes]({{< relref "../enterprise/access-control/roles.md#role-scopes" >}}) for more information.
+version | number | No | Version of the role. If not present, version 0 will be assigned to the role and returned in the response. Refer to the [Custom roles]({{< relref "../enterprise/access-control/roles.md#custom-roles" >}}) for more information.
+name | string | Yes | Name of the role. Refer to [Custom roles]({{< relref "../enterprise/access-control/roles.md#custom-roles" >}}) for more information.
+description | string | No | Description of the role.
+permissions | Permission | No | If not present, the role will be created without any permissions.
+
+**Permission**
+
+Field Name | Data   Type | Required | Description
+--- | --- | --- | ---
+action | string | Yes | Refer to [Permissions]({{< relref "../enterprise/access-control/permissions.md" >}}) for full list of available actions.
+scope | string | No | If not present, no scope will be mapped to the permission. Refer to [Permissions]({{< relref "../enterprise/access-control/permissions.md#scope-definitions" >}}) for full list of available scopes.
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "version": 2,
+    "uid": "jZrmlLCGka",
+    "name": "custom:delete:create:roles",
+    "description": "My custom role which gives users permissions to delete and create roles",
+    "global": true,
+    "permissions": [
+        {
+            "action": "roles:delete",
+            "scope": "permissions:delegate",
+            "updated": "2021-05-13T23:19:46+02:00",
+            "created": "2021-05-13T23:19:46+02:00"
+        }
+    ],
+    "updated": "2021-05-13T23:20:51.416518+02:00",
+    "created": "2021-05-13T23:19:46+02:00"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role is updated.
+400 | Bad request (invalid json, missing content-type, missing or invalid fields, etc.).
+403 | Access denied
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Update a custom role
+
+`PUT /api/access-control/roles/:uid`
+
+Update the role with the given UID, and it's permissions with the given UID. The operation is idempotent and all permissions of the role will be replaced with what is in the request. You would need to increment the version of the role with each update, otherwise the request will fail.
+
+#### Required permissions
+
+`permission:delegate` scope ensures that users can only update custom roles with the same, or a subset of permissions which the user has.
+For example, if a user does not have required permissions for creating users, they won't be able to update a custom role which allows to do that. This is done to prevent escalation of privileges.
+
+Action | Scope
+--- | --- | 
+roles:write | permissions:delegate
+
+#### Example request
+
+```http
+PUT /api/access-control/roles/jZrmlLCGka
+Accept: application/json
+Content-Type: application/json
+
+{
+    "version": 2,    
+    "name": "custom:delete:create:roles",
+    "description": "My custom role which gives users permissions to delete and create roles",    
+    "permissions": [
+        {
+            "action": "roles:delete",
+            "scope": "permissions:delegate"
+        },
+         {
+            "action": "roles:create",
+            "scope": "permissions:delegate"
+        }
+    ]
+}
+```
+
+#### JSON body schema
+
+Field Name | Data Type | Required | Description
+--- | --- | --- | ---
+version | number | Yes | Version of the role. Must be incremented for update to work.
+name | string | Yes | Name of the role.
+description | string | No | Description of the role.
+permissions | List of Permissions | No | The full list of permissions the role should have after the update.
+
+**Permission**
+
+Field Name | Data   Type | Required | Description
+--- | --- | --- | ---
+action | string | Yes | Refer to [Permissions]({{< relref "../enterprise/access-control/permissions.md" >}}) for full list of available actions.
+scope | string | No | If not present, no scope will be mapped to the permission. Refer to [Permissions]({{< relref "../enterprise/access-control/permissions.md#scope-definitions" >}}) for full list of available scopes.
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "version": 3,    
+    "name": "custom:delete:create:roles",
+    "description": "My custom role which gives users permissions to delete and create roles",    
+    "permissions": [
+        {
+            "action": "roles:delete",
+            "scope": "permissions:delegate",
+            "updated": "2021-05-13T23:19:46.546146+02:00",
+            "created": "2021-05-13T23:19:46.546146+02:00"
+        },
+         {
+            "action": "roles:create",
+            "scope": "permissions:delegate",
+            "updated": "2021-05-13T23:19:46.546146+02:00",
+            "created": "2021-05-13T23:19:46.546146+02:00"
+        }
+    ],
+    "updated": "2021-05-13T23:19:46.540987+02:00",
+    "created": "2021-05-13T23:19:46.540986+02:00"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role is updated.
+400 | Bad request (invalid json, missing content-type, missing or invalid fields, etc.).
+403 | Access denied
+404 | Role was not found to  update.
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Delete a custom role
+
+`DELETE /api/access-control/roles/:uid?force=false`
+
+Delete a role with the given UID, and it's permissions. If the role is assigned to a built-in role, the deletion operation will fail, unless `force` query param is set to `true`, and in that case all assignments will also be deleted.
+
+#### Required permissions
+
+`permission:delegate` scope ensures that users can only delete a custom role with the same, or a subset of permissions which the user has.
+For example, if a user does not have required permissions for creating users, they won't be able to delete a custom role which allows to do that.
+
+Action | Scope
+--- | --- | 
+roles:delete | permissions:delegate
+
+#### Example request
+
+```http
+DELETE /api/access-control/roles/jZrmlLCGka?force=true
+Accept: application/json
+```
+
+#### Query parameters
+
+Param | Type | Required | Description
+--- | --- | --- | ---
+force | boolean | No | When set to `true`, the role will be deleted with all it's assignments.
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "message": "Role deleted"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role is deleted.
+400 | Bad request (invalid json, missing content-type, missing or invalid fields, etc.).
+403 | Access denied
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+## Create and remove built-in role assignments
+
+API set allows to create or remove [built-in role assignments]({{< relref "../enterprise/access-control/roles.md#built-in-role-assignments" >}}) and list current assignments. 
+
+### Get all built-in role assignments
+
+`GET /api/access-control/builtin-roles`
+
+Gets all built-in role assignments.
+
+#### Required permissions
+
+Action | Scope
+--- | --- | 
+roles.builtin:list | roles:*
+
+#### Example request
+
+```http
+GET /api/access-control/builtin-roles
+Accept: application/json
+Content-Type: application/json
+```
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "Admin": [
+        {
+            "version": 1,
+            "uid": "qQui_LCMk",
+            "name": "grafana:roles:users:org:edit",
+            "description": "",
+            "global": true,
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        },
+        {
+            "version": 1,
+            "uid": "PeXmlYjMk",
+            "name": "grafana:roles:users:org:read",
+            "description": "",
+            "global": true,
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        }
+    ],
+    "Grafana Admin": [
+        {
+            "version": 1,
+            "uid": "qQui_LCMk",
+            "name": "grafana:roles:users:org:edit",
+            "description": "",
+            "global": true,
+            "updated": "2021-05-13T16:24:26+02:00",
+            "created": "2021-05-13T16:24:26+02:00"
+        }
+    ]
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Built-in role assignments are returned.
+403 | Access denied
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Create a built-in role assignment
+
+`POST /api/access-control/builtin-roles`
+
+Creates a new built-in role assignment.
+
+#### Required permissions
+
+`permission:delegate` scope ensures that users can only create built-in role assignments with the roles which have same, or a subset of permissions which the user has. 
+For example, if a user does not have required permissions for creating users, they won't be able to create a built-in role assignment which will allow to do that. This is done to prevent escalation of privileges.
+
+Action | Scope
+--- | --- | 
+roles.builtin:add | permissions:delegate
+
+#### Example request
+
+```http
+POST /api/access-control/builtin-roles
+Accept: application/json
+Content-Type: application/json
+
+{
+    "roleUid": "LPMGN99Mk",
+    "builtinRole": "Grafana Admin",
+    "global": false
+}
+```
+
+#### JSON body schema
+
+Field Name | Date Type | Required | Description
+--- | --- | --- | ---
+roleUid | string | Yes | UID of the role.
+builtinRole | boolean | Yes | Can be one of `Viewer`, `Editor`, `Admin` or `Grafana Admin`.
+global | boolean | No | A flag indicating if the assignment is global or not. If set to `false`, the default org ID of the authenticated user will be used from the request to create organization local assignment. Refer to the [Built-in role assignments]({{< relref "../enterprise/access-control/roles.md#built-in-role-assignments" >}}) for more information.
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "message": "Built-in role grant added"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role was assigned to built-in role.
+400 | Bad request (invalid json, missing content-type, missing or invalid fields, etc.).
+403 | Access denied
+404 | Role not found
+500 | Unexpected error. Refer to body and/or server logs for more details.
+
+### Remove a built-in role assignment
+
+`DELETE /api/access-control/builtin-roles/:builtinRole/roles/:roleUID`
+
+Deletes a built-in role assignment (for one of _Viewer_, _Editor_, _Admin_, or _Grafana Admin_) to the role with the provided UID.
+
+#### Required permissions
+
+`permission:delegate` scope ensures that users can only remove built-in role assignments with the roles which have same, or a subset of permissions which the user has.
+For example, if a user does not have required permissions for creating users, they won't be able to remove a built-in role assignment which allows to do that.
+
+Action | Scope
+--- | --- | 
+roles.builtin:remove | permissions:delegate
+
+#### Example request
+
+```http
+DELETE /api/access-control/builtin-roles/Grafana%20Admin/roles/LPMGN99Mk?global=false
+Accept: application/json
+```
+
+#### Query parameters
+
+Param | Type | Required | Description
+--- | --- | --- | ---
+global | boolean | No | A flag indicating if the assignment is global or not. If set to `false`, the default org ID of the authenticated user will be used from the request to remove assignment. Refer to the [Built-in role assignments]({{< relref "../enterprise/access-control/roles.md#built-in-role-assignments" >}}) for more information.
+
+#### Example response
+
+```http
+HTTP/1.1 200 OK
+Content-Type: application/json; charset=UTF-8
+
+{
+    "message": "Built-in role grant removed"
+}
+```
+
+#### Status codes
+
+Code | Description
+--- | --- | 
+200 | Role was unassigned from built-in role.
+400 | Bad request (invalid json, missing content-type, missing or invalid fields, etc.).
+403 | Access denied
+404 | Role not found.
+500 | Unexpected error. Refer to body and/or server logs for more details.
diff --git a/docs/sources/http_api/admin.md b/docs/sources/http_api/admin.md
index ab1851cd5d5..c4e30667e66 100644
--- a/docs/sources/http_api/admin.md
+++ b/docs/sources/http_api/admin.md
@@ -11,6 +11,9 @@ The Admin HTTP API does not currently work with an API Token. API Tokens are cur
 the permission of server admin, only users can be given that permission. So in order to use these API calls you will have to use Basic Auth and the Grafana user
 must have the Grafana Admin permission. (The default admin user is called `admin` and has permission to use this API.)
 
+> If you are running Grafana Enterprise and have [Fine-grained access control]({{< relref "../enterprise/access-control/_index.md" >}}) enabled, for some endpoints you would need to have relevant permissions.
+Refer to specific resources to understand what permissions are required.
+
 ## Settings
 
 `GET /api/admin/settings`
@@ -209,6 +212,14 @@ Content-Type: application/json
 
 Create new user. Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:create | n/a
+
 **Example Request**:
 
 ```http
@@ -243,6 +254,14 @@ Content-Type: application/json
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 Change password for a specific user.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.password:update | global:users:*
+
 **Example Request**:
 
 ```http
@@ -268,6 +287,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.permissions:update | global:users:*
+
 **Example Request**:
 
 ```http
@@ -293,6 +320,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:delete | global:users:*
+
 **Example Request**:
 
 ```http
@@ -353,6 +388,14 @@ Return a list of all auth tokens (devices) that the user currently have logged i
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.authtoken:list | global:users:*
+
 **Example Request**:
 
 ```http
@@ -404,6 +447,14 @@ and will be required to authenticate again upon next activity.
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.authtoken:update | global:users:*
+
 **Example Request**:
 
 ```http
@@ -436,6 +487,14 @@ and will be required to authenticate again upon next activity.
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.logout | global:users:*
+
 **Example Request**:
 
 ```http
@@ -465,12 +524,22 @@ Content-Type: application/json
 
 `POST /api/admin/provisioning/notifications/reload`
 
+`POST /api/admin/provisioning/accesscontrol/reload`
+
 Reloads the provisioning config files for specified type and provision entities again. It won't return
 until the new provisioned entities are already stored in the database. In case of dashboards, it will stop
 polling for changes in dashboard files and then restart it with new configurations after returning.
 
 Only works with Basic Authentication (username and password). See [introduction](http://docs.grafana.org/http_api/admin/#admin-api) for an explanation.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#admin-api" >}}) for an explanation.
+
+Action | Scope | Provision entity 
+--- | --- | --- 
+provisioning:reload | service:accesscontrol | accesscontrol
+
 **Example Request**:
 
 ```http
diff --git a/docs/sources/http_api/org.md b/docs/sources/http_api/org.md
index 95753476ac1..cfd56262e7b 100644
--- a/docs/sources/http_api/org.md
+++ b/docs/sources/http_api/org.md
@@ -5,13 +5,15 @@ keywords = ["grafana", "http", "documentation", "api", "organization"]
 aliases = ["/docs/grafana/latest/http_api/organization/"]
 +++
 
-
 # Organization API
 
 The Organization HTTP API is divided in two resources, `/api/org` (current organization)
 and `/api/orgs` (admin organizations). One big difference between these are that
 the admin of all organizations API only works with basic authentication, see [Admin Organizations API](#admin-organizations-api) for more information.
 
+> If you are running Grafana Enterprise and have [Fine-grained access control]({{< relref "../enterprise/access-control/_index.md" >}}) enabled, for some endpoints you would need to have relevant permissions.
+Refer to specific resources to understand what permissions are required.
+
 ## Current Organization API
 
 ### Get current Organization
@@ -46,6 +48,14 @@ Content-Type: application/json
 Returns all org users within the current organization.
 Accessible to users with org admin role.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:read | users:*
+
 **Example Request**:
 
 ```http
@@ -112,6 +122,14 @@ Content-Type: application/json
 
 `PATCH /api/org/users/:userId`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users.role:update | users:*
+
 **Example Request**:
 
 ```http
@@ -138,6 +156,14 @@ Content-Type: application/json
 
 `DELETE /api/org/users/:userId`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:remove | users:*
+
 **Example Request**:
 
 ```http
@@ -188,6 +214,14 @@ Content-Type: application/json
 
 Adds a global user to the current organization.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:add | users:*
+
 **Example Request**:
 
 ```http
@@ -407,6 +441,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password), see [introduction](#admin-organizations-api).
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:read | users:*
+
 **Example Request**:
 
 ```http
@@ -440,6 +482,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password), see [introduction](#admin-organizations-api).
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:add | users:*
+
 **Example Request**:
 
 ```http
@@ -468,6 +518,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password), see [introduction](#admin-organizations-api).
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users.role:update | users:*
+
 **Example Request**:
 
 ```http
@@ -495,6 +553,14 @@ Content-Type: application/json
 
 Only works with Basic Authentication (username and password), see [introduction](#admin-organizations-api).
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#organization-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+org.users:remove | users:*
+
 **Example Request**:
 
 ```http
diff --git a/docs/sources/http_api/reporting.md b/docs/sources/http_api/reporting.md
index b24bfb3af35..254c58863d5 100644
--- a/docs/sources/http_api/reporting.md
+++ b/docs/sources/http_api/reporting.md
@@ -11,7 +11,9 @@ This API allows you to interact programmatically with the [Reporting]({{< relref
 
 > Reporting is only available in Grafana Enterprise. Read more about [Grafana Enterprise]({{< relref "../enterprise" >}}).
 
-
+> If you have [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) enabled, for some endpoints you would need to have relevant permissions.
+Refer to specific resources to understand what permissions are required.
+ 
 ## Send a report
 
 > Only available in Grafana Enterprise v7.0+.
@@ -22,6 +24,14 @@ This API allows you to interact programmatically with the [Reporting]({{< relref
 
 Generate and send a report. This API waits for the report to be generated before returning. We recommend that you set the client's timeout to at least 60 seconds.
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#reporting-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+reports:send | n/a
+
 ### Example request
 
 ```http
@@ -63,4 +73,4 @@ Code | Description
 401 | Authentication failed, refer to [Authentication API]({{< relref "../http_api/auth.md" >}}).
 403 | User is authenticated but is not authorized to generate the report.
 404 | Report not found.
-500 | Unexpected error or server misconfiguration. Refer to body and/or server logs for more details.
+500 | Unexpected error or server misconfiguration. Refer to server logs for more details.
diff --git a/docs/sources/http_api/user.md b/docs/sources/http_api/user.md
index 963a8a144a1..e3e16070c5c 100644
--- a/docs/sources/http_api/user.md
+++ b/docs/sources/http_api/user.md
@@ -5,12 +5,23 @@ keywords = ["grafana", "http", "documentation", "api", "user"]
 aliases = ["/docs/grafana/latest/http_api/user/"]
 +++
 
-# User HTTP resources / actions
+# User API
 
+> If you are running Grafana Enterprise and have [Fine-grained access control]({{< relref "../enterprise/access-control/_index.md" >}}) enabled, for some endpoints you would need to have relevant permissions.
+Refer to specific resources to understand what permissions are required.
+ 
 ## Search Users
 
 `GET /api/users?perpage=10&page=1`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:read | global:users:*
+
 **Example Request**:
 
 ```http
@@ -58,6 +69,14 @@ Content-Type: application/json
 
 `GET /api/users/search?perpage=10&page=1&query=mygraf`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:read | global:users:*
+
 **Example Request**:
 
 ```http
@@ -111,6 +130,14 @@ Content-Type: application/json
 
 `GET /api/users/:id`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:read | users:*
+
 **Example Request**:
 
 ```http
@@ -148,6 +175,14 @@ Content-Type: application/json
 
 `GET /api/users/lookup?loginOrEmail=user@mygraf.com`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:read | global:users:*
+
 **Example Request using the email as option**:
 
 ```http
@@ -195,6 +230,14 @@ Content-Type: application/json
 
 `PUT /api/users/:id`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:write | users:*
+
 **Example Request**:
 
 ```http
@@ -226,6 +269,14 @@ Content-Type: application/json
 
 `GET /api/users/:id/orgs`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users:read | users:*
+
 **Example Request**:
 
 ```http
@@ -256,6 +307,14 @@ Content-Type: application/json
 
 `GET /api/users/:id/teams`
 
+#### Required permissions
+
+See note in the [introduction]({{< ref "#user-api" >}}) for an explanation.
+
+Action | Scope
+--- | --- | 
+users.teams:read | users:*
+
 **Example Request**:
 
 ```http
diff --git a/docs/sources/manage-users/_index.md b/docs/sources/manage-users/_index.md
index fae95f60625..cae1e05e26c 100644
--- a/docs/sources/manage-users/_index.md
+++ b/docs/sources/manage-users/_index.md
@@ -9,6 +9,8 @@ Grafana offers several options for grouping users. Each level has different tool
 
 One of the most important user management tasks is assigning roles, which govern what [permissions]({{< relref "../permissions/_index.md" >}}) a user has. The correct permissions ensure that users have access to only the resources they need.
 
+> Refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) in Grafana Enterprise to understand how you can manage users with fine-grained permissions.
+
 ## Server
 
 The highest and broadest level of user group in Grafana is the server. Every user with an account in a Grafana instance is a member of the server group.
diff --git a/docs/sources/permissions/_index.md b/docs/sources/permissions/_index.md
index 6f08ead231d..9b7f82fd09f 100644
--- a/docs/sources/permissions/_index.md
+++ b/docs/sources/permissions/_index.md
@@ -8,6 +8,8 @@ weight = 50
 
 # Permissions
 
+> Refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) in Grafana Enterprise for managing access with fine-grained permissions. 
+
 What you can do in Grafana is defined by the _permissions_ associated with your user account.
 
 There are three types of permissions:
@@ -23,6 +25,8 @@ You can be granted permissions based on:
 - (Grafana Enterprise) Data source permissions. For more information, refer to [Data source permissions]({{< relref "../enterprise/datasource_permissions.md" >}}) in [Grafana Enterprise]({{< relref "../enterprise" >}}).
 - (Grafana Cloud) Grafana Cloud has additional roles. For more information, refer to [Grafana Cloud roles and permissions](/docs/grafana-cloud/cloud-portal/cloud-roles/).
 
+If you are running Grafana Enterprise, you can grant access by using fine-grained roles and permissions, refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) for more information.
+
 ## Grafana Server Admin role
 
 Grafana server administrators have the **Grafana Admin** flag enabled on their account. They can access the **Server Admin** menu and perform the following tasks:
diff --git a/docs/sources/permissions/organization_roles.md b/docs/sources/permissions/organization_roles.md
index d4cb187c5c7..85cac7aaf0a 100644
--- a/docs/sources/permissions/organization_roles.md
+++ b/docs/sources/permissions/organization_roles.md
@@ -7,6 +7,8 @@ weight = 100
 
 # Organization roles
 
+> Refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) in Grafana Enterprise for managing Organization roles with fine-grained permissions.
+
 Users can belong to one or more organizations. A user's organization membership is tied to a role that defines what the user is allowed to do in that organization. Grafana supports multiple _organizations_ in order to support a wide variety of deployment models, including using a single Grafana instance to provide service to multiple potentially untrusted organizations.
 
 In most cases, Grafana is deployed with a single organization.
@@ -36,6 +38,8 @@ The table below compares what each role can do. Read the sections below for more
 | Change team settings   |  x  |    |    |
 | Configure app plugins   |  x  |    |    |
 
+If you are running Grafana Enterprise, you can grant and revoke access by using fine-grained roles and permissions, refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) for more information.
+
 ## Organization admin role
 
 Can do everything scoped to the organization. For example:
diff --git a/docs/sources/permissions/restricting-access.md b/docs/sources/permissions/restricting-access.md
index 645e3ab68b3..2eaa6e29f05 100644
--- a/docs/sources/permissions/restricting-access.md
+++ b/docs/sources/permissions/restricting-access.md
@@ -5,6 +5,8 @@ weight = 500
 
 # Restricting access
 
+> Refer to [Fine-grained access Control]({{< relref "../enterprise/access-control/_index.md" >}}) in Grafana Enterprise to understand how to use fine-grained permissions to restrict access.
+
 The highest permission always wins so if you for example want to hide a folder or dashboard from others you need to remove the **Organization Role** based permission from the Access Control List (ACL).
 
 - You cannot override permissions for users with the Organization Admin role. Admins always have access to everything.

From 0ee0d65e129893f2ff4ba323813ae2359075e3f5 Mon Sep 17 00:00:00 2001
From: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>
Date: Thu, 20 May 2021 14:16:15 -0700
Subject: [PATCH 14/43] Docs: 8.0 panel edit updates (#34533)

* Update timeseries.md

* Update add-a-panel.md

* Update _index.md

* Update panel-editor.md

* content updates

* content edits

* moved repeat panels topic

* Update getting-started.md

* edits

* Update DRAFT.md
---
 docs/sources/basics/timeseries.md             |  2 +-
 .../getting-started/getting-started.md        |  7 ++--
 docs/sources/linking/panel-links.md           |  2 +-
 docs/sources/panels/DRAFT.md                  | 40 ++-----------------
 docs/sources/panels/add-a-panel.md            | 38 +++++++++---------
 docs/sources/panels/legend-options.md         |  2 +-
 docs/sources/panels/panel-editor.md           |  3 +-
 docs/sources/panels/panel-options.md          | 38 ++++++++++++++++++
 .../repeat-panels-or-rows.md                  |  3 +-
 docs/sources/panels/visualizations/_index.md  |  8 ++--
 .../shared/panels/panel-links-intro.md        |  5 +++
 .../shared/panels/repeat-panel-intro.md       |  5 +++
 12 files changed, 84 insertions(+), 69 deletions(-)
 create mode 100644 docs/sources/panels/panel-options.md
 rename docs/sources/{variables => panels}/repeat-panels-or-rows.md (90%)
 create mode 100644 docs/sources/shared/panels/panel-links-intro.md
 create mode 100644 docs/sources/shared/panels/repeat-panel-intro.md

diff --git a/docs/sources/basics/timeseries.md b/docs/sources/basics/timeseries.md
index bc7b874606a..1348189d3f9 100644
--- a/docs/sources/basics/timeseries.md
+++ b/docs/sources/basics/timeseries.md
@@ -1,5 +1,5 @@
 +++
-title = "Time series"
+title = "Intro to time series"
 description = "Introduction to time series"
 keywords = ["grafana", "intro", "guide", "concepts", "timeseries"]
 weight = 400
diff --git a/docs/sources/getting-started/getting-started.md b/docs/sources/getting-started/getting-started.md
index b49831fbc77..e70b547599d 100644
--- a/docs/sources/getting-started/getting-started.md
+++ b/docs/sources/getting-started/getting-started.md
@@ -22,7 +22,7 @@ To log in to Grafana for the first time:
 
 1. Open your web browser and go to http://localhost:3000/. The default HTTP port that Grafana listens to is `3000` unless you have configured a different port.
 1. On the login page, enter `admin` for username and password.
-1. Click **Log In**. If login is successful, then you will see a prompt to change the password.
+1. Click **Log in**. If login is successful, then you will see a prompt to change the password.
 1. Click **OK** on the prompt, then change your password.
 
 > **Note:** We strongly recommend that you follow Grafana's best practices and change the default administrator password. Don't forget to record your credentials!
@@ -31,8 +31,9 @@ To log in to Grafana for the first time:
 
 To create your first dashboard:
 
-1. Click the **+** icon on the left panel, select **Create Dashboard**, and then click **Add an empty panel**.
-1. In the New Dashboard/Edit Panel view, go to the **Query** tab.
+1. Click the **+** icon on the side menu.
+1. On the dashboard, click **Add an empty panel**.
+1. In the New dashboard/Edit panel view, go to the **Query** tab.
 1. Configure your [query]({{< relref "../panels/queries.md" >}}) by selecting ``-- Grafana --`` from the [data source selector]({{< relref "../panels/queries.md/#data-source-selector" >}}). This generates the Random Walk dashboard.
 1. Click the  **Save** icon in the top right corner of your screen to save the dashboard.
 1. Add a descriptive name, and then click **Save**.
diff --git a/docs/sources/linking/panel-links.md b/docs/sources/linking/panel-links.md
index 4d050bbb4c2..a42f69f446c 100644
--- a/docs/sources/linking/panel-links.md
+++ b/docs/sources/linking/panel-links.md
@@ -8,7 +8,7 @@ weight = 300
 
 # Panel links
 
-Each panel can have its own set of links that are shown in the upper left corner of the panel. You can link to any available URL, including dashboards, panels, or external sites. You can even control the time range to ensure the user is zoomed in on the right data in Grafana.
+{{< docs/shared "panels/panel-links-intro.md" >}}
 
 Click the icon on the top left corner of a panel to see available panel links.
 
diff --git a/docs/sources/panels/DRAFT.md b/docs/sources/panels/DRAFT.md
index f3a162271ca..81ca648c62c 100644
--- a/docs/sources/panels/DRAFT.md
+++ b/docs/sources/panels/DRAFT.md
@@ -1,58 +1,24 @@
 +++
 draft = "true"
+description = "A topic to collect my thoughts and plans for Grafana 8.0. Can delete after that."
 +++
 
-Task: Add panel
-
-Default visualization: Time series
- - change if you want to, or go to query
-
-Get data into your panel
-- Select data source
-- Add query and/or expression
-- Transform data
-- Troubleshoot
-  - Query options
-  - Inspect query
-  - Table view
-
-Make it look good
-- Change the visualization
-- Panel options
-- Visualization-specific options
-- Thresholds
-- Standard options
-- Value mappings
-- Data links
-- Overrides
-
-Next steps
-- Set up alert
-
 TOC
 
 # General
 Add a panel
 Panel editor
-
-# Work with your metrics
 Queries
 - Share query results
-- Mixed data source queries
-Expressions
+- Mixed data source queries (not yet written)
+Expressions (beta)
 Transformations
 Inspect a panel
-
-# Adjust appearance
-
 Panel options
 Visualization-specific settings (Visualizations)
 Thresholds
 Value mappings
 Data links (can be for all fields or one)
-
-Visualizations > specific options
-
 Overrides
 
 
diff --git a/docs/sources/panels/add-a-panel.md b/docs/sources/panels/add-a-panel.md
index 2191a78fc21..3229affda15 100644
--- a/docs/sources/panels/add-a-panel.md
+++ b/docs/sources/panels/add-a-panel.md
@@ -16,30 +16,34 @@ Panels allow you to show your data in visual form. This topic walks you through
 
 1. Click **Add an empty panel**.
 
-Grafana creates an empty graph panel with your default data source selected.
+Grafana creates an empty time series panel with your default data source selected.
 
-## 2. Edit panel settings
-
-While not required, we recommend that you add a helpful title and description to your panel. You can use [variables you have defined]({{< relref "../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
-
-![](/img/docs/panels/panel-settings-7-0.png)
-
-**Panel title -** Text entered in this field is displayed at the top of your panel in the panel editor and in the dashboard.
-
-**Description -** Text entered in this field is displayed in a tooltip in the upper left corner of the panel. Write a description of the panel and the data you are displaying. Pretend you are explaining it to a new user six months from now, when it is no longer fresh in your mind. Future editors (possibly yourself) will thank you.
-
-## 3. Write a query
+## 2. Write a query
 
 Each panel needs at least one query to display a visualization. You write queries in the Query tab of the panel editor. For more information about the Query tab, refer to [Queries]({{< relref "queries.md" >}}).
 
 1. Choose a data source. In the first line of the Query tab, click the drop-down list to see all available data sources. This list includes all data sources you added. Refer to [Add a data source]({{< relref "../datasources/add-a-data-source.md" >}}) if you need instructions.
 1. Write or construct a query in the query language of your data source. Options will vary. Refer to your specific [data source documentation]({{< relref "../datasources/_index.md" >}}) for specific guidelines.
 
-## 4. Choose a visualization type
+## 3. Choose a visualization type
 
-In the Visualization section of the Panel tab, click a visualization type. Grafana displays a preview of your query results with that visualization applied.
+In the Visualization list, click a visualization type. Grafana displays a preview of your query results with that visualization applied.
 
-For more information about individual visualizations, refer to [Visualizations]({{< relref "visualizations/_index.md" >}}).
+![](/img/docs/panel-editor/select-visualization-8-0.png)
+
+For more information about individual visualizations, refer to [Visualizations options]({{< relref "visualizations/_index.md" >}}).
+
+## 4. (Optional) Edit panel settings
+
+While not required, most visualizations need some adjustment before they properly display the information that you need. Options are defined in the linked topics below.
+
+- [Panel options]({{< relref "./panel-options.md" >}})
+- [Visualization-specific options]({{< relref "./visualizations/_index.md" >}})
+- [Standard options]({{< relref "./standard-options.md" >}})
+- [Thresholds]({{< relref "./thresholds.md" >}})
+- [Value mappings]({{< relref "./value-mappings.md" >}})
+- [Data links]({{< relref "../linking/data-links.md" >}})
+- [Override fields]({{< relref "field-options/configure-specific-fields.md" >}})
 
 ## 5. Apply changes and save
 
@@ -54,7 +58,5 @@ Our Grafana Fundamentals tutorial is a great place to start, or you can learn mo
 - Learn more about [panel editor]({{< relref "panel-editor.md" >}}) options.
 - Add more [queries]({{< relref "queries.md" >}}).
 - [Transform]({{< relref "transformations/_index.md" >}}) your data.
-- [Configure]({{< relref "field-options/_index.md" >}}) how your results are displayed in the visualization.
-
-- If you made a graph panel, set up an [alert]({{< relref "../alerting/_index.md" >}}).
+- Set up an [alert]({{< relref "../alerting/_index.md" >}}).
 - Create [templates and variables]({{< relref "../variables/_index.md" >}}).
diff --git a/docs/sources/panels/legend-options.md b/docs/sources/panels/legend-options.md
index cdb6b0637af..469167667e8 100644
--- a/docs/sources/panels/legend-options.md
+++ b/docs/sources/panels/legend-options.md
@@ -1,7 +1,7 @@
 +++
 title = "Legend options"
 aliases = ["/docs/grafana/latest/panels/visualizations/panel-legend/"]
-weight = 500
+weight = 950
 +++
 
 # Legend options
diff --git a/docs/sources/panels/panel-editor.md b/docs/sources/panels/panel-editor.md
index 082f8dbdec0..a9c5164fe99 100644
--- a/docs/sources/panels/panel-editor.md
+++ b/docs/sources/panels/panel-editor.md
@@ -68,7 +68,6 @@ The section contains tabs where you control almost every aspect of how your data
 Features in these tabs are documented in the following topics:
 
 - [Add a panel]({{< relref "add-a-panel.md" >}}) describes basic panel settings.
-- [Visualizations]({{< relref "visualizations/_index.md" >}}) display options vary widely. They are described in the individual visualization topic.
+- [Visualization]({{< relref "visualizations/_index.md" >}}) options vary widely. They are described in the individual visualization topic.
 - [Field options and overrides]({{< relref "field-options/_index.md" >}}) allow you to control almost every aspect of your visualization, including units, value mappings, and [Thresholds]({{< relref "thresholds.md" >}}).
 - [Panel links]({{< relref "../linking/panel-links.md" >}}) and [Data links]({{< relref "../linking/data-links.md" >}}) help you connect your visualization to other resources.
-
diff --git a/docs/sources/panels/panel-options.md b/docs/sources/panels/panel-options.md
new file mode 100644
index 00000000000..eed0433cfa5
--- /dev/null
+++ b/docs/sources/panels/panel-options.md
@@ -0,0 +1,38 @@
++++
+title = "Panel options"
+weight = 900
++++
+
+# Panel options
+
+Panel options are common to all panels. They are basic options to add information and clarity to your panels. Fields are described below.
+
+While not required, we recommend that you add a helpful title and description to all panels.
+
+![](/img/docs/panels/panel-options-8-0.png)
+
+## Title
+
+Text entered in this field is displayed at the top of your panel in the panel editor and in the dashboard. You can use [variables you have defined]({{< relref "../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
+
+## Description
+
+Text entered in this field is displayed in a tooltip in the upper left corner of the panel. Write a description of the panel and the data you are displaying. Pretend you are explaining it to a new user six months from now, when it is no longer fresh in your mind. Future editors (possibly yourself) will thank you.
+
+You can use [variables you have defined]({{< relref "../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
+
+## Transparent background
+
+Toggle the transparent background option on your panel display.
+
+## Panel links
+
+{{< docs/shared "panels/panel-links-intro.md" >}}
+
+For more information, refer to [Panel links]({{< relref "../linking/panel-links.md" >}}).
+
+## Repeat options
+
+{{< docs/shared "panels/repeat-panels-intro.md" >}}
+
+For more information, refer to [Repeat panels or rows]({{< relref "./repeat-panels-or-rows.md" >}}).
diff --git a/docs/sources/variables/repeat-panels-or-rows.md b/docs/sources/panels/repeat-panels-or-rows.md
similarity index 90%
rename from docs/sources/variables/repeat-panels-or-rows.md
rename to docs/sources/panels/repeat-panels-or-rows.md
index 9ec9af93552..5385a0c4051 100644
--- a/docs/sources/variables/repeat-panels-or-rows.md
+++ b/docs/sources/panels/repeat-panels-or-rows.md
@@ -1,12 +1,13 @@
 +++
 title = "Repeat panels or rows"
 keywords = ["grafana", "templating", "documentation", "guide", "template", "variable", "repeat"]
+aliases = ["/docs/grafana/latest/variables/repeat-panels-or-rows/"]
 weight = 800
 +++
 
 # Repeat panels or rows
 
-Grafana lets you create dynamic dashboards using _template variables_. All variables in your queries expand to the current value of the variable before the query is sent to the database. Variables let you reuse a single dashboard for all your services.
+{{< docs/shared "panels/repeat-panels-intro.md" >}}
 
 Template variables can be very useful to dynamically change your queries across a whole dashboard. If you want
 Grafana to dynamically create new panels or rows based on what values you have selected, you can use the _Repeat_ feature.
diff --git a/docs/sources/panels/visualizations/_index.md b/docs/sources/panels/visualizations/_index.md
index 2dd61d59e44..3e2a8f33465 100644
--- a/docs/sources/panels/visualizations/_index.md
+++ b/docs/sources/panels/visualizations/_index.md
@@ -1,12 +1,10 @@
 +++
-title = "Visualizations"
+title = "Visualization options"
 weight = 300
 +++
 
-# Visualizations
+# Visualization options
 
-Grafana offers a variety of visualizations to suit different use cases. This section of the documentation lists the different visualizations available in Grafana and their unique display settings.
-
-The default options and their unique display options are described in the pages in this section.
+Grafana offers a variety of visualizations to suit different use cases. This section of the documentation lists the different visualizations available in Grafana and their unique options.
 
 You can add more panel types with [plugins]({{< relref "../../plugins/_index.md" >}}).
diff --git a/docs/sources/shared/panels/panel-links-intro.md b/docs/sources/shared/panels/panel-links-intro.md
new file mode 100644
index 00000000000..8f3980daed4
--- /dev/null
+++ b/docs/sources/shared/panels/panel-links-intro.md
@@ -0,0 +1,5 @@
+---
+title: Panel links intro
+---
+
+Each panel can have its own set of links that are shown in the upper left corner of the panel. You can link to any available URL, including dashboards, panels, or external sites. You can even control the time range to ensure the user is zoomed in on the right data in Grafana.
\ No newline at end of file
diff --git a/docs/sources/shared/panels/repeat-panel-intro.md b/docs/sources/shared/panels/repeat-panel-intro.md
new file mode 100644
index 00000000000..effd55c5468
--- /dev/null
+++ b/docs/sources/shared/panels/repeat-panel-intro.md
@@ -0,0 +1,5 @@
+---
+title: Repeat panel intro
+---
+
+Grafana lets you create dynamic dashboards using _template variables_. All variables in your queries expand to the current value of the variable before the query is sent to the database. Variables let you reuse a single dashboard for all your services.
\ No newline at end of file

From 1e024f22b8f767da01c9322f489d7b71aeec19c3 Mon Sep 17 00:00:00 2001
From: achatterjee-grafana
 <70489351+achatterjee-grafana@users.noreply.github.com>
Date: Thu, 20 May 2021 17:45:07 -0400
Subject: [PATCH 15/43] Added singlestat deprecation notice. (#34534)

* Added singlestat deprecation notice.

* removed extra space.
---
 docs/sources/whatsnew/whats-new-in-v8-0.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/docs/sources/whatsnew/whats-new-in-v8-0.md b/docs/sources/whatsnew/whats-new-in-v8-0.md
index 993616fd9a8..202f8d1fd40 100644
--- a/docs/sources/whatsnew/whats-new-in-v8-0.md
+++ b/docs/sources/whatsnew/whats-new-in-v8-0.md
@@ -181,6 +181,11 @@ You can now configure generic OAuth with empty scopes. This allows OAuth Identit
 
 You can now configure generic OAuth with strict parsing of the `role_attribute_path`. By default, if  th `role_attribute_path` property does not return a role, then the user is assigned the `Viewer` role. You can disable the role assignment by setting `role_attribute_strict = true`. It denies user access if no role or an invalid role is returned.
 
+####  Singlestat panel deprecated
+
+Support for Singlestat panel has been discontinued. When you upgrade to version 8.0, all existing Singlestat panels automatically becomes Stat panels.
+Stat panel is available as plugin.
+
 ## Enterprise features
 
 These features are included in the Grafana Enterprise edition.

From 11b2f0ee4d3f2d22a0a93cbb0fe926a24933b0db Mon Sep 17 00:00:00 2001
From: Ryan McKinley <ryantxu@gmail.com>
Date: Thu, 20 May 2021 16:03:23 -0700
Subject: [PATCH 16/43] Timeline: use full row height with one series (#34532)

---
 public/app/plugins/panel/state-timeline/TimelineChart.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/public/app/plugins/panel/state-timeline/TimelineChart.tsx b/public/app/plugins/panel/state-timeline/TimelineChart.tsx
index 3fb00b81571..e78042e3748 100755
--- a/public/app/plugins/panel/state-timeline/TimelineChart.tsx
+++ b/public/app/plugins/panel/state-timeline/TimelineChart.tsx
@@ -42,6 +42,9 @@ export class TimelineChart extends React.Component<TimelineProps> {
       getTimeRange,
       eventBus,
       ...this.props,
+
+      // When there is only one row, use the full space
+      rowHeight: alignedFrame.fields.length > 2 ? this.props.rowHeight : 1,
     });
   };
 

From abe5c06d69902fc85e4ade9657478cc69cd47f2a Mon Sep 17 00:00:00 2001
From: Matthew Turland <tobias382@gmail.com>
Date: Sat, 22 May 2021 11:59:49 -0500
Subject: [PATCH 17/43] Fix Quick Start link on Geting Started Influx page
 (#34549)

Square brackets were used for the URL instead of parentheses, causing the markup to be displayed as literal text.
---
 docs/sources/getting-started/getting-started-influxdb.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/sources/getting-started/getting-started-influxdb.md b/docs/sources/getting-started/getting-started-influxdb.md
index d5126ad4cf1..b8cddfb6075 100644
--- a/docs/sources/getting-started/getting-started-influxdb.md
+++ b/docs/sources/getting-started/getting-started-influxdb.md
@@ -25,7 +25,7 @@ If you chose to use InfluxDB Cloud, then you should [download and install the In
 
 ## Step 4. Get data into InfluxDB
 
-If you downloaded and installed InfluxDB on your local machine, then use the [Quick Start][https://docs.influxdata.com/influxdb/v2.0/write-data/#quick-start-for-influxdb-oss] feature to visualize InfluxDB metrics.
+If you downloaded and installed InfluxDB on your local machine, then use the [Quick Start](https://docs.influxdata.com/influxdb/v2.0/write-data/#quick-start-for-influxdb-oss) feature to visualize InfluxDB metrics.
 
 If you are using the cloud account, then the wizards will guide you through the initial process. For more information, refer to [Configure Telegraf](https://docs.influxdata.com/influxdb/cloud/write-data/no-code/use-telegraf/#configure-telegraf).
 

From 7204a6471767371bd3656c33b34ad87c81f99c24 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= <hugo.haggmark@grafana.com>
Date: Mon, 24 May 2021 06:11:01 +0200
Subject: [PATCH 18/43] LibraryElements: Creates usage stats for panels and
 variables (#34476)

* LibraryPanels: Adds usage collection

* Refactor: renames Panel and Variable consts

* Chore: initialize stats

* Refactor: moves library element migrations to migration namespace
---
 pkg/infra/metrics/metrics.go                  | 20 +++++++
 pkg/infra/usagestats/usage_stats.go           |  4 ++
 pkg/infra/usagestats/usage_stats_test.go      |  4 ++
 pkg/models/libraryelements.go                 | 13 +++++
 pkg/models/stats.go                           |  2 +
 pkg/services/libraryelements/database.go      | 18 +++----
 pkg/services/libraryelements/guard.go         |  6 +--
 .../libraryelements/libraryelements.go        | 51 ------------------
 .../libraryelements_create_test.go            |  6 ++-
 .../libraryelements_get_all_test.go           | 50 ++++++++---------
 .../libraryelements_get_test.go               |  4 +-
 .../libraryelements_patch_test.go             | 32 +++++------
 .../libraryelements_permissions_test.go       | 10 ++--
 .../libraryelements/libraryelements_test.go   |  6 +--
 pkg/services/libraryelements/models.go        |  7 ---
 pkg/services/libraryelements/writers.go       |  3 +-
 pkg/services/librarypanels/librarypanels.go   |  2 +-
 .../librarypanels/librarypanels_test.go       |  4 +-
 .../sqlstore/migrations/libraryelements.go    | 53 +++++++++++++++++++
 .../sqlstore/migrations/migrations.go         |  1 +
 pkg/services/sqlstore/stats.go                |  2 +
 pkg/services/sqlstore/stats_test.go           |  2 +
 22 files changed, 174 insertions(+), 126 deletions(-)
 create mode 100644 pkg/models/libraryelements.go
 create mode 100644 pkg/services/sqlstore/migrations/libraryelements.go

diff --git a/pkg/infra/metrics/metrics.go b/pkg/infra/metrics/metrics.go
index cb81d98c7d0..e325a75d126 100644
--- a/pkg/infra/metrics/metrics.go
+++ b/pkg/infra/metrics/metrics.go
@@ -185,6 +185,12 @@ var (
 	grafanaBuildVersion *prometheus.GaugeVec
 
 	grafanaPluginBuildInfoDesc *prometheus.GaugeVec
+
+	// StatsTotalLibraryPanels is a metric of total number of library panels stored in Grafana.
+	StatsTotalLibraryPanels prometheus.Gauge
+
+	// StatsTotalLibraryVariables is a metric of total number of library variables stored in Grafana.
+	StatsTotalLibraryVariables prometheus.Gauge
 )
 
 func init() {
@@ -547,6 +553,18 @@ func init() {
 		Help:      "number of evaluation calls",
 		Namespace: ExporterName,
 	})
+
+	StatsTotalLibraryPanels = prometheus.NewGauge(prometheus.GaugeOpts{
+		Name:      "stat_totals_library_panels",
+		Help:      "total amount of library panels in the database",
+		Namespace: ExporterName,
+	})
+
+	StatsTotalLibraryVariables = prometheus.NewGauge(prometheus.GaugeOpts{
+		Name:      "stat_totals_library_variables",
+		Help:      "total amount of library variables in the database",
+		Namespace: ExporterName,
+	})
 }
 
 // SetBuildInformation sets the build information for this binary
@@ -640,6 +658,8 @@ func initMetricVars() {
 		StatsTotalDashboardVersions,
 		StatsTotalAnnotations,
 		MAccessEvaluationCount,
+		StatsTotalLibraryPanels,
+		StatsTotalLibraryVariables,
 	)
 }
 
diff --git a/pkg/infra/usagestats/usage_stats.go b/pkg/infra/usagestats/usage_stats.go
index d2e5c78879f..2b43583acd0 100644
--- a/pkg/infra/usagestats/usage_stats.go
+++ b/pkg/infra/usagestats/usage_stats.go
@@ -72,6 +72,8 @@ func (uss *UsageStatsService) GetUsageReport(ctx context.Context) (UsageReport,
 	metrics["stats.dashboard_versions.count"] = statsQuery.Result.DashboardVersions
 	metrics["stats.annotations.count"] = statsQuery.Result.Annotations
 	metrics["stats.alert_rules.count"] = statsQuery.Result.AlertRules
+	metrics["stats.library_panels.count"] = statsQuery.Result.LibraryPanels
+	metrics["stats.library_variables.count"] = statsQuery.Result.LibraryVariables
 	validLicCount := 0
 	if uss.License.HasValidLicense() {
 		validLicCount = 1
@@ -317,6 +319,8 @@ func (uss *UsageStatsService) updateTotalStats() {
 	metrics.StatsTotalDashboardVersions.Set(float64(statsQuery.Result.DashboardVersions))
 	metrics.StatsTotalAnnotations.Set(float64(statsQuery.Result.Annotations))
 	metrics.StatsTotalAlertRules.Set(float64(statsQuery.Result.AlertRules))
+	metrics.StatsTotalLibraryPanels.Set(float64(statsQuery.Result.LibraryPanels))
+	metrics.StatsTotalLibraryVariables.Set(float64(statsQuery.Result.LibraryVariables))
 
 	dsStats := models.GetDataSourceStatsQuery{}
 	if err := uss.Bus.Dispatch(&dsStats); err != nil {
diff --git a/pkg/infra/usagestats/usage_stats_test.go b/pkg/infra/usagestats/usage_stats_test.go
index 4e068704256..3a1125d505d 100644
--- a/pkg/infra/usagestats/usage_stats_test.go
+++ b/pkg/infra/usagestats/usage_stats_test.go
@@ -63,6 +63,8 @@ func TestMetrics(t *testing.T) {
 				DashboardVersions:     16,
 				Annotations:           17,
 				AlertRules:            18,
+				LibraryPanels:         19,
+				LibraryVariables:      20,
 			}
 			getSystemStatsQuery = query
 			return nil
@@ -313,6 +315,8 @@ func TestMetrics(t *testing.T) {
 			assert.Equal(t, 16, metrics.Get("stats.dashboard_versions.count").MustInt())
 			assert.Equal(t, 17, metrics.Get("stats.annotations.count").MustInt())
 			assert.Equal(t, 18, metrics.Get("stats.alert_rules.count").MustInt())
+			assert.Equal(t, 19, metrics.Get("stats.library_panels.count").MustInt())
+			assert.Equal(t, 20, metrics.Get("stats.library_variables.count").MustInt())
 
 			assert.Equal(t, 9, metrics.Get("stats.ds."+models.DS_ES+".count").MustInt())
 			assert.Equal(t, 10, metrics.Get("stats.ds."+models.DS_PROMETHEUS+".count").MustInt())
diff --git a/pkg/models/libraryelements.go b/pkg/models/libraryelements.go
new file mode 100644
index 00000000000..9a989add8db
--- /dev/null
+++ b/pkg/models/libraryelements.go
@@ -0,0 +1,13 @@
+package models
+
+// LibraryElementKind is used for the kind of library element
+type LibraryElementKind int
+
+const (
+	// PanelElement is used for library elements that are of the Panel kind
+	PanelElement LibraryElementKind = iota + 1
+	// VariableElement is used for library elements that are of the Variable kind
+	VariableElement
+)
+
+const LibraryElementConnectionTableName = "library_element_connection"
diff --git a/pkg/models/stats.go b/pkg/models/stats.go
index 640eb535d48..4387f6e86e7 100644
--- a/pkg/models/stats.go
+++ b/pkg/models/stats.go
@@ -19,6 +19,8 @@ type SystemStats struct {
 	DashboardVersions     int64
 	Annotations           int64
 	AlertRules            int64
+	LibraryPanels         int64
+	LibraryVariables      int64
 
 	Admins         int
 	Editors        int
diff --git a/pkg/services/libraryelements/database.go b/pkg/services/libraryelements/database.go
index fa377f029c5..9a12d6c5780 100644
--- a/pkg/services/libraryelements/database.go
+++ b/pkg/services/libraryelements/database.go
@@ -22,7 +22,7 @@ SELECT DISTINCT
 	, u1.email AS created_by_email
 	, u2.login AS updated_by_name
 	, u2.email AS updated_by_email
-	, (SELECT COUNT(connection_id) FROM ` + connectionTableName + ` WHERE element_id = le.id AND kind=1) AS connected_dashboards`
+	, (SELECT COUNT(connection_id) FROM ` + models.LibraryElementConnectionTableName + ` WHERE element_id = le.id AND kind=1) AS connected_dashboards`
 )
 
 func getFromLibraryElementDTOWithMeta(dialect migrator.Dialect) string {
@@ -41,9 +41,9 @@ func syncFieldsWithModel(libraryElement *LibraryElement) error {
 		return err
 	}
 
-	if LibraryElementKind(libraryElement.Kind) == Panel {
+	if models.LibraryElementKind(libraryElement.Kind) == models.PanelElement {
 		model["title"] = libraryElement.Name
-	} else if LibraryElementKind(libraryElement.Kind) == Variable {
+	} else if models.LibraryElementKind(libraryElement.Kind) == models.VariableElement {
 		model["name"] = libraryElement.Name
 	}
 	if model["type"] != nil {
@@ -520,7 +520,7 @@ func (l *LibraryElementService) getConnections(c *models.ReqContext, uid string)
 		var libraryElementConnections []libraryElementConnectionWithMeta
 		builder := sqlstore.SQLBuilder{}
 		builder.Write("SELECT lec.*, u1.login AS created_by_name, u1.email AS created_by_email")
-		builder.Write(" FROM " + connectionTableName + " AS lec")
+		builder.Write(" FROM " + models.LibraryElementConnectionTableName + " AS lec")
 		builder.Write(" LEFT JOIN " + l.SQLStore.Dialect.Quote("user") + " AS u1 ON lec.created_by = u1.id")
 		builder.Write(" INNER JOIN dashboard AS dashboard on lec.connection_id = dashboard.id")
 		builder.Write(` WHERE lec.element_id=?`, element.ID)
@@ -562,7 +562,7 @@ func (l *LibraryElementService) getElementsForDashboardID(c *models.ReqContext,
 			", coalesce(dashboard.uid, '') AS folder_uid" +
 			getFromLibraryElementDTOWithMeta(l.SQLStore.Dialect) +
 			" LEFT JOIN dashboard AS dashboard ON dashboard.id = le.folder_id" +
-			" INNER JOIN " + connectionTableName + " AS lce ON lce.element_id = le.id AND lce.kind=1 AND lce.connection_id=?"
+			" INNER JOIN " + models.LibraryElementConnectionTableName + " AS lce ON lce.element_id = le.id AND lce.kind=1 AND lce.connection_id=?"
 		sess := session.SQL(sql, dashboardID)
 		err := sess.Find(&libraryElements)
 		if err != nil {
@@ -610,7 +610,7 @@ func (l *LibraryElementService) getElementsForDashboardID(c *models.ReqContext,
 // connectElementsToDashboardID adds connections for all elements Library Elements in a Dashboard.
 func (l *LibraryElementService) connectElementsToDashboardID(c *models.ReqContext, elementUIDs []string, dashboardID int64) error {
 	err := l.SQLStore.WithTransactionalDbSession(c.Context.Req.Context(), func(session *sqlstore.DBSession) error {
-		_, err := session.Exec("DELETE FROM "+connectionTableName+" WHERE kind=1 AND connection_id=?", dashboardID)
+		_, err := session.Exec("DELETE FROM "+models.LibraryElementConnectionTableName+" WHERE kind=1 AND connection_id=?", dashboardID)
 		if err != nil {
 			return err
 		}
@@ -646,7 +646,7 @@ func (l *LibraryElementService) connectElementsToDashboardID(c *models.ReqContex
 // disconnectElementsFromDashboardID deletes connections for all Library Elements in a Dashboard.
 func (l *LibraryElementService) disconnectElementsFromDashboardID(c *models.ReqContext, dashboardID int64) error {
 	return l.SQLStore.WithTransactionalDbSession(c.Context.Req.Context(), func(session *sqlstore.DBSession) error {
-		_, err := session.Exec("DELETE FROM "+connectionTableName+" WHERE kind=1 AND connection_id=?", dashboardID)
+		_, err := session.Exec("DELETE FROM "+models.LibraryElementConnectionTableName+" WHERE kind=1 AND connection_id=?", dashboardID)
 		if err != nil {
 			return err
 		}
@@ -676,7 +676,7 @@ func (l *LibraryElementService) deleteLibraryElementsInFolderUID(c *models.ReqCo
 			ConnectionID int64 `xorm:"connection_id"`
 		}
 		sql := "SELECT lec.connection_id FROM library_element AS le"
-		sql += " INNER JOIN " + connectionTableName + " AS lec on le.id = lec.element_id"
+		sql += " INNER JOIN " + models.LibraryElementConnectionTableName + " AS lec on le.id = lec.element_id"
 		sql += " WHERE le.folder_id=? AND le.org_id=?"
 		err = session.SQL(sql, folderID, c.SignedInUser.OrgId).Find(&connectionIDs)
 		if err != nil {
@@ -694,7 +694,7 @@ func (l *LibraryElementService) deleteLibraryElementsInFolderUID(c *models.ReqCo
 			return err
 		}
 		for _, elementID := range elementIDs {
-			_, err := session.Exec("DELETE FROM "+connectionTableName+" WHERE element_id=?", elementID.ID)
+			_, err := session.Exec("DELETE FROM "+models.LibraryElementConnectionTableName+" WHERE element_id=?", elementID.ID)
 			if err != nil {
 				return err
 			}
diff --git a/pkg/services/libraryelements/guard.go b/pkg/services/libraryelements/guard.go
index c5d41295c0c..980eb6cb3f7 100644
--- a/pkg/services/libraryelements/guard.go
+++ b/pkg/services/libraryelements/guard.go
@@ -11,11 +11,11 @@ func isGeneralFolder(folderID int64) bool {
 }
 
 func (l *LibraryElementService) requireSupportedElementKind(kindAsInt int64) error {
-	kind := LibraryElementKind(kindAsInt)
+	kind := models.LibraryElementKind(kindAsInt)
 	switch kind {
-	case Panel:
+	case models.PanelElement:
 		return nil
-	case Variable:
+	case models.VariableElement:
 		return nil
 	default:
 		return errLibraryElementUnSupportedElementKind
diff --git a/pkg/services/libraryelements/libraryelements.go b/pkg/services/libraryelements/libraryelements.go
index 3fc2eafb194..3fff1d6364c 100644
--- a/pkg/services/libraryelements/libraryelements.go
+++ b/pkg/services/libraryelements/libraryelements.go
@@ -6,7 +6,6 @@ import (
 	"github.com/grafana/grafana/pkg/models"
 	"github.com/grafana/grafana/pkg/registry"
 	"github.com/grafana/grafana/pkg/services/sqlstore"
-	"github.com/grafana/grafana/pkg/services/sqlstore/migrator"
 	"github.com/grafana/grafana/pkg/setting"
 )
 
@@ -27,8 +26,6 @@ type LibraryElementService struct {
 	log           log.Logger
 }
 
-const connectionTableName = "library_element_connection"
-
 func init() {
 	registry.RegisterService(&LibraryElementService{})
 }
@@ -66,51 +63,3 @@ func (l *LibraryElementService) DisconnectElementsFromDashboard(c *models.ReqCon
 func (l *LibraryElementService) DeleteLibraryElementsInFolder(c *models.ReqContext, folderUID string) error {
 	return l.deleteLibraryElementsInFolderUID(c, folderUID)
 }
-
-// AddMigration defines database migrations.
-// If Panel Library is not enabled does nothing.
-func (l *LibraryElementService) AddMigration(mg *migrator.Migrator) {
-	libraryElementsV1 := migrator.Table{
-		Name: "library_element",
-		Columns: []*migrator.Column{
-			{Name: "id", Type: migrator.DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true},
-			{Name: "org_id", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "folder_id", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "uid", Type: migrator.DB_NVarchar, Length: 40, Nullable: false},
-			{Name: "name", Type: migrator.DB_NVarchar, Length: 150, Nullable: false},
-			{Name: "kind", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "type", Type: migrator.DB_NVarchar, Length: 40, Nullable: false},
-			{Name: "description", Type: migrator.DB_NVarchar, Length: 255, Nullable: false},
-			{Name: "model", Type: migrator.DB_Text, Nullable: false},
-			{Name: "created", Type: migrator.DB_DateTime, Nullable: false},
-			{Name: "created_by", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "updated", Type: migrator.DB_DateTime, Nullable: false},
-			{Name: "updated_by", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "version", Type: migrator.DB_BigInt, Nullable: false},
-		},
-		Indices: []*migrator.Index{
-			{Cols: []string{"org_id", "folder_id", "name", "kind"}, Type: migrator.UniqueIndex},
-		},
-	}
-
-	mg.AddMigration("create library_element table v1", migrator.NewAddTableMigration(libraryElementsV1))
-	mg.AddMigration("add index library_element org_id-folder_id-name-kind", migrator.NewAddIndexMigration(libraryElementsV1, libraryElementsV1.Indices[0]))
-
-	libraryElementConnectionV1 := migrator.Table{
-		Name: connectionTableName,
-		Columns: []*migrator.Column{
-			{Name: "id", Type: migrator.DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true},
-			{Name: "element_id", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "kind", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "connection_id", Type: migrator.DB_BigInt, Nullable: false},
-			{Name: "created", Type: migrator.DB_DateTime, Nullable: false},
-			{Name: "created_by", Type: migrator.DB_BigInt, Nullable: false},
-		},
-		Indices: []*migrator.Index{
-			{Cols: []string{"element_id", "kind", "connection_id"}, Type: migrator.UniqueIndex},
-		},
-	}
-
-	mg.AddMigration("create "+connectionTableName+" table v1", migrator.NewAddTableMigration(libraryElementConnectionV1))
-	mg.AddMigration("add index "+connectionTableName+" element_id-kind-connection_id", migrator.NewAddIndexMigration(libraryElementConnectionV1, libraryElementConnectionV1.Indices[0]))
-}
diff --git a/pkg/services/libraryelements/libraryelements_create_test.go b/pkg/services/libraryelements/libraryelements_create_test.go
index 1dce51efe0a..e200c471be0 100644
--- a/pkg/services/libraryelements/libraryelements_create_test.go
+++ b/pkg/services/libraryelements/libraryelements_create_test.go
@@ -5,6 +5,8 @@ import (
 
 	"github.com/google/go-cmp/cmp"
 	"github.com/stretchr/testify/require"
+
+	"github.com/grafana/grafana/pkg/models"
 )
 
 func TestCreateLibraryElement(t *testing.T) {
@@ -24,7 +26,7 @@ func TestCreateLibraryElement(t *testing.T) {
 					FolderID:    1,
 					UID:         sc.initialResult.Result.UID,
 					Name:        "Text - Library Panel",
-					Kind:        int64(Panel),
+					Kind:        int64(models.PanelElement),
 					Type:        "text",
 					Description: "A description",
 					Model: map[string]interface{}{
@@ -69,7 +71,7 @@ func TestCreateLibraryElement(t *testing.T) {
 					FolderID:    1,
 					UID:         result.Result.UID,
 					Name:        "Library Panel Name",
-					Kind:        int64(Panel),
+					Kind:        int64(models.PanelElement),
 					Type:        "text",
 					Description: "A description",
 					Model: map[string]interface{}{
diff --git a/pkg/services/libraryelements/libraryelements_get_all_test.go b/pkg/services/libraryelements/libraryelements_get_all_test.go
index a20740f0c49..2358b18a21c 100644
--- a/pkg/services/libraryelements/libraryelements_get_all_test.go
+++ b/pkg/services/libraryelements/libraryelements_get_all_test.go
@@ -42,7 +42,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 			err := sc.reqContext.Req.ParseForm()
 			require.NoError(t, err)
-			sc.reqContext.Req.Form.Add("kind", strconv.FormatInt(int64(Panel), 10))
+			sc.reqContext.Req.Form.Add("kind", strconv.FormatInt(int64(models.PanelElement), 10))
 
 			resp = sc.service.getAllHandler(sc.reqContext)
 			require.Equal(t, 200, resp.Status())
@@ -62,7 +62,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -107,7 +107,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 			err := sc.reqContext.Req.ParseForm()
 			require.NoError(t, err)
-			sc.reqContext.Req.Form.Add("kind", strconv.FormatInt(int64(Variable), 10))
+			sc.reqContext.Req.Form.Add("kind", strconv.FormatInt(int64(models.VariableElement), 10))
 
 			resp = sc.service.getAllHandler(sc.reqContext)
 			require.Equal(t, 200, resp.Status())
@@ -127,7 +127,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "query0",
-							Kind:        int64(Variable),
+							Kind:        int64(models.VariableElement),
 							Type:        "query",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -187,7 +187,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -222,7 +222,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[1].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -286,7 +286,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -321,7 +321,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[1].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -360,7 +360,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 	scenarioWithPanel(t, "When an admin tries to get all library panels and two exist and typeFilter is set to existing types, it should succeed and the result should be correct",
 		func(t *testing.T, sc scenarioContext) {
-			command := getCreateCommandWithModel(sc.folder.Id, "Gauge - Library Panel", Panel, []byte(`
+			command := getCreateCommandWithModel(sc.folder.Id, "Gauge - Library Panel", models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -372,7 +372,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 			resp := sc.service.createHandler(sc.reqContext, command)
 			require.Equal(t, 200, resp.Status())
 
-			command = getCreateCommandWithModel(sc.folder.Id, "BarGauge - Library Panel", Panel, []byte(`
+			command = getCreateCommandWithModel(sc.folder.Id, "BarGauge - Library Panel", models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -405,7 +405,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "BarGauge - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "bargauge",
 							Description: "BarGauge description",
 							Model: map[string]interface{}{
@@ -440,7 +440,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[1].UID,
 							Name:        "Gauge - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "gauge",
 							Description: "Gauge description",
 							Model: map[string]interface{}{
@@ -479,7 +479,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 	scenarioWithPanel(t, "When an admin tries to get all library panels and two exist and typeFilter is set to a nonexistent type, it should succeed and the result should be correct",
 		func(t *testing.T, sc scenarioContext) {
-			command := getCreateCommandWithModel(sc.folder.Id, "Gauge - Library Panel", Panel, []byte(`
+			command := getCreateCommandWithModel(sc.folder.Id, "Gauge - Library Panel", models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -542,7 +542,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    newFolder.Id,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -637,7 +637,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -672,7 +672,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[1].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -736,7 +736,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -800,7 +800,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -865,7 +865,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -904,7 +904,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 	scenarioWithPanel(t, "When an admin tries to get all library panels and two exist and searchString exists in the description, it should succeed and the result should be correct",
 		func(t *testing.T, sc scenarioContext) {
-			command := getCreateCommandWithModel(sc.folder.Id, "Text - Library Panel2", Panel, []byte(`
+			command := getCreateCommandWithModel(sc.folder.Id, "Text - Library Panel2", models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -939,7 +939,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -978,7 +978,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 
 	scenarioWithPanel(t, "When an admin tries to get all library panels and two exist and searchString exists in both name and description, it should succeed and the result should be correct",
 		func(t *testing.T, sc scenarioContext) {
-			command := getCreateCommandWithModel(sc.folder.Id, "Some Other", Panel, []byte(`
+			command := getCreateCommandWithModel(sc.folder.Id, "Some Other", models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -1011,7 +1011,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Some Other",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A Library Panel",
 							Model: map[string]interface{}{
@@ -1046,7 +1046,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[1].UID,
 							Name:        "Text - Library Panel",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
@@ -1112,7 +1112,7 @@ func TestGetAllLibraryElements(t *testing.T) {
 							FolderID:    1,
 							UID:         result.Result.Elements[0].UID,
 							Name:        "Text - Library Panel2",
-							Kind:        int64(Panel),
+							Kind:        int64(models.PanelElement),
 							Type:        "text",
 							Description: "A description",
 							Model: map[string]interface{}{
diff --git a/pkg/services/libraryelements/libraryelements_get_test.go b/pkg/services/libraryelements/libraryelements_get_test.go
index 4f0218dceff..34e5d58bd1c 100644
--- a/pkg/services/libraryelements/libraryelements_get_test.go
+++ b/pkg/services/libraryelements/libraryelements_get_test.go
@@ -35,7 +35,7 @@ func TestGetLibraryElement(t *testing.T) {
 						FolderID:    1,
 						UID:         res.Result.UID,
 						Name:        "Text - Library Panel",
-						Kind:        int64(Panel),
+						Kind:        int64(models.PanelElement),
 						Type:        "text",
 						Description: "A description",
 						Model: map[string]interface{}{
@@ -130,7 +130,7 @@ func TestGetLibraryElement(t *testing.T) {
 						FolderID:    1,
 						UID:         res.Result.UID,
 						Name:        "Text - Library Panel",
-						Kind:        int64(Panel),
+						Kind:        int64(models.PanelElement),
 						Type:        "text",
 						Description: "A description",
 						Model: map[string]interface{}{
diff --git a/pkg/services/libraryelements/libraryelements_patch_test.go b/pkg/services/libraryelements/libraryelements_patch_test.go
index 7af2290db0e..2bda2b43019 100644
--- a/pkg/services/libraryelements/libraryelements_patch_test.go
+++ b/pkg/services/libraryelements/libraryelements_patch_test.go
@@ -5,12 +5,14 @@ import (
 
 	"github.com/google/go-cmp/cmp"
 	"github.com/stretchr/testify/require"
+
+	"github.com/grafana/grafana/pkg/models"
 )
 
 func TestPatchLibraryElement(t *testing.T) {
 	scenarioWithPanel(t, "When an admin tries to patch a library panel that does not exist, it should fail",
 		func(t *testing.T, sc scenarioContext) {
-			cmd := patchLibraryElementCommand{Kind: int64(Panel)}
+			cmd := patchLibraryElementCommand{Kind: int64(models.PanelElement)}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": "unknown"})
 			resp := sc.service.patchHandler(sc.reqContext, cmd)
 			require.Equal(t, 404, resp.Status())
@@ -31,7 +33,7 @@ func TestPatchLibraryElement(t *testing.T) {
 								  "type": "graph"
 								}
 							`),
-				Kind:    int64(Panel),
+				Kind:    int64(models.PanelElement),
 				Version: 1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -45,7 +47,7 @@ func TestPatchLibraryElement(t *testing.T) {
 					FolderID:    newFolder.Id,
 					UID:         sc.initialResult.Result.UID,
 					Name:        "Panel - New name",
-					Kind:        int64(Panel),
+					Kind:        int64(models.PanelElement),
 					Type:        "graph",
 					Description: "An updated description",
 					Model: map[string]interface{}{
@@ -83,7 +85,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			newFolder := createFolderWithACL(t, sc.sqlStore, "NewFolder", sc.user, []folderACLItem{})
 			cmd := patchLibraryElementCommand{
 				FolderID: newFolder.Id,
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 				Version:  1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -104,7 +106,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: -1,
 				Name:     "New Name",
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 				Version:  1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -125,7 +127,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: -1,
 				Model:    []byte(`{ "title": "New Model Title", "name": "New Model Name", "type":"graph", "description": "New description" }`),
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 				Version:  1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -152,7 +154,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: -1,
 				Model:    []byte(`{ "description": "New description" }`),
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 				Version:  1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -178,7 +180,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: -1,
 				Model:    []byte(`{ "type": "graph" }`),
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 				Version:  1,
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -201,7 +203,7 @@ func TestPatchLibraryElement(t *testing.T) {
 
 	scenarioWithPanel(t, "When another admin tries to patch a library panel, it should change UpdatedBy successfully and return correct result",
 		func(t *testing.T, sc scenarioContext) {
-			cmd := patchLibraryElementCommand{FolderID: -1, Version: 1, Kind: int64(Panel)}
+			cmd := patchLibraryElementCommand{FolderID: -1, Version: 1, Kind: int64(models.PanelElement)}
 			sc.reqContext.UserId = 2
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
 			resp := sc.service.patchHandler(sc.reqContext, cmd)
@@ -223,7 +225,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				Name:    "Text - Library Panel",
 				Version: 1,
-				Kind:    int64(Panel),
+				Kind:    int64(models.PanelElement),
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 			resp = sc.service.patchHandler(sc.reqContext, cmd)
@@ -239,7 +241,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: 1,
 				Version:  1,
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 			resp = sc.service.patchHandler(sc.reqContext, cmd)
@@ -251,7 +253,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: sc.folder.Id,
 				Version:  1,
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 			}
 			sc.reqContext.OrgId = 2
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
@@ -264,7 +266,7 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: sc.folder.Id,
 				Version:  1,
-				Kind:     int64(Panel),
+				Kind:     int64(models.PanelElement),
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
 			resp := sc.service.patchHandler(sc.reqContext, cmd)
@@ -278,14 +280,14 @@ func TestPatchLibraryElement(t *testing.T) {
 			cmd := patchLibraryElementCommand{
 				FolderID: sc.folder.Id,
 				Version:  1,
-				Kind:     int64(Variable),
+				Kind:     int64(models.VariableElement),
 			}
 			sc.reqContext.ReplaceAllParams(map[string]string{":uid": sc.initialResult.Result.UID})
 			resp := sc.service.patchHandler(sc.reqContext, cmd)
 			require.Equal(t, 200, resp.Status())
 			var result = validateAndUnMarshalResponse(t, resp)
 			sc.initialResult.Result.Type = "text"
-			sc.initialResult.Result.Kind = int64(Panel)
+			sc.initialResult.Result.Kind = int64(models.PanelElement)
 			sc.initialResult.Result.Description = "A description"
 			sc.initialResult.Result.Model = map[string]interface{}{
 				"datasource":  "${DS_GDEV-TESTDATA}",
diff --git a/pkg/services/libraryelements/libraryelements_permissions_test.go b/pkg/services/libraryelements/libraryelements_permissions_test.go
index 3a2ca821d69..045d41f49ee 100644
--- a/pkg/services/libraryelements/libraryelements_permissions_test.go
+++ b/pkg/services/libraryelements/libraryelements_permissions_test.go
@@ -84,7 +84,7 @@ func TestLibraryElementPermissions(t *testing.T) {
 				toFolder := createFolderWithACL(t, sc.sqlStore, "Folder", sc.user, testCase.items)
 				sc.reqContext.SignedInUser.OrgRole = testCase.role
 
-				cmd := patchLibraryElementCommand{FolderID: toFolder.Id, Version: 1, Kind: int64(Panel)}
+				cmd := patchLibraryElementCommand{FolderID: toFolder.Id, Version: 1, Kind: int64(models.PanelElement)}
 				sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 				resp = sc.service.patchHandler(sc.reqContext, cmd)
 				require.Equal(t, testCase.status, resp.Status())
@@ -99,7 +99,7 @@ func TestLibraryElementPermissions(t *testing.T) {
 				toFolder := createFolderWithACL(t, sc.sqlStore, "Folder", sc.user, everyonePermissions)
 				sc.reqContext.SignedInUser.OrgRole = testCase.role
 
-				cmd := patchLibraryElementCommand{FolderID: toFolder.Id, Version: 1, Kind: int64(Panel)}
+				cmd := patchLibraryElementCommand{FolderID: toFolder.Id, Version: 1, Kind: int64(models.PanelElement)}
 				sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 				resp = sc.service.patchHandler(sc.reqContext, cmd)
 				require.Equal(t, testCase.status, resp.Status())
@@ -146,7 +146,7 @@ func TestLibraryElementPermissions(t *testing.T) {
 				result := validateAndUnMarshalResponse(t, resp)
 				sc.reqContext.SignedInUser.OrgRole = testCase.role
 
-				cmd := patchLibraryElementCommand{FolderID: 0, Version: 1, Kind: int64(Panel)}
+				cmd := patchLibraryElementCommand{FolderID: 0, Version: 1, Kind: int64(models.PanelElement)}
 				sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 				resp = sc.service.patchHandler(sc.reqContext, cmd)
 				require.Equal(t, testCase.status, resp.Status())
@@ -160,7 +160,7 @@ func TestLibraryElementPermissions(t *testing.T) {
 				result := validateAndUnMarshalResponse(t, resp)
 				sc.reqContext.SignedInUser.OrgRole = testCase.role
 
-				cmd := patchLibraryElementCommand{FolderID: folder.Id, Version: 1, Kind: int64(Panel)}
+				cmd := patchLibraryElementCommand{FolderID: folder.Id, Version: 1, Kind: int64(models.PanelElement)}
 				sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 				resp = sc.service.patchHandler(sc.reqContext, cmd)
 				require.Equal(t, testCase.status, resp.Status())
@@ -205,7 +205,7 @@ func TestLibraryElementPermissions(t *testing.T) {
 				result := validateAndUnMarshalResponse(t, resp)
 				sc.reqContext.SignedInUser.OrgRole = testCase.role
 
-				cmd := patchLibraryElementCommand{FolderID: -100, Version: 1, Kind: int64(Panel)}
+				cmd := patchLibraryElementCommand{FolderID: -100, Version: 1, Kind: int64(models.PanelElement)}
 				sc.reqContext.ReplaceAllParams(map[string]string{":uid": result.Result.UID})
 				resp = sc.service.patchHandler(sc.reqContext, cmd)
 				require.Equal(t, 404, resp.Status())
diff --git a/pkg/services/libraryelements/libraryelements_test.go b/pkg/services/libraryelements/libraryelements_test.go
index 7cc9b854ae1..232dfaffe47 100644
--- a/pkg/services/libraryelements/libraryelements_test.go
+++ b/pkg/services/libraryelements/libraryelements_test.go
@@ -126,7 +126,7 @@ type libraryElementsSearchResult struct {
 }
 
 func getCreatePanelCommand(folderID int64, name string) CreateLibraryElementCommand {
-	command := getCreateCommandWithModel(folderID, name, Panel, []byte(`
+	command := getCreateCommandWithModel(folderID, name, models.PanelElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "id": 1,
@@ -140,7 +140,7 @@ func getCreatePanelCommand(folderID int64, name string) CreateLibraryElementComm
 }
 
 func getCreateVariableCommand(folderID int64, name string) CreateLibraryElementCommand {
-	command := getCreateCommandWithModel(folderID, name, Variable, []byte(`
+	command := getCreateCommandWithModel(folderID, name, models.VariableElement, []byte(`
 			{
 			  "datasource": "${DS_GDEV-TESTDATA}",
 			  "name": "query0",
@@ -152,7 +152,7 @@ func getCreateVariableCommand(folderID int64, name string) CreateLibraryElementC
 	return command
 }
 
-func getCreateCommandWithModel(folderID int64, name string, kind LibraryElementKind, model []byte) CreateLibraryElementCommand {
+func getCreateCommandWithModel(folderID int64, name string, kind models.LibraryElementKind, model []byte) CreateLibraryElementCommand {
 	command := CreateLibraryElementCommand{
 		FolderID: folderID,
 		Name:     name,
diff --git a/pkg/services/libraryelements/models.go b/pkg/services/libraryelements/models.go
index 6dbe926e21c..fb0670c3992 100644
--- a/pkg/services/libraryelements/models.go
+++ b/pkg/services/libraryelements/models.go
@@ -6,13 +6,6 @@ import (
 	"time"
 )
 
-type LibraryElementKind int
-
-const (
-	Panel LibraryElementKind = iota + 1
-	Variable
-)
-
 type LibraryConnectionKind int
 
 const (
diff --git a/pkg/services/libraryelements/writers.go b/pkg/services/libraryelements/writers.go
index f8dcd52bcdf..d935fbe8b26 100644
--- a/pkg/services/libraryelements/writers.go
+++ b/pkg/services/libraryelements/writers.go
@@ -5,6 +5,7 @@ import (
 	"strconv"
 	"strings"
 
+	"github.com/grafana/grafana/pkg/models"
 	"github.com/grafana/grafana/pkg/services/sqlstore"
 )
 
@@ -38,7 +39,7 @@ func writePerPageSQL(query searchLibraryElementsQuery, sqlStore *sqlstore.SQLSto
 }
 
 func writeKindSQL(query searchLibraryElementsQuery, builder *sqlstore.SQLBuilder) {
-	if LibraryElementKind(query.kind) == Panel || LibraryElementKind(query.kind) == Variable {
+	if models.LibraryElementKind(query.kind) == models.PanelElement || models.LibraryElementKind(query.kind) == models.VariableElement {
 		builder.Write(" AND le.kind = ?", query.kind)
 	}
 }
diff --git a/pkg/services/librarypanels/librarypanels.go b/pkg/services/librarypanels/librarypanels.go
index 10a8dd9378f..90daff312a0 100644
--- a/pkg/services/librarypanels/librarypanels.go
+++ b/pkg/services/librarypanels/librarypanels.go
@@ -76,7 +76,7 @@ func (lps *LibraryPanelService) LoadLibraryPanelsForDashboard(c *models.ReqConte
 			continue
 		}
 
-		if libraryelements.LibraryElementKind(elementInDB.Kind) != libraryelements.Panel {
+		if models.LibraryElementKind(elementInDB.Kind) != models.PanelElement {
 			continue
 		}
 
diff --git a/pkg/services/librarypanels/librarypanels_test.go b/pkg/services/librarypanels/librarypanels_test.go
index 7ee014d4a34..2972a71ac93 100644
--- a/pkg/services/librarypanels/librarypanels_test.go
+++ b/pkg/services/librarypanels/librarypanels_test.go
@@ -493,7 +493,7 @@ func TestConnectLibraryPanelsForDashboard(t *testing.T) {
 			  "description": "Unused description"
 			}
 		`),
-				Kind: int64(libraryelements.Panel),
+				Kind: int64(models.PanelElement),
 			})
 			require.NoError(t, err)
 			dashJSON := map[string]interface{}{
@@ -783,7 +783,7 @@ func scenarioWithLibraryPanel(t *testing.T, desc string, fn func(t *testing.T, s
 			  "description": "A description"
 			}
 		`),
-			Kind: int64(libraryelements.Panel),
+			Kind: int64(models.PanelElement),
 		}
 		resp, err := sc.elementService.CreateElement(sc.reqContext, command)
 		require.NoError(t, err)
diff --git a/pkg/services/sqlstore/migrations/libraryelements.go b/pkg/services/sqlstore/migrations/libraryelements.go
new file mode 100644
index 00000000000..099e204fc1e
--- /dev/null
+++ b/pkg/services/sqlstore/migrations/libraryelements.go
@@ -0,0 +1,53 @@
+package migrations
+
+import (
+	"github.com/grafana/grafana/pkg/models"
+	"github.com/grafana/grafana/pkg/services/sqlstore/migrator"
+)
+
+// addLibraryElementsMigrations defines database migrations for library elements.
+func addLibraryElementsMigrations(mg *migrator.Migrator) {
+	libraryElementsV1 := migrator.Table{
+		Name: "library_element",
+		Columns: []*migrator.Column{
+			{Name: "id", Type: migrator.DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true},
+			{Name: "org_id", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "folder_id", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "uid", Type: migrator.DB_NVarchar, Length: 40, Nullable: false},
+			{Name: "name", Type: migrator.DB_NVarchar, Length: 150, Nullable: false},
+			{Name: "kind", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "type", Type: migrator.DB_NVarchar, Length: 40, Nullable: false},
+			{Name: "description", Type: migrator.DB_NVarchar, Length: 255, Nullable: false},
+			{Name: "model", Type: migrator.DB_Text, Nullable: false},
+			{Name: "created", Type: migrator.DB_DateTime, Nullable: false},
+			{Name: "created_by", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "updated", Type: migrator.DB_DateTime, Nullable: false},
+			{Name: "updated_by", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "version", Type: migrator.DB_BigInt, Nullable: false},
+		},
+		Indices: []*migrator.Index{
+			{Cols: []string{"org_id", "folder_id", "name", "kind"}, Type: migrator.UniqueIndex},
+		},
+	}
+
+	mg.AddMigration("create library_element table v1", migrator.NewAddTableMigration(libraryElementsV1))
+	mg.AddMigration("add index library_element org_id-folder_id-name-kind", migrator.NewAddIndexMigration(libraryElementsV1, libraryElementsV1.Indices[0]))
+
+	libraryElementConnectionV1 := migrator.Table{
+		Name: models.LibraryElementConnectionTableName,
+		Columns: []*migrator.Column{
+			{Name: "id", Type: migrator.DB_BigInt, IsPrimaryKey: true, IsAutoIncrement: true},
+			{Name: "element_id", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "kind", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "connection_id", Type: migrator.DB_BigInt, Nullable: false},
+			{Name: "created", Type: migrator.DB_DateTime, Nullable: false},
+			{Name: "created_by", Type: migrator.DB_BigInt, Nullable: false},
+		},
+		Indices: []*migrator.Index{
+			{Cols: []string{"element_id", "kind", "connection_id"}, Type: migrator.UniqueIndex},
+		},
+	}
+
+	mg.AddMigration("create "+models.LibraryElementConnectionTableName+" table v1", migrator.NewAddTableMigration(libraryElementConnectionV1))
+	mg.AddMigration("add index "+models.LibraryElementConnectionTableName+" element_id-kind-connection_id", migrator.NewAddIndexMigration(libraryElementConnectionV1, libraryElementConnectionV1.Indices[0]))
+}
diff --git a/pkg/services/sqlstore/migrations/migrations.go b/pkg/services/sqlstore/migrations/migrations.go
index 30c0afa4295..b57309ef307 100644
--- a/pkg/services/sqlstore/migrations/migrations.go
+++ b/pkg/services/sqlstore/migrations/migrations.go
@@ -40,6 +40,7 @@ func AddMigrations(mg *Migrator) {
 	addShortURLMigrations(mg)
 	ualert.AddTablesMigrations(mg)
 	ualert.AddDashAlertMigration(mg)
+	addLibraryElementsMigrations(mg)
 }
 
 func addMigrationLogMigrations(mg *Migrator) {
diff --git a/pkg/services/sqlstore/stats.go b/pkg/services/sqlstore/stats.go
index b7341ab7d7f..2df3117b0de 100644
--- a/pkg/services/sqlstore/stats.go
+++ b/pkg/services/sqlstore/stats.go
@@ -80,6 +80,8 @@ func GetSystemStats(query *models.GetSystemStatsQuery) error {
 	sb.Write(`(SELECT COUNT(id) FROM ` + dialect.Quote("team") + `) AS teams,`)
 	sb.Write(`(SELECT COUNT(id) FROM ` + dialect.Quote("user_auth_token") + `) AS auth_tokens,`)
 	sb.Write(`(SELECT COUNT(id) FROM ` + dialect.Quote("alert_rule") + `) AS alert_rules,`)
+	sb.Write(`(SELECT COUNT(id) FROM `+dialect.Quote("library_element")+` WHERE kind = ?) AS library_panels,`, models.PanelElement)
+	sb.Write(`(SELECT COUNT(id) FROM `+dialect.Quote("library_element")+` WHERE kind = ?) AS library_variables,`, models.VariableElement)
 
 	sb.Write(roleCounterSQL())
 
diff --git a/pkg/services/sqlstore/stats_test.go b/pkg/services/sqlstore/stats_test.go
index 60f073223fc..4faee99cbdd 100644
--- a/pkg/services/sqlstore/stats_test.go
+++ b/pkg/services/sqlstore/stats_test.go
@@ -24,6 +24,8 @@ func TestStatsDataAccess(t *testing.T) {
 		assert.Equal(t, 0, query.Result.Editors)
 		assert.Equal(t, 0, query.Result.Viewers)
 		assert.Equal(t, 3, query.Result.Admins)
+		assert.Equal(t, int64(0), query.Result.LibraryPanels)
+		assert.Equal(t, int64(0), query.Result.LibraryVariables)
 	})
 
 	t.Run("Get system user count stats should not results in error", func(t *testing.T) {

From 7b17801047ae79e1725639e502bd06fd9171f141 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= <hugo.haggmark@grafana.com>
Date: Mon, 24 May 2021 09:31:34 +0200
Subject: [PATCH 19/43] LibraryPanels: Fixes error when importing plugin
 dashboard (#34557)

---
 pkg/api/dashboard_test.go                     |   4 -
 pkg/api/plugins.go                            |   4 +-
 pkg/plugins/ifaces.go                         |   2 +-
 pkg/plugins/manager/dashboard_import.go       |  10 +-
 pkg/plugins/manager/dashboard_import_test.go  |   3 +-
 pkg/plugins/plugindashboards/service.go       |   2 +-
 pkg/services/librarypanels/librarypanels.go   |   9 --
 .../librarypanels/librarypanels_test.go       | 100 ------------------
 8 files changed, 11 insertions(+), 123 deletions(-)

diff --git a/pkg/api/dashboard_test.go b/pkg/api/dashboard_test.go
index 45389f4ee92..fd500c617af 100644
--- a/pkg/api/dashboard_test.go
+++ b/pkg/api/dashboard_test.go
@@ -1348,10 +1348,6 @@ func (m *mockLibraryPanelService) ConnectLibraryPanelsForDashboard(c *models.Req
 	return nil
 }
 
-func (m *mockLibraryPanelService) ImportDashboard(c *models.ReqContext, dashboard *simplejson.Json, importedID int64) error {
-	return nil
-}
-
 type mockLibraryElementService struct {
 }
 
diff --git a/pkg/api/plugins.go b/pkg/api/plugins.go
index 761163c2d9d..48e75d4b972 100644
--- a/pkg/api/plugins.go
+++ b/pkg/api/plugins.go
@@ -220,13 +220,13 @@ func (hs *HTTPServer) ImportDashboard(c *models.ReqContext, apiCmd dtos.ImportDa
 		}
 	}
 
-	dashInfo, err := hs.PluginManager.ImportDashboard(apiCmd.PluginId, apiCmd.Path, c.OrgId, apiCmd.FolderId,
+	dashInfo, dash, err := hs.PluginManager.ImportDashboard(apiCmd.PluginId, apiCmd.Path, c.OrgId, apiCmd.FolderId,
 		apiCmd.Dashboard, apiCmd.Overwrite, apiCmd.Inputs, c.SignedInUser, hs.DataService)
 	if err != nil {
 		return hs.dashboardSaveErrorToApiResponse(err)
 	}
 
-	err = hs.LibraryPanelService.ImportDashboard(c, apiCmd.Dashboard, dashInfo.DashboardId)
+	err = hs.LibraryPanelService.ConnectLibraryPanelsForDashboard(c, dash)
 	if err != nil {
 		return response.Error(500, "Error while connecting library panels", err)
 	}
diff --git a/pkg/plugins/ifaces.go b/pkg/plugins/ifaces.go
index ff695a0057f..f9855e3a2e7 100644
--- a/pkg/plugins/ifaces.go
+++ b/pkg/plugins/ifaces.go
@@ -49,7 +49,7 @@ type Manager interface {
 	// ImportDashboard imports a dashboard.
 	ImportDashboard(pluginID, path string, orgID, folderID int64, dashboardModel *simplejson.Json,
 		overwrite bool, inputs []ImportDashboardInput, user *models.SignedInUser,
-		requestHandler DataRequestHandler) (PluginDashboardInfoDTO, error)
+		requestHandler DataRequestHandler) (PluginDashboardInfoDTO, *models.Dashboard, error)
 	// ScanningErrors returns plugin scanning errors encountered.
 	ScanningErrors() []PluginError
 	// LoadPluginDashboard loads a plugin dashboard.
diff --git a/pkg/plugins/manager/dashboard_import.go b/pkg/plugins/manager/dashboard_import.go
index c6debf67021..442ea19484b 100644
--- a/pkg/plugins/manager/dashboard_import.go
+++ b/pkg/plugins/manager/dashboard_import.go
@@ -23,12 +23,12 @@ func (e DashboardInputMissingError) Error() string {
 
 func (pm *PluginManager) ImportDashboard(pluginID, path string, orgID, folderID int64, dashboardModel *simplejson.Json,
 	overwrite bool, inputs []plugins.ImportDashboardInput, user *models.SignedInUser,
-	requestHandler plugins.DataRequestHandler) (plugins.PluginDashboardInfoDTO, error) {
+	requestHandler plugins.DataRequestHandler) (plugins.PluginDashboardInfoDTO, *models.Dashboard, error) {
 	var dashboard *models.Dashboard
 	if pluginID != "" {
 		var err error
 		if dashboard, err = pm.LoadPluginDashboard(pluginID, path); err != nil {
-			return plugins.PluginDashboardInfoDTO{}, err
+			return plugins.PluginDashboardInfoDTO{}, &models.Dashboard{}, err
 		}
 	} else {
 		dashboard = models.NewDashboardFromJson(dashboardModel)
@@ -41,7 +41,7 @@ func (pm *PluginManager) ImportDashboard(pluginID, path string, orgID, folderID
 
 	generatedDash, err := evaluator.Eval()
 	if err != nil {
-		return plugins.PluginDashboardInfoDTO{}, err
+		return plugins.PluginDashboardInfoDTO{}, &models.Dashboard{}, err
 	}
 
 	saveCmd := models.SaveDashboardCommand{
@@ -62,7 +62,7 @@ func (pm *PluginManager) ImportDashboard(pluginID, path string, orgID, folderID
 
 	savedDash, err := dashboards.NewService(pm.SQLStore).ImportDashboard(dto)
 	if err != nil {
-		return plugins.PluginDashboardInfoDTO{}, err
+		return plugins.PluginDashboardInfoDTO{}, &models.Dashboard{}, err
 	}
 
 	return plugins.PluginDashboardInfoDTO{
@@ -77,7 +77,7 @@ func (pm *PluginManager) ImportDashboard(pluginID, path string, orgID, folderID
 		Imported:         true,
 		DashboardId:      savedDash.Id,
 		Slug:             savedDash.Slug,
-	}, nil
+	}, savedDash, nil
 }
 
 type DashTemplateEvaluator struct {
diff --git a/pkg/plugins/manager/dashboard_import_test.go b/pkg/plugins/manager/dashboard_import_test.go
index a9983fe0a48..52f2d120f0d 100644
--- a/pkg/plugins/manager/dashboard_import_test.go
+++ b/pkg/plugins/manager/dashboard_import_test.go
@@ -21,12 +21,13 @@ func TestDashboardImport(t *testing.T) {
 		mock := &dashboards.FakeDashboardService{}
 		dashboards.MockDashboardService(mock)
 
-		info, err := pm.ImportDashboard("test-app", "dashboards/connections.json", 1, 0, nil, false,
+		info, dash, err := pm.ImportDashboard("test-app", "dashboards/connections.json", 1, 0, nil, false,
 			[]plugins.ImportDashboardInput{
 				{Name: "*", Type: "datasource", Value: "graphite"},
 			}, &models.SignedInUser{UserId: 1, OrgRole: models.ROLE_ADMIN}, nil)
 		require.NoError(t, err)
 		require.NotNil(t, info)
+		require.NotNil(t, dash)
 
 		resultStr, err := mock.SavedDashboards[0].Dashboard.Data.EncodePretty()
 		require.NoError(t, err)
diff --git a/pkg/plugins/plugindashboards/service.go b/pkg/plugins/plugindashboards/service.go
index ef8573b14b4..ccbf5a6f704 100644
--- a/pkg/plugins/plugindashboards/service.go
+++ b/pkg/plugins/plugindashboards/service.go
@@ -145,7 +145,7 @@ func (s *Service) autoUpdateAppDashboard(pluginDashInfo *plugins.PluginDashboard
 	s.logger.Info("Auto updating App dashboard", "dashboard", dash.Title, "newRev",
 		pluginDashInfo.Revision, "oldRev", pluginDashInfo.ImportedRevision)
 	user := &models.SignedInUser{UserId: 0, OrgRole: models.ROLE_ADMIN}
-	_, err = s.PluginManager.ImportDashboard(pluginDashInfo.PluginId, pluginDashInfo.Path, orgID, 0, dash.Data, true,
+	_, _, err = s.PluginManager.ImportDashboard(pluginDashInfo.PluginId, pluginDashInfo.Path, orgID, 0, dash.Data, true,
 		nil, user, s.DataService)
 	return err
 }
diff --git a/pkg/services/librarypanels/librarypanels.go b/pkg/services/librarypanels/librarypanels.go
index 90daff312a0..1cbaba1d970 100644
--- a/pkg/services/librarypanels/librarypanels.go
+++ b/pkg/services/librarypanels/librarypanels.go
@@ -18,7 +18,6 @@ type Service interface {
 	LoadLibraryPanelsForDashboard(c *models.ReqContext, dash *models.Dashboard) error
 	CleanLibraryPanelsForDashboard(dash *models.Dashboard) error
 	ConnectLibraryPanelsForDashboard(c *models.ReqContext, dash *models.Dashboard) error
-	ImportDashboard(c *models.ReqContext, dashboard *simplejson.Json, importedID int64) error
 }
 
 // LibraryPanelService is the service for the Panel Library feature.
@@ -193,11 +192,3 @@ func (lps *LibraryPanelService) ConnectLibraryPanelsForDashboard(c *models.ReqCo
 
 	return lps.LibraryElementService.ConnectElementsToDashboard(c, elementUIDs, dash.Id)
 }
-
-// ImportDashboard loops through all panels in dashboard JSON and connects any library panels to the dashboard.
-func (lps *LibraryPanelService) ImportDashboard(c *models.ReqContext, dashboard *simplejson.Json, importedID int64) error {
-	dash := models.NewDashboardFromJson(dashboard)
-	dash.Id = importedID
-
-	return lps.ConnectLibraryPanelsForDashboard(c, dash)
-}
diff --git a/pkg/services/librarypanels/librarypanels_test.go b/pkg/services/librarypanels/librarypanels_test.go
index 2972a71ac93..1ec6da66584 100644
--- a/pkg/services/librarypanels/librarypanels_test.go
+++ b/pkg/services/librarypanels/librarypanels_test.go
@@ -572,106 +572,6 @@ func TestConnectLibraryPanelsForDashboard(t *testing.T) {
 		})
 }
 
-func TestImportDashboard(t *testing.T) {
-	scenarioWithLibraryPanel(t, "When an admin tries to import a dashboard with a library panel, it should connect the two",
-		func(t *testing.T, sc scenarioContext) {
-			importedJSON := map[string]interface{}{
-				"panels": []interface{}{},
-			}
-			importedDashboard := models.Dashboard{
-				Title: "Dummy dash that simulates an imported dash",
-				Data:  simplejson.NewFromAny(importedJSON),
-			}
-			importedDashInDB := createDashboard(t, sc.sqlStore, sc.user, &importedDashboard, sc.folder.Id)
-			elements, err := sc.elementService.GetElementsForDashboard(sc.reqContext, importedDashInDB.Id)
-			require.NoError(t, err)
-			require.Len(t, elements, 0)
-
-			dashJSON := map[string]interface{}{
-				"title": "Testing ImportDashboard",
-				"panels": []interface{}{
-					map[string]interface{}{
-						"id": int64(1),
-						"gridPos": map[string]interface{}{
-							"h": 6,
-							"w": 6,
-							"x": 0,
-							"y": 0,
-						},
-					},
-					map[string]interface{}{
-						"id": int64(2),
-						"gridPos": map[string]interface{}{
-							"h": 6,
-							"w": 6,
-							"x": 6,
-							"y": 0,
-						},
-						"datasource": "${DS_GDEV-TESTDATA}",
-						"libraryPanel": map[string]interface{}{
-							"uid":  sc.initialResult.Result.UID,
-							"name": sc.initialResult.Result.Name,
-						},
-						"title": "Text - Library Panel",
-						"type":  "text",
-					},
-				},
-			}
-			dash := simplejson.NewFromAny(dashJSON)
-			err = sc.service.ImportDashboard(sc.reqContext, dash, importedDashInDB.Id)
-			require.NoError(t, err)
-
-			elements, err = sc.elementService.GetElementsForDashboard(sc.reqContext, importedDashInDB.Id)
-			require.NoError(t, err)
-			require.Len(t, elements, 1)
-			require.Equal(t, sc.initialResult.Result.UID, elements[sc.initialResult.Result.UID].UID)
-		})
-
-	scenarioWithLibraryPanel(t, "When an admin tries to import a dashboard with a library panel without uid, it should fail",
-		func(t *testing.T, sc scenarioContext) {
-			importedJSON := map[string]interface{}{
-				"panels": []interface{}{},
-			}
-			importedDashboard := models.Dashboard{
-				Title: "Dummy dash that simulates an imported dash",
-				Data:  simplejson.NewFromAny(importedJSON),
-			}
-			importedDashInDB := createDashboard(t, sc.sqlStore, sc.user, &importedDashboard, sc.folder.Id)
-
-			dashJSON := map[string]interface{}{
-				"panels": []interface{}{
-					map[string]interface{}{
-						"id": int64(1),
-						"gridPos": map[string]interface{}{
-							"h": 6,
-							"w": 6,
-							"x": 0,
-							"y": 0,
-						},
-					},
-					map[string]interface{}{
-						"id": int64(2),
-						"gridPos": map[string]interface{}{
-							"h": 6,
-							"w": 6,
-							"x": 6,
-							"y": 0,
-						},
-						"datasource": "${DS_GDEV-TESTDATA}",
-						"libraryPanel": map[string]interface{}{
-							"name": sc.initialResult.Result.Name,
-						},
-						"title": "Text - Library Panel",
-						"type":  "text",
-					},
-				},
-			}
-			dash := simplejson.NewFromAny(dashJSON)
-			err := sc.service.ImportDashboard(sc.reqContext, dash, importedDashInDB.Id)
-			require.EqualError(t, err, errLibraryPanelHeaderUIDMissing.Error())
-		})
-}
-
 type libraryPanel struct {
 	ID          int64
 	OrgID       int64

From 68513b9a3fd2e04d2a2f1a1522920cca6b0017fd Mon Sep 17 00:00:00 2001
From: Jack Westbrook <jack.westbrook@gmail.com>
Date: Mon, 24 May 2021 09:55:39 +0200
Subject: [PATCH 20/43] Chore: bump Acorn and Underscore (#34302)

---
 package.json |  3 ++-
 yarn.lock    | 14 +++++++-------
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index c4e6f9e88f4..54b02f8f927 100644
--- a/package.json
+++ b/package.json
@@ -308,7 +308,8 @@
     "whatwg-fetch": "3.1.0"
   },
   "resolutions": {
-    "caniuse-db": "1.0.30000772"
+    "caniuse-db": "1.0.30000772",
+    "underscore": "1.12.1"
   },
   "workspaces": {
     "packages": [
diff --git a/yarn.lock b/yarn.lock
index bcfcbbf38d1..dcb41f6a723 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5639,9 +5639,9 @@ acorn@^3.0.4:
   integrity sha1-ReN/s56No/JbruP/U2niu18iAXo=
 
 acorn@^5.0.0, acorn@^5.5.0:
-  version "5.7.3"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.3.tgz#67aa231bf8812974b85235a96771eb6bd07ea279"
-  integrity sha512-T/zvzYRfbVojPWahDsE5evJdHb3oJoQfFbsrKM7w5Zcs++Tr257tia3BmMP8XYVjp1S9RZXQMh7gao96BlqZOw==
+  version "5.7.4"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.4.tgz#3e8d8a9947d0599a1796d10225d7432f4a4acf5e"
+  integrity sha512-1D++VG7BhrtvQpNbBzovKNc1FLGGEE/oGe7b9xJm/RFHMBeUaUGpluV9RLjZa47YFdPcDAenEYuq9pQPcMdLJg==
 
 acorn@^6.0.1, acorn@^6.0.7, acorn@^6.2.1, acorn@^6.4.1:
   version "6.4.2"
@@ -21802,10 +21802,10 @@ undefsafe@^2.0.2:
   dependencies:
     debug "^2.2.0"
 
-underscore@1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.7.0.tgz#6bbaf0877500d36be34ecaa584e0db9fef035209"
-  integrity sha1-a7rwh3UA02vjTsqlhODbn+8DUgk=
+underscore@1.12.1, underscore@1.7.0:
+  version "1.12.1"
+  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.12.1.tgz#7bb8cc9b3d397e201cf8553336d262544ead829e"
+  integrity sha512-hEQt0+ZLDVUMhebKxL4x1BTtDY7bavVofhZ9KZ4aI26X9SRaE+Y3m83XUL1UP2jn8ynjndwCCpEHdUG+9pP1Tw==
 
 unfetch@^4.2.0:
   version "4.2.0"

From 0c2bb9562a80dc6ece7368b10fac1bb7917ca1ac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A1bor=20Farkas?= <gabor.farkas@gmail.com>
Date: Mon, 24 May 2021 10:25:30 +0200
Subject: [PATCH 21/43] devenv: slow_proxy_mac: make configurable and smaller
 (#34560)

---
 devenv/docker/blocks/slow_proxy_mac/.env        |  2 ++
 devenv/docker/blocks/slow_proxy_mac/Dockerfile  |  9 ++++++---
 .../blocks/slow_proxy_mac/docker-compose.yaml   |  3 ++-
 devenv/docker/blocks/slow_proxy_mac/main.go     | 17 +++++++++++++----
 4 files changed, 23 insertions(+), 8 deletions(-)
 create mode 100644 devenv/docker/blocks/slow_proxy_mac/.env

diff --git a/devenv/docker/blocks/slow_proxy_mac/.env b/devenv/docker/blocks/slow_proxy_mac/.env
new file mode 100644
index 00000000000..74f4e9c1841
--- /dev/null
+++ b/devenv/docker/blocks/slow_proxy_mac/.env
@@ -0,0 +1,2 @@
+ORIGIN_SERVER=http://host.docker.internal:9090/
+SLEEP_DURATION=60s
\ No newline at end of file
diff --git a/devenv/docker/blocks/slow_proxy_mac/Dockerfile b/devenv/docker/blocks/slow_proxy_mac/Dockerfile
index d48c945f5ab..735d433414c 100644
--- a/devenv/docker/blocks/slow_proxy_mac/Dockerfile
+++ b/devenv/docker/blocks/slow_proxy_mac/Dockerfile
@@ -1,7 +1,10 @@
-
-FROM golang:latest
+FROM golang:latest as builder
 ADD main.go /
 WORKDIR /
-RUN GO111MODULE=off go build -o main .
+RUN GO111MODULE=off CGO_ENABLED=0 go build -o main .
+
+FROM scratch
+WORKDIR /
 EXPOSE 3011
+COPY --from=builder /main /main
 ENTRYPOINT ["/main"]
diff --git a/devenv/docker/blocks/slow_proxy_mac/docker-compose.yaml b/devenv/docker/blocks/slow_proxy_mac/docker-compose.yaml
index 47347042df7..135c230c9bc 100644
--- a/devenv/docker/blocks/slow_proxy_mac/docker-compose.yaml
+++ b/devenv/docker/blocks/slow_proxy_mac/docker-compose.yaml
@@ -3,4 +3,5 @@
     ports:
       - '3011:3011'
     environment:
-      ORIGIN_SERVER: 'http://host.docker.internal:9090/'
+      ORIGIN_SERVER: ${ORIGIN_SERVER}
+      SLEEP_DURATION: ${SLEEP_DURATION}
\ No newline at end of file
diff --git a/devenv/docker/blocks/slow_proxy_mac/main.go b/devenv/docker/blocks/slow_proxy_mac/main.go
index dece2525c13..4c98eb9d17c 100644
--- a/devenv/docker/blocks/slow_proxy_mac/main.go
+++ b/devenv/docker/blocks/slow_proxy_mac/main.go
@@ -1,7 +1,6 @@
 package main
 
 import (
-	"fmt"
 	"log"
 	"net/http"
 	"net/http/httputil"
@@ -13,16 +12,26 @@ import (
 func main() {
 	origin := os.Getenv("ORIGIN_SERVER")
 	if origin == "" {
-		origin = "http://host.docker.internal:9090/"
+		// it is never not-set, the default is in the `.env` file
+		log.Fatalf("missing env-variable ORIGIN_SERVER")
 	}
 
-	sleep := time.Minute
+	sleepDurationStr := os.Getenv("SLEEP_DURATION")
+	if sleepDurationStr == "" {
+		// it is never not-set, the default is in the `.env` file
+		log.Fatalf("missing env-variable SLEEP_DURATION")
+	}
+
+	sleep, err := time.ParseDuration(sleepDurationStr)
+	if err != nil {
+		log.Fatalf("failed to parse SLEEP_DURATION: %v", err)
+	}
 
 	originURL, _ := url.Parse(origin)
 	proxy := httputil.NewSingleHostReverseProxy(originURL)
 
 	http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
-		fmt.Printf("sleeping for %s then proxying request: %s", sleep.String(), r.RequestURI)
+		log.Printf("sleeping for %s then proxying request: url '%s', headers: '%v'", sleep.String(), r.RequestURI, r.Header)
 		<-time.After(sleep)
 		proxy.ServeHTTP(w, r)
 	})

From 8d05df83edc4ed2570ce36585c9554ec9ac08eea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Jamr=C3=B3z?= <pm.jamroz@gmail.com>
Date: Mon, 24 May 2021 10:34:37 +0200
Subject: [PATCH 22/43] CustomScrollbar: Invoke setScrollTop callback only
 after scrolling finishes (#34263)

* Invoke setScrollTop callback only after scrolling finishes

When the state is updated while scroll events are being dispatched (like in QueryGroup) it may cause resetting the scroll position to the first emitted event because setting the scroll happens only after render (useEffect).

* Memoize onScrollStop callback
---
 .../CustomScrollbar/CustomScrollbar.tsx          | 12 +++++++++---
 packages/grafana-ui/src/components/index.ts      |  2 +-
 .../dashboard/containers/DashboardPage.tsx       |  9 ++++-----
 .../app/features/query/components/QueryGroup.tsx | 16 ++++++++++++----
 4 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx
index 15f23febba1..412ad8d9ff0 100644
--- a/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx
+++ b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx
@@ -2,10 +2,12 @@ import React, { FC, useCallback, useEffect, useRef } from 'react';
 import { isNil } from 'lodash';
 import classNames from 'classnames';
 import { css } from '@emotion/css';
-import Scrollbars from 'react-custom-scrollbars';
+import Scrollbars, { positionValues } from 'react-custom-scrollbars';
 import { useStyles2 } from '../../themes';
 import { GrafanaTheme2 } from '@grafana/data';
 
+export type ScrollbarPosition = positionValues;
+
 interface Props {
   className?: string;
   autoHide?: boolean;
@@ -15,7 +17,7 @@ interface Props {
   hideHorizontalTrack?: boolean;
   hideVerticalTrack?: boolean;
   scrollTop?: number;
-  setScrollTop?: (event: any) => void;
+  setScrollTop?: (position: ScrollbarPosition) => void;
   autoHeightMin?: number | string;
   updateAfterMountMs?: number;
 }
@@ -101,11 +103,15 @@ export const CustomScrollbar: FC<Props> = ({
     return <div {...passedProps} className="scrollbar-view" />;
   }, []);
 
+  const onScrollStop = useCallback(() => {
+    ref.current && setScrollTop && setScrollTop(ref.current.getValues());
+  }, [setScrollTop]);
+
   return (
     <Scrollbars
       ref={ref}
       className={classNames(styles.customScrollbar, className)}
-      onScroll={setScrollTop}
+      onScrollStop={onScrollStop}
       autoHeight={true}
       autoHide={autoHide}
       autoHideTimeout={autoHideTimeout}
diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts
index 6ac0c481cbc..21214a8eb10 100644
--- a/packages/grafana-ui/src/components/index.ts
+++ b/packages/grafana-ui/src/components/index.ts
@@ -6,7 +6,7 @@ export { Tooltip, PopoverContent } from './Tooltip/Tooltip';
 export { PopoverController } from './Tooltip/PopoverController';
 export { Popover } from './Tooltip/Popover';
 export { Portal } from './Portal/Portal';
-export { CustomScrollbar } from './CustomScrollbar/CustomScrollbar';
+export { CustomScrollbar, ScrollbarPosition } from './CustomScrollbar/CustomScrollbar';
 export { TabbedContainer, TabConfig } from './TabbedContainer/TabbedContainer';
 
 export { ClipboardButton } from './ClipboardButton/ClipboardButton';
diff --git a/public/app/features/dashboard/containers/DashboardPage.tsx b/public/app/features/dashboard/containers/DashboardPage.tsx
index cf71804f686..81afc13554b 100644
--- a/public/app/features/dashboard/containers/DashboardPage.tsx
+++ b/public/app/features/dashboard/containers/DashboardPage.tsx
@@ -1,11 +1,11 @@
 import $ from 'jquery';
-import React, { MouseEvent, PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import { css } from 'emotion';
 import { hot } from 'react-hot-loader';
 import { connect } from 'react-redux';
 import { locationService } from '@grafana/runtime';
 import { selectors } from '@grafana/e2e-selectors';
-import { CustomScrollbar, stylesFactory, Themeable2, withTheme2 } from '@grafana/ui';
+import { CustomScrollbar, ScrollbarPosition, stylesFactory, Themeable2, withTheme2 } from '@grafana/ui';
 
 import { createErrorNotification } from 'app/core/copy/appNotification';
 import { Branding } from 'app/core/components/Branding/Branding';
@@ -241,9 +241,8 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
     $('body').toggleClass('panel-in-fullscreen', isFullscreen);
   }
 
-  setScrollTop = (e: MouseEvent<HTMLElement>): void => {
-    const target = e.target as HTMLElement;
-    this.setState({ scrollTop: target.scrollTop, updateScrollTop: undefined });
+  setScrollTop = ({ scrollTop }: ScrollbarPosition): void => {
+    this.setState({ scrollTop, updateScrollTop: undefined });
   };
 
   onAddPanel = () => {
diff --git a/public/app/features/query/components/QueryGroup.tsx b/public/app/features/query/components/QueryGroup.tsx
index 8d3b7fb80c7..c919376e229 100644
--- a/public/app/features/query/components/QueryGroup.tsx
+++ b/public/app/features/query/components/QueryGroup.tsx
@@ -1,7 +1,16 @@
 // Libraries
 import React, { PureComponent } from 'react';
 // Components
-import { Button, CustomScrollbar, HorizontalGroup, Icon, Modal, stylesFactory, Tooltip } from '@grafana/ui';
+import {
+  Button,
+  CustomScrollbar,
+  HorizontalGroup,
+  Icon,
+  Modal,
+  ScrollbarPosition,
+  stylesFactory,
+  Tooltip,
+} from '@grafana/ui';
 import { getDataSourceSrv, DataSourcePicker } from '@grafana/runtime';
 import { QueryEditorRows } from './QueryEditorRows';
 // Services
@@ -275,9 +284,8 @@ export class QueryGroup extends PureComponent<Props, State> {
     this.onScrollBottom();
   };
 
-  setScrollTop = (event: React.MouseEvent<HTMLElement>) => {
-    const target = event.target as HTMLElement;
-    this.setState({ scrollTop: target.scrollTop });
+  setScrollTop = ({ scrollTop }: ScrollbarPosition) => {
+    this.setState({ scrollTop: scrollTop });
   };
 
   onQueriesChange = (queries: DataQuery[]) => {

From e21b90681f327f435d9f4c8469b76c3bedf33f4e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A1bor=20Farkas?= <gabor.farkas@gmail.com>
Date: Mon, 24 May 2021 12:24:42 +0200
Subject: [PATCH 23/43] influxdb: influxql: make measurement-autocomplete case
 insensitive (#34563)

---
 public/app/plugins/datasource/influxdb/query_builder.ts     | 3 ++-
 .../plugins/datasource/influxdb/specs/query_builder.test.ts | 6 +++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/public/app/plugins/datasource/influxdb/query_builder.ts b/public/app/plugins/datasource/influxdb/query_builder.ts
index 2993c998719..0155c0910d0 100644
--- a/public/app/plugins/datasource/influxdb/query_builder.ts
+++ b/public/app/plugins/datasource/influxdb/query_builder.ts
@@ -44,7 +44,8 @@ export class InfluxQueryBuilder {
     } else if (type === 'MEASUREMENTS') {
       query = 'SHOW MEASUREMENTS';
       if (withMeasurementFilter) {
-        query += ' WITH MEASUREMENT =~ /' + kbn.regexEscape(withMeasurementFilter) + '/';
+        // we do a case-insensitive regex-based lookup
+        query += ' WITH MEASUREMENT =~ /(?i)' + kbn.regexEscape(withMeasurementFilter) + '/';
       }
     } else if (type === 'FIELDS') {
       measurement = this.target.measurement;
diff --git a/public/app/plugins/datasource/influxdb/specs/query_builder.test.ts b/public/app/plugins/datasource/influxdb/specs/query_builder.test.ts
index f32e8438967..59b8e839e98 100644
--- a/public/app/plugins/datasource/influxdb/specs/query_builder.test.ts
+++ b/public/app/plugins/datasource/influxdb/specs/query_builder.test.ts
@@ -56,13 +56,13 @@ describe('InfluxQueryBuilder', () => {
     it('should have WITH MEASUREMENT in measurement query for non-empty query with no tags', () => {
       const builder = new InfluxQueryBuilder({ measurement: '', tags: [] });
       const query = builder.buildExploreQuery('MEASUREMENTS', undefined, 'something');
-      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /something/ LIMIT 100');
+      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /(?i)something/ LIMIT 100');
     });
 
     it('should escape the regex value in measurement query', () => {
       const builder = new InfluxQueryBuilder({ measurement: '', tags: [] });
       const query = builder.buildExploreQuery('MEASUREMENTS', undefined, 'abc/edf/');
-      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /abc\\/edf\\// LIMIT 100');
+      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /(?i)abc\\/edf\\// LIMIT 100');
     });
 
     it('should have WITH MEASUREMENT WHERE in measurement query for non-empty query with tags', () => {
@@ -71,7 +71,7 @@ describe('InfluxQueryBuilder', () => {
         tags: [{ key: 'app', value: 'email' }],
       });
       const query = builder.buildExploreQuery('MEASUREMENTS', undefined, 'something');
-      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /something/ WHERE "app" = \'email\' LIMIT 100');
+      expect(query).toBe('SHOW MEASUREMENTS WITH MEASUREMENT =~ /(?i)something/ WHERE "app" = \'email\' LIMIT 100');
     });
 
     it('should have where condition in measurement query for query with tags', () => {

From 6796a89e9d03ab3efaa4e03ca26fcf54a05a8a4d Mon Sep 17 00:00:00 2001
From: mmenbawy <elmenabawym@gmail.com>
Date: Mon, 24 May 2021 12:28:10 +0200
Subject: [PATCH 24/43] Loki: Bring back processed bytes as meta info (#34092)

* Loki: Bring back processed bytes as meta info

* style: Lint
---
 public/app/core/logs_model.test.ts | 12 +++++++++++-
 public/app/core/logs_model.ts      | 28 ++++++++++++++++++++++++++++
 2 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/public/app/core/logs_model.test.ts b/public/app/core/logs_model.test.ts
index cac8a65d8b8..04aa3e0939a 100644
--- a/public/app/core/logs_model.test.ts
+++ b/public/app/core/logs_model.test.ts
@@ -698,6 +698,8 @@ describe('logSeriesToLogsModel', () => {
         meta: {
           searchWords: ['test'],
           limit: 1000,
+          stats: [{ displayName: 'Summary: total bytes processed', value: 97048, unit: 'decbytes' }],
+          custom: { lokiQueryStatKey: 'Summary: total bytes processed' },
           preferredVisualisationType: 'logs',
         },
       },
@@ -705,7 +707,10 @@ describe('logSeriesToLogsModel', () => {
 
     const metaData = {
       hasUniqueLabels: false,
-      meta: [{ label: LIMIT_LABEL, value: 1000, kind: 0 }],
+      meta: [
+        { label: LIMIT_LABEL, value: 1000, kind: 0 },
+        { label: 'Total bytes processed', value: '97.0  kB', kind: 1 },
+      ],
       rows: [],
     };
 
@@ -739,6 +744,8 @@ describe('logSeriesToLogsModel', () => {
         meta: {
           searchWords: ['test'],
           limit: 1000,
+          stats: [{ displayName: 'Summary: total bytes processed', value: 97048, unit: 'decbytes' }],
+          custom: { lokiQueryStatKey: 'Summary: total bytes processed' },
           preferredVisualisationType: 'logs',
         },
       }),
@@ -749,6 +756,8 @@ describe('logSeriesToLogsModel', () => {
         meta: {
           searchWords: ['test'],
           limit: 1000,
+          stats: [{ displayName: 'Summary: total bytes processed', value: 97048, unit: 'decbytes' }],
+          custom: { lokiQueryStatKey: 'Summary: total bytes processed' },
           preferredVisualisationType: 'logs',
         },
       }),
@@ -758,6 +767,7 @@ describe('logSeriesToLogsModel', () => {
     expect(logsModel.meta).toMatchObject([
       { kind: 2, label: 'Common labels', value: { foo: 'bar', level: 'dbug' } },
       { kind: 0, label: LIMIT_LABEL, value: 2000 },
+      { kind: 1, label: 'Total bytes processed', value: '194  kB' },
     ]);
     expect(logsModel.rows).toHaveLength(3);
     expect(logsModel.rows).toMatchObject([
diff --git a/public/app/core/logs_model.ts b/public/app/core/logs_model.ts
index 79c5d7d9755..b079ea6943b 100644
--- a/public/app/core/logs_model.ts
+++ b/public/app/core/logs_model.ts
@@ -33,6 +33,7 @@ import {
   DataQuery,
 } from '@grafana/data';
 import { getThemeColor } from 'app/core/utils/colors';
+import { SIPrefix } from '@grafana/data/src/valueFormats/symbolFormatters';
 import { config } from '@grafana/runtime';
 
 export const LIMIT_LABEL = 'Line limit';
@@ -443,10 +444,16 @@ export function logSeriesToLogsModel(logSeries: DataFrame[]): LogsModel | undefi
       kind: LogsMetaKind.Number,
     });
   }
+
+  let totalBytes = 0;
+  const queriesVisited: { [refId: string]: boolean } = {};
   // To add just 1 error message
   let errorMetaAdded = false;
 
   for (const series of logSeries) {
+    const totalBytesKey = series.meta?.custom?.lokiQueryStatKey;
+    const { refId } = series; // Stats are per query, keeping track by refId
+
     if (!errorMetaAdded && series.meta?.custom?.error) {
       meta.push({
         label: '',
@@ -455,7 +462,28 @@ export function logSeriesToLogsModel(logSeries: DataFrame[]): LogsModel | undefi
       });
       errorMetaAdded = true;
     }
+
+    if (refId && !queriesVisited[refId]) {
+      if (totalBytesKey && series.meta?.stats) {
+        const byteStat = series.meta.stats.find((stat) => stat.displayName === totalBytesKey);
+        if (byteStat) {
+          totalBytes += byteStat.value;
+        }
+      }
+
+      queriesVisited[refId] = true;
+    }
   }
+
+  if (totalBytes > 0) {
+    const { text, suffix } = SIPrefix('B')(totalBytes);
+    meta.push({
+      label: 'Total bytes processed',
+      value: `${text} ${suffix}`,
+      kind: LogsMetaKind.String,
+    });
+  }
+
   return {
     hasUniqueLabels,
     meta,

From b5de6e7a1d8510a083bb9ff9292456a6257ba4c2 Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Mon, 24 May 2021 13:30:02 +0200
Subject: [PATCH 25/43] Add @public release tag to Spinner component (#34576)

---
 packages/grafana-ui/src/components/Spinner/Spinner.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/grafana-ui/src/components/Spinner/Spinner.tsx b/packages/grafana-ui/src/components/Spinner/Spinner.tsx
index 1ccf2c8748f..a77f80a9e5b 100644
--- a/packages/grafana-ui/src/components/Spinner/Spinner.tsx
+++ b/packages/grafana-ui/src/components/Spinner/Spinner.tsx
@@ -23,6 +23,10 @@ export type Props = {
   inline?: boolean;
   size?: number;
 };
+
+/**
+ * @public
+ */
 export const Spinner: FC<Props> = (props: Props) => {
   const { className, inline = false, iconClassName, style, size = 16 } = props;
   const styles = getStyles(size, inline);

From 247bdc2f9b93b8e4bcd42f472a87d9081ed41829 Mon Sep 17 00:00:00 2001
From: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>
Date: Mon, 24 May 2021 13:56:48 +0200
Subject: [PATCH 26/43] Explore: Add caching for queries run from logs
 navigation (#34297)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* WIP: Implement simple caching

* If results are cached, don't run new query and use those results

* Add duplicate key check

* Clean up

* Clean up

* Add tests for caching

* Remove unused variables

* Update public/app/features/explore/state/query.test.ts

Co-authored-by: Piotr Jamróz <pm.jamroz@gmail.com>

* Update public/app/features/explore/state/query.test.ts

Co-authored-by: Piotr Jamróz <pm.jamroz@gmail.com>

* Use decorateData to apply all decorators

* Remove unused variables

* Change loading stte to Done

* Clear cache when running query from navigation

Co-authored-by: Piotr Jamróz <pm.jamroz@gmail.com>
---
 .../app/features/explore/ExploreToolbar.tsx   |  11 +-
 public/app/features/explore/Logs.tsx          |   6 +
 public/app/features/explore/LogsContainer.tsx |  11 +-
 .../features/explore/LogsNavigation.test.tsx  |   2 +
 .../app/features/explore/LogsNavigation.tsx   |  14 +-
 .../explore/state/explorePane.test.ts         |   1 +
 .../app/features/explore/state/explorePane.ts |   1 +
 .../app/features/explore/state/query.test.ts  | 106 ++++++-
 public/app/features/explore/state/query.ts    | 263 +++++++++++-------
 public/app/features/explore/state/utils.ts    |  24 ++
 .../app/features/explore/utils/decorators.ts  |  20 +-
 public/app/types/explore.ts                   |   7 +
 12 files changed, 363 insertions(+), 103 deletions(-)

diff --git a/public/app/features/explore/ExploreToolbar.tsx b/public/app/features/explore/ExploreToolbar.tsx
index afb3a8b573a..72503cd8276 100644
--- a/public/app/features/explore/ExploreToolbar.tsx
+++ b/public/app/features/explore/ExploreToolbar.tsx
@@ -19,7 +19,7 @@ import { ExploreTimeControls } from './ExploreTimeControls';
 import { LiveTailButton } from './LiveTailButton';
 import { RunButton } from './RunButton';
 import { LiveTailControls } from './useLiveTailControls';
-import { cancelQueries, clearQueries, runQueries } from './state/query';
+import { cancelQueries, clearQueries, runQueries, clearCache } from './state/query';
 import ReturnToDashboardButton from './ReturnToDashboardButton';
 import { isSplit } from './state/selectors';
 
@@ -54,6 +54,7 @@ interface DispatchProps {
   syncTimes: typeof syncTimes;
   changeRefreshInterval: typeof changeRefreshInterval;
   onChangeTimeZone: typeof updateTimeZoneForSession;
+  clearCache: typeof clearCache;
 }
 
 type Props = StateProps & DispatchProps & OwnProps;
@@ -68,10 +69,13 @@ export class UnConnectedExploreToolbar extends PureComponent<Props> {
   };
 
   onRunQuery = (loading = false) => {
+    const { clearCache, runQueries, cancelQueries, exploreId } = this.props;
     if (loading) {
-      return this.props.cancelQueries(this.props.exploreId);
+      return cancelQueries(exploreId);
     } else {
-      return this.props.runQueries(this.props.exploreId);
+      // We want to give user a chance tu re-run the query even if it is saved in cache
+      clearCache(exploreId);
+      return runQueries(exploreId);
     }
   };
 
@@ -274,6 +278,7 @@ const mapDispatchToProps: DispatchProps = {
   split: splitOpen,
   syncTimes,
   onChangeTimeZone: updateTimeZoneForSession,
+  clearCache,
 };
 
 export const ExploreToolbar = hot(module)(connect(mapStateToProps, mapDispatchToProps)(UnConnectedExploreToolbar));
diff --git a/public/app/features/explore/Logs.tsx b/public/app/features/explore/Logs.tsx
index e598af19e6b..a71f260badc 100644
--- a/public/app/features/explore/Logs.tsx
+++ b/public/app/features/explore/Logs.tsx
@@ -65,6 +65,8 @@ interface Props {
   onStopScanning?: () => void;
   getRowContext?: (row: LogRowModel, options?: RowContextOptions) => Promise<any>;
   getFieldLinks: (field: Field, rowIndex: number) => Array<LinkModel<Field>>;
+  addResultsToCache: () => void;
+  clearCache: () => void;
 }
 
 interface State {
@@ -244,6 +246,8 @@ export class UnthemedLogs extends PureComponent<Props, State> {
       getFieldLinks,
       theme,
       logsQueries,
+      clearCache,
+      addResultsToCache,
     } = this.props;
 
     const {
@@ -361,6 +365,8 @@ export class UnthemedLogs extends PureComponent<Props, State> {
             loading={loading}
             queries={logsQueries ?? []}
             scrollToTopLogs={this.scrollToTopLogs}
+            addResultsToCache={addResultsToCache}
+            clearCache={clearCache}
           />
         </div>
         {!loading && !hasData && !scanning && (
diff --git a/public/app/features/explore/LogsContainer.tsx b/public/app/features/explore/LogsContainer.tsx
index 47bcfdfe216..efc86135228 100644
--- a/public/app/features/explore/LogsContainer.tsx
+++ b/public/app/features/explore/LogsContainer.tsx
@@ -7,6 +7,7 @@ import { AbsoluteTimeRange, Field, LogRowModel, RawTimeRange } from '@grafana/da
 import { ExploreId, ExploreItemState } from 'app/types/explore';
 import { StoreState } from 'app/types';
 import { splitOpen } from './state/main';
+import { addResultsToCache, clearCache } from './state/query';
 import { updateTimeRange } from './state/time';
 import { getTimeZone } from '../profile/state/selectors';
 import { LiveLogsWithTheme } from './LiveLogs';
@@ -15,7 +16,7 @@ import { LogsCrossFadeTransition } from './utils/LogsCrossFadeTransition';
 import { LiveTailControls } from './useLiveTailControls';
 import { getFieldLinksForExplore } from './utils/links';
 
-interface LogsContainerProps {
+interface LogsContainerProps extends PropsFromRedux {
   exploreId: ExploreId;
   scanRange?: RawTimeRange;
   width: number;
@@ -26,7 +27,7 @@ interface LogsContainerProps {
   onStopScanning: () => void;
 }
 
-export class LogsContainer extends PureComponent<PropsFromRedux & LogsContainerProps> {
+export class LogsContainer extends PureComponent<LogsContainerProps> {
   onChangeTime = (absoluteRange: AbsoluteTimeRange) => {
     const { exploreId, updateTimeRange } = this.props;
     updateTimeRange({ exploreId, absoluteRange });
@@ -77,6 +78,8 @@ export class LogsContainer extends PureComponent<PropsFromRedux & LogsContainerP
       width,
       isLive,
       exploreId,
+      addResultsToCache,
+      clearCache,
     } = this.props;
 
     if (!logRows) {
@@ -134,6 +137,8 @@ export class LogsContainer extends PureComponent<PropsFromRedux & LogsContainerP
               width={width}
               getRowContext={this.getLogRowContext}
               getFieldLinks={this.getFieldLinks}
+              addResultsToCache={() => addResultsToCache(exploreId)}
+              clearCache={() => clearCache(exploreId)}
             />
           </Collapse>
         </LogsCrossFadeTransition>
@@ -180,6 +185,8 @@ function mapStateToProps(state: StoreState, { exploreId }: { exploreId: string }
 const mapDispatchToProps = {
   updateTimeRange,
   splitOpen,
+  addResultsToCache,
+  clearCache,
 };
 
 const connector = connect(mapStateToProps, mapDispatchToProps);
diff --git a/public/app/features/explore/LogsNavigation.test.tsx b/public/app/features/explore/LogsNavigation.test.tsx
index 6570f5391fb..9b0772e1bd5 100644
--- a/public/app/features/explore/LogsNavigation.test.tsx
+++ b/public/app/features/explore/LogsNavigation.test.tsx
@@ -15,6 +15,8 @@ const setup = (propOverrides?: object) => {
     visibleRange: { from: 1619081941000, to: 1619081945930 },
     onChangeTime: jest.fn(),
     scrollToTopLogs: jest.fn(),
+    addResultsToCache: jest.fn(),
+    clearCache: jest.fn(),
     ...propOverrides,
   };
 
diff --git a/public/app/features/explore/LogsNavigation.tsx b/public/app/features/explore/LogsNavigation.tsx
index 98772edfe98..5eb09377ff7 100644
--- a/public/app/features/explore/LogsNavigation.tsx
+++ b/public/app/features/explore/LogsNavigation.tsx
@@ -14,6 +14,8 @@ type Props = {
   logsSortOrder?: LogsSortOrder | null;
   onChangeTime: (range: AbsoluteTimeRange) => void;
   scrollToTopLogs: () => void;
+  addResultsToCache: () => void;
+  clearCache: () => void;
 };
 
 export type LogsPage = {
@@ -30,6 +32,8 @@ function LogsNavigation({
   scrollToTopLogs,
   visibleRange,
   queries,
+  clearCache,
+  addResultsToCache,
 }: Props) {
   const [pages, setPages] = useState<LogsPage[]>([]);
   const [currentPageIndex, setCurrentPageIndex] = useState(0);
@@ -53,6 +57,7 @@ function LogsNavigation({
     let newPages: LogsPage[] = [];
     // We want to start new pagination if queries change or if absolute range is different than expected
     if (!isEqual(expectedRangeRef.current, absoluteRange) || !isEqual(expectedQueriesRef.current, queries)) {
+      clearCache();
       setPages([newPage]);
       setCurrentPageIndex(0);
       expectedQueriesRef.current = queries;
@@ -72,7 +77,14 @@ function LogsNavigation({
       const index = newPages.findIndex((page) => page.queryRange.to === absoluteRange.to);
       setCurrentPageIndex(index);
     }
-  }, [visibleRange, absoluteRange, logsSortOrder, queries]);
+    addResultsToCache();
+  }, [visibleRange, absoluteRange, logsSortOrder, queries, clearCache, addResultsToCache]);
+
+  useEffect(() => {
+    return () => clearCache();
+    // We can't enforce the eslint rule here because we only want to run when component unmounts.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 
   const changeTime = ({ from, to }: AbsoluteTimeRange) => {
     expectedRangeRef.current = { from, to };
diff --git a/public/app/features/explore/state/explorePane.test.ts b/public/app/features/explore/state/explorePane.test.ts
index 6b2d28e7f8d..11a0aefaac3 100644
--- a/public/app/features/explore/state/explorePane.test.ts
+++ b/public/app/features/explore/state/explorePane.test.ts
@@ -37,6 +37,7 @@ const defaultInitialState = {
         label: 'Off',
         value: 0,
       },
+      cache: [],
     },
   },
 };
diff --git a/public/app/features/explore/state/explorePane.ts b/public/app/features/explore/state/explorePane.ts
index f88eb1a3425..03c67cb605b 100644
--- a/public/app/features/explore/state/explorePane.ts
+++ b/public/app/features/explore/state/explorePane.ts
@@ -238,6 +238,7 @@ export const paneReducer = (state: ExploreItemState = makeExplorePaneState(), ac
       datasourceMissing: !datasourceInstance,
       queryResponse: createEmptyQueryResponse(),
       logsHighlighterExpressions: undefined,
+      cache: [],
     };
   }
 
diff --git a/public/app/features/explore/state/query.test.ts b/public/app/features/explore/state/query.test.ts
index 99b90a35404..d3370872a51 100644
--- a/public/app/features/explore/state/query.test.ts
+++ b/public/app/features/explore/state/query.test.ts
@@ -1,5 +1,7 @@
 import {
   addQueryRowAction,
+  addResultsToCache,
+  clearCache,
   cancelQueries,
   cancelQueriesAction,
   queryReducer,
@@ -10,7 +12,17 @@ import {
 } from './query';
 import { ExploreId, ExploreItemState } from 'app/types';
 import { interval, of } from 'rxjs';
-import { ArrayVector, DataQueryResponse, DefaultTimeZone, MutableDataFrame, RawTimeRange, toUtc } from '@grafana/data';
+import {
+  ArrayVector,
+  DataQueryResponse,
+  DefaultTimeZone,
+  MutableDataFrame,
+  RawTimeRange,
+  toUtc,
+  PanelData,
+  DataFrame,
+  LoadingState,
+} from '@grafana/data';
 import { thunkTester } from 'test/core/thunk/thunkTester';
 import { makeExplorePaneState } from './utils';
 import { reducerTester } from '../../../../test/core/redux/reducerTester';
@@ -50,6 +62,7 @@ const defaultInitialState = {
         label: 'Off',
         value: 0,
       },
+      cache: [],
     },
   },
 };
@@ -213,4 +226,95 @@ describe('reducer', () => {
         });
     });
   });
+
+  describe('caching', () => {
+    it('should add response to cache', async () => {
+      const store = configureStore({
+        ...(defaultInitialState as any),
+        explore: {
+          [ExploreId.left]: {
+            ...defaultInitialState.explore[ExploreId.left],
+            queryResponse: {
+              series: [{ name: 'test name' }] as DataFrame[],
+              state: LoadingState.Done,
+            } as PanelData,
+            absoluteRange: { from: 1621348027000, to: 1621348050000 },
+          },
+        },
+      });
+
+      await store.dispatch(addResultsToCache(ExploreId.left));
+
+      expect(store.getState().explore[ExploreId.left].cache).toEqual([
+        { key: 'from=1621348027000&to=1621348050000', value: { series: [{ name: 'test name' }], state: 'Done' } },
+      ]);
+    });
+
+    it('should not add response to cache if response is still loading', async () => {
+      const store = configureStore({
+        ...(defaultInitialState as any),
+        explore: {
+          [ExploreId.left]: {
+            ...defaultInitialState.explore[ExploreId.left],
+            queryResponse: { series: [{ name: 'test name' }] as DataFrame[], state: LoadingState.Loading } as PanelData,
+            absoluteRange: { from: 1621348027000, to: 1621348050000 },
+          },
+        },
+      });
+
+      await store.dispatch(addResultsToCache(ExploreId.left));
+
+      expect(store.getState().explore[ExploreId.left].cache).toEqual([]);
+    });
+
+    it('should not add duplicate response to cache', async () => {
+      const store = configureStore({
+        ...(defaultInitialState as any),
+        explore: {
+          [ExploreId.left]: {
+            ...defaultInitialState.explore[ExploreId.left],
+            queryResponse: {
+              series: [{ name: 'test name' }] as DataFrame[],
+              state: LoadingState.Done,
+            } as PanelData,
+            absoluteRange: { from: 1621348027000, to: 1621348050000 },
+            cache: [
+              {
+                key: 'from=1621348027000&to=1621348050000',
+                value: { series: [{ name: 'old test name' }], state: LoadingState.Done },
+              },
+            ],
+          },
+        },
+      });
+
+      await store.dispatch(addResultsToCache(ExploreId.left));
+
+      expect(store.getState().explore[ExploreId.left].cache).toHaveLength(1);
+      expect(store.getState().explore[ExploreId.left].cache).toEqual([
+        { key: 'from=1621348027000&to=1621348050000', value: { series: [{ name: 'old test name' }], state: 'Done' } },
+      ]);
+    });
+
+    it('should clear cache', async () => {
+      const store = configureStore({
+        ...(defaultInitialState as any),
+        explore: {
+          [ExploreId.left]: {
+            ...defaultInitialState.explore[ExploreId.left],
+            cache: [
+              {
+                key: 'from=1621348027000&to=1621348050000',
+                value: { series: [{ name: 'old test name' }], state: 'Done' },
+              },
+            ],
+          },
+        },
+      });
+
+      await store.dispatch(clearCache(ExploreId.left));
+
+      expect(store.getState().explore[ExploreId.left].cache).toEqual([]);
+    });
+  });
 });
diff --git a/public/app/features/explore/state/query.ts b/public/app/features/explore/state/query.ts
index 13ca14bd7a5..79ebde5bc71 100644
--- a/public/app/features/explore/state/query.ts
+++ b/public/app/features/explore/state/query.ts
@@ -1,5 +1,5 @@
-import { map, mergeMap, throttleTime } from 'rxjs/operators';
-import { identity, Unsubscribable } from 'rxjs';
+import { mergeMap, throttleTime } from 'rxjs/operators';
+import { identity, Unsubscribable, of } from 'rxjs';
 import {
   DataQuery,
   DataQueryErrorType,
@@ -27,19 +27,14 @@ import { ExploreId, QueryOptions } from 'app/types/explore';
 import { getTimeZone } from 'app/features/profile/state/selectors';
 import { getShiftedTimeRange } from 'app/core/utils/timePicker';
 import { notifyApp } from '../../../core/actions';
-import { preProcessPanelData, runRequest } from '../../query/state/runRequest';
-import {
-  decorateWithFrameTypeMetadata,
-  decorateWithGraphResult,
-  decorateWithLogsResult,
-  decorateWithTableResult,
-} from '../utils/decorators';
+import { runRequest } from '../../query/state/runRequest';
+import { decorateData } from '../utils/decorators';
 import { createErrorNotification } from '../../../core/copy/appNotification';
 import { richHistoryUpdatedAction, stateSave } from './main';
 import { AnyAction, createAction, PayloadAction } from '@reduxjs/toolkit';
 import { updateTime } from './time';
 import { historyUpdatedAction } from './history';
-import { createEmptyQueryResponse } from './utils';
+import { createEmptyQueryResponse, createCacheKey, getResultsFromCache } from './utils';
 
 //
 // Actions and Payloads
@@ -164,6 +159,24 @@ export interface ScanStopPayload {
 }
 export const scanStopAction = createAction<ScanStopPayload>('explore/scanStop');
 
+/**
+ * Adds query results to cache.
+ * This is currently used to cache last 5 query results for log queries run from logs navigation (pagination).
+ */
+export interface AddResultsToCachePayload {
+  exploreId: ExploreId;
+  cacheKey: string;
+  queryResponse: PanelData;
+}
+export const addResultsToCacheAction = createAction<AddResultsToCachePayload>('explore/addResultsToCache');
+
+/**
+ *  Clears cache.
+ */
+export interface ClearCachePayload {
+  exploreId: ExploreId;
+}
+export const clearCacheAction = createAction<ClearCachePayload>('explore/clearCache');
 //
 // Action creators
 //
@@ -309,100 +322,115 @@ export const runQueries = (exploreId: ExploreId, options?: { replaceUrl?: boolea
       history,
       refreshInterval,
       absoluteRange,
+      cache,
     } = exploreItemState;
+    let newQuerySub;
 
-    if (!hasNonEmptyQuery(queries)) {
-      dispatch(clearQueriesAction({ exploreId }));
-      dispatch(stateSave({ replace: options?.replaceUrl })); // Remember to save to state and update location
-      return;
-    }
+    const cachedValue = getResultsFromCache(cache, absoluteRange);
 
-    if (!datasourceInstance) {
-      return;
-    }
-
-    // Some datasource's query builders allow per-query interval limits,
-    // but we're using the datasource interval limit for now
-    const minInterval = datasourceInstance?.interval;
-
-    stopQueryState(querySubscription);
-
-    const datasourceId = datasourceInstance?.meta.id;
-
-    const queryOptions: QueryOptions = {
-      minInterval,
-      // maxDataPoints is used in:
-      // Loki - used for logs streaming for buffer size, with undefined it falls back to datasource config if it supports that.
-      // Elastic - limits the number of datapoints for the counts query and for logs it has hardcoded limit.
-      // Influx - used to correctly display logs in graph
-      // TODO:unification
-      // maxDataPoints: mode === ExploreMode.Logs && datasourceId === 'loki' ? undefined : containerWidth,
-      maxDataPoints: containerWidth,
-      liveStreaming: live,
-    };
-
-    const datasourceName = datasourceInstance.name;
-    const timeZone = getTimeZone(getState().user);
-    const transaction = buildQueryTransaction(queries, queryOptions, range, scanning, timeZone);
-
-    let firstResponse = true;
-    dispatch(changeLoadingStateAction({ exploreId, loadingState: LoadingState.Loading }));
-
-    const newQuerySub = runRequest(datasourceInstance, transaction.request)
-      .pipe(
-        // Simple throttle for live tailing, in case of > 1000 rows per interval we spend about 200ms on processing and
-        // rendering. In case this is optimized this can be tweaked, but also it should be only as fast as user
-        // actually can see what is happening.
-        live ? throttleTime(500) : identity,
-        map((data: PanelData) => preProcessPanelData(data, queryResponse)),
-        map(decorateWithFrameTypeMetadata),
-        map(decorateWithGraphResult),
-        map(decorateWithLogsResult({ absoluteRange, refreshInterval, queries })),
-        mergeMap(decorateWithTableResult)
-      )
-      .subscribe(
-        (data) => {
-          if (!data.error && firstResponse) {
-            // Side-effect: Saving history in localstorage
-            const nextHistory = updateHistory(history, datasourceId, queries);
-            const nextRichHistory = addToRichHistory(
-              richHistory || [],
-              datasourceId,
-              datasourceName,
-              queries,
-              false,
-              '',
-              ''
-            );
-            dispatch(historyUpdatedAction({ exploreId, history: nextHistory }));
-            dispatch(richHistoryUpdatedAction({ richHistory: nextRichHistory }));
-
-            // We save queries to the URL here so that only successfully run queries change the URL.
-            dispatch(stateSave({ replace: options?.replaceUrl }));
+    // If we have results saved in cache, we are going to use those results instead of running queries
+    if (cachedValue) {
+      newQuerySub = of(cachedValue)
+        .pipe(mergeMap((data: PanelData) => decorateData(data, queryResponse, absoluteRange, refreshInterval, queries)))
+        .subscribe((data) => {
+          if (!data.error) {
+            dispatch(stateSave());
           }
 
-          firstResponse = false;
-
           dispatch(queryStreamUpdatedAction({ exploreId, response: data }));
+        });
 
-          // Keep scanning for results if this was the last scanning transaction
-          if (getState().explore[exploreId]!.scanning) {
-            if (data.state === LoadingState.Done && data.series.length === 0) {
-              const range = getShiftedTimeRange(-1, getState().explore[exploreId]!.range);
-              dispatch(updateTime({ exploreId, absoluteRange: range }));
-              dispatch(runQueries(exploreId));
-            } else {
-              // We can stop scanning if we have a result
-              dispatch(scanStopAction({ exploreId }));
+      // If we don't have resuls saved in cache, run new queries
+    } else {
+      if (!hasNonEmptyQuery(queries)) {
+        dispatch(clearQueriesAction({ exploreId }));
+        dispatch(stateSave({ replace: options?.replaceUrl })); // Remember to save to state and update location
+        return;
+      }
+
+      if (!datasourceInstance) {
+        return;
+      }
+
+      // Some datasource's query builders allow per-query interval limits,
+      // but we're using the datasource interval limit for now
+      const minInterval = datasourceInstance?.interval;
+
+      stopQueryState(querySubscription);
+
+      const datasourceId = datasourceInstance?.meta.id;
+
+      const queryOptions: QueryOptions = {
+        minInterval,
+        // maxDataPoints is used in:
+        // Loki - used for logs streaming for buffer size, with undefined it falls back to datasource config if it supports that.
+        // Elastic - limits the number of datapoints for the counts query and for logs it has hardcoded limit.
+        // Influx - used to correctly display logs in graph
+        // TODO:unification
+        // maxDataPoints: mode === ExploreMode.Logs && datasourceId === 'loki' ? undefined : containerWidth,
+        maxDataPoints: containerWidth,
+        liveStreaming: live,
+      };
+
+      const datasourceName = datasourceInstance.name;
+      const timeZone = getTimeZone(getState().user);
+      const transaction = buildQueryTransaction(queries, queryOptions, range, scanning, timeZone);
+
+      let firstResponse = true;
+      dispatch(changeLoadingStateAction({ exploreId, loadingState: LoadingState.Loading }));
+
+      newQuerySub = runRequest(datasourceInstance, transaction.request)
+        .pipe(
+          // Simple throttle for live tailing, in case of > 1000 rows per interval we spend about 200ms on processing and
+          // rendering. In case this is optimized this can be tweaked, but also it should be only as fast as user
+          // actually can see what is happening.
+          live ? throttleTime(500) : identity,
+          mergeMap((data: PanelData) => decorateData(data, queryResponse, absoluteRange, refreshInterval, queries))
+        )
+        .subscribe(
+          (data) => {
+            if (!data.error && firstResponse) {
+              // Side-effect: Saving history in localstorage
+              const nextHistory = updateHistory(history, datasourceId, queries);
+              const nextRichHistory = addToRichHistory(
+                richHistory || [],
+                datasourceId,
+                datasourceName,
+                queries,
+                false,
+                '',
+                ''
+              );
+              dispatch(historyUpdatedAction({ exploreId, history: nextHistory }));
+              dispatch(richHistoryUpdatedAction({ richHistory: nextRichHistory }));
+
+              // We save queries to the URL here so that only successfully run queries change the URL.
+              dispatch(stateSave({ replace: options?.replaceUrl }));
             }
+
+            firstResponse = false;
+
+            dispatch(queryStreamUpdatedAction({ exploreId, response: data }));
+
+            // Keep scanning for results if this was the last scanning transaction
+            if (getState().explore[exploreId]!.scanning) {
+              if (data.state === LoadingState.Done && data.series.length === 0) {
+                const range = getShiftedTimeRange(-1, getState().explore[exploreId]!.range);
+                dispatch(updateTime({ exploreId, absoluteRange: range }));
+                dispatch(runQueries(exploreId));
+              } else {
+                // We can stop scanning if we have a result
+                dispatch(scanStopAction({ exploreId }));
+              }
+            }
+          },
+          (error) => {
+            dispatch(notifyApp(createErrorNotification('Query processing error', error)));
+            dispatch(changeLoadingStateAction({ exploreId, loadingState: LoadingState.Error }));
+            console.error(error);
           }
-        },
-        (error) => {
-          dispatch(notifyApp(createErrorNotification('Query processing error', error)));
-          dispatch(changeLoadingStateAction({ exploreId, loadingState: LoadingState.Error }));
-          console.error(error);
-        }
-      );
+        );
+    }
 
     dispatch(queryStoreSubscriptionAction({ exploreId, querySubscription: newQuerySub }));
   };
@@ -439,6 +467,25 @@ export function scanStart(exploreId: ExploreId): ThunkResult<void> {
   };
 }
 
+export function addResultsToCache(exploreId: ExploreId): ThunkResult<void> {
+  return (dispatch, getState) => {
+    const queryResponse = getState().explore[exploreId]!.queryResponse;
+    const absoluteRange = getState().explore[exploreId]!.absoluteRange;
+    const cacheKey = createCacheKey(absoluteRange);
+
+    // Save results to cache only when all results recived and loading is done
+    if (queryResponse.state === LoadingState.Done) {
+      dispatch(addResultsToCacheAction({ exploreId, cacheKey, queryResponse }));
+    }
+  };
+}
+
+export function clearCache(exploreId: ExploreId): ThunkResult<void> {
+  return (dispatch, getState) => {
+    dispatch(clearCacheAction({ exploreId }));
+  };
+}
+
 //
 // Reducer
 //
@@ -629,6 +676,32 @@ export const queryReducer = (state: ExploreItemState, action: AnyAction): Explor
     };
   }
 
+  if (addResultsToCacheAction.match(action)) {
+    const CACHE_LIMIT = 5;
+    const { cache } = state;
+    const { queryResponse, cacheKey } = action.payload;
+
+    let newCache = [...cache];
+    const isDuplicateKey = newCache.some((c) => c.key === cacheKey);
+
+    if (!isDuplicateKey) {
+      const newCacheItem = { key: cacheKey, value: queryResponse };
+      newCache = [newCacheItem, ...newCache].slice(0, CACHE_LIMIT);
+    }
+
+    return {
+      ...state,
+      cache: newCache,
+    };
+  }
+
+  if (clearCacheAction.match(action)) {
+    return {
+      ...state,
+      cache: [],
+    };
+  }
+
   return state;
 };
 
diff --git a/public/app/features/explore/state/utils.ts b/public/app/features/explore/state/utils.ts
index 8b72d814782..8fb96f4a303 100644
--- a/public/app/features/explore/state/utils.ts
+++ b/public/app/features/explore/state/utils.ts
@@ -6,6 +6,7 @@ import {
   HistoryItem,
   LoadingState,
   PanelData,
+  AbsoluteTimeRange,
 } from '@grafana/data';
 
 import { ExploreItemState } from 'app/types/explore';
@@ -49,6 +50,7 @@ export const makeExplorePaneState = (): ExploreItemState => ({
   graphResult: null,
   logsResult: null,
   eventBridge: (null as unknown) as EventBusExtended,
+  cache: [],
 });
 
 export const createEmptyQueryResponse = (): PanelData => ({
@@ -96,3 +98,25 @@ export function getUrlStateFromPaneState(pane: ExploreItemState): ExploreUrlStat
     range: toRawTimeRange(pane.range),
   };
 }
+
+export function createCacheKey(absRange: AbsoluteTimeRange) {
+  const params = {
+    from: absRange.from,
+    to: absRange.to,
+  };
+
+  const cacheKey = Object.entries(params)
+    .map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v.toString())}`)
+    .join('&');
+  return cacheKey;
+}
+
+export function getResultsFromCache(
+  cache: Array<{ key: string; value: PanelData }>,
+  absoluteRange: AbsoluteTimeRange
+): PanelData | undefined {
+  const cacheKey = createCacheKey(absoluteRange);
+  const cacheIdx = cache.findIndex((c) => c.key === cacheKey);
+  const cacheValue = cacheIdx >= 0 ? cache[cacheIdx].value : undefined;
+  return cacheValue;
+}
diff --git a/public/app/features/explore/utils/decorators.ts b/public/app/features/explore/utils/decorators.ts
index dfd2fd4f135..60cd97d5da3 100644
--- a/public/app/features/explore/utils/decorators.ts
+++ b/public/app/features/explore/utils/decorators.ts
@@ -11,10 +11,11 @@ import {
 import { config } from '@grafana/runtime';
 import { groupBy } from 'lodash';
 import { Observable, of } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { map, mergeMap } from 'rxjs/operators';
 import { dataFrameToLogsModel } from '../../../core/logs_model';
 import { refreshIntervalToSortOrder } from '../../../core/utils/explore';
 import { ExplorePanelData } from '../../../types';
+import { preProcessPanelData } from '../../query/state/runRequest';
 
 /**
  * When processing response first we try to determine what kind of dataframes we got as one query can return multiple
@@ -154,6 +155,23 @@ export const decorateWithLogsResult = (
   return { ...data, logsResult };
 };
 
+// decorateData applies all decorators
+export function decorateData(
+  data: PanelData,
+  queryResponse: PanelData,
+  absoluteRange: AbsoluteTimeRange,
+  refreshInterval: string | undefined,
+  queries: DataQuery[] | undefined
+): Observable<ExplorePanelData> {
+  return of(data).pipe(
+    map((data: PanelData) => preProcessPanelData(data, queryResponse)),
+    map(decorateWithFrameTypeMetadata),
+    map(decorateWithGraphResult),
+    map(decorateWithLogsResult({ absoluteRange, refreshInterval, queries })),
+    mergeMap(decorateWithTableResult)
+  );
+}
+
 /**
  * Check if frame contains time series, which for our purpose means 1 time column and 1 or more numeric columns.
  */
diff --git a/public/app/types/explore.ts b/public/app/types/explore.ts
index e4f913cca21..506ba3bcbe0 100644
--- a/public/app/types/explore.ts
+++ b/public/app/types/explore.ts
@@ -149,6 +149,13 @@ export interface ExploreItemState {
   showTable?: boolean;
   showTrace?: boolean;
   showNodeGraph?: boolean;
+
+  /**
+   * We are using caching to store query responses of queries run from logs navigation.
+   * In logs navigation, we do pagination and we don't want our users to unnecessarily run the same queries that they've run just moments before.
+   * We are currently caching last 5 query responses.
+   */
+  cache: Array<{ key: string; value: PanelData }>;
 }
 
 export interface ExploreUpdateState {

From e9e438ee2f720231c412e0693342f2f3d6055d5a Mon Sep 17 00:00:00 2001
From: Alex Khomenko <Clarity-89@users.noreply.github.com>
Date: Mon, 24 May 2021 15:09:33 +0300
Subject: [PATCH 27/43] Form: Expose all return values from useForm (#34380)

---
 packages/grafana-ui/src/components/Forms/Form.tsx            | 4 ++--
 packages/grafana-ui/src/types/forms.ts                       | 5 +----
 .../features/alerting/components/NotificationChannelForm.tsx | 5 +++--
 .../alerting/components/NotificationChannelOptions.tsx       | 5 +++--
 .../manage-dashboards/components/ImportDashboardForm.tsx     | 2 +-
 5 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/packages/grafana-ui/src/components/Forms/Form.tsx b/packages/grafana-ui/src/components/Forms/Form.tsx
index c3b4eeb0913..b10051597ae 100644
--- a/packages/grafana-ui/src/components/Forms/Form.tsx
+++ b/packages/grafana-ui/src/components/Forms/Form.tsx
@@ -24,7 +24,7 @@ export function Form<T>({
   maxWidth = 600,
   ...htmlProps
 }: FormProps<T>) {
-  const { handleSubmit, register, control, trigger, getValues, formState, watch, setValue } = useForm<T>({
+  const { handleSubmit, trigger, formState, ...rest } = useForm<T>({
     mode: validateOn,
     defaultValues,
   });
@@ -45,7 +45,7 @@ export function Form<T>({
       onSubmit={handleSubmit(onSubmit)}
       {...htmlProps}
     >
-      {children({ register, errors: formState.errors, control, getValues, formState, watch, setValue })}
+      {children({ errors: formState.errors, formState, ...rest })}
     </form>
   );
 }
diff --git a/packages/grafana-ui/src/types/forms.ts b/packages/grafana-ui/src/types/forms.ts
index 15684115dab..c757bee9223 100644
--- a/packages/grafana-ui/src/types/forms.ts
+++ b/packages/grafana-ui/src/types/forms.ts
@@ -1,10 +1,7 @@
 import { UseFormReturn, FieldValues, FieldErrors } from 'react-hook-form';
 export { SubmitHandler as FormsOnSubmit, FieldErrors as FormFieldErrors } from 'react-hook-form';
 
-export type FormAPI<T> = Pick<
-  UseFormReturn<T>,
-  'register' | 'control' | 'formState' | 'getValues' | 'watch' | 'setValue'
-> & {
+export type FormAPI<T> = Omit<UseFormReturn<T>, 'trigger' | 'handleSubmit'> & {
   errors: FieldErrors<T>;
 };
 
diff --git a/public/app/features/alerting/components/NotificationChannelForm.tsx b/public/app/features/alerting/components/NotificationChannelForm.tsx
index 14b9fe9979f..a9abc49a523 100644
--- a/public/app/features/alerting/components/NotificationChannelForm.tsx
+++ b/public/app/features/alerting/components/NotificationChannelForm.tsx
@@ -9,7 +9,8 @@ import { ChannelSettings } from './ChannelSettings';
 
 import config from 'app/core/config';
 
-interface Props extends Omit<FormAPI<NotificationChannelDTO>, 'formState' | 'setValue'> {
+interface Props
+  extends Pick<FormAPI<NotificationChannelDTO>, 'control' | 'errors' | 'register' | 'watch' | 'getValues'> {
   selectableChannels: Array<SelectableValue<string>>;
   selectedChannel?: NotificationChannelType;
   imageRendererAvailable: boolean;
@@ -19,7 +20,7 @@ interface Props extends Omit<FormAPI<NotificationChannelDTO>, 'formState' | 'set
 }
 
 export interface NotificationSettingsProps
-  extends Omit<FormAPI<NotificationChannelDTO>, 'formState' | 'watch' | 'getValues' | 'setValue'> {
+  extends Pick<FormAPI<NotificationChannelDTO>, 'control' | 'errors' | 'register'> {
   currentFormValues: NotificationChannelDTO;
 }
 
diff --git a/public/app/features/alerting/components/NotificationChannelOptions.tsx b/public/app/features/alerting/components/NotificationChannelOptions.tsx
index f268a4d5886..9cdb59a61d5 100644
--- a/public/app/features/alerting/components/NotificationChannelOptions.tsx
+++ b/public/app/features/alerting/components/NotificationChannelOptions.tsx
@@ -1,10 +1,11 @@
 import React, { FC } from 'react';
 import { SelectableValue } from '@grafana/data';
-import { Button, Checkbox, Field, FormAPI, Input } from '@grafana/ui';
+import { Button, Checkbox, Field, Input } from '@grafana/ui';
 import { OptionElement } from './OptionElement';
 import { NotificationChannelDTO, NotificationChannelOption, NotificationChannelSecureFields } from '../../../types';
+import { NotificationSettingsProps } from './NotificationChannelForm';
 
-interface Props extends Omit<FormAPI<NotificationChannelDTO>, 'formState' | 'getValues' | 'watch' | 'setValue'> {
+interface Props extends NotificationSettingsProps {
   selectedChannelOptions: NotificationChannelOption[];
   currentFormValues: NotificationChannelDTO;
   secureFields: NotificationChannelSecureFields;
diff --git a/public/app/features/manage-dashboards/components/ImportDashboardForm.tsx b/public/app/features/manage-dashboards/components/ImportDashboardForm.tsx
index 43ba364b8ba..865a75a07f5 100644
--- a/public/app/features/manage-dashboards/components/ImportDashboardForm.tsx
+++ b/public/app/features/manage-dashboards/components/ImportDashboardForm.tsx
@@ -15,7 +15,7 @@ import { FolderPicker } from 'app/core/components/Select/FolderPicker';
 import { DashboardInput, DashboardInputs, DataSourceInput, ImportDashboardDTO } from '../state/reducers';
 import { validateTitle, validateUid } from '../utils/validation';
 
-interface Props extends Omit<FormAPI<ImportDashboardDTO>, 'formState' | 'setValue'> {
+interface Props extends Pick<FormAPI<ImportDashboardDTO>, 'register' | 'errors' | 'control' | 'getValues' | 'watch'> {
   uidReset: boolean;
   inputs: DashboardInputs;
   initialFolderId: number;

From 6970c9ebfd140c0b96c4ffa02788de34773eaa1a Mon Sep 17 00:00:00 2001
From: Dimitris Sotirakis <dimitrios.sotirakis@grafana.com>
Date: Mon, 24 May 2021 15:17:40 +0300
Subject: [PATCH 28/43] Use `laher/mergefs` - remove custom code (#34571)

---
 go.mod                                        |  1 +
 go.sum                                        |  4 +
 pkg/cmd/grafana-cli/commands/mergefs.go       | 92 -------------------
 pkg/cmd/grafana-cli/commands/mergefs_test.go  | 68 --------------
 .../scuemata_validation_command_test.go       |  7 +-
 5 files changed, 9 insertions(+), 163 deletions(-)
 delete mode 100644 pkg/cmd/grafana-cli/commands/mergefs.go
 delete mode 100644 pkg/cmd/grafana-cli/commands/mergefs_test.go

diff --git a/go.mod b/go.mod
index 7761246b9ca..4f382baddf2 100644
--- a/go.mod
+++ b/go.mod
@@ -62,6 +62,7 @@ require (
 	github.com/jmespath/go-jmespath v0.4.0
 	github.com/json-iterator/go v1.1.11
 	github.com/jung-kurt/gofpdf v1.16.2
+	github.com/laher/mergefs v0.1.1
 	github.com/lib/pq v1.10.0
 	github.com/linkedin/goavro/v2 v2.10.0
 	github.com/magefile/mage v1.11.0
diff --git a/go.sum b/go.sum
index b200f536f05..7c57193f70b 100644
--- a/go.sum
+++ b/go.sum
@@ -1203,6 +1203,8 @@ github.com/kylelemons/godebug v1.1.0 h1:RPNrshWIDI6G2gRW9EHilWtl7Z6Sb1BR0xunSBf0
 github.com/kylelemons/godebug v1.1.0/go.mod h1:9/0rRGxNHcop5bhtWyNeEfOS8JIWk580+fNqagV/RAw=
 github.com/labstack/echo/v4 v4.1.11/go.mod h1:i541M3Fj6f76NZtHSj7TXnyM8n2gaodfvfxNnFqi74g=
 github.com/labstack/gommon v0.3.0/go.mod h1:MULnywXg0yavhxWKc+lOruYdAhDwPK9wf0OL7NoOu+k=
+github.com/laher/mergefs v0.1.1 h1:nV2bTS57vrmbMxeR6uvJpI8LyGl3QHj4bLBZO3aUV58=
+github.com/laher/mergefs v0.1.1/go.mod h1:FSY1hYy94on4Tz60waRMGdO1awwS23BacqJlqf9lJ9Q=
 github.com/lann/builder v0.0.0-20150808151131-f22ce00fd939/go.mod h1:dXGbAdH5GtBTC4WfIxhKZfyBF/HBFgRZSWwZ9g/He9o=
 github.com/lann/builder v0.0.0-20180802200727-47ae307949d0/go.mod h1:dXGbAdH5GtBTC4WfIxhKZfyBF/HBFgRZSWwZ9g/He9o=
 github.com/lann/ps v0.0.0-20150810152359-62de8c46ede0/go.mod h1:vmVJ0l/dxyfGW6FmdpVm2joNMFikkuWg0EoCKLGUMNw=
@@ -1243,6 +1245,8 @@ github.com/mailru/easyjson v0.7.6 h1:8yTIVnZgCoiM1TgqoeTl+LfU5Jg6/xL3QhGQnimLYnA
 github.com/mailru/easyjson v0.7.6/go.mod h1:xzfreul335JAWq5oZzymOObrkdz5UnU4kGfJJLY9Nlc=
 github.com/markbates/oncer v0.0.0-20181203154359-bf2de49a0be2/go.mod h1:Ld9puTsIW75CHf65OeIOkyKbteujpZVXDpWK6YGZbxE=
 github.com/markbates/safe v1.0.1/go.mod h1:nAqgmRi7cY2nqMc92/bSEeQA+R4OheNU2T1kNSCBdG0=
+github.com/matryer/is v1.4.0 h1:sosSmIWwkYITGrxZ25ULNDeKiMNzFSr4V/eqBQP0PeE=
+github.com/matryer/is v1.4.0/go.mod h1:8I/i5uYgLzgsgEloJE1U6xx5HkBQpAZvepWuujKwMRU=
 github.com/matryer/moq v0.0.0-20190312154309-6cfb0558e1bd/go.mod h1:9ELz6aaclSIGnZBoaSLZ3NAl1VTufbOrXBPvtcy6WiQ=
 github.com/mattermost/xml-roundtrip-validator v0.0.0-20201213122252-bcd7e1b9601e h1:qqXczln0qwkVGcpQ+sQuPOVntt2FytYarXXxYSNJkgw=
 github.com/mattermost/xml-roundtrip-validator v0.0.0-20201213122252-bcd7e1b9601e/go.mod h1:qccnGMcpgwcNaBnxqpJpWWUiPNr5H3O8eDgGV9gT5To=
diff --git a/pkg/cmd/grafana-cli/commands/mergefs.go b/pkg/cmd/grafana-cli/commands/mergefs.go
deleted file mode 100644
index c31449f5e94..00000000000
--- a/pkg/cmd/grafana-cli/commands/mergefs.go
+++ /dev/null
@@ -1,92 +0,0 @@
-package commands
-
-import (
-	"errors"
-	"io/fs"
-	"os"
-	"sort"
-
-	"github.com/grafana/grafana/pkg/cmd/grafana-cli/logger"
-)
-
-// MergeFS contains a slice of different filesystems that can be merged together
-type MergeFS struct {
-	filesystems []fs.FS
-}
-
-// Merge filesystems
-func Merge(filesystems ...fs.FS) fs.FS {
-	return MergeFS{filesystems: filesystems}
-}
-
-// Open opens the named file.
-func (mfs MergeFS) Open(name string) (fs.File, error) {
-	for _, filesystem := range mfs.filesystems {
-		file, err := filesystem.Open(name)
-		if err == nil {
-			return file, nil
-		}
-	}
-	return nil, os.ErrNotExist
-}
-
-// ReadDir reads from the directory, and produces a DirEntry array of different
-// directories.
-//
-// It iterates through all different filesystems that exist in the mfs MergeFS
-// filesystem slice and it identifies overlapping directories that exist in different
-// filesystems
-func (mfs MergeFS) ReadDir(name string) ([]fs.DirEntry, error) {
-	dirsMap := make(map[string]fs.DirEntry)
-	for _, filesystem := range mfs.filesystems {
-		if fsys, ok := filesystem.(fs.ReadDirFS); ok {
-			dir, err := fsys.ReadDir(name)
-			if err != nil {
-				if errors.Is(err, fs.ErrNotExist) {
-					logger.Debugf("directory in filepath %s was not found in filesystem", name)
-					continue
-				}
-				return nil, err
-			}
-			for _, v := range dir {
-				if _, ok := dirsMap[v.Name()]; !ok {
-					dirsMap[v.Name()] = v
-				}
-			}
-			continue
-		}
-
-		file, err := filesystem.Open(name)
-		if err != nil {
-			logger.Debugf("filepath %s was not found in filesystem", name)
-			continue
-		}
-
-		dir, ok := file.(fs.ReadDirFile)
-		if !ok {
-			return nil, &fs.PathError{Op: "readdir", Path: name, Err: errors.New("not implemented")}
-		}
-
-		fsDirs, err := dir.ReadDir(-1)
-		if err != nil {
-			return nil, err
-		}
-		sort.Slice(fsDirs, func(i, j int) bool { return fsDirs[i].Name() < fsDirs[j].Name() })
-		for _, v := range fsDirs {
-			if _, ok := dirsMap[v.Name()]; !ok {
-				dirsMap[v.Name()] = v
-			}
-		}
-		if err := file.Close(); err != nil {
-			logger.Error("failed to close file", "err", err)
-		}
-	}
-	dirs := make([]fs.DirEntry, 0, len(dirsMap))
-
-	for _, value := range dirsMap {
-		dirs = append(dirs, value)
-	}
-
-	sort.Slice(dirs, func(i, j int) bool { return dirs[i].Name() < dirs[j].Name() })
-	return dirs, nil
-}
diff --git a/pkg/cmd/grafana-cli/commands/mergefs_test.go b/pkg/cmd/grafana-cli/commands/mergefs_test.go
deleted file mode 100644
index e79503db4be..00000000000
--- a/pkg/cmd/grafana-cli/commands/mergefs_test.go
+++ /dev/null
@@ -1,68 +0,0 @@
-package commands
-
-import (
-	"io/fs"
-	"os"
-	"path/filepath"
-	"testing"
-	"testing/fstest"
-
-	"github.com/stretchr/testify/require"
-)
-
-func TestMergeFS(t *testing.T) {
-	var filePaths = []struct {
-		path           string
-		dirArrayLength int
-		child          string
-	}{
-		// MapFS takes in account the current directory in addition to all included directories and produces a "" dir
-		{"a", 1, "z"},
-		{"a/z", 1, "bar.cue"},
-		{"b", 1, "z"},
-		{"b/z", 1, "foo.cue"},
-	}
-
-	tempDir := os.DirFS(filepath.Join("testdata", "mergefs"))
-	a := fstest.MapFS{
-		"a":           &fstest.MapFile{Mode: fs.ModeDir},
-		"a/z":         &fstest.MapFile{Mode: fs.ModeDir},
-		"a/z/bar.cue": &fstest.MapFile{Data: []byte("bar")},
-	}
-
-	filesystem := Merge(tempDir, a)
-
-	t.Run("testing mergefs.ReadDir", func(t *testing.T) {
-		for _, fp := range filePaths {
-			t.Run("testing path: "+fp.path, func(t *testing.T) {
-				dirs, err := fs.ReadDir(filesystem, fp.path)
-				require.NoError(t, err)
-				require.Len(t, dirs, fp.dirArrayLength)
-
-				for i := 0; i < len(dirs); i++ {
-					require.Equal(t, dirs[i].Name(), fp.child)
-				}
-			})
-		}
-	})
-
-	t.Run("testing mergefs.Open", func(t *testing.T) {
-		data := make([]byte, 3)
-		file, err := filesystem.Open("a/z/bar.cue")
-		require.NoError(t, err)
-
-		_, err = file.Read(data)
-		require.NoError(t, err)
-		require.Equal(t, "bar", string(data))
-
-		file, err = filesystem.Open("b/z/foo.cue")
-		require.NoError(t, err)
-
-		_, err = file.Read(data)
-		require.NoError(t, err)
-		require.Equal(t, "foo", string(data))
-
-		err = file.Close()
-		require.NoError(t, err)
-	})
-}
diff --git a/pkg/cmd/grafana-cli/commands/scuemata_validation_command_test.go b/pkg/cmd/grafana-cli/commands/scuemata_validation_command_test.go
index 2f9294daf99..cca7ed473d7 100644
--- a/pkg/cmd/grafana-cli/commands/scuemata_validation_command_test.go
+++ b/pkg/cmd/grafana-cli/commands/scuemata_validation_command_test.go
@@ -8,6 +8,7 @@ import (
 	"testing/fstest"
 
 	"github.com/grafana/grafana/pkg/schema/load"
+	"github.com/laher/mergefs"
 	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/require"
 )
@@ -35,7 +36,7 @@ func TestValidateScuemataBasics(t *testing.T) {
 		filesystem := fstest.MapFS{
 			"cue/data/gen.cue": &fstest.MapFile{Data: genCue},
 		}
-		mergedFS := Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
+		mergedFS := mergefs.Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
 
 		var baseLoadPaths = load.BaseLoadPaths{
 			BaseCueFS:       mergedFS,
@@ -53,7 +54,7 @@ func TestValidateScuemataBasics(t *testing.T) {
 		filesystem := fstest.MapFS{
 			"cue/data/gen.cue": &fstest.MapFile{Data: genCue},
 		}
-		mergedFS := Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
+		mergedFS := mergefs.Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
 
 		var baseLoadPaths = load.BaseLoadPaths{
 			BaseCueFS:       mergedFS,
@@ -78,7 +79,7 @@ func TestValidateScuemataBasics(t *testing.T) {
 			"valid.json":   &fstest.MapFile{Data: validPanel},
 			"invalid.json": &fstest.MapFile{Data: invalidPanel},
 		}
-		mergedFS := Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
+		mergedFS := mergefs.Merge(filesystem, defaultBaseLoadPaths.BaseCueFS)
 
 		var baseLoadPaths = load.BaseLoadPaths{
 			BaseCueFS:       mergedFS,

From a0b78313f3b863b8a1504b59b97333a4910fe00c Mon Sep 17 00:00:00 2001
From: Peter Holmberg <peterholmberg@users.noreply.github.com>
Date: Mon, 24 May 2021 14:20:11 +0200
Subject: [PATCH 29/43] Alerting: Remove unused NGAlerting components (#34568)

---
 .../features/alerting/AlertRuleList.test.tsx  |   1 -
 .../app/features/alerting/AlertRuleList.tsx   |  24 +--
 .../features/alerting/NextGenAlertingPage.tsx | 179 ----------------
 .../components/AlertDefinitionItem.tsx        |  55 -----
 .../components/AlertDefinitionOptions.tsx     |  83 --------
 .../components/AlertingQueryPreview.tsx       | 118 -----------
 .../alerting/components/EmptyState.tsx        |  37 ----
 .../components/PreviewInstancesTab.tsx        |  23 --
 .../alerting/components/PreviewQueryTab.tsx   |  74 -------
 public/app/features/alerting/state/actions.ts | 198 +-----------------
 .../app/features/alerting/state/reducers.ts   |  74 +------
 .../app/features/alerting/state/selectors.ts  |  24 +--
 public/app/routes/routes.tsx                  |  14 --
 public/app/types/alerting.ts                  |  39 +---
 public/app/types/store.ts                     |   3 +-
 15 files changed, 18 insertions(+), 928 deletions(-)
 delete mode 100644 public/app/features/alerting/NextGenAlertingPage.tsx
 delete mode 100644 public/app/features/alerting/components/AlertDefinitionItem.tsx
 delete mode 100644 public/app/features/alerting/components/AlertDefinitionOptions.tsx
 delete mode 100644 public/app/features/alerting/components/AlertingQueryPreview.tsx
 delete mode 100644 public/app/features/alerting/components/EmptyState.tsx
 delete mode 100644 public/app/features/alerting/components/PreviewInstancesTab.tsx
 delete mode 100644 public/app/features/alerting/components/PreviewQueryTab.tsx

diff --git a/public/app/features/alerting/AlertRuleList.test.tsx b/public/app/features/alerting/AlertRuleList.test.tsx
index 19621dd3ed0..935b3d309db 100644
--- a/public/app/features/alerting/AlertRuleList.test.tsx
+++ b/public/app/features/alerting/AlertRuleList.test.tsx
@@ -25,7 +25,6 @@ const setup = (propOverrides?: object) => {
     togglePauseAlertRule: jest.fn(),
     search: '',
     isLoading: false,
-    ngAlertDefinitions: [],
   };
 
   Object.assign(props, propOverrides);
diff --git a/public/app/features/alerting/AlertRuleList.tsx b/public/app/features/alerting/AlertRuleList.tsx
index cd9c75bbec3..b44a2aba32a 100644
--- a/public/app/features/alerting/AlertRuleList.tsx
+++ b/public/app/features/alerting/AlertRuleList.tsx
@@ -5,7 +5,7 @@ import Page from 'app/core/components/Page/Page';
 import AlertRuleItem from './AlertRuleItem';
 import appEvents from 'app/core/app_events';
 import { getNavModel } from 'app/core/selectors/navModel';
-import { AlertDefinition, AlertRule, StoreState } from 'app/types';
+import { AlertRule, StoreState } from 'app/types';
 import { getAlertRulesAsync, togglePauseAlertRule } from './state/actions';
 import { getAlertRuleItems, getSearchQuery } from './state/selectors';
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
@@ -13,7 +13,6 @@ import { SelectableValue } from '@grafana/data';
 import { config, locationService } from '@grafana/runtime';
 import { setSearchQuery } from './state/reducers';
 import { Button, LinkButton, Select, VerticalGroup } from '@grafana/ui';
-import { AlertDefinitionItem } from './components/AlertDefinitionItem';
 import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
 import { ShowModalReactEvent } from '../../types/events';
 import { AlertHowToModal } from './AlertHowToModal';
@@ -24,7 +23,6 @@ function mapStateToProps(state: StoreState) {
     alertRules: getAlertRuleItems(state),
     search: getSearchQuery(state.alertRules),
     isLoading: state.alertRules.isLoading,
-    ngAlertDefinitions: state.alertDefinition.alertDefinitions,
   };
 }
 
@@ -125,23 +123,13 @@ export class AlertRuleListUnconnected extends PureComponent<Props> {
             </Button>
           </div>
           <VerticalGroup spacing="none">
-            {alertRules.map((rule, index) => {
-              // Alert definition has "title" as name property.
-              if (rule.hasOwnProperty('name')) {
-                return (
-                  <AlertRuleItem
-                    rule={rule as AlertRule}
-                    key={rule.id}
-                    search={search}
-                    onTogglePause={() => this.onTogglePause(rule as AlertRule)}
-                  />
-                );
-              }
+            {alertRules.map((rule) => {
               return (
-                <AlertDefinitionItem
-                  key={`${rule.id}-${index}`}
-                  alertDefinition={rule as AlertDefinition}
+                <AlertRuleItem
+                  rule={rule as AlertRule}
+                  key={rule.id}
                   search={search}
+                  onTogglePause={() => this.onTogglePause(rule as AlertRule)}
                 />
               );
             })}
diff --git a/public/app/features/alerting/NextGenAlertingPage.tsx b/public/app/features/alerting/NextGenAlertingPage.tsx
deleted file mode 100644
index 1d84dc6a46b..00000000000
--- a/public/app/features/alerting/NextGenAlertingPage.tsx
+++ /dev/null
@@ -1,179 +0,0 @@
-import React, { FormEvent, PureComponent } from 'react';
-import { hot } from 'react-hot-loader';
-import { connect, ConnectedProps } from 'react-redux';
-import { css } from '@emotion/css';
-import { GrafanaTheme2, SelectableValue } from '@grafana/data';
-import { locationService } from '@grafana/runtime';
-import { PageToolbar, stylesFactory, ToolbarButton, withTheme2, Themeable2 } from '@grafana/ui';
-import { config } from 'app/core/config';
-import { SplitPaneWrapper } from 'app/core/components/SplitPaneWrapper/SplitPaneWrapper';
-import { AlertingQueryEditor } from './components/AlertingQueryEditor';
-import { AlertDefinitionOptions } from './components/AlertDefinitionOptions';
-import { AlertingQueryPreview } from './components/AlertingQueryPreview';
-import {
-  cleanUpDefinitionState,
-  createAlertDefinition,
-  evaluateAlertDefinition,
-  evaluateNotSavedAlertDefinition,
-  getAlertDefinition,
-  updateAlertDefinition,
-  updateAlertDefinitionOption,
-  updateAlertDefinitionUiState,
-} from './state/actions';
-import { StoreState } from 'app/types';
-import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
-import { GrafanaQuery } from '../../types/unified-alerting-dto';
-
-function mapStateToProps(state: StoreState, props: RouteProps) {
-  return {
-    uiState: state.alertDefinition.uiState,
-    getInstances: state.alertDefinition.getInstances,
-    alertDefinition: state.alertDefinition.alertDefinition,
-    pageId: props.match.params.id as string,
-  };
-}
-
-const mapDispatchToProps = {
-  updateAlertDefinitionUiState,
-  updateAlertDefinitionOption,
-  evaluateAlertDefinition,
-  updateAlertDefinition,
-  createAlertDefinition,
-  getAlertDefinition,
-  evaluateNotSavedAlertDefinition,
-  cleanUpDefinitionState,
-};
-
-const connector = connect(mapStateToProps, mapDispatchToProps);
-
-interface RouteProps extends GrafanaRouteComponentProps<{ id: string }> {}
-
-interface OwnProps extends Themeable2 {
-  saveDefinition: typeof createAlertDefinition | typeof updateAlertDefinition;
-}
-
-type Props = OwnProps & ConnectedProps<typeof connector>;
-
-class UnthemedNextGenAlertingPage extends PureComponent<Props> {
-  componentDidMount() {
-    const { getAlertDefinition, pageId } = this.props;
-
-    if (pageId) {
-      getAlertDefinition(pageId);
-    }
-  }
-
-  componentWillUnmount() {
-    this.props.cleanUpDefinitionState();
-  }
-
-  onChangeAlertOption = (event: FormEvent<HTMLElement>) => {
-    const formEvent = event as FormEvent<HTMLFormElement>;
-    this.props.updateAlertDefinitionOption({ [formEvent.currentTarget.name]: formEvent.currentTarget.value });
-  };
-
-  onChangeInterval = (interval: SelectableValue<number>) => {
-    this.props.updateAlertDefinitionOption({
-      intervalSeconds: interval.value,
-    });
-  };
-
-  onConditionChange = (condition: SelectableValue<string>) => {
-    this.props.updateAlertDefinitionOption({
-      condition: condition.value,
-    });
-  };
-
-  onSaveAlert = () => {
-    const { alertDefinition, createAlertDefinition, updateAlertDefinition } = this.props;
-
-    if (alertDefinition.uid) {
-      updateAlertDefinition();
-    } else {
-      createAlertDefinition();
-    }
-  };
-
-  onDiscard = () => {
-    locationService.replace(`${config.appSubUrl}/alerting/ng/list`);
-  };
-
-  onTest = () => {
-    const { alertDefinition, evaluateAlertDefinition, evaluateNotSavedAlertDefinition } = this.props;
-    if (alertDefinition.uid) {
-      evaluateAlertDefinition();
-    } else {
-      evaluateNotSavedAlertDefinition();
-    }
-  };
-
-  renderToolbarActions() {
-    return [
-      <ToolbarButton variant="destructive" key="discard" onClick={this.onDiscard}>
-        Discard
-      </ToolbarButton>,
-      <ToolbarButton key="test" onClick={this.onTest}>
-        Test
-      </ToolbarButton>,
-      <ToolbarButton variant="primary" key="save" onClick={this.onSaveAlert}>
-        Save
-      </ToolbarButton>,
-    ];
-  }
-
-  render() {
-    const { alertDefinition, uiState, updateAlertDefinitionUiState, getInstances, theme } = this.props;
-
-    const styles = getStyles(theme);
-
-    return (
-      <div className={styles.wrapper}>
-        <PageToolbar title="Alert editor" pageIcon="bell">
-          {this.renderToolbarActions()}
-        </PageToolbar>
-        <div className={styles.splitPanesWrapper}>
-          <SplitPaneWrapper
-            leftPaneComponents={[
-              <AlertingQueryPreview key="queryPreview" getInstances={getInstances} queries={[]} onTest={this.onTest} />,
-              <AlertingQueryEditor key="queryEditor" value={[] as GrafanaQuery[]} onChange={() => {}} />,
-            ]}
-            uiState={uiState}
-            updateUiState={updateAlertDefinitionUiState}
-            rightPaneComponents={
-              <AlertDefinitionOptions
-                alertDefinition={alertDefinition}
-                onChange={this.onChangeAlertOption}
-                onIntervalChange={this.onChangeInterval}
-                onConditionChange={this.onConditionChange}
-              />
-            }
-          />
-        </div>
-      </div>
-    );
-  }
-}
-
-const NextGenAlertingPageUnconnected = withTheme2(UnthemedNextGenAlertingPage);
-
-export default hot(module)(connector(NextGenAlertingPageUnconnected));
-
-const getStyles = stylesFactory((theme: GrafanaTheme2) => ({
-  wrapper: css`
-    width: calc(100% - 55px);
-    height: 100%;
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    background: ${theme.colors.background.canvas};
-    display: flex;
-    flex-direction: column;
-  `,
-  splitPanesWrapper: css`
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    width: 100%;
-    position: relative;
-  `,
-}));
diff --git a/public/app/features/alerting/components/AlertDefinitionItem.tsx b/public/app/features/alerting/components/AlertDefinitionItem.tsx
deleted file mode 100644
index 64407a22207..00000000000
--- a/public/app/features/alerting/components/AlertDefinitionItem.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import React, { FC } from 'react';
-// @ts-ignore
-import Highlighter from 'react-highlight-words';
-import { FeatureState } from '@grafana/data';
-import { Card, FeatureBadge, Icon, LinkButton } from '@grafana/ui';
-import { AlertDefinition } from 'app/types';
-import { config } from '@grafana/runtime';
-
-interface Props {
-  alertDefinition: AlertDefinition;
-  search: string;
-}
-
-export const AlertDefinitionItem: FC<Props> = ({ alertDefinition, search }) => {
-  return (
-    <Card heading={CardTitle(alertDefinition.title, search)}>
-      <Card.Figure>
-        <Icon size="xl" name="question-circle" className="alert-rule-item__icon" />
-      </Card.Figure>
-      <Card.Meta>
-        <span key="state">
-          <span key="text">{alertDefinition.description}</span>
-        </span>
-      </Card.Meta>
-      <Card.Actions>
-        {[
-          <LinkButton
-            key="edit"
-            variant="secondary"
-            href={
-              config.featureToggles.ngalert
-                ? `/alerting/ng/${alertDefinition.uid}/edit`
-                : `/alerting/${alertDefinition.uid}/edit`
-            }
-            icon="cog"
-          >
-            Edit alert
-          </LinkButton>,
-        ]}
-      </Card.Actions>
-    </Card>
-  );
-};
-
-const CardTitle = (title: string, search: string) => (
-  <div style={{ display: 'flex', justifyContent: 'space-between', width: '100%' }}>
-    <Highlighter
-      key={title}
-      highlightClassName="highlight-search-match"
-      textToHighlight={title}
-      searchWords={[search]}
-    />
-    <FeatureBadge featureState={FeatureState.beta} />
-  </div>
-);
diff --git a/public/app/features/alerting/components/AlertDefinitionOptions.tsx b/public/app/features/alerting/components/AlertDefinitionOptions.tsx
deleted file mode 100644
index db22fb8d801..00000000000
--- a/public/app/features/alerting/components/AlertDefinitionOptions.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import React, { FC, FormEvent } from 'react';
-import { css } from '@emotion/css';
-import { GrafanaTheme, SelectableValue } from '@grafana/data';
-import { Field, Input, Select, Tab, TabContent, TabsBar, TextArea, useStyles } from '@grafana/ui';
-import { AlertDefinition } from 'app/types';
-
-const intervalOptions: Array<SelectableValue<number>> = [
-  { value: 60, label: '1m' },
-  { value: 300, label: '5m' },
-  { value: 600, label: '10m' },
-];
-
-interface Props {
-  alertDefinition: AlertDefinition;
-  onChange: (event: FormEvent<HTMLElement>) => void;
-  onIntervalChange: (interval: SelectableValue<number>) => void;
-  onConditionChange: (refId: SelectableValue<string>) => void;
-}
-
-export const AlertDefinitionOptions: FC<Props> = ({ alertDefinition, onChange, onIntervalChange }) => {
-  const styles = useStyles(getStyles);
-
-  return (
-    <div className={styles.wrapper}>
-      <TabsBar>
-        <Tab label="Alert definition" active={true} />
-      </TabsBar>
-      <TabContent className={styles.container}>
-        <Field label="Title">
-          <Input width={25} name="title" value={alertDefinition.title} onChange={onChange} />
-        </Field>
-        <Field label="Description" description="What does the alert do? Why was it created?">
-          <TextArea
-            rows={5}
-            width={25}
-            name="description"
-            value={alertDefinition.description}
-            onChange={onChange}
-            readOnly={true}
-          />
-        </Field>
-        <Field label="Evaluate">
-          <div className={styles.optionRow}>
-            <span className={styles.optionName}>Every</span>
-            <Select
-              onChange={onIntervalChange}
-              value={intervalOptions.find((i) => i.value === alertDefinition.intervalSeconds)}
-              options={intervalOptions}
-              width={10}
-            />
-          </div>
-        </Field>
-        <Field label="Conditions">
-          <div />
-        </Field>
-      </TabContent>
-    </div>
-  );
-};
-
-const getStyles = (theme: GrafanaTheme) => {
-  return {
-    wrapper: css`
-      padding-top: ${theme.spacing.md};
-      height: 100%;
-    `,
-    container: css`
-      padding: ${theme.spacing.md};
-      background-color: ${theme.colors.panelBg};
-      height: 100%;
-      border-left: 1px solid ${theme.colors.border1};
-    `,
-    optionRow: css`
-      display: flex;
-      align-items: baseline;
-    `,
-    optionName: css`
-      font-size: ${theme.typography.size.md};
-      color: ${theme.colors.formInputText};
-      margin-right: ${theme.spacing.sm};
-    `,
-  };
-};
diff --git a/public/app/features/alerting/components/AlertingQueryPreview.tsx b/public/app/features/alerting/components/AlertingQueryPreview.tsx
deleted file mode 100644
index fc632589a58..00000000000
--- a/public/app/features/alerting/components/AlertingQueryPreview.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import React, { FC, useState } from 'react';
-import { css } from '@emotion/css';
-import AutoSizer from 'react-virtualized-auto-sizer';
-import { DataFrame, DataQuery, GrafanaTheme, PanelData } from '@grafana/data';
-import { Icon, Tab, TabContent, TabsBar, useStyles } from '@grafana/ui';
-import { PreviewQueryTab } from './PreviewQueryTab';
-import { PreviewInstancesTab } from './PreviewInstancesTab';
-import { EmptyState } from './EmptyState';
-
-enum Tabs {
-  Query = 'query',
-  Instances = 'instances',
-}
-
-const tabs = [
-  { id: Tabs.Query, text: 'Query result' },
-  { id: Tabs.Instances, text: 'Alerting instances' },
-];
-
-interface Props {
-  getInstances: () => DataFrame[];
-  queries: DataQuery[];
-  onTest: () => void;
-}
-
-export const AlertingQueryPreview: FC<Props> = ({ getInstances, onTest, queries }) => {
-  const [activeTab, setActiveTab] = useState<string>(Tabs.Query);
-  const styles = useStyles(getStyles);
-
-  let data = {} as PanelData;
-
-  const instances = getInstances();
-
-  return (
-    <div className={styles.wrapper}>
-      <TabsBar>
-        {tabs.map((tab, index) => {
-          return (
-            <Tab
-              key={`${tab.id}-${index}`}
-              label={tab.text}
-              onChangeTab={() => setActiveTab(tab.id)}
-              active={activeTab === tab.id}
-            />
-          );
-        })}
-      </TabsBar>
-      <TabContent className={styles.tabContent}>
-        {data &&
-          (data.state === 'Error' ? (
-            <EmptyState title="There was an error :(">
-              <div>{data.error?.data?.error}</div>
-            </EmptyState>
-          ) : (
-            <QueriesAndInstances
-              instances={instances}
-              onTest={onTest}
-              data={data}
-              activeTab={activeTab}
-              queries={queries}
-            />
-          ))}
-      </TabContent>
-    </div>
-  );
-};
-
-interface PreviewProps {
-  queries: DataQuery[];
-  instances: DataFrame[];
-  onTest: () => void;
-  data: PanelData;
-  activeTab: string;
-}
-
-const QueriesAndInstances: FC<PreviewProps> = ({ queries, instances, onTest, data, activeTab }) => {
-  if (queries.length === 0) {
-    return (
-      <EmptyState title="No queries added.">
-        <div>Start adding queries to this alert and a visualisation for your queries will appear here.</div>
-        <div>
-          Learn more about how to create alert definitions <Icon name="external-link-alt" />
-        </div>
-      </EmptyState>
-    );
-  }
-
-  return (
-    <AutoSizer style={{ width: '100%', height: '100%' }}>
-      {({ width, height }) => {
-        switch (activeTab) {
-          case Tabs.Instances:
-            return <PreviewInstancesTab instances={instances} width={width} height={height} onTest={onTest} />;
-
-          case Tabs.Query:
-          default:
-            return <PreviewQueryTab data={data} width={width} height={height} />;
-        }
-      }}
-    </AutoSizer>
-  );
-};
-
-const getStyles = (theme: GrafanaTheme) => {
-  return {
-    wrapper: css`
-      display: flex;
-      flex-direction: column;
-      width: 100%;
-      height: 100%;
-      padding: ${theme.spacing.md} 0 0 ${theme.spacing.md};
-    `,
-    tabContent: css`
-      background: ${theme.colors.panelBg};
-      height: 100%;
-    `,
-  };
-};
diff --git a/public/app/features/alerting/components/EmptyState.tsx b/public/app/features/alerting/components/EmptyState.tsx
deleted file mode 100644
index 9e517b04659..00000000000
--- a/public/app/features/alerting/components/EmptyState.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import React, { FC, ReactNode } from 'react';
-import { css } from '@emotion/css';
-import { useStyles } from '@grafana/ui';
-import { GrafanaTheme } from '@grafana/data';
-
-interface Props {
-  title: string;
-  children: ReactNode | ReactNode[];
-}
-
-export const EmptyState: FC<Props> = ({ children, title }) => {
-  const styles = useStyles(getStyles);
-
-  return (
-    <div className={styles.emptyState}>
-      <h4 className={styles.emptyStateHeader}>{title}</h4>
-      {children}
-    </div>
-  );
-};
-
-const getStyles = (theme: GrafanaTheme) => {
-  return {
-    emptyState: css`
-      color: ${theme.colors.textSemiWeak};
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      height: 100%;
-      width: 100%;
-    `,
-    emptyStateHeader: css`
-      color: ${theme.colors.textSemiWeak};
-    `,
-  };
-};
diff --git a/public/app/features/alerting/components/PreviewInstancesTab.tsx b/public/app/features/alerting/components/PreviewInstancesTab.tsx
deleted file mode 100644
index 32b9081b5b5..00000000000
--- a/public/app/features/alerting/components/PreviewInstancesTab.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React, { FC } from 'react';
-import { DataFrame } from '@grafana/data';
-import { Button, Table } from '@grafana/ui';
-import { EmptyState } from './EmptyState';
-
-interface Props {
-  instances: DataFrame[];
-  width: number;
-  height: number;
-  onTest: () => void;
-}
-
-export const PreviewInstancesTab: FC<Props> = ({ instances, onTest, height, width }) => {
-  if (!instances.length) {
-    return (
-      <EmptyState title="You haven’t tested your alert yet.">
-        <div>In order to see your instances, you need to test your alert first.</div>
-        <Button onClick={onTest}>Test alert now</Button>
-      </EmptyState>
-    );
-  }
-  return <Table data={instances[0]} height={height} width={width} />;
-};
diff --git a/public/app/features/alerting/components/PreviewQueryTab.tsx b/public/app/features/alerting/components/PreviewQueryTab.tsx
deleted file mode 100644
index 29ddf155352..00000000000
--- a/public/app/features/alerting/components/PreviewQueryTab.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import React, { FC, useMemo, useState } from 'react';
-import { css } from '@emotion/css';
-import { getFrameDisplayName, GrafanaTheme, PanelData, SelectableValue } from '@grafana/data';
-import { Button, Select, stylesFactory, Table, useTheme } from '@grafana/ui';
-import { EmptyState } from './EmptyState';
-
-interface Props {
-  data: PanelData;
-  width: number;
-  height: number;
-}
-
-export const PreviewQueryTab: FC<Props> = ({ data, height, width }) => {
-  const [currentSeries, setSeries] = useState<number>(0);
-  const theme = useTheme();
-  const styles = getStyles(theme, height);
-  const series = useMemo<Array<SelectableValue<number>>>(() => {
-    if (data?.series) {
-      return data.series.map((frame, index) => ({ value: index, label: getFrameDisplayName(frame) }));
-    }
-
-    return [];
-  }, [data]);
-
-  // Select padding
-  const padding = 16;
-
-  if (!data) {
-    return (
-      <EmptyState title="Run queries to view data.">
-        <Button>Run queries</Button>
-      </EmptyState>
-    );
-  }
-
-  if (!data.series) {
-    return null;
-  }
-
-  if (data.series.length > 1) {
-    return (
-      <div className={styles.wrapper}>
-        <div style={{ height: height - theme.spacing.formInputHeight - 16 }}>
-          <Table
-            data={data.series[currentSeries]}
-            height={height - theme.spacing.formInputHeight - padding}
-            width={width}
-          />
-        </div>
-        <div className={styles.selectWrapper}>
-          <Select
-            onChange={(selectedValue) => setSeries(selectedValue.value!)}
-            options={series}
-            value={currentSeries}
-          />
-        </div>
-      </div>
-    );
-  }
-
-  return <Table data={data.series[0]} height={height} width={width} />;
-};
-
-const getStyles = stylesFactory((theme: GrafanaTheme, height: number) => {
-  return {
-    wrapper: css`
-      label: preview-wrapper;
-      height: ${height}px;
-    `,
-    selectWrapper: css`
-      padding: ${theme.spacing.md};
-    `,
-  };
-});
diff --git a/public/app/features/alerting/state/actions.ts b/public/app/features/alerting/state/actions.ts
index c3871f049f5..99b65bbd86c 100644
--- a/public/app/features/alerting/state/actions.ts
+++ b/public/app/features/alerting/state/actions.ts
@@ -1,50 +1,13 @@
-import {
-  AppEvents,
-  applyFieldOverrides,
-  dataFrameFromJSON,
-  DataFrameJSON,
-  DataQuery,
-  DataSourceApi,
-} from '@grafana/data';
-import { config, getBackendSrv, getDataSourceSrv, locationService } from '@grafana/runtime';
+import { AppEvents } from '@grafana/data';
+import { getBackendSrv, locationService } from '@grafana/runtime';
 import { appEvents } from 'app/core/core';
-import store from 'app/core/store';
-import {
-  ALERT_DEFINITION_UI_STATE_STORAGE_KEY,
-  cleanUpState,
-  loadAlertRules,
-  loadedAlertRules,
-  notificationChannelLoaded,
-  setAlertDefinition,
-  setAlertDefinitions,
-  setInstanceData,
-  setNotificationChannels,
-  setUiState,
-  updateAlertDefinitionOptions,
-} from './reducers';
-import {
-  AlertDefinition,
-  AlertDefinitionState,
-  AlertDefinitionUiState,
-  AlertRuleDTO,
-  NotifierDTO,
-  QueryGroupDataSource,
-  QueryGroupOptions,
-  ThunkResult,
-} from 'app/types';
-import { ExpressionDatasourceID } from '../../expressions/ExpressionDatasource';
-import { isExpressionQuery } from 'app/features/expressions/guards';
+import { loadAlertRules, loadedAlertRules, notificationChannelLoaded, setNotificationChannels } from './reducers';
+import { AlertRuleDTO, NotifierDTO, ThunkResult } from 'app/types';
 
 export function getAlertRulesAsync(options: { state: string }): ThunkResult<void> {
   return async (dispatch) => {
     dispatch(loadAlertRules());
     const rules: AlertRuleDTO[] = await getBackendSrv().get('/api/alerts', options);
-
-    if (config.featureToggles.ngalert) {
-      const ngAlertDefinitions = await getBackendSrv().get('/api/alert-definitions');
-      dispatch(setAlertDefinitions(ngAlertDefinitions.results));
-    }
-
     dispatch(loadedAlertRules(rules));
   };
 }
@@ -109,156 +72,3 @@ export function loadNotificationChannel(id: number): ThunkResult<void> {
     dispatch(notificationChannelLoaded(notificationChannel));
   };
 }
-
-export function getAlertDefinition(id: string): ThunkResult<void> {
-  return async (dispatch) => {
-    const alertDefinition = await getBackendSrv().get(`/api/alert-definitions/${id}`);
-    dispatch(setAlertDefinition(alertDefinition));
-  };
-}
-
-export function createAlertDefinition(): ThunkResult<void> {
-  return async (dispatch, getStore) => {
-    const alertDefinition = await buildAlertDefinition(getStore().alertDefinition);
-    await getBackendSrv().post(`/api/alert-definitions`, alertDefinition);
-    appEvents.emit(AppEvents.alertSuccess, ['Alert definition created']);
-    locationService.push('/alerting/ng/list');
-  };
-}
-
-export function updateAlertDefinition(): ThunkResult<void> {
-  return async (dispatch, getStore) => {
-    const alertDefinition = await buildAlertDefinition(getStore().alertDefinition);
-
-    const updatedAlertDefinition = await getBackendSrv().put(
-      `/api/alert-definitions/${alertDefinition.uid}`,
-      alertDefinition
-    );
-    appEvents.emit(AppEvents.alertSuccess, ['Alert definition updated']);
-    dispatch(setAlertDefinition(updatedAlertDefinition));
-  };
-}
-
-export function updateAlertDefinitionUiState(uiState: Partial<AlertDefinitionUiState>): ThunkResult<void> {
-  return (dispatch, getStore) => {
-    const nextState = { ...getStore().alertDefinition.uiState, ...uiState };
-    dispatch(setUiState(nextState));
-
-    try {
-      store.setObject(ALERT_DEFINITION_UI_STATE_STORAGE_KEY, nextState);
-    } catch (error) {
-      console.error(error);
-    }
-  };
-}
-
-export function updateAlertDefinitionOption(alertDefinition: Partial<AlertDefinition>): ThunkResult<void> {
-  return (dispatch) => {
-    dispatch(updateAlertDefinitionOptions(alertDefinition));
-  };
-}
-
-export function evaluateAlertDefinition(): ThunkResult<void> {
-  return async (dispatch, getStore) => {
-    const { alertDefinition } = getStore().alertDefinition;
-
-    const response: { instances: DataFrameJSON[] } = await getBackendSrv().get(
-      `/api/alert-definitions/eval/${alertDefinition.uid}`
-    );
-
-    const handledResponse = handleJSONResponse(response.instances);
-
-    dispatch(setInstanceData(handledResponse));
-    appEvents.emit(AppEvents.alertSuccess, ['Alert definition tested successfully']);
-  };
-}
-
-export function evaluateNotSavedAlertDefinition(): ThunkResult<void> {
-  return async (dispatch, getStore) => {
-    const { alertDefinition } = getStore().alertDefinition;
-    const defaultDataSource = await getDataSourceSrv().get(null);
-
-    const response: { instances: DataFrameJSON[] } = await getBackendSrv().post('/api/alert-definitions/eval', {
-      condition: alertDefinition.condition,
-      data: buildDataQueryModel({} as QueryGroupOptions, defaultDataSource),
-    });
-
-    const handledResponse = handleJSONResponse(response.instances);
-    dispatch(setInstanceData(handledResponse));
-    appEvents.emit(AppEvents.alertSuccess, ['Alert definition tested successfully']);
-  };
-}
-
-export function cleanUpDefinitionState(): ThunkResult<void> {
-  return (dispatch) => {
-    dispatch(cleanUpState(undefined));
-  };
-}
-
-async function buildAlertDefinition(state: AlertDefinitionState) {
-  const queryOptions = {} as QueryGroupOptions;
-  const currentAlertDefinition = state.alertDefinition;
-  const defaultDataSource = await getDataSourceSrv().get(null);
-
-  return {
-    ...currentAlertDefinition,
-    data: buildDataQueryModel(queryOptions, defaultDataSource),
-  };
-}
-
-function handleJSONResponse(frames: DataFrameJSON[]) {
-  const dataFrames = frames.map((instance) => {
-    return dataFrameFromJSON(instance);
-  });
-
-  return applyFieldOverrides({
-    data: dataFrames,
-    fieldConfig: {
-      defaults: {},
-      overrides: [],
-    },
-    replaceVariables: (value: any) => value,
-    theme: config.theme2,
-  });
-}
-
-function buildDataQueryModel(queryOptions: QueryGroupOptions, defaultDataSource: DataSourceApi) {
-  return queryOptions.queries.map((query: DataQuery) => {
-    if (isExpressionQuery(query)) {
-      const dataSource: QueryGroupDataSource = {
-        name: ExpressionDatasourceID,
-        uid: ExpressionDatasourceID,
-      };
-
-      return {
-        model: {
-          ...query,
-          type: query.type,
-          datasource: dataSource.name,
-          datasourceUid: dataSource.uid,
-        },
-        refId: query.refId,
-      };
-    }
-
-    const dataSourceSetting = getDataSourceSrv().getInstanceSettings(query.datasource);
-    const dataSource: QueryGroupDataSource = {
-      name: dataSourceSetting?.name ?? defaultDataSource.name,
-      uid: dataSourceSetting?.uid ?? defaultDataSource.uid,
-    };
-
-    return {
-      model: {
-        ...query,
-        type: query.queryType,
-        datasource: dataSource.name,
-        datasourceUid: dataSource.uid,
-      },
-      refId: query.refId,
-      relativeTimeRange: {
-        from: 600,
-        to: 0,
-      },
-    };
-  });
-}
diff --git a/public/app/features/alerting/state/reducers.ts b/public/app/features/alerting/state/reducers.ts
index c44e40d7351..9de18c88ba5 100644
--- a/public/app/features/alerting/state/reducers.ts
+++ b/public/app/features/alerting/state/reducers.ts
@@ -1,11 +1,7 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
-import { DataFrame, dateTime } from '@grafana/data';
+import { dateTime } from '@grafana/data';
 import alertDef from './alertDef';
 import {
-  AlertDefinition,
-  AlertDefinitionDTO,
-  AlertDefinitionState,
-  AlertDefinitionUiState,
   AlertRule,
   AlertRuleDTO,
   AlertRulesState,
@@ -13,12 +9,8 @@ import {
   NotificationChannelState,
   NotifierDTO,
 } from 'app/types';
-import store from 'app/core/store';
 import unifiedAlertingReducer from '../unified/state/reducers';
 
-export const ALERT_DEFINITION_UI_STATE_STORAGE_KEY = 'grafana.alerting.alertDefinition.ui';
-const DEFAULT_ALERT_DEFINITION_UI_STATE: AlertDefinitionUiState = { rightPaneSize: 400, topPaneSize: 0.45 };
-
 export const initialState: AlertRulesState = {
   items: [],
   searchQuery: '',
@@ -31,24 +23,6 @@ export const initialChannelState: NotificationChannelState = {
   notifiers: [],
 };
 
-export const initialAlertDefinitionState: AlertDefinitionState = {
-  alertDefinition: {
-    id: 0,
-    uid: '',
-    title: '',
-    description: '',
-    condition: '',
-    data: [],
-    intervalSeconds: 60,
-  },
-  uiState: { ...store.getObject(ALERT_DEFINITION_UI_STATE_STORAGE_KEY, DEFAULT_ALERT_DEFINITION_UI_STATE) },
-  data: [],
-  alertDefinitions: [] as AlertDefinition[],
-  /* These are functions as they are mutated later on and redux toolkit will Object.freeze state so
-   * we need to store these using functions instead */
-  getInstances: () => [] as DataFrame[],
-};
-
 function convertToAlertRule(dto: AlertRuleDTO, state: string): AlertRule {
   const stateModel = alertDef.getStateDisplayModel(state);
 
@@ -135,41 +109,6 @@ const notificationChannelSlice = createSlice({
   },
 });
 
-const alertDefinitionSlice = createSlice({
-  name: 'alertDefinition',
-  initialState: initialAlertDefinitionState,
-  reducers: {
-    setAlertDefinition: (state: AlertDefinitionState, action: PayloadAction<AlertDefinitionDTO>) => {
-      state.alertDefinition.title = action.payload.title;
-      state.alertDefinition.id = action.payload.id;
-      state.alertDefinition.uid = action.payload.uid;
-      state.alertDefinition.condition = action.payload.condition;
-      state.alertDefinition.intervalSeconds = action.payload.intervalSeconds;
-      state.alertDefinition.data = action.payload.data;
-      state.alertDefinition.description = action.payload.description;
-    },
-    updateAlertDefinitionOptions: (state: AlertDefinitionState, action: PayloadAction<Partial<AlertDefinition>>) => {
-      state.alertDefinition = { ...state.alertDefinition, ...action.payload };
-    },
-    setUiState: (state: AlertDefinitionState, action: PayloadAction<AlertDefinitionUiState>) => {
-      state.uiState = { ...state.uiState, ...action.payload };
-    },
-    setAlertDefinitions: (state: AlertDefinitionState, action: PayloadAction<AlertDefinition[]>) => {
-      state.alertDefinitions = action.payload;
-    },
-    setInstanceData: (state: AlertDefinitionState, action: PayloadAction<DataFrame[]>) => {
-      state.getInstances = () => action.payload;
-    },
-    cleanUpState: (state: AlertDefinitionState, action: PayloadAction<undefined>) => {
-      state.alertDefinitions = initialAlertDefinitionState.alertDefinitions;
-      state.alertDefinition = initialAlertDefinitionState.alertDefinition;
-      state.data = initialAlertDefinitionState.data;
-      state.getInstances = initialAlertDefinitionState.getInstances;
-      state.uiState = initialAlertDefinitionState.uiState;
-    },
-  },
-});
-
 export const { loadAlertRules, loadedAlertRules, setSearchQuery } = alertRulesSlice.actions;
 
 export const {
@@ -178,23 +117,12 @@ export const {
   resetSecureField,
 } = notificationChannelSlice.actions;
 
-export const {
-  setUiState,
-  updateAlertDefinitionOptions,
-  setAlertDefinitions,
-  setAlertDefinition,
-  setInstanceData,
-  cleanUpState,
-} = alertDefinitionSlice.actions;
-
 export const alertRulesReducer = alertRulesSlice.reducer;
 export const notificationChannelReducer = notificationChannelSlice.reducer;
-export const alertDefinitionsReducer = alertDefinitionSlice.reducer;
 
 export default {
   alertRules: alertRulesReducer,
   notificationChannel: notificationChannelReducer,
-  alertDefinition: alertDefinitionsReducer,
   unifiedAlerting: unifiedAlertingReducer,
 };
 
diff --git a/public/app/features/alerting/state/selectors.ts b/public/app/features/alerting/state/selectors.ts
index 3db0c20e2da..f51e66ce8a4 100644
--- a/public/app/features/alerting/state/selectors.ts
+++ b/public/app/features/alerting/state/selectors.ts
@@ -1,27 +1,13 @@
-import { AlertDefinition, AlertRule, AlertRulesState, NotificationChannelState, StoreState } from 'app/types';
-import { config } from '@grafana/runtime';
+import { AlertRule, AlertRulesState, NotificationChannelState, StoreState } from 'app/types';
 
 export const getSearchQuery = (state: AlertRulesState) => state.searchQuery;
 
-export const getAlertRuleItems = (state: StoreState) => {
+export const getAlertRuleItems = (state: StoreState): AlertRule[] => {
   const regex = new RegExp(state.alertRules.searchQuery, 'i');
-  const result: Array<AlertRule | AlertDefinition> = [];
 
-  result.push(
-    ...state.alertRules.items.filter((item) => {
-      return regex.test(item.name) || regex.test(item.stateText) || regex.test(item.info!);
-    })
-  );
-
-  if (config.featureToggles.ngalert) {
-    result.push(
-      ...state.alertDefinition.alertDefinitions.filter((item) => {
-        return regex.test(item.title);
-      })
-    );
-  }
-
-  return result;
+  return state.alertRules.items.filter((item) => {
+    return regex.test(item.name) || regex.test(item.stateText) || regex.test(item.info!);
+  });
 };
 
 export const getNotificationChannel = (state: NotificationChannelState, channelId: number) => {
diff --git a/public/app/routes/routes.tsx b/public/app/routes/routes.tsx
index c3e246d69c0..9520220e7e1 100644
--- a/public/app/routes/routes.tsx
+++ b/public/app/routes/routes.tsx
@@ -439,13 +439,6 @@ export function getAppRoutes(): RouteDescriptor[] {
         () => import(/* webpackChunkName: "AlertingRuleForm"*/ 'app/features/alerting/unified/RuleEditor')
       ),
     },
-    {
-      path: '/alerting/ng/new',
-      pageClass: 'page-alerting',
-      component: SafeDynamicImport(
-        () => import(/* webpackChunkName: "NgAlertingPage"*/ 'app/features/alerting/NextGenAlertingPage')
-      ),
-    },
     {
       path: '/alerting/:id/edit',
       pageClass: 'page-alerting',
@@ -453,13 +446,6 @@ export function getAppRoutes(): RouteDescriptor[] {
         () => import(/* webpackChunkName: "AlertingRuleForm"*/ 'app/features/alerting/unified/RuleEditor')
       ),
     },
-    {
-      path: '/alerting/ng/:id/edit',
-      pageClass: 'page-alerting',
-      component: SafeDynamicImport(
-        () => import(/* webpackChunkName: "NgAlertingPage"*/ 'app/features/alerting/NextGenAlertingPage')
-      ),
-    },
     {
       path: '/playlists',
       component: SafeDynamicImport(
diff --git a/public/app/types/alerting.ts b/public/app/types/alerting.ts
index 29ffcf163ef..aff14234045 100644
--- a/public/app/types/alerting.ts
+++ b/public/app/types/alerting.ts
@@ -1,5 +1,4 @@
-import { DataFrame, DataQuery, PanelData, SelectableValue, TimeRange } from '@grafana/data';
-import { ExpressionQuery } from '../features/expressions/types';
+import { SelectableValue } from '@grafana/data';
 
 export interface AlertRuleDTO {
   id: number;
@@ -155,42 +154,6 @@ export interface AlertNotification {
   type: string;
 }
 
-export interface AlertDefinitionState {
-  uiState: AlertDefinitionUiState;
-  alertDefinition: AlertDefinition;
-  data: PanelData[];
-  alertDefinitions: AlertDefinition[];
-  getInstances: () => DataFrame[];
-}
-
-export interface AlertDefinition {
-  id: number;
-  uid: string;
-  title: string;
-  description: string;
-  condition: string;
-  data: any[];
-  intervalSeconds: number;
-}
-
-export interface AlertDefinitionDTO extends AlertDefinition {
-  queryType: string;
-  refId: string;
-  relativeTimeRange: TimeRange;
-  orgId: number;
-  updated: string;
-  version: number;
-}
-
-export interface AlertDefinitionQueryModel {
-  model: DataQuery | ExpressionQuery;
-}
-
-export interface AlertDefinitionUiState {
-  rightPaneSize: number;
-  topPaneSize: number;
-}
-
 export interface AnnotationItemDTO {
   id: number;
   alertId: number;
diff --git a/public/app/types/store.ts b/public/app/types/store.ts
index ad3ae7b1f14..55258e032d2 100644
--- a/public/app/types/store.ts
+++ b/public/app/types/store.ts
@@ -1,7 +1,7 @@
 import { ThunkAction, ThunkDispatch as GenericThunkDispatch } from 'redux-thunk';
 import { PayloadAction } from '@reduxjs/toolkit';
 import { NavIndex } from '@grafana/data';
-import { AlertDefinitionState, AlertRulesState, NotificationChannelState } from './alerting';
+import { AlertRulesState, NotificationChannelState } from './alerting';
 import { UnifiedAlertingState } from '../features/alerting/unified/state/reducers';
 import { TeamsState, TeamState } from './teams';
 import { FolderState } from './folders';
@@ -41,7 +41,6 @@ export interface StoreState {
   templating: TemplatingState;
   importDashboard: ImportDashboardState;
   notificationChannel: NotificationChannelState;
-  alertDefinition: AlertDefinitionState;
   unifiedAlerting: UnifiedAlertingState;
 }
 

From b48832c0f718dcd7b8d0acd72152ceac8ebaec8b Mon Sep 17 00:00:00 2001
From: Sofia Papagiannaki <papagian@users.noreply.github.com>
Date: Mon, 24 May 2021 16:09:29 +0300
Subject: [PATCH 30/43] [Alerting]: alertmanager notifier fixes (#34575)

---
 pkg/services/ngalert/notifier/alertmanager.go |  2 ++
 .../ngalert/notifier/available_channels.go    | 15 +++++++-
 .../alerting/api_available_channel_test.go    | 34 ++++++++++++++++++-
 3 files changed, 49 insertions(+), 2 deletions(-)

diff --git a/pkg/services/ngalert/notifier/alertmanager.go b/pkg/services/ngalert/notifier/alertmanager.go
index 31759307427..c286e015891 100644
--- a/pkg/services/ngalert/notifier/alertmanager.go
+++ b/pkg/services/ngalert/notifier/alertmanager.go
@@ -442,6 +442,8 @@ func (am *Alertmanager) buildReceiverIntegrations(receiver *apimodels.PostableAp
 			n, err = channels.NewThreemaNotifier(cfg, tmpl)
 		case "opsgenie":
 			n, err = channels.NewOpsgenieNotifier(cfg, tmpl)
+		case "prometheus-alertmanager":
+			n, err = channels.NewAlertmanagerNotifier(cfg, tmpl)
 		default:
 			return nil, fmt.Errorf("notifier %s is not supported", r.Type)
 		}
diff --git a/pkg/services/ngalert/notifier/available_channels.go b/pkg/services/ngalert/notifier/available_channels.go
index 84014630ae9..6fbbb6962b3 100644
--- a/pkg/services/ngalert/notifier/available_channels.go
+++ b/pkg/services/ngalert/notifier/available_channels.go
@@ -638,7 +638,7 @@ func GetAvailableNotifiers() []*alerting.NotifierPlugin {
 			},
 		},
 		{
-			Type:        "alertmanager",
+			Type:        "prometheus-alertmanager",
 			Name:        "Alertmanager",
 			Description: "Sends notifications to Alertmanager",
 			Heading:     "Alertmanager Settings",
@@ -651,6 +651,19 @@ func GetAvailableNotifiers() []*alerting.NotifierPlugin {
 					PropertyName: "url",
 					Required:     true,
 				},
+				{
+					Label:        "Basic Auth User",
+					Element:      alerting.ElementTypeInput,
+					InputType:    alerting.InputTypeText,
+					PropertyName: "basicAuthUser",
+				},
+				{
+					Label:        "Basic Auth Password",
+					Element:      alerting.ElementTypeInput,
+					InputType:    alerting.InputTypePassword,
+					PropertyName: "basicAuthPassword",
+					Secure:       true,
+				},
 			},
 		},
 		{
diff --git a/pkg/tests/api/alerting/api_available_channel_test.go b/pkg/tests/api/alerting/api_available_channel_test.go
index c891c42a220..57e225d3f85 100644
--- a/pkg/tests/api/alerting/api_available_channel_test.go
+++ b/pkg/tests/api/alerting/api_available_channel_test.go
@@ -1291,7 +1291,7 @@ var expAvailableChannelJsonOutput = `
     ]
   },
   {
-    "type": "alertmanager",
+    "type": "prometheus-alertmanager",
     "name": "Alertmanager",
     "heading": "Alertmanager Settings",
     "description": "Sends notifications to Alertmanager",
@@ -1312,6 +1312,38 @@ var expAvailableChannelJsonOutput = `
         "required": true,
         "validationRule": "",
         "secure": false
+      },
+      {
+        "element": "input",
+        "inputType": "text",
+        "label": "Basic Auth User",
+        "description": "",
+	"placeholder": "",
+        "propertyName": "basicAuthUser",
+        "selectOptions": null,
+        "showWhen": {
+          "field": "",
+          "is": ""
+        },
+        "required": false,
+        "validationRule": "",
+        "secure": false
+      },
+      {
+        "element": "input",
+        "inputType": "password",
+        "label": "Basic Auth Password",
+        "description": "",
+	"placeholder": "",
+        "propertyName": "basicAuthPassword",
+        "selectOptions": null,
+        "showWhen": {
+          "field": "",
+          "is": ""
+        },
+        "required": false,
+        "validationRule": "",
+        "secure": true
       }
     ]
   },

From 395d7eb74cdce7c2a405bba80738cd4a3d342784 Mon Sep 17 00:00:00 2001
From: Uchechukwu Obasi <obasiuche62@gmail.com>
Date: Mon, 24 May 2021 14:28:26 +0100
Subject: [PATCH 31/43] DashboardRow: fixes time variable not updating when
 used in row title (#34523)

* DashboardRow: fixes time variable not updating when used in row title

* adds test cases for subscribe event
---
 .../components/DashboardRow/DashboardRow.test.tsx   |  5 +++++
 .../components/DashboardRow/DashboardRow.tsx        | 13 +++++++++----
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/public/app/features/dashboard/components/DashboardRow/DashboardRow.test.tsx b/public/app/features/dashboard/components/DashboardRow/DashboardRow.test.tsx
index df944b049c5..9da5aa3b5b7 100644
--- a/public/app/features/dashboard/components/DashboardRow/DashboardRow.test.tsx
+++ b/public/app/features/dashboard/components/DashboardRow/DashboardRow.test.tsx
@@ -13,6 +13,7 @@ describe('DashboardRow', () => {
       meta: {
         canEdit: true,
       },
+      events: { subscribe: jest.fn() },
     };
 
     panel = new PanelModel({ collapsed: false });
@@ -31,6 +32,10 @@ describe('DashboardRow', () => {
     expect(dashboardMock.toggleRow.mock.calls).toHaveLength(1);
   });
 
+  it('Should subscribe to event during mount', () => {
+    expect(dashboardMock.events.subscribe.mock.calls).toHaveLength(1);
+  });
+
   it('should have two actions as admin', () => {
     expect(wrapper.find('.dashboard-row__actions .pointer')).toHaveLength(2);
   });
diff --git a/public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx b/public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx
index 687eedbe843..4081e2162ef 100644
--- a/public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx
+++ b/public/app/features/dashboard/components/DashboardRow/DashboardRow.tsx
@@ -4,10 +4,10 @@ import { Icon } from '@grafana/ui';
 import { PanelModel } from '../../state/PanelModel';
 import { DashboardModel } from '../../state/DashboardModel';
 import appEvents from 'app/core/app_events';
-import { CoreEvents } from 'app/types';
 import { RowOptionsButton } from '../RowOptions/RowOptionsButton';
 import { getTemplateSrv } from '@grafana/runtime';
-import { ShowConfirmModalEvent } from '../../../../types/events';
+import { RefreshEvent, ShowConfirmModalEvent } from '../../../../types/events';
+import { Unsubscribable } from 'rxjs';
 
 export interface DashboardRowProps {
   panel: PanelModel;
@@ -15,18 +15,23 @@ export interface DashboardRowProps {
 }
 
 export class DashboardRow extends React.Component<DashboardRowProps, any> {
+  sub?: Unsubscribable;
   constructor(props: DashboardRowProps) {
     super(props);
 
     this.state = {
       collapsed: this.props.panel.collapsed,
     };
+  }
 
-    this.props.dashboard.on(CoreEvents.templateVariableValueUpdated, this.onVariableUpdated);
+  componentDidMount() {
+    this.sub = this.props.dashboard.events.subscribe(RefreshEvent, this.onVariableUpdated);
   }
 
   componentWillUnmount() {
-    this.props.dashboard.off(CoreEvents.templateVariableValueUpdated, this.onVariableUpdated);
+    if (this.sub) {
+      this.sub.unsubscribe();
+    }
   }
 
   onVariableUpdated = () => {

From 530072fce784a642314c90459cbd2db6ffb09bd4 Mon Sep 17 00:00:00 2001
From: wangjian <wj0360@foxmail.com>
Date: Mon, 24 May 2021 21:45:29 +0800
Subject: [PATCH 32/43] Elasticsearch: fix NewClient not passing
 httpClientProvider to client impl (#34539)

* Update client.go

fix missing "httpClientProvider" in NewClient

* Update client.go
---
 pkg/tsdb/elasticsearch/client/client.go | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/pkg/tsdb/elasticsearch/client/client.go b/pkg/tsdb/elasticsearch/client/client.go
index 4176c119ad3..d63f17eeb1f 100644
--- a/pkg/tsdb/elasticsearch/client/client.go
+++ b/pkg/tsdb/elasticsearch/client/client.go
@@ -99,12 +99,13 @@ var NewClient = func(ctx context.Context, httpClientProvider httpclient.Provider
 	clientLog.Info("Creating new client", "version", version.String(), "timeField", timeField, "indices", strings.Join(indices, ", "))
 
 	return &baseClientImpl{
-		ctx:       ctx,
-		ds:        ds,
-		version:   version,
-		timeField: timeField,
-		indices:   indices,
-		timeRange: timeRange,
+		ctx:                ctx,
+		httpClientProvider: httpClientProvider,
+		ds:                 ds,
+		version:            version,
+		timeField:          timeField,
+		indices:            indices,
+		timeRange:          timeRange,
 	}, nil
 }
 

From 0afc4c0361a710a883f76851881070e7808a09a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A1bor=20Farkas?= <gabor.farkas@gmail.com>
Date: Mon, 24 May 2021 15:58:59 +0200
Subject: [PATCH 33/43] InfluxDB: InfluxQL query editor: better handling of
 slow queries (#34507)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* InfluxDB: InfluxQL query editor: better handling of slow queries

* adjusted message to be similar to other messages

* simplify code

Co-authored-by: Piotr Jamróz <pm.jamroz@gmail.com>

Co-authored-by: Piotr Jamróz <pm.jamroz@gmail.com>
---
 .../datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx  | 1 +
 1 file changed, 1 insertion(+)

diff --git a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
index cc94d6c288a..b77285e9ac2 100644
--- a/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
+++ b/public/app/plugins/datasource/influxdb/components/VisualInfluxQLEditor/Seg.tsx
@@ -106,6 +106,7 @@ const SelSingleLoad = ({ loadOptions, allowCustomValue, onChange, onClose }: Sel
   return (
     <div className={selectClass}>
       <Select
+        isLoading={loadState.loading}
         formatCreateLabel={formatCreateLabel}
         autoFocus
         isOpen

From 888683a8ad2f0f05d66d5a5d085c230dbba26e33 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Mon, 24 May 2021 16:21:54 +0200
Subject: [PATCH 34/43] RowOptions: Fix enter key updating row options (#34586)

---
 .../features/dashboard/components/RowOptions/RowOptionsForm.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/public/app/features/dashboard/components/RowOptions/RowOptionsForm.tsx b/public/app/features/dashboard/components/RowOptions/RowOptionsForm.tsx
index b135977ad94..6ff45492ed5 100644
--- a/public/app/features/dashboard/components/RowOptions/RowOptionsForm.tsx
+++ b/public/app/features/dashboard/components/RowOptions/RowOptionsForm.tsx
@@ -34,7 +34,7 @@ export const RowOptionsForm: FC<Props> = ({ repeat, title, onUpdate, onCancel })
           </Field>
 
           <Modal.ButtonRow>
-            <Button variant="secondary" onClick={onCancel} fill="outline">
+            <Button type="button" variant="secondary" onClick={onCancel} fill="outline">
               Cancel
             </Button>
             <Button type="submit">Update</Button>

From 3c707c0a30df95bb76f7be1b5ec132704e698511 Mon Sep 17 00:00:00 2001
From: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>
Date: Mon, 24 May 2021 11:25:38 -0700
Subject: [PATCH 35/43] Docs: Update whats-new-in-v8-0.md (#34609)

---
 docs/sources/whatsnew/whats-new-in-v8-0.md | 39 ++++++++++++++++++----
 1 file changed, 33 insertions(+), 6 deletions(-)

diff --git a/docs/sources/whatsnew/whats-new-in-v8-0.md b/docs/sources/whatsnew/whats-new-in-v8-0.md
index 202f8d1fd40..c4c611bbdd0 100644
--- a/docs/sources/whatsnew/whats-new-in-v8-0.md
+++ b/docs/sources/whatsnew/whats-new-in-v8-0.md
@@ -22,30 +22,57 @@ These features are included in the Grafana open source edition.
 
 Library panels allow users to build panels that can be used in multiple dashboards. Any updates made to that shared panel will then automatically be applied to all the dashboards that have that panel.
 
-### Timeline panel
+### Real-time streaming
 
-Shows discrete status or state transitions of something over time. For example daily uptime or multi-sensor and digital I/O status.
+Data sources can now send real-time updates to dashboards over a websocket connection.  This can be used with the [MQTT data source](https://github.com/grafana/mqtt-datasource).
 
-### Bar chart panel
+In addition to data source integration, events can be sent to dashboards by posting metrics to the new live endpoint: `/api/live/push endpoint`.
 
-New visualization that allows categorical data display. Following the new panel architecture supports field config and overrides, common tooltip, and legend options.
+These metrics will be broadcast to all dashboards connected to that stream endpoint.
 
-### Time series panel updates
+### Bar chart visualization (beta)
+
+The Bar chart panel is a new visualization that allows categorical data display.
+
+### State timeline visualization (beta)
+
+This new visualization is designed to display state changes and durations.
+
+### Status grid visualization (beta)
+
+This new visualization is designed to display periodic status history.
+
+### Histogram visualization (beta)
+
+This release introduces a new histogram panel visualization.
+
+### Time series visualization updates
+
+The Time series is out of beta!  We are removing the `Beta` tag and graduating the Time series visualization to a stable state.
 
-The Time series is out of beta!  We are removing the `Beta`tag and graduating the Time series panel to a stable state.
 - **Time series** is now the default visualization option, replacing the **Graph (old)**.
 - The Time series panel now supports stacking. For more information, refer to [Graph stacked time series]({{< relref "../panels/visualizations/time-series/graph-time-series-stacking.md" >}}).
 - You can now add alerts in the Time series panel, just like the old Graph panel.
 - We added support for a shared crosshair and a tooltip that’s now smarter when it comes to data display in the tooltip.
 - Various performance improvements.
 
+[Time series panel]({{< relref "../panels/visualizations/time-series/_index.md" >}}) topics have been updated as a result of these changes.
+
+### Pie chart visualization updates
+
+The Pie chart is out of beta!  We are removing the `Beta` tag and graduating the Pie chart visualization to a stable state.
+
 ### Panel editor updates
 
+Lots of panel editor improvements, heavily informed by user research and community feedback.
+
 - All options are now shown in a single pane.
 - You can now search panel options.
 - Value mapping has been completely redesigned.
 - New **Table view** option is always available.
 
+The [Panels]({{< relref "../panels/_index.md" >}}) section has been updated to reflect these changes.
+
 ### Look and feel update
 
 Grafana 8 comes with a refreshed look and feel, including themes changed to be more accessible. The improved Grafana UI brings a number of adjustments and tweaks that make the application even more fun to use. Enjoy the new home dashboard design!

From 9b518669dd8f54ed2d4089c562f7e712bd3ab880 Mon Sep 17 00:00:00 2001
From: David Parrott <stomp.box.yo@gmail.com>
Date: Mon, 24 May 2021 11:57:58 -0700
Subject: [PATCH 36/43] Alerting WIP update documentation (#34524)

* update alerts index.md

* pr feedback
---
 docs/sources/alerting/_index.md | 40 ++++++++++++++++-----------------
 1 file changed, 19 insertions(+), 21 deletions(-)

diff --git a/docs/sources/alerting/_index.md b/docs/sources/alerting/_index.md
index e420c23118d..bd4e93282cf 100644
--- a/docs/sources/alerting/_index.md
+++ b/docs/sources/alerting/_index.md
@@ -6,39 +6,34 @@ weight = 110
 
 # Alerts overview
 
-Alerts allow you to identify problems in your system moments after they occur. By quickly identifying unintended changes in your system, you can minimize disruptions to your services.
+Alerts allow you to know about problems in your systems moments after they occur. Robust and actionable alerts help you identify and resolve issues quickly, minimizing disruption to your services.
 
-Alerts consists of two parts:
+Alerts have four main components:
 
-- Alert rules - When the alert is triggered. Alert rules are defined by one or more conditions that are regularly evaluated by Grafana.
-- Notification channel - How the alert is delivered. When the conditions of an alert rule are met, the Grafana notifies the channels configured for that alert.
-
-Currently only the graph panel visualization supports alerts.
+- Alert rule - One or more conditions, the frequency of evaluation, and the (optional) duration that a condition must be met before notifying.
+- Contact point - A channel for sending notifications when the conditions of an alert rule are met.
+- Notification policy - A set of matching and grouping criteria used to determine where, and how frequently, to send notifications. 
+- Silences - Date and matching criteria used to silence notifications. 
 
 ## Alert tasks
 
 You can perform the following tasks for alerts:
 
-- [Add or edit an alert notification channel]({{< relref "notifications.md" >}})
 - [Create an alert rule]({{< relref "create-alerts.md" >}})
 - [View existing alert rules and their current state]({{< relref "view-alerts.md" >}})
 - [Test alert rules and troubleshoot]({{< relref "troubleshoot-alerts.md" >}})
+- [Add or edit an alert contact point]({{< relref "notifications.md" >}})
 
 ## Clustering
 
 Currently alerting supports a limited form of high availability. Since v4.2.0 of Grafana, alert notifications are deduped when running multiple servers. This means all alerts are executed on every server but no duplicate alert notifications are sent due to the deduping logic. Proper load balancing of alerts will be introduced in the future.
 
-## Notifications
+## Alert evaluation
 
-You can also set alert rule notifications along with a detailed message about the alert rule. The message can contain anything: information about how you might solve the issue, link to runbook, and so on.
+Grafana managed alerts are evaluated by the Grafana backend. Rule evaluations are scheduled, according to the alert rule configuration, and queries are evaluated by an engine that is part of core Grafana.
 
-The actual notifications are configured and shared between multiple alerts.
-
-## Alert execution
-
-Alert rules are evaluated in the Grafana backend in a scheduler and query execution engine that is part
-of core Grafana. Alert rules can query only backend data sources with alerting enabled. Such data sources are:
-- builtin or developed and maintained by grafana, such as: `Graphite`, `Prometheus`, `Loki`, `InfluxDB`, `Elasticsearch`,
+Alert rules can only query backend data sources with alerting enabled:
+- builtin or developed and maintained by grafana: `Graphite`, `Prometheus`, `Loki`, `InfluxDB`, `Elasticsearch`,
 `Google Cloud Monitoring`, `Cloudwatch`, `Azure Monitor`, `MySQL`, `PostgreSQL`, `MSSQL`, `OpenTSDB`, `Oracle`, and `Azure Data Explorer`
 - any community backend data sources with alerting enabled (`backend` and `alerting` properties are set in the [plugin.json]({{< relref "../developers/plugins/metadata.md" >}}))
 
@@ -46,9 +41,12 @@ of core Grafana. Alert rules can query only backend data sources with alerting e
 
 The alert engine publishes some internal metrics about itself. You can read more about how Grafana publishes [internal metrics]({{< relref "../administration/view-server/internal-metrics.md" >}}).
 
-Description | Type | Metric name
+Metric Name | Type | Description
 ---------- | ----------- | ----------
-Total number of alerts | counter | `alerting.active_alerts`
-Alert execution result | counter | `alerting.result`
-Notifications sent counter | counter | `alerting.notifications_sent`
-Alert execution timer | timer | `alerting.execution_time`
+`alerting.alerts` | gauge | How many alerts by state
+`alerting.request_duration_seconds` | histogram | Histogram of requests to the Alerting API
+`alerting.active_configurations` | gauge | The number of active, non default alertmanager configurations for grafana managed alerts
+`alerting.rule_evaluations_total` | counter | The total number of rule evaluations
+`alerting.rule_evaluation_failures_total` | counter | The total number of rule evaluation failures
+`alerting.rule_evaluation_duration_seconds` | summary | The duration for a rule to execute
+`alerting.rule_group_rules` | gauge | The number of rules

From a337f70469e83556e452acc6a9ef83accf7453e4 Mon Sep 17 00:00:00 2001
From: Sergey Kostrukov <sekost@microsoft.com>
Date: Mon, 24 May 2021 23:19:08 -0700
Subject: [PATCH 37/43] AzureMonitor: Fix Azure token provider national clouds
 (#34615)

* Fix AAD authority for sovereign clouds

* Update Azure SDK with scopes fix

* Credential initialization in cache
---
 go.mod                                      |   8 +-
 go.sum                                      |  16 +-
 pkg/api/pluginproxy/token_cache.go          |  65 +++++--
 pkg/api/pluginproxy/token_cache_test.go     | 183 +++++++++++++++++++-
 pkg/api/pluginproxy/token_provider_azure.go |  77 ++------
 5 files changed, 260 insertions(+), 89 deletions(-)

diff --git a/go.mod b/go.mod
index 4f382baddf2..a227ca86274 100644
--- a/go.mod
+++ b/go.mod
@@ -14,8 +14,8 @@ replace k8s.io/client-go => k8s.io/client-go v0.18.8
 require (
 	cloud.google.com/go/storage v1.14.0
 	cuelang.org/go v0.3.2
-	github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.0
-	github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.8.0
+	github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.1
+	github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.9.1
 	github.com/BurntSushi/toml v0.3.1
 	github.com/Masterminds/semver v1.5.0
 	github.com/VividCortex/mysqlerr v0.0.0-20170204212430-6c6b55f8796f
@@ -94,10 +94,10 @@ require (
 	go.opentelemetry.io/collector v0.25.0
 	golang.org/x/crypto v0.0.0-20210513164829-c07d793c2f9a
 	golang.org/x/exp v0.0.0-20210220032938-85be41e4509f // indirect
-	golang.org/x/net v0.0.0-20210510120150-4163338589ed
+	golang.org/x/net v0.0.0-20210521195947-fe42d452be8f
 	golang.org/x/oauth2 v0.0.0-20210413134643-5e61552d6c78
 	golang.org/x/sync v0.0.0-20210220032951-036812b2e83c
-	golang.org/x/sys v0.0.0-20210514084401-e8d321eab015 // indirect
+	golang.org/x/sys v0.0.0-20210521203332-0cec03c779c1 // indirect
 	golang.org/x/time v0.0.0-20210220033141-f8bda1e9f3ba
 	golang.org/x/tools v0.1.0
 	gonum.org/v1/gonum v0.9.1
diff --git a/go.sum b/go.sum
index 7c57193f70b..ce078b50bf4 100644
--- a/go.sum
+++ b/go.sum
@@ -78,10 +78,10 @@ github.com/Azure/azure-sdk-for-go v51.2.0+incompatible/go.mod h1:9XXNKU+eRnpl9mo
 github.com/Azure/azure-sdk-for-go v52.5.0+incompatible h1:/NLBWHCnIHtZyLPc1P7WIqi4Te4CC23kIQyK3Ep/7lA=
 github.com/Azure/azure-sdk-for-go v52.5.0+incompatible/go.mod h1:9XXNKU+eRnpl9moKnB4QOLf1HestfXbmab5FXxiDBjc=
 github.com/Azure/azure-sdk-for-go/sdk/azcore v0.14.0/go.mod h1:pElNP+u99BvCZD+0jOlhI9OC/NB2IDTOTGZOZH0Qhq8=
-github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.0 h1:ZsS7JltN+5D42mcU3Mb4lwVivlFL89v+FlXXMXE2YEM=
-github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.0/go.mod h1:MVdrcUC4Hup35qHym3VdzoW+NBgBxrta9Vei97jRtM8=
-github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.8.0 h1:wb00szFWtKeIef2Q5X8gdd0mYp8oSHmJOYUh/QXD8sw=
-github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.8.0/go.mod h1:acANgl9stsT5xflESXKjZx4rhZJSr0TGgTDYY0xJPIE=
+github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.1 h1:yQw8Ah26gBP4dv66ZNjZpRBRV+gaHH/0TLn1taU4FZ4=
+github.com/Azure/azure-sdk-for-go/sdk/azcore v0.16.1/go.mod h1:MVdrcUC4Hup35qHym3VdzoW+NBgBxrta9Vei97jRtM8=
+github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.9.1 h1:KchdKK3XlOjkzBROV+q3D+YgfRTvwoeBwbaoX4aVkjI=
+github.com/Azure/azure-sdk-for-go/sdk/azidentity v0.9.1/go.mod h1:acANgl9stsT5xflESXKjZx4rhZJSr0TGgTDYY0xJPIE=
 github.com/Azure/azure-sdk-for-go/sdk/internal v0.5.0/go.mod h1:k4KbFSunV/+0hOHL1vyFaPsiYQ1Vmvy1TBpmtvCDLZM=
 github.com/Azure/azure-sdk-for-go/sdk/internal v0.5.1 h1:vx8McI56N5oLSQu8xa+xdiE0fjQq8W8Zt49vHP8Rygw=
 github.com/Azure/azure-sdk-for-go/sdk/internal v0.5.1/go.mod h1:k4KbFSunV/+0hOHL1vyFaPsiYQ1Vmvy1TBpmtvCDLZM=
@@ -2092,8 +2092,8 @@ golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v
 golang.org/x/net v0.0.0-20210316092652-d523dce5a7f4/go.mod h1:RBQZq4jEuRlivfhVLdyRGr576XBO4/greRjx4P4O3yc=
 golang.org/x/net v0.0.0-20210324051636-2c4c8ecb7826/go.mod h1:RBQZq4jEuRlivfhVLdyRGr576XBO4/greRjx4P4O3yc=
 golang.org/x/net v0.0.0-20210421230115-4e50805a0758/go.mod h1:72T/g9IO56b78aLF+1Kcs5dz7/ng1VjMUvfKvpfy+jM=
-golang.org/x/net v0.0.0-20210510120150-4163338589ed h1:p9UgmWI9wKpfYmgaV/IZKGdXc5qEK45tDwwwDyjS26I=
-golang.org/x/net v0.0.0-20210510120150-4163338589ed/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
+golang.org/x/net v0.0.0-20210521195947-fe42d452be8f h1:Si4U+UcgJzya9kpiEUJKQvjr512OLli+gL4poHrz93U=
+golang.org/x/net v0.0.0-20210521195947-fe42d452be8f/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
 golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.0.0-20181106182150-f42d05182288/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.0.0-20190226205417-e64efc72b421/go.mod h1:gOpvHmFTYa4IltrdGE7lF6nIHvwfUNPOp7c8zoXwtLw=
@@ -2240,8 +2240,8 @@ golang.org/x/sys v0.0.0-20210324051608-47abb6519492/go.mod h1:h1NjWce9XRLGQEsW7w
 golang.org/x/sys v0.0.0-20210412220455-f1c623a9e750/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210420072515-93ed5bcd2bfe/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
-golang.org/x/sys v0.0.0-20210514084401-e8d321eab015 h1:hZR0X1kPW+nwyJ9xRxqZk1vx5RUObAPBdKVvXPDUH/E=
-golang.org/x/sys v0.0.0-20210514084401-e8d321eab015/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.0.0-20210521203332-0cec03c779c1 h1:lCnv+lfrU9FRPGf8NeRuWAAPjNnema5WtBinMgs1fD8=
+golang.org/x/sys v0.0.0-20210521203332-0cec03c779c1/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/term v0.0.0-20201117132131-f5c789dd3221/go.mod h1:Nr5EML6q2oocZ2LXRh80K7BxOlk5/8JxuGnuhpl+muw=
 golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
 golang.org/x/text v0.0.0-20160726164857-2910a502d2bf/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
diff --git a/pkg/api/pluginproxy/token_cache.go b/pkg/api/pluginproxy/token_cache.go
index 91a3d92d361..a8f35867a75 100644
--- a/pkg/api/pluginproxy/token_cache.go
+++ b/pkg/api/pluginproxy/token_cache.go
@@ -5,6 +5,7 @@ import (
 	"sort"
 	"strings"
 	"sync"
+	"sync/atomic"
 	"time"
 )
 
@@ -15,6 +16,7 @@ type AccessToken struct {
 
 type TokenCredential interface {
 	GetCacheKey() string
+	Init() error
 	GetAccessToken(ctx context.Context, scopes []string) (*AccessToken, error)
 }
 
@@ -31,7 +33,10 @@ type tokenCacheImpl struct {
 }
 type credentialCacheEntry struct {
 	credential TokenCredential
-	cache      sync.Map // of *scopesCacheEntry
+
+	credInit  uint32
+	credMutex sync.Mutex
+	cache     sync.Map // of *scopesCacheEntry
 }
 
 type scopesCacheEntry struct {
@@ -44,31 +49,67 @@ type scopesCacheEntry struct {
 }
 
 func (c *tokenCacheImpl) GetAccessToken(ctx context.Context, credential TokenCredential, scopes []string) (string, error) {
+	return c.getEntryFor(credential).getAccessToken(ctx, scopes)
+}
+
+func (c *tokenCacheImpl) getEntryFor(credential TokenCredential) *credentialCacheEntry {
 	var entry interface{}
 	var ok bool
 
-	credentialKey := credential.GetCacheKey()
-	scopesKey := getKeyForScopes(scopes)
+	key := credential.GetCacheKey()
 
-	if entry, ok = c.cache.Load(credentialKey); !ok {
-		entry, _ = c.cache.LoadOrStore(credentialKey, &credentialCacheEntry{
+	if entry, ok = c.cache.Load(key); !ok {
+		entry, _ = c.cache.LoadOrStore(key, &credentialCacheEntry{
 			credential: credential,
 		})
 	}
 
-	credentialEntry := entry.(*credentialCacheEntry)
+	return entry.(*credentialCacheEntry)
+}
 
-	if entry, ok = credentialEntry.cache.Load(scopesKey); !ok {
-		entry, _ = credentialEntry.cache.LoadOrStore(scopesKey, &scopesCacheEntry{
-			credential: credentialEntry.credential,
+func (c *credentialCacheEntry) getAccessToken(ctx context.Context, scopes []string) (string, error) {
+	err := c.ensureInitialized()
+	if err != nil {
+		return "", err
+	}
+
+	return c.getEntryFor(scopes).getAccessToken(ctx)
+}
+
+func (c *credentialCacheEntry) ensureInitialized() error {
+	if atomic.LoadUint32(&c.credInit) == 0 {
+		c.credMutex.Lock()
+		defer c.credMutex.Unlock()
+
+		if c.credInit == 0 {
+			// Initialize credential
+			err := c.credential.Init()
+			if err != nil {
+				return err
+			}
+
+			atomic.StoreUint32(&c.credInit, 1)
+		}
+	}
+
+	return nil
+}
+
+func (c *credentialCacheEntry) getEntryFor(scopes []string) *scopesCacheEntry {
+	var entry interface{}
+	var ok bool
+
+	key := getKeyForScopes(scopes)
+
+	if entry, ok = c.cache.Load(key); !ok {
+		entry, _ = c.cache.LoadOrStore(key, &scopesCacheEntry{
+			credential: c.credential,
 			scopes:     scopes,
 			cond:       sync.NewCond(&sync.Mutex{}),
 		})
 	}
 
-	scopesEntry := entry.(*scopesCacheEntry)
-
-	return scopesEntry.getAccessToken(ctx)
+	return entry.(*scopesCacheEntry)
 }
 
 func (c *scopesCacheEntry) getAccessToken(ctx context.Context) (string, error) {
diff --git a/pkg/api/pluginproxy/token_cache_test.go b/pkg/api/pluginproxy/token_cache_test.go
index 904e64d39b8..4edd67db9ef 100644
--- a/pkg/api/pluginproxy/token_cache_test.go
+++ b/pkg/api/pluginproxy/token_cache_test.go
@@ -14,7 +14,9 @@ import (
 
 type fakeCredential struct {
 	key                string
+	initCalledTimes    int
 	calledTimes        int
+	initFunc           func() error
 	getAccessTokenFunc func(ctx context.Context, scopes []string) (*AccessToken, error)
 }
 
@@ -22,6 +24,19 @@ func (c *fakeCredential) GetCacheKey() string {
 	return c.key
 }
 
+func (c *fakeCredential) Reset() {
+	c.initCalledTimes = 0
+	c.calledTimes = 0
+}
+
+func (c *fakeCredential) Init() error {
+	c.initCalledTimes = c.initCalledTimes + 1
+	if c.initFunc != nil {
+		return c.initFunc()
+	}
+	return nil
+}
+
 func (c *fakeCredential) GetAccessToken(ctx context.Context, scopes []string) (*AccessToken, error) {
 	c.calledTimes = c.calledTimes + 1
 	if c.getAccessTokenFunc != nil {
@@ -103,12 +118,168 @@ func TestConcurrentTokenCache_GetAccessToken(t *testing.T) {
 	})
 }
 
+func TestCredentialCacheEntry_EnsureInitialized(t *testing.T) {
+	t.Run("when credential init returns error", func(t *testing.T) {
+		credential := &fakeCredential{
+			initFunc: func() error {
+				return errors.New("unable to initialize")
+			},
+		}
+
+		t.Run("should return error", func(t *testing.T) {
+			cacheEntry := &credentialCacheEntry{
+				credential: credential,
+			}
+
+			err := cacheEntry.ensureInitialized()
+
+			assert.Error(t, err)
+		})
+
+		t.Run("should call init again each time and return error", func(t *testing.T) {
+			credential.Reset()
+
+			cacheEntry := &credentialCacheEntry{
+				credential: credential,
+			}
+
+			var err error
+			err = cacheEntry.ensureInitialized()
+			assert.Error(t, err)
+
+			err = cacheEntry.ensureInitialized()
+			assert.Error(t, err)
+
+			err = cacheEntry.ensureInitialized()
+			assert.Error(t, err)
+
+			assert.Equal(t, 3, credential.initCalledTimes)
+		})
+	})
+
+	t.Run("when credential init returns error only once", func(t *testing.T) {
+		var times = 0
+		credential := &fakeCredential{
+			initFunc: func() error {
+				times = times + 1
+				if times == 1 {
+					return errors.New("unable to initialize")
+				}
+				return nil
+			},
+		}
+
+		t.Run("should call credential init again only while it returns error", func(t *testing.T) {
+			cacheEntry := &credentialCacheEntry{
+				credential: credential,
+			}
+
+			var err error
+			err = cacheEntry.ensureInitialized()
+			assert.Error(t, err)
+
+			err = cacheEntry.ensureInitialized()
+			assert.NoError(t, err)
+
+			err = cacheEntry.ensureInitialized()
+			assert.NoError(t, err)
+
+			assert.Equal(t, 2, credential.initCalledTimes)
+		})
+	})
+
+	t.Run("when credential init panics", func(t *testing.T) {
+		credential := &fakeCredential{
+			initFunc: func() error {
+				panic(errors.New("unable to initialize"))
+			},
+		}
+
+		t.Run("should call credential init again each time", func(t *testing.T) {
+			credential.Reset()
+
+			cacheEntry := &credentialCacheEntry{
+				credential: credential,
+			}
+
+			func() {
+				defer func() {
+					assert.NotNil(t, recover(), "credential expected to panic")
+				}()
+				_ = cacheEntry.ensureInitialized()
+			}()
+
+			func() {
+				defer func() {
+					assert.NotNil(t, recover(), "credential expected to panic")
+				}()
+				_ = cacheEntry.ensureInitialized()
+			}()
+
+			func() {
+				defer func() {
+					assert.NotNil(t, recover(), "credential expected to panic")
+				}()
+				_ = cacheEntry.ensureInitialized()
+			}()
+
+			assert.Equal(t, 3, credential.initCalledTimes)
+		})
+	})
+
+	t.Run("when credential init panics only once", func(t *testing.T) {
+		var times = 0
+		credential := &fakeCredential{
+			initFunc: func() error {
+				times = times + 1
+				if times == 1 {
+					panic(errors.New("unable to initialize"))
+				}
+				return nil
+			},
+		}
+
+		t.Run("should call credential init again only while it panics", func(t *testing.T) {
+			cacheEntry := &credentialCacheEntry{
+				credential: credential,
+			}
+
+			var err error
+
+			func() {
+				defer func() {
+					assert.NotNil(t, recover(), "credential expected to panic")
+				}()
+				_ = cacheEntry.ensureInitialized()
+			}()
+
+			func() {
+				defer func() {
+					assert.Nil(t, recover(), "credential not expected to panic")
+				}()
+				err = cacheEntry.ensureInitialized()
+				assert.NoError(t, err)
+			}()
+
+			func() {
+				defer func() {
+					assert.Nil(t, recover(), "credential not expected to panic")
+				}()
+				err = cacheEntry.ensureInitialized()
+				assert.NoError(t, err)
+			}()
+
+			assert.Equal(t, 2, credential.initCalledTimes)
+		})
+	})
+}
+
 func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 	ctx := context.Background()
 
 	scopes := []string{"Scope1"}
 
-	t.Run("when credential returns error", func(t *testing.T) {
+	t.Run("when credential getAccessToken returns error", func(t *testing.T) {
 		credential := &fakeCredential{
 			getAccessTokenFunc: func(ctx context.Context, scopes []string) (*AccessToken, error) {
 				invalidToken := &AccessToken{Token: "invalid_token", ExpiresOn: timeNow().Add(time.Hour)}
@@ -130,7 +301,7 @@ func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 		})
 
 		t.Run("should call credential again each time and return error", func(t *testing.T) {
-			credential.calledTimes = 0
+			credential.Reset()
 
 			cacheEntry := &scopesCacheEntry{
 				credential: credential,
@@ -152,7 +323,7 @@ func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 		})
 	})
 
-	t.Run("when credential returns error only once", func(t *testing.T) {
+	t.Run("when credential getAccessToken returns error only once", func(t *testing.T) {
 		var times = 0
 		credential := &fakeCredential{
 			getAccessTokenFunc: func(ctx context.Context, scopes []string) (*AccessToken, error) {
@@ -191,7 +362,7 @@ func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 		})
 	})
 
-	t.Run("when credential panics", func(t *testing.T) {
+	t.Run("when credential getAccessToken panics", func(t *testing.T) {
 		credential := &fakeCredential{
 			getAccessTokenFunc: func(ctx context.Context, scopes []string) (*AccessToken, error) {
 				panic(errors.New("unable to get access token"))
@@ -199,7 +370,7 @@ func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 		}
 
 		t.Run("should call credential again each time", func(t *testing.T) {
-			credential.calledTimes = 0
+			credential.Reset()
 
 			cacheEntry := &scopesCacheEntry{
 				credential: credential,
@@ -232,7 +403,7 @@ func TestScopesCacheEntry_GetAccessToken(t *testing.T) {
 		})
 	})
 
-	t.Run("when credential panics only once", func(t *testing.T) {
+	t.Run("when credential getAccessToken panics only once", func(t *testing.T) {
 		var times = 0
 		credential := &fakeCredential{
 			getAccessTokenFunc: func(ctx context.Context, scopes []string) (*AccessToken, error) {
diff --git a/pkg/api/pluginproxy/token_provider_azure.go b/pkg/api/pluginproxy/token_provider_azure.go
index a72d9355b52..68fcae750f6 100644
--- a/pkg/api/pluginproxy/token_provider_azure.go
+++ b/pkg/api/pluginproxy/token_provider_azure.go
@@ -3,11 +3,8 @@ package pluginproxy
 import (
 	"context"
 	"crypto/sha256"
-	"errors"
 	"fmt"
 	"strings"
-	"sync"
-	"sync/atomic"
 
 	"github.com/Azure/azure-sdk-for-go/sdk/azcore"
 	"github.com/Azure/azure-sdk-for-go/sdk/azidentity"
@@ -108,9 +105,8 @@ func (provider *azureAccessTokenProvider) resolveAuthorityHost(cloudName string)
 }
 
 type managedIdentityCredential struct {
-	clientId  string
-	credLock  sync.Mutex
-	credValue atomic.Value // of azcore.TokenCredential
+	clientId   string
+	credential azcore.TokenCredential
 }
 
 func (c *managedIdentityCredential) GetCacheKey() string {
@@ -121,39 +117,17 @@ func (c *managedIdentityCredential) GetCacheKey() string {
 	return fmt.Sprintf("azure|msi|%s", clientId)
 }
 
-func (c *managedIdentityCredential) getCredential() (azcore.TokenCredential, error) {
-	credential := c.credValue.Load()
-
-	if credential == nil {
-		c.credLock.Lock()
-		defer c.credLock.Unlock()
-
-		var err error
-		credential, err = azidentity.NewManagedIdentityCredential(c.clientId, nil)
-		if err != nil {
-			return nil, err
-		}
-
-		c.credValue.Store(credential)
+func (c *managedIdentityCredential) Init() error {
+	if credential, err := azidentity.NewManagedIdentityCredential(c.clientId, nil); err != nil {
+		return err
+	} else {
+		c.credential = credential
+		return nil
 	}
-
-	return credential.(azcore.TokenCredential), nil
 }
 
 func (c *managedIdentityCredential) GetAccessToken(ctx context.Context, scopes []string) (*AccessToken, error) {
-	credential, err := c.getCredential()
-	if err != nil {
-		return nil, err
-	}
-
-	// Implementation of ManagedIdentityCredential doesn't support scopes, converting to resource
-	if len(scopes) == 0 {
-		return nil, errors.New("scopes not provided")
-	}
-	resource := strings.TrimSuffix(scopes[0], "/.default")
-	scopes = []string{resource}
-
-	accessToken, err := credential.GetToken(ctx, azcore.TokenRequestOptions{Scopes: scopes})
+	accessToken, err := c.credential.GetToken(ctx, azcore.TokenRequestOptions{Scopes: scopes})
 	if err != nil {
 		return nil, err
 	}
@@ -166,40 +140,25 @@ type clientSecretCredential struct {
 	tenantId     string
 	clientId     string
 	clientSecret string
-	credLock     sync.Mutex
-	credValue    atomic.Value // of azcore.TokenCredential
+	credential   azcore.TokenCredential
 }
 
 func (c *clientSecretCredential) GetCacheKey() string {
 	return fmt.Sprintf("azure|clientsecret|%s|%s|%s|%s", c.authority, c.tenantId, c.clientId, hashSecret(c.clientSecret))
 }
 
-func (c *clientSecretCredential) getCredential() (azcore.TokenCredential, error) {
-	credential := c.credValue.Load()
-
-	if credential == nil {
-		c.credLock.Lock()
-		defer c.credLock.Unlock()
-
-		var err error
-		credential, err = azidentity.NewClientSecretCredential(c.tenantId, c.clientId, c.clientSecret, nil)
-		if err != nil {
-			return nil, err
-		}
-
-		c.credValue.Store(credential)
+func (c *clientSecretCredential) Init() error {
+	options := &azidentity.ClientSecretCredentialOptions{AuthorityHost: c.authority}
+	if credential, err := azidentity.NewClientSecretCredential(c.tenantId, c.clientId, c.clientSecret, options); err != nil {
+		return err
+	} else {
+		c.credential = credential
+		return nil
 	}
-
-	return credential.(azcore.TokenCredential), nil
 }
 
 func (c *clientSecretCredential) GetAccessToken(ctx context.Context, scopes []string) (*AccessToken, error) {
-	credential, err := c.getCredential()
-	if err != nil {
-		return nil, err
-	}
-
-	accessToken, err := credential.GetToken(ctx, azcore.TokenRequestOptions{Scopes: scopes})
+	accessToken, err := c.credential.GetToken(ctx, azcore.TokenRequestOptions{Scopes: scopes})
 	if err != nil {
 		return nil, err
 	}

From 1d3bcb0e90aea855ef89dfdd81ddf3b1cf3a4b59 Mon Sep 17 00:00:00 2001
From: Josh Hunt <joshhunt@users.noreply.github.com>
Date: Tue, 25 May 2021 07:51:48 +0100
Subject: [PATCH 38/43] AzureMonitor: ResourceMonitor children refactor
 (#34591)

* AzureMonitor: Refactor children to be an arrayu

* Add some resourcePickerData tests

* update tests

* some quick NestedResourceTable tests
---
 .../__mocks__/argResourcePickerResponse.ts    |  80 +++++++++
 .../__mocks__/instanceSettings.ts             |  24 +++
 .../__mocks__/resourcePickerRows.ts           |  88 +++++++++
 .../NestedResourceTable.test.tsx              |  67 +++++++
 .../ResourcePicker/NestedResourceTable.tsx    |  10 +-
 .../components/ResourcePicker/NestedRows.tsx  |  85 +++++----
 .../components/ResourcePicker/index.tsx       | 108 +++++------
 .../components/ResourcePicker/types.ts        |  29 ++-
 .../components/ResourcePicker/utils.ts        |  20 +++
 .../resourcePicker/resourcePickerData.test.ts | 114 ++++++++++++
 .../resourcePicker/resourcePickerData.ts      | 170 +++++++++---------
 .../types/index.ts                            |  21 +++
 12 files changed, 623 insertions(+), 193 deletions(-)
 create mode 100644 public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/argResourcePickerResponse.ts
 create mode 100644 public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/instanceSettings.ts
 create mode 100644 public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/resourcePickerRows.ts
 create mode 100644 public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.test.tsx
 create mode 100644 public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.test.ts

diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/argResourcePickerResponse.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/argResourcePickerResponse.ts
new file mode 100644
index 00000000000..a6c3a473e9d
--- /dev/null
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/argResourcePickerResponse.ts
@@ -0,0 +1,80 @@
+import { AzureGraphResponse, RawAzureResourceGroupItem, RawAzureResourceItem } from '../types';
+
+export const createMockARGResourceContainersResponse = (): AzureGraphResponse<RawAzureResourceGroupItem[]> => ({
+  data: [
+    {
+      subscriptionURI: '/subscriptions/abc-123',
+      subscriptionName: 'Primary Subscription',
+      resourceGroupURI: '/subscriptions/abc-123/resourceGroups/prod',
+      resourceGroupName: 'Production',
+    },
+
+    {
+      subscriptionURI: '/subscription/def-456',
+      subscriptionName: 'Dev Subscription',
+      resourceGroupURI: '/subscription/def-456/resourceGroups/dev',
+      resourceGroupName: 'Development',
+    },
+
+    {
+      subscriptionURI: '/subscription/def-456',
+      subscriptionName: 'Dev Subscription',
+      resourceGroupURI: '/subscription/def-456/resourceGroups/test',
+      resourceGroupName: 'Test',
+    },
+
+    {
+      subscriptionURI: '/subscriptions/abc-123',
+      subscriptionName: 'Primary Subscription',
+      resourceGroupURI: '/subscriptions/abc-123/resourceGroups/pre-prod',
+      resourceGroupName: 'Pre-production',
+    },
+
+    {
+      subscriptionURI: '/subscription/def-456',
+      subscriptionName: 'Dev Subscription',
+      resourceGroupURI: '/subscription/def-456/resourceGroups/qa',
+      resourceGroupName: 'QA',
+    },
+  ],
+});
+
+export const createARGResourcesResponse = (): AzureGraphResponse<RawAzureResourceItem[]> => ({
+  data: [
+    {
+      id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/web-server',
+      name: 'web-server',
+      type: 'Microsoft.Compute/virtualMachines',
+      resourceGroup: 'dev',
+      subscriptionId: 'def-456',
+      location: 'northeurope',
+    },
+
+    {
+      id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/web-server_DataDisk',
+      name: 'web-server_DataDisk',
+      type: 'Microsoft.Compute/disks',
+      resourceGroup: 'dev',
+      subscriptionId: 'def-456',
+      location: 'northeurope',
+    },
+
+    {
+      id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/db-server',
+      name: 'db-server',
+      type: 'Microsoft.Compute/virtualMachines',
+      resourceGroup: 'dev',
+      subscriptionId: 'def-456',
+      location: 'northeurope',
+    },
+
+    {
+      id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/db-server_DataDisk',
+      name: 'db-server_DataDisk',
+      type: 'Microsoft.Compute/disks',
+      resourceGroup: 'dev',
+      subscriptionId: 'def-456',
+      location: 'northeurope',
+    },
+  ],
+});
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/instanceSettings.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/instanceSettings.ts
new file mode 100644
index 00000000000..2832df6c9a6
--- /dev/null
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/instanceSettings.ts
@@ -0,0 +1,24 @@
+import { DataSourcePluginMeta } from '@grafana/data';
+import { AzureDataSourceInstanceSettings } from '../types';
+
+export const createMockInstanceSetttings = (): AzureDataSourceInstanceSettings => ({
+  url: '/ds/1',
+  id: 1,
+  uid: 'abc',
+  type: 'azuremonitor',
+  meta: {} as DataSourcePluginMeta,
+  name: 'azure',
+
+  jsonData: {
+    cloudName: 'azuremonitor',
+    azureAuthType: 'clientsecret',
+
+    // monitor
+    tenantId: 'abc-123',
+    clientId: 'def-456',
+    subscriptionId: 'ghi-789',
+
+    // logs
+    azureLogAnalyticsSameAs: true,
+  },
+});
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/resourcePickerRows.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/resourcePickerRows.ts
new file mode 100644
index 00000000000..1c87fc239d1
--- /dev/null
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/__mocks__/resourcePickerRows.ts
@@ -0,0 +1,88 @@
+import { ResourceRowGroup, ResourceRowType } from '../components/ResourcePicker/types';
+
+export const createMockResourcePickerRows = (): ResourceRowGroup => [
+  {
+    id: '/subscriptions/abc-123',
+    name: 'Primary Subscription',
+    type: ResourceRowType.Subscription,
+    typeLabel: 'Subscription',
+    children: [
+      {
+        id: '/subscriptions/abc-123/resourceGroups/prod',
+        name: 'Production',
+        type: ResourceRowType.ResourceGroup,
+        typeLabel: 'Resource Group',
+        children: [],
+      },
+      {
+        id: '/subscriptions/abc-123/resourceGroups/pre-prod',
+        name: 'Pre-production',
+        type: ResourceRowType.ResourceGroup,
+        typeLabel: 'Resource Group',
+        children: [],
+      },
+    ],
+  },
+
+  {
+    id: '/subscriptions/def-456',
+    name: 'Dev Subscription',
+    type: ResourceRowType.Subscription,
+    typeLabel: 'Subscription',
+    children: [
+      {
+        id: '/subscriptions/def-456/resourceGroups/dev',
+        name: 'Development',
+        type: ResourceRowType.ResourceGroup,
+        typeLabel: 'Resource Group',
+        children: [
+          {
+            id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/web-server',
+            name: 'web-server',
+            typeLabel: 'Microsoft.Compute/virtualMachines',
+            type: ResourceRowType.Resource,
+            location: 'northeurope',
+          },
+
+          {
+            id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/web-server_DataDisk',
+            name: 'web-server_DataDisk',
+            typeLabel: 'Microsoft.Compute/disks',
+            type: ResourceRowType.Resource,
+            location: 'northeurope',
+          },
+
+          {
+            id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/db-server',
+            name: 'db-server',
+            typeLabel: 'Microsoft.Compute/virtualMachines',
+            type: ResourceRowType.Resource,
+            location: 'northeurope',
+          },
+
+          {
+            id: '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/db-server_DataDisk',
+            name: 'db-server_DataDisk',
+            typeLabel: 'Microsoft.Compute/disks',
+            type: ResourceRowType.Resource,
+            location: 'northeurope',
+          },
+        ],
+      },
+      {
+        id: '/subscriptions/def-456/resourceGroups/test',
+        name: 'Test',
+        type: ResourceRowType.ResourceGroup,
+        typeLabel: 'Resource Group',
+        children: [],
+      },
+      {
+        id: '/subscriptions/def-456/resourceGroups/qa',
+        name: 'QA',
+        type: ResourceRowType.ResourceGroup,
+        typeLabel: 'Resource Group',
+        children: [],
+      },
+    ],
+  },
+];
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.test.tsx b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.test.tsx
new file mode 100644
index 00000000000..faedf6e50a8
--- /dev/null
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.test.tsx
@@ -0,0 +1,67 @@
+import { act, render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import React from 'react';
+import { createMockResourcePickerRows } from '../../__mocks__/resourcePickerRows';
+
+import NestedResourceTable from './NestedResourceTable';
+import { findRow } from './utils';
+
+describe('AzureMonitor NestedResourceTable', () => {
+  const noop: any = () => {};
+
+  it('renders subscriptions', () => {
+    const rows = createMockResourcePickerRows();
+
+    render(<NestedResourceTable rows={rows} selectedRows={[]} requestNestedRows={noop} onRowSelectedChange={noop} />);
+
+    expect(screen.getByText('Primary Subscription')).toBeInTheDocument();
+    expect(screen.getByText('Dev Subscription')).toBeInTheDocument();
+  });
+
+  it('opens to the selected resource', () => {
+    const rows = createMockResourcePickerRows();
+    const selected = findRow(
+      rows,
+      '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/web-server_DataDisk'
+    );
+
+    if (!selected) {
+      throw new Error("couldn't find row, test data stale");
+    }
+
+    render(
+      <NestedResourceTable rows={rows} selectedRows={[selected]} requestNestedRows={noop} onRowSelectedChange={noop} />
+    );
+
+    expect(screen.getByText('web-server_DataDisk')).toBeInTheDocument();
+  });
+
+  it("expands resource groups when they're clicked", async () => {
+    const rows = createMockResourcePickerRows();
+    const promise = Promise.resolve();
+    const requestNestedRows = jest.fn().mockReturnValue(promise);
+    render(
+      <NestedResourceTable
+        rows={rows}
+        selectedRows={[]}
+        requestNestedRows={requestNestedRows}
+        onRowSelectedChange={noop}
+      />
+    );
+
+    const expandButton = screen.getAllByLabelText('Expand')[2];
+    userEvent.click(expandButton);
+
+    expect(requestNestedRows).toBeCalledWith(
+      expect.objectContaining({
+        id: '/subscriptions/def-456/resourceGroups/dev',
+        name: 'Development',
+        typeLabel: 'Resource Group',
+      })
+    );
+
+    await act(() => promise);
+
+    expect(screen.getByText('web-server')).toBeInTheDocument();
+  });
+});
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.tsx b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.tsx
index 3f0927e0893..30f654c6361 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.tsx
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedResourceTable.tsx
@@ -5,14 +5,14 @@ import { useStyles2 } from '@grafana/ui';
 
 import NestedRows from './NestedRows';
 import getStyles from './styles';
-import { Row, RowGroup } from './types';
+import { ResourceRow, ResourceRowGroup } from './types';
 
 interface NestedResourceTableProps {
-  rows: RowGroup;
-  selectedRows: RowGroup;
+  rows: ResourceRowGroup;
+  selectedRows: ResourceRowGroup;
   noHeader?: boolean;
-  requestNestedRows: (row: Row) => Promise<void>;
-  onRowSelectedChange: (row: Row, selected: boolean) => void;
+  requestNestedRows: (row: ResourceRow) => Promise<void>;
+  onRowSelectedChange: (row: ResourceRow, selected: boolean) => void;
 }
 
 const NestedResourceTable: React.FC<NestedResourceTableProps> = ({
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedRows.tsx b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedRows.tsx
index 7d8fe4a7f2c..c6e957d09c1 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedRows.tsx
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/NestedRows.tsx
@@ -2,14 +2,15 @@ import { cx } from '@emotion/css';
 import { Checkbox, Icon, IconButton, LoadingPlaceholder, useStyles2, useTheme2, FadeTransition } from '@grafana/ui';
 import React, { useCallback, useEffect, useState } from 'react';
 import getStyles from './styles';
-import { EntryType, Row, RowGroup } from './types';
+import { ResourceRowType, ResourceRow, ResourceRowGroup } from './types';
+import { findRow } from './utils';
 
 interface NestedRowsProps {
-  rows: RowGroup;
+  rows: ResourceRowGroup;
   level: number;
-  selectedRows: RowGroup;
-  requestNestedRows: (row: Row) => Promise<void>;
-  onRowSelectedChange: (row: Row, selected: boolean) => void;
+  selectedRows: ResourceRowGroup;
+  requestNestedRows: (row: ResourceRow) => Promise<void>;
+  onRowSelectedChange: (row: ResourceRow, selected: boolean) => void;
 }
 
 const NestedRows: React.FC<NestedRowsProps> = ({
@@ -20,10 +21,10 @@ const NestedRows: React.FC<NestedRowsProps> = ({
   onRowSelectedChange,
 }) => (
   <>
-    {Object.keys(rows).map((rowId) => (
+    {rows.map((row) => (
       <NestedRow
-        key={rowId}
-        row={rows[rowId]}
+        key={row.id}
+        row={row}
         selectedRows={selectedRows}
         level={level}
         requestNestedRows={requestNestedRows}
@@ -34,39 +35,41 @@ const NestedRows: React.FC<NestedRowsProps> = ({
 );
 
 interface NestedRowProps {
-  row: Row;
+  row: ResourceRow;
   level: number;
-  selectedRows: RowGroup;
-  requestNestedRows: (row: Row) => Promise<void>;
-  onRowSelectedChange: (row: Row, selected: boolean) => void;
+  selectedRows: ResourceRowGroup;
+  requestNestedRows: (row: ResourceRow) => Promise<void>;
+  onRowSelectedChange: (row: ResourceRow, selected: boolean) => void;
 }
 
 const NestedRow: React.FC<NestedRowProps> = ({ row, selectedRows, level, requestNestedRows, onRowSelectedChange }) => {
   const styles = useStyles2(getStyles);
+  const initialOpenStatus = row.type === ResourceRowType.Subscription ? 'open' : 'closed';
+  const [rowStatus, setRowStatus] = useState<'open' | 'closed' | 'loading'>(initialOpenStatus);
 
-  const isSelected = !!selectedRows[row.id];
-  const isDisabled = Object.keys(selectedRows).length > 0 && !isSelected;
-  const initialOpenStatus = row.type === EntryType.Collection ? 'open' : 'closed';
-  const [openStatus, setOpenStatus] = useState<'open' | 'closed' | 'loading'>(initialOpenStatus);
-  const isOpen = openStatus === 'open';
+  const isSelected = !!selectedRows.find((v) => v.id === row.id);
+  const isDisabled = selectedRows.length > 0 && !isSelected;
+  const isOpen = rowStatus === 'open';
 
   const onRowToggleCollapse = async () => {
-    if (openStatus === 'open') {
-      setOpenStatus('closed');
+    if (rowStatus === 'open') {
+      setRowStatus('closed');
       return;
     }
-    setOpenStatus('loading');
+    setRowStatus('loading');
     await requestNestedRows(row);
-    setOpenStatus('open');
+    setRowStatus('open');
   };
 
   // opens the resource group on load of component if there was a previously saved selection
   useEffect(() => {
-    const selectedRow = Object.keys(selectedRows).map((rowId) => selectedRows[rowId])[0];
-    const isSelectedResourceGroup =
-      selectedRow && selectedRow.resourceGroupName && row.name === selectedRow.resourceGroupName;
-    if (isSelectedResourceGroup) {
-      setOpenStatus('open');
+    // Assuming we don't have multi-select yet
+    const selectedRow = selectedRows[0];
+
+    const containsChild = selectedRow && !!findRow(row.children ?? [], selectedRow.id);
+
+    if (containsChild) {
+      setRowStatus('open');
     }
   }, [selectedRows, row]);
 
@@ -100,7 +103,7 @@ const NestedRow: React.FC<NestedRowProps> = ({ row, selectedRows, level, request
         />
       )}
 
-      <FadeTransition visible={openStatus === 'loading'}>
+      <FadeTransition visible={rowStatus === 'loading'}>
         <tr>
           <td className={cx(styles.cell, styles.loadingCell)} colSpan={3}>
             <LoadingPlaceholder text="Loading..." className={styles.spinner} />
@@ -112,19 +115,19 @@ const NestedRow: React.FC<NestedRowProps> = ({ row, selectedRows, level, request
 };
 
 interface EntryIconProps {
-  entry: Row;
+  entry: ResourceRow;
   isOpen: boolean;
 }
 
 const EntryIcon: React.FC<EntryIconProps> = ({ isOpen, entry: { type } }) => {
   switch (type) {
-    case EntryType.Collection:
+    case ResourceRowType.Subscription:
       return <Icon name="layer-group" />;
 
-    case EntryType.SubCollection:
+    case ResourceRowType.ResourceGroup:
       return <Icon name={isOpen ? 'folder-open' : 'folder'} />;
 
-    case EntryType.Resource:
+    case ResourceRowType.Resource:
       return <Icon name="cube" />;
 
     default:
@@ -134,12 +137,12 @@ const EntryIcon: React.FC<EntryIconProps> = ({ isOpen, entry: { type } }) => {
 
 interface NestedEntryProps {
   level: number;
-  entry: Row;
+  entry: ResourceRow;
   isSelected: boolean;
   isOpen: boolean;
   isDisabled: boolean;
-  onToggleCollapse: (row: Row) => void;
-  onSelectedChange: (row: Row, selected: boolean) => void;
+  onToggleCollapse: (row: ResourceRow) => void;
+  onSelectedChange: (row: ResourceRow, selected: boolean) => void;
 }
 
 const NestedEntry: React.FC<NestedEntryProps> = ({
@@ -154,7 +157,7 @@ const NestedEntry: React.FC<NestedEntryProps> = ({
   const theme = useTheme2();
   const styles = useStyles2(getStyles);
   const hasChildren = !!entry.children;
-  const isSelectable = entry.type === EntryType.Resource;
+  const isSelectable = entry.type === ResourceRowType.Resource;
 
   const handleToggleCollapse = useCallback(() => {
     onToggleCollapse(entry);
@@ -168,10 +171,13 @@ const NestedEntry: React.FC<NestedEntryProps> = ({
     [entry, onSelectedChange]
   );
 
+  const checkboxId = `checkbox_${entry.id}`;
+
   return (
     <div className={styles.nestedEntry} style={{ marginLeft: level * (3 * theme.spacing.gridSize) }}>
       {/* When groups are selectable, I *think* we will want to show a 2-wide space instead
             of the collapse button for leaf rows that have no children to get them to align */}
+
       <span className={styles.entryContentItem}>
         {hasChildren && (
           <IconButton
@@ -179,17 +185,22 @@ const NestedEntry: React.FC<NestedEntryProps> = ({
             name={isOpen ? 'angle-down' : 'angle-right'}
             aria-label={isOpen ? 'Collapse' : 'Expand'}
             onClick={handleToggleCollapse}
+            id={entry.id}
           />
         )}
 
-        {isSelectable && <Checkbox onChange={handleSelectedChanged} disabled={isDisabled} value={isSelected} />}
+        {isSelectable && (
+          <Checkbox id={checkboxId} onChange={handleSelectedChanged} disabled={isDisabled} value={isSelected} />
+        )}
       </span>
 
       <span className={styles.entryContentItem}>
         <EntryIcon entry={entry} isOpen={isOpen} />
       </span>
 
-      <span className={cx(styles.entryContentItem, styles.truncated)}>{entry.name}</span>
+      <label htmlFor={checkboxId} className={cx(styles.entryContentItem, styles.truncated)}>
+        {entry.name}
+      </label>
     </div>
   );
 };
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/index.tsx b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/index.tsx
index 2ed144365d9..db293fafb8d 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/index.tsx
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/index.tsx
@@ -1,13 +1,13 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import NestedResourceTable from './NestedResourceTable';
-import { Row, RowGroup } from './types';
+import { ResourceRow, ResourceRowGroup } from './types';
 import { css } from '@emotion/css';
 import { GrafanaTheme2 } from '@grafana/data';
 import { Button, useStyles2 } from '@grafana/ui';
 import ResourcePickerData from '../../resourcePicker/resourcePickerData';
 import { produce } from 'immer';
 import { Space } from '../Space';
-import { parseResourceURI } from './utils';
+import { findRow, parseResourceURI } from './utils';
 
 interface ResourcePickerProps {
   resourcePickerData: Pick<ResourcePickerData, 'getResourcePickerData' | 'getResourcesForResourceGroup'>;
@@ -20,72 +20,80 @@ interface ResourcePickerProps {
 const ResourcePicker = ({ resourcePickerData, resourceURI, onApply, onCancel }: ResourcePickerProps) => {
   const styles = useStyles2(getStyles);
 
-  const [rows, setRows] = useState<RowGroup>({});
+  const [rows, setRows] = useState<ResourceRowGroup>([]);
   const [internalSelected, setInternalSelected] = useState<string | undefined>(resourceURI);
 
+  // Sync the resourceURI prop to internal state
   useEffect(() => {
     setInternalSelected(resourceURI);
   }, [resourceURI]);
 
-  const handleFetchInitialResources = useCallback(async () => {
-    const initalRows = await resourcePickerData.getResourcePickerData();
-    setRows(initalRows);
-  }, [resourcePickerData]);
-
-  useEffect(() => {
-    handleFetchInitialResources();
-  }, [handleFetchInitialResources]);
+  // Map the selected item into an array of rows
+  const selectedResourceRows = useMemo(() => {
+    const found = internalSelected && findRow(rows, internalSelected);
+    return found ? [found] : [];
+  }, [internalSelected, rows]);
 
+  // Request resources for a expanded resource group
   const requestNestedRows = useCallback(
-    async (resourceGroup: Row) => {
-      // if we've already fetched resources for a resource group we don't need to re-fetch them
-      if (resourceGroup.children && Object.keys(resourceGroup.children).length > 0) {
+    async (resourceGroup: ResourceRow) => {
+      // If we already have children, we don't need to re-fetch them
+      if (resourceGroup.children?.length) {
         return;
       }
 
       // fetch and set nested resources for the resourcegroup into the bigger state object
       const resources = await resourcePickerData.getResourcesForResourceGroup(resourceGroup);
-      setRows(
-        produce(rows, (draftState: RowGroup) => {
-          const subscriptionChildren = draftState[resourceGroup.subscriptionId].children;
+      const newRows = produce(rows, (draftState) => {
+        // We want to find the row again from the draftState so we can "mutate" it
+        const draftRow = findRow(draftState, resourceGroup.id);
 
-          if (subscriptionChildren) {
-            subscriptionChildren[resourceGroup.name].children = resources;
-          }
-        })
-      );
+        if (!draftRow) {
+          // This case shouldn't happen
+          throw new Error('Unable to find resource');
+        }
+
+        draftRow.children = resources;
+      });
+
+      setRows(newRows);
     },
     [resourcePickerData, rows]
   );
 
-  const handleSelectionChanged = useCallback((row: Row, isSelected: boolean) => {
+  // Select
+  const handleSelectionChanged = useCallback((row: ResourceRow, isSelected: boolean) => {
     isSelected ? setInternalSelected(row.id) : setInternalSelected(undefined);
   }, []);
 
-  const selectedResource = useMemo(() => {
-    if (internalSelected && Object.keys(rows).length) {
-      const parsed = parseResourceURI(internalSelected);
+  // Request initial data on first mount
+  useEffect(() => {
+    resourcePickerData.getResourcePickerData().then((initalRows) => setRows(initalRows));
+  }, [resourcePickerData]);
 
-      if (parsed) {
-        const { subscriptionID, resourceGroup } = parsed;
-        const allResourceGroups = rows[subscriptionID].children || {};
-        const selectedResourceGroup = allResourceGroups[resourceGroup.toLowerCase()];
-        const allResourcesInResourceGroup = selectedResourceGroup.children;
-
-        if (!allResourcesInResourceGroup || Object.keys(allResourcesInResourceGroup).length === 0) {
-          requestNestedRows(selectedResourceGroup);
-          return {};
-        }
-
-        const matchingResource = allResourcesInResourceGroup[internalSelected];
-
-        return {
-          [internalSelected]: matchingResource,
-        };
-      }
+  // Request sibling resources for a selected resource - in practice should only be on first mount
+  useEffect(() => {
+    if (!internalSelected || !rows.length) {
+      return;
     }
-    return {};
-  }, [internalSelected, rows, requestNestedRows]);
+
+    // If we can find this resource in the rows, then we don't need to load anything
+    const foundResourceRow = findRow(rows, internalSelected);
+    if (foundResourceRow) {
+      return;
+    }
+
+    const parsedURI = parseResourceURI(internalSelected);
+    const resourceGroupURI = `/subscriptions/${parsedURI?.subscriptionID}/resourceGroups/${parsedURI?.resourceGroup}`;
+    const resourceGroupRow = findRow(rows, resourceGroupURI);
+
+    // TODO: Error UI
+    if (!resourceGroupRow) {
+      throw new Error('Unable to find resource group for resource');
+    }
+
+    requestNestedRows(resourceGroupRow);
+  }, [requestNestedRows, internalSelected, rows]);
 
   const handleApply = useCallback(() => {
     onApply(internalSelected);
@@ -97,20 +105,20 @@ const ResourcePicker = ({ resourcePickerData, resourceURI, onApply, onCancel }:
         rows={rows}
         requestNestedRows={requestNestedRows}
         onRowSelectedChange={handleSelectionChanged}
-        selectedRows={selectedResource}
+        selectedRows={selectedResourceRows}
       />
 
       <div className={styles.selectionFooter}>
-        {internalSelected && (
+        {selectedResourceRows.length > 0 && (
           <>
             <Space v={2} />
             <h5>Selection</h5>
             <NestedResourceTable
-              noHeader={true}
-              rows={selectedResource}
+              rows={selectedResourceRows}
               requestNestedRows={requestNestedRows}
               onRowSelectedChange={handleSelectionChanged}
-              selectedRows={selectedResource}
+              selectedRows={selectedResourceRows}
+              noHeader={true}
             />
           </>
         )}
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/types.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/types.ts
index c0396fff645..919286506bf 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/types.ts
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/types.ts
@@ -1,19 +1,16 @@
-export enum EntryType {
-  Collection,
-  SubCollection,
-  Resource,
-}
-export interface Row {
-  id: string;
-  name: string;
-  type: EntryType;
-  typeLabel: string;
-  subscriptionId: string;
-  location?: string;
-  children?: RowGroup;
-  resourceGroupName?: string;
+export enum ResourceRowType {
+  Subscription = 'Subscription',
+  ResourceGroup = 'ResourceGroup',
+  Resource = 'Resource',
 }
 
-export interface RowGroup {
-  [subscriptionIdOrResourceGroupName: string]: Row;
+export interface ResourceRow {
+  id: string;
+  name: string;
+  type: ResourceRowType;
+  typeLabel: string;
+  location?: string;
+  children?: ResourceRowGroup;
 }
+
+export type ResourceRowGroup = ResourceRow[];
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/utils.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/utils.ts
index 1c3c946e5ca..f0d238af813 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/utils.ts
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/components/ResourcePicker/utils.ts
@@ -1,3 +1,5 @@
+import { ResourceRow, ResourceRowGroup } from './types';
+
 const RESOURCE_URI_REGEX = /\/subscriptions\/(?<subscriptionID>.+)\/resourceGroups\/(?<resourceGroup>.+)\/providers.+\/(?<resource>[\w-_]+)/;
 
 export function parseResourceURI(resourceURI: string) {
@@ -14,3 +16,21 @@ export function parseResourceURI(resourceURI: string) {
 export function isGUIDish(input: string) {
   return !!input.match(/^[A-Z0-9]+/i);
 }
+
+export function findRow(rows: ResourceRowGroup, id: string): ResourceRow | undefined {
+  for (const row of rows) {
+    if (row.id === id) {
+      return row;
+    }
+
+    if (row.children) {
+      const result = findRow(row.children, id);
+
+      if (result) {
+        return result;
+      }
+    }
+  }
+
+  return undefined;
+}
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.test.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.test.ts
new file mode 100644
index 00000000000..fba4b60c059
--- /dev/null
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.test.ts
@@ -0,0 +1,114 @@
+import { of } from 'rxjs';
+
+import { createFetchResponse } from 'test/helpers/createFetchResponse';
+import { backendSrv } from 'app/core/services/backend_srv';
+
+import ResourcePickerData from './resourcePickerData';
+import {
+  createMockARGResourceContainersResponse,
+  createARGResourcesResponse,
+} from '../__mocks__/argResourcePickerResponse';
+import { ResourceRowType } from '../components/ResourcePicker/types';
+import { createMockInstanceSetttings } from '../__mocks__/instanceSettings';
+
+jest.mock('@grafana/runtime', () => ({
+  ...((jest.requireActual('@grafana/runtime') as unknown) as object),
+  getBackendSrv: () => backendSrv,
+}));
+
+const instanceSettings = createMockInstanceSetttings();
+
+describe('AzureMonitor resourcePickerData', () => {
+  describe('getResourcePickerData', () => {
+    let fetchMock: jest.SpyInstance;
+
+    beforeEach(() => {
+      fetchMock = jest.spyOn(backendSrv, 'fetch');
+      fetchMock.mockImplementation(() => {
+        const data = createMockARGResourceContainersResponse();
+        return of(createFetchResponse(data));
+      });
+    });
+
+    afterEach(() => fetchMock.mockReset());
+
+    it('calls ARG API', async () => {
+      const resourcePickerData = new ResourcePickerData(instanceSettings);
+      await resourcePickerData.getResourcePickerData();
+
+      expect(fetchMock).toHaveBeenCalled();
+      const argQuery = fetchMock.mock.calls[0][0].data.query;
+
+      expect(argQuery).toContain(`where type == 'microsoft.resources/subscriptions'`);
+      expect(argQuery).toContain(`where type == 'microsoft.resources/subscriptions/resourcegroups'`);
+    });
+
+    it('returns only subscriptions at the top level', async () => {
+      const resourcePickerData = new ResourcePickerData(instanceSettings);
+      const results = await resourcePickerData.getResourcePickerData();
+
+      expect(results.map((v) => v.id)).toEqual(['/subscriptions/abc-123', '/subscription/def-456']);
+    });
+
+    it('nests resource groups under their subscriptions', async () => {
+      const resourcePickerData = new ResourcePickerData(instanceSettings);
+      const results = await resourcePickerData.getResourcePickerData();
+
+      expect(results[0].children?.map((v) => v.id)).toEqual([
+        '/subscriptions/abc-123/resourceGroups/prod',
+        '/subscriptions/abc-123/resourceGroups/pre-prod',
+      ]);
+
+      expect(results[1].children?.map((v) => v.id)).toEqual([
+        '/subscription/def-456/resourceGroups/dev',
+        '/subscription/def-456/resourceGroups/test',
+        '/subscription/def-456/resourceGroups/qa',
+      ]);
+    });
+  });
+
+  describe('getResourcesForResourceGroup', () => {
+    let fetchMock: jest.SpyInstance;
+
+    const resourceRow = {
+      id: '/subscription/def-456/resourceGroups/dev',
+      name: 'Dev',
+      type: ResourceRowType.ResourceGroup,
+      typeLabel: 'Resource group',
+    };
+
+    beforeEach(() => {
+      fetchMock = jest.spyOn(backendSrv, 'fetch');
+      fetchMock.mockImplementation(() => {
+        const data = createARGResourcesResponse();
+        return of(createFetchResponse(data));
+      });
+    });
+
+    afterEach(() => fetchMock.mockReset());
+
+    it('requests resources for the specified resource row', async () => {
+      const resourcePickerData = new ResourcePickerData(instanceSettings);
+      await resourcePickerData.getResourcesForResourceGroup(resourceRow);
+
+      expect(fetchMock).toHaveBeenCalled();
+      const argQuery = fetchMock.mock.calls[0][0].data.query;
+
+      expect(argQuery).toContain(resourceRow.id);
+    });
+
+    it('returns formatted resources', async () => {
+      const resourcePickerData = new ResourcePickerData(instanceSettings);
+      const results = await resourcePickerData.getResourcesForResourceGroup(resourceRow);
+
+      expect(results.map((v) => v.id)).toEqual([
+        '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/web-server',
+        '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/web-server_DataDisk',
+        '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/virtualMachines/db-server',
+        '/subscription/def-456/resourceGroups/dev/providers/Microsoft.Compute/disks/db-server_DataDisk',
+      ]);
+
+      results.forEach((v) => expect(v.type).toEqual(ResourceRowType.Resource));
+    });
+  });
+});
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.ts
index 543c51f70ec..e36ad7c7eef 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.ts
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/resourcePicker/resourcePickerData.ts
@@ -1,32 +1,18 @@
 import { FetchResponse, getBackendSrv } from '@grafana/runtime';
 import { getLogAnalyticsResourcePickerApiRoute } from '../api/routes';
-import { EntryType, Row, RowGroup } from '../components/ResourcePicker/types';
+import { ResourceRowType, ResourceRow, ResourceRowGroup } from '../components/ResourcePicker/types';
 import { getAzureCloud } from '../credentials';
-import { AzureDataSourceInstanceSettings, AzureResourceSummaryItem } from '../types';
+import {
+  AzureDataSourceInstanceSettings,
+  AzureGraphResponse,
+  AzureResourceSummaryItem,
+  RawAzureResourceGroupItem,
+  RawAzureResourceItem,
+} from '../types';
 import { SUPPORTED_LOCATIONS, SUPPORTED_RESOURCE_TYPES } from './supportedResources';
 
 const RESOURCE_GRAPH_URL = '/providers/Microsoft.ResourceGraph/resources?api-version=2020-04-01-preview';
 
-interface RawAzureResourceGroupItem {
-  subscriptionId: string;
-  subscriptionName: string;
-  resourceGroup: string;
-  resourceGroupId: string;
-}
-
-interface RawAzureResourceItem {
-  id: string;
-  name: string;
-  subscriptionId: string;
-  resourceGroup: string;
-  type: string;
-  location: string;
-}
-
-interface AzureGraphResponse<T = unknown> {
-  data: T;
-}
-
 export default class ResourcePickerData {
   private proxyUrl: string;
   private cloud: string;
@@ -37,27 +23,43 @@ export default class ResourcePickerData {
   }
 
   async getResourcePickerData() {
-    const { ok, data: response } = await this.makeResourceGraphRequest<RawAzureResourceGroupItem[]>(
-      `resources
-      | join kind=leftouter (ResourceContainers | where type=='microsoft.resources/subscriptions' | project subscriptionName=name, subscriptionId, resourceGroupId=id) on subscriptionId
-      | where type in (${SUPPORTED_RESOURCE_TYPES})
-      | summarize count() by resourceGroup, subscriptionName, resourceGroupId, subscriptionId
-      | order by resourceGroup asc
-      `
-    );
+    const query = `
+      resources
+        // Put subscription details on each row
+        | join kind=leftouter (
+          ResourceContainers
+            | where type == 'microsoft.resources/subscriptions'
+            | project subscriptionName=name, subscriptionURI=id, subscriptionId
+          ) on subscriptionId
+
+        // Put resource group details on each row
+        | join kind=leftouter (
+          ResourceContainers
+            | where type == 'microsoft.resources/subscriptions/resourcegroups'
+            | project resourceGroupURI=id, resourceGroupName=name, resourceGroup
+          ) on resourceGroup
+
+        | where type in (${SUPPORTED_RESOURCE_TYPES})
+
+        // Get only unique resource groups and subscriptions. Also acts like a project
+        | summarize count() by resourceGroupName, resourceGroupURI, subscriptionName, subscriptionURI
+        | order by subscriptionURI asc
+    `;
+
+    const { ok, data: response } = await this.makeResourceGraphRequest<RawAzureResourceGroupItem[]>(query);
 
     // TODO: figure out desired error handling strategy
     if (!ok) {
       throw new Error('unable to fetch resource containers');
     }
 
-    return this.formatResourceGroupData(response.data);
+    return formatResourceGroupData(response.data);
   }
 
-  async getResourcesForResourceGroup(resourceGroup: Row) {
+  async getResourcesForResourceGroup(resourceGroup: ResourceRow) {
     const { ok, data: response } = await this.makeResourceGraphRequest<RawAzureResourceItem[]>(`
       resources
-      | where resourceGroup == "${resourceGroup.name.toLowerCase()}"
+      | where id hasprefix "${resourceGroup.id}"
       | where type in (${SUPPORTED_RESOURCE_TYPES}) and location in (${SUPPORTED_LOCATIONS})
     `);
 
@@ -66,7 +68,7 @@ export default class ResourcePickerData {
       throw new Error('unable to fetch resource containers');
     }
 
-    return this.formatResourceGroupChildren(response.data);
+    return formatResourceGroupChildren(response.data);
   }
 
   async getResource(resourceURI: string) {
@@ -114,57 +116,6 @@ export default class ResourcePickerData {
     return response.data[0].id;
   }
 
-  formatResourceGroupData(rawData: RawAzureResourceGroupItem[]) {
-    const formatedSubscriptionsAndResourceGroups: RowGroup = {};
-
-    rawData.forEach((resourceGroup) => {
-      // if the subscription doesn't exist yet, create it
-      if (!formatedSubscriptionsAndResourceGroups[resourceGroup.subscriptionId]) {
-        formatedSubscriptionsAndResourceGroups[resourceGroup.subscriptionId] = {
-          name: resourceGroup.subscriptionName,
-          id: resourceGroup.subscriptionId,
-          subscriptionId: resourceGroup.subscriptionId,
-          typeLabel: 'Subscription',
-          type: EntryType.Collection,
-          children: {},
-        };
-      }
-
-      // add the resource group to the subscription
-      // store by resourcegroupname not id to match resource uri
-      (formatedSubscriptionsAndResourceGroups[resourceGroup.subscriptionId].children as RowGroup)[
-        resourceGroup.resourceGroup
-      ] = {
-        name: resourceGroup.resourceGroup,
-        id: resourceGroup.resourceGroupId,
-        subscriptionId: resourceGroup.subscriptionId,
-        type: EntryType.SubCollection,
-        typeLabel: 'Resource Group',
-        children: {},
-      };
-    });
-
-    return formatedSubscriptionsAndResourceGroups;
-  }
-
-  formatResourceGroupChildren(rawData: RawAzureResourceItem[]) {
-    const children: RowGroup = {};
-
-    rawData.forEach((item: RawAzureResourceItem) => {
-      children[item.id] = {
-        name: item.name,
-        id: item.id,
-        subscriptionId: item.id,
-        resourceGroupName: item.resourceGroup,
-        type: EntryType.Resource,
-        typeLabel: item.type, // TODO: these types can be quite long, we may wish to format them more
-        location: item.location, // TODO: we may wish to format these locations, by default they are written as 'northeurope' rather than a more human readable "North Europe"
-      };
-    });
-
-    return children;
-  }
-
   async makeResourceGraphRequest<T = unknown>(
     query: string,
     maxRetries = 1
@@ -191,3 +142,52 @@ export default class ResourcePickerData {
     }
   }
 }
+
+function formatResourceGroupData(rawData: RawAzureResourceGroupItem[]) {
+  // Subscriptions goes into the top level array
+  const rows: ResourceRowGroup = [];
+
+  // Array of all the resource groups, with subscription data on each row
+  for (const row of rawData) {
+    const resourceGroupRow: ResourceRow = {
+      name: row.resourceGroupName,
+      id: row.resourceGroupURI,
+      type: ResourceRowType.ResourceGroup,
+      typeLabel: 'Resource Group',
+      children: [],
+    };
+
+    const subscription = rows.find((v) => v.id === row.subscriptionURI);
+
+    if (subscription) {
+      if (!subscription.children) {
+        subscription.children = [];
+      }
+
+      subscription.children.push(resourceGroupRow);
+    } else {
+      const newSubscriptionRow = {
+        name: row.subscriptionName,
+        id: row.subscriptionURI,
+        typeLabel: 'Subscription',
+        type: ResourceRowType.Subscription,
+        children: [resourceGroupRow],
+      };
+
+      rows.push(newSubscriptionRow);
+    }
+  }
+
+  return rows;
+}
+
+function formatResourceGroupChildren(rawData: RawAzureResourceItem[]): ResourceRowGroup {
+  return rawData.map((item) => ({
+    name: item.name,
+    id: item.id,
+    resourceGroupName: item.resourceGroup,
+    type: ResourceRowType.Resource,
+    typeLabel: item.type, // TODO: these types can be quite long, we may wish to format them more
+    location: item.location, // TODO: we may wish to format these locations, by default they are written as 'northeurope' rather than a more human readable "North Europe"
+  }));
+}
diff --git a/public/app/plugins/datasource/grafana-azure-monitor-datasource/types/index.ts b/public/app/plugins/datasource/grafana-azure-monitor-datasource/types/index.ts
index 3a0140ce90b..4973d264d6e 100644
--- a/public/app/plugins/datasource/grafana-azure-monitor-datasource/types/index.ts
+++ b/public/app/plugins/datasource/grafana-azure-monitor-datasource/types/index.ts
@@ -230,3 +230,24 @@ export interface AzureResourceSummaryItem {
   subscriptionName: string;
   resourceGroupName: string;
 }
+
+export interface RawAzureResourceGroupItem {
+  subscriptionURI: string;
+  subscriptionName: string;
+
+  resourceGroupURI: string;
+  resourceGroupName: string;
+}
+
+export interface RawAzureResourceItem {
+  id: string;
+  name: string;
+  subscriptionId: string;
+  resourceGroup: string;
+  type: string;
+  location: string;
+}
+
+export interface AzureGraphResponse<T = unknown> {
+  data: T;
+}

From d666defaea5786aca9672cff8b497b31d6ee1254 Mon Sep 17 00:00:00 2001
From: Domas <domasx2@gmail.com>
Date: Tue, 25 May 2021 10:26:10 +0300
Subject: [PATCH 39/43] Alerting: misc ui fixes volume 4 (#34503)

---
 .../amroutes/AmRoutesExpandedForm.tsx         |  7 +--
 .../amroutes/AmRoutesExpandedRead.tsx         | 50 ++++++++++---------
 .../components/amroutes/AmRoutesTable.tsx     |  2 +-
 .../components/receivers/ReceiversTable.tsx   | 11 +++-
 .../components/rule-editor/AlertRuleForm.tsx  | 10 +++-
 .../components/rules/AlertInstanceDetails.tsx |  2 +-
 .../unified/components/rules/RuleDetails.tsx  |  2 +-
 .../unified/components/rules/RuleState.tsx    |  6 +--
 .../components/silences/MatchersField.tsx     |  7 ++-
 .../components/silences/SilencesTable.tsx     |  2 +-
 .../alerting/unified/utils/receivers.ts       | 42 ++++++++++------
 11 files changed, 86 insertions(+), 55 deletions(-)

diff --git a/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedForm.tsx b/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedForm.tsx
index 5a4e64b7696..1aa1871891c 100644
--- a/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedForm.tsx
+++ b/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedForm.tsx
@@ -54,21 +54,21 @@ export const AmRoutesExpandedForm: FC<AmRoutesExpandedFormProps> = ({ onCancel,
           <FieldArray name="matchers" control={control}>
             {({ fields, append, remove }) => (
               <>
-                <div>Matchers</div>
+                <div>Matching labels</div>
                 <div className={styles.matchersContainer}>
                   {fields.map((field, index) => {
                     const localPath = `matchers[${index}]`;
-
                     return (
                       <HorizontalGroup key={field.id} align="flex-start">
                         <Field
-                          label="Name"
+                          label="Label"
                           invalid={!!errors.matchers?.[index]?.name}
                           error={errors.matchers?.[index]?.name?.message}
                         >
                           <Input
                             {...register(`${localPath}.name`, { required: 'Field is required' })}
                             defaultValue={field.name}
+                            placeholder="label"
                           />
                         </Field>
                         <Field
@@ -79,6 +79,7 @@ export const AmRoutesExpandedForm: FC<AmRoutesExpandedFormProps> = ({ onCancel,
                           <Input
                             {...register(`${localPath}.value`, { required: 'Field is required' })}
                             defaultValue={field.value}
+                            placeholder="value"
                           />
                         </Field>
                         <Field className={styles.matcherRegexField} label="Regex">
diff --git a/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedRead.tsx b/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedRead.tsx
index 17462080798..4c918b98c63 100644
--- a/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedRead.tsx
+++ b/public/app/features/alerting/unified/components/amroutes/AmRoutesExpandedRead.tsx
@@ -38,30 +38,34 @@ export const AmRoutesExpandedRead: FC<AmRoutesExpandedReadProps> = ({ onChange,
       <div className={gridStyles.valueCell}>{repeatInterval}</div>
       <div className={gridStyles.titleCell}>Nested policies</div>
       <div className={gridStyles.valueCell}>
-        <AmRoutesTable
-          isAddMode={isAddMode}
-          onCancelAdd={() => {
-            setIsAddMode(false);
-            setSubroutes((subroutes) => {
-              const newSubroutes = [...subroutes];
-              newSubroutes.pop();
-
-              return newSubroutes;
-            });
-          }}
-          onChange={(newRoutes) => {
-            onChange({
-              ...routes,
-              routes: newRoutes,
-            });
-
-            if (isAddMode) {
+        {!!subroutes.length ? (
+          <AmRoutesTable
+            isAddMode={isAddMode}
+            onCancelAdd={() => {
               setIsAddMode(false);
-            }
-          }}
-          receivers={receivers}
-          routes={subroutes}
-        />
+              setSubroutes((subroutes) => {
+                const newSubroutes = [...subroutes];
+                newSubroutes.pop();
+
+                return newSubroutes;
+              });
+            }}
+            onChange={(newRoutes) => {
+              onChange({
+                ...routes,
+                routes: newRoutes,
+              });
+
+              if (isAddMode) {
+                setIsAddMode(false);
+              }
+            }}
+            receivers={receivers}
+            routes={subroutes}
+          />
+        ) : (
+          <p>No nested policies configured.</p>
+        )}
         {!isAddMode && (
           <Button
             className={styles.addNestedRoutingBtn}
diff --git a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
index a0254651a7e..811f512add1 100644
--- a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
+++ b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
@@ -65,7 +65,7 @@ export const AmRoutesTable: FC<AmRoutesTableProps> = ({ isAddMode, onCancelAdd,
   const cols: RouteTableColumnProps[] = [
     {
       id: 'matchingCriteria',
-      label: 'Matching criteria',
+      label: 'Matching labels',
       // eslint-disable-next-line react/display-name
       renderCell: (item) => <Matchers matchers={item.data.matchers} />,
       size: 10,
diff --git a/public/app/features/alerting/unified/components/receivers/ReceiversTable.tsx b/public/app/features/alerting/unified/components/receivers/ReceiversTable.tsx
index ede2423a54c..09b9c5275c4 100644
--- a/public/app/features/alerting/unified/components/receivers/ReceiversTable.tsx
+++ b/public/app/features/alerting/unified/components/receivers/ReceiversTable.tsx
@@ -3,7 +3,7 @@ import { AlertManagerCortexConfig } from 'app/plugins/datasource/alertmanager/ty
 import React, { FC, useMemo, useState } from 'react';
 import { useUnifiedAlertingSelector } from '../../hooks/useUnifiedAlertingSelector';
 import { getAlertTableStyles } from '../../styles/table';
-import { extractReadableNotifierTypes } from '../../utils/receivers';
+import { extractNotifierTypeCounts } from '../../utils/receivers';
 import { ActionIcon } from '../rules/ActionIcon';
 import { ReceiversSection } from './ReceiversSection';
 import { makeAMLink } from '../../utils/misc';
@@ -48,7 +48,14 @@ export const ReceiversTable: FC<Props> = ({ config, alertManagerName }) => {
     () =>
       config.alertmanager_config.receivers?.map((receiver) => ({
         name: receiver.name,
-        types: extractReadableNotifierTypes(receiver, grafanaNotifiers.result ?? []),
+        types: Object.entries(extractNotifierTypeCounts(receiver, grafanaNotifiers.result ?? [])).map(
+          ([type, count]) => {
+            if (count > 1) {
+              return `${type} (${count})`;
+            }
+            return type;
+          }
+        ),
       })) ?? [],
     [config, grafanaNotifiers.result]
   );
diff --git a/public/app/features/alerting/unified/components/rule-editor/AlertRuleForm.tsx b/public/app/features/alerting/unified/components/rule-editor/AlertRuleForm.tsx
index 4aa39a82d1e..d90e6564e65 100644
--- a/public/app/features/alerting/unified/components/rule-editor/AlertRuleForm.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/AlertRuleForm.tsx
@@ -66,8 +66,14 @@ export const AlertRuleForm: FC<Props> = ({ existing }) => {
         values: {
           ...defaultValues,
           ...values,
-          annotations: values.annotations?.filter(({ key, value }) => !!key && !!value) ?? [],
-          labels: values.labels?.filter(({ key }) => !!key) ?? [],
+          annotations:
+            values.annotations
+              ?.map(({ key, value }) => ({ key: key.trim(), value: value.trim() }))
+              .filter(({ key, value }) => !!key && !!value) ?? [],
+          labels:
+            values.labels
+              ?.map(({ key, value }) => ({ key: key.trim(), value: value.trim() }))
+              .filter(({ key }) => !!key) ?? [],
         },
         existing,
         redirectOnSave: exitOnSave ? returnTo : undefined,
diff --git a/public/app/features/alerting/unified/components/rules/AlertInstanceDetails.tsx b/public/app/features/alerting/unified/components/rules/AlertInstanceDetails.tsx
index cdd5c5ba0cb..6d4443da42d 100644
--- a/public/app/features/alerting/unified/components/rules/AlertInstanceDetails.tsx
+++ b/public/app/features/alerting/unified/components/rules/AlertInstanceDetails.tsx
@@ -8,7 +8,7 @@ interface Props {
 }
 
 export const AlertInstanceDetails: FC<Props> = ({ instance }) => {
-  const annotations = Object.entries(instance.annotations || {}) || [];
+  const annotations = (Object.entries(instance.annotations || {}) || []).filter(([_, value]) => !!value.trim());
 
   return (
     <div>
diff --git a/public/app/features/alerting/unified/components/rules/RuleDetails.tsx b/public/app/features/alerting/unified/components/rules/RuleDetails.tsx
index 4c1bea8ac10..1af71cb9453 100644
--- a/public/app/features/alerting/unified/components/rules/RuleDetails.tsx
+++ b/public/app/features/alerting/unified/components/rules/RuleDetails.tsx
@@ -24,7 +24,7 @@ export const RuleDetails: FC<Props> = ({ rule, rulesSource }) => {
 
   const { promRule } = rule;
 
-  const annotations = Object.entries(rule.annotations);
+  const annotations = Object.entries(rule.annotations).filter(([_, value]) => !!value.trim());
 
   const dataSources: Array<{ name: string; icon?: string }> = useMemo(() => {
     if (isCloudRulesSource(rulesSource)) {
diff --git a/public/app/features/alerting/unified/components/rules/RuleState.tsx b/public/app/features/alerting/unified/components/rules/RuleState.tsx
index b00046ff2b3..85427dc3a79 100644
--- a/public/app/features/alerting/unified/components/rules/RuleState.tsx
+++ b/public/app/features/alerting/unified/components/rules/RuleState.tsx
@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
 import { GrafanaTheme2, intervalToAbbreviatedDurationString } from '@grafana/data';
 import { HorizontalGroup, Spinner, useStyles2 } from '@grafana/ui';
 import { CombinedRule } from 'app/types/unified-alerting';
-import { PromAlertingRuleState } from 'app/types/unified-alerting-dto';
+import { GrafanaAlertState, PromAlertingRuleState } from 'app/types/unified-alerting-dto';
 import React, { FC, useMemo } from 'react';
 import { isAlertingRule, isRecordingRule } from '../../utils/rules';
 import { AlertStateTag } from './AlertStateTag';
@@ -27,7 +27,7 @@ export const RuleState: FC<Props> = ({ rule, isDeleting, isCreating }) => {
     ) {
       // find earliest alert
       const firstActiveAt = promRule.alerts.reduce((prev, alert) => {
-        if (alert.activeAt) {
+        if (alert.activeAt && alert.state !== GrafanaAlertState.Normal) {
           const activeAt = new Date(alert.activeAt);
           if (prev === null || prev.getTime() > activeAt.getTime()) {
             return activeAt;
@@ -36,7 +36,7 @@ export const RuleState: FC<Props> = ({ rule, isDeleting, isCreating }) => {
         return prev;
       }, null as Date | null);
 
-      // caclulate time elapsed from earliest alert
+      // calculate time elapsed from earliest alert
       if (firstActiveAt) {
         return (
           <span title={String(firstActiveAt)} className={style.for}>
diff --git a/public/app/features/alerting/unified/components/silences/MatchersField.tsx b/public/app/features/alerting/unified/components/silences/MatchersField.tsx
index 7c2c9bb3c08..e49d4fab774 100644
--- a/public/app/features/alerting/unified/components/silences/MatchersField.tsx
+++ b/public/app/features/alerting/unified/components/silences/MatchersField.tsx
@@ -21,15 +21,14 @@ const MatchersField: FC<Props> = ({ className }) => {
 
   return (
     <div className={cx(className, styles.wrapper)}>
-      <Field label="Matchers" required>
+      <Field label="Matching labels" required>
         <div>
           <div className={styles.matchers}>
             {matchers.map((matcher, index) => {
-              console.log(matcher);
               return (
                 <div className={styles.row} key={`${matcher.id}`}>
                   <Field
-                    label="Name"
+                    label="Label"
                     invalid={!!errors?.matchers?.[index]?.name}
                     error={errors?.matchers?.[index]?.name?.message}
                   >
@@ -38,7 +37,7 @@ const MatchersField: FC<Props> = ({ className }) => {
                         required: { value: true, message: 'Required.' },
                       })}
                       defaultValue={matcher.name}
-                      placeholder="name"
+                      placeholder="label"
                     />
                   </Field>
                   <Field
diff --git a/public/app/features/alerting/unified/components/silences/SilencesTable.tsx b/public/app/features/alerting/unified/components/silences/SilencesTable.tsx
index dae086effa1..5a3ccd90e84 100644
--- a/public/app/features/alerting/unified/components/silences/SilencesTable.tsx
+++ b/public/app/features/alerting/unified/components/silences/SilencesTable.tsx
@@ -48,7 +48,7 @@ const SilencesTable: FC<Props> = ({ silences, alertManagerAlerts, alertManagerSo
               <tr>
                 <th />
                 <th>State</th>
-                <th>Matchers</th>
+                <th>Matching labels</th>
                 <th>Alerts</th>
                 <th>Schedule</th>
                 {contextSrv.isEditor && <th>Action</th>}
diff --git a/public/app/features/alerting/unified/utils/receivers.ts b/public/app/features/alerting/unified/utils/receivers.ts
index cc2f026b243..44f0d8a7e89 100644
--- a/public/app/features/alerting/unified/utils/receivers.ts
+++ b/public/app/features/alerting/unified/utils/receivers.ts
@@ -3,29 +3,43 @@ import { GrafanaManagedReceiverConfig, Receiver } from 'app/plugins/datasource/a
 import { NotifierDTO } from 'app/types';
 import { capitalize } from 'lodash';
 
-// extract readable notifier types that are in use for a receiver, eg ['Slack', 'Email', 'PagerDuty']
-export function extractReadableNotifierTypes(receiver: Receiver, grafanaNotifiers: NotifierDTO[]): string[] {
-  return [
-    // grafana specific receivers
-    ...getReadabaleGrafanaNotifierTypes(receiver.grafana_managed_receiver_configs ?? [], grafanaNotifiers),
-    // cortex alert manager receivers
-    ...getReadableCortexAlertManagerNotifierTypes(receiver),
-  ];
+// extract notifier type name to count map, eg { Slack: 1, Email: 2 }
+
+type NotifierTypeCounts = Record<string, number>; // name : count
+
+export function extractNotifierTypeCounts(receiver: Receiver, grafanaNotifiers: NotifierDTO[]): NotifierTypeCounts {
+  if (receiver['grafana_managed_receiver_configs']) {
+    return getGrafanaNotifierTypeCounts(receiver.grafana_managed_receiver_configs ?? [], grafanaNotifiers);
+  }
+  return getCortexAlertManagerNotifierTypeCounts(receiver);
 }
 
-function getReadableCortexAlertManagerNotifierTypes(receiver: Receiver): string[] {
+function getCortexAlertManagerNotifierTypeCounts(receiver: Receiver): NotifierTypeCounts {
   return Object.entries(receiver)
     .filter(([key]) => key !== 'grafana_managed_receiver_configs' && key.endsWith('_configs')) // filter out only properties that are alert manager notifier
     .filter(([_, value]) => Array.isArray(value) && !!value.length) // check that there are actually notifiers of this type configured
-    .map(([key]) => key.replace('_configs', '')) // remove the `_config` part from the key, making it intto a notifier name
-    .map((type) => receiverTypeNames[type] ?? capitalize(type)); // either map to readable name or, failing that, capitalize
+    .reduce<NotifierTypeCounts>((acc, [key, value]) => {
+      const type = key.replace('_configs', ''); // remove the `_config` part from the key, making it intto a notifier name
+      const name = receiverTypeNames[type] ?? capitalize(type);
+      return {
+        ...acc,
+        [name]: (acc[name] ?? 0) + (Array.isArray(value) ? value.length : 1),
+      };
+    }, {});
 }
 
-function getReadabaleGrafanaNotifierTypes(
+function getGrafanaNotifierTypeCounts(
   configs: GrafanaManagedReceiverConfig[],
   grafanaNotifiers: NotifierDTO[]
-): string[] {
+): NotifierTypeCounts {
   return configs
     .map((recv) => recv.type) // extract types from config
-    .map((type) => grafanaNotifiers.find((r) => r.type === type)?.name ?? capitalize(type)); // get readable name from notifier cofnig, or if not available, just capitalize
+    .map((type) => grafanaNotifiers.find((r) => r.type === type)?.name ?? capitalize(type)) // get readable name from notifier cofnig, or if not available, just capitalize
+    .reduce<NotifierTypeCounts>(
+      (acc, type) => ({
+        ...acc,
+        [type]: (acc[type] ?? 0) + 1,
+      }),
+      {}
+    );
 }

From 91657dad182127bf577b449ff9d94e5bf86e592a Mon Sep 17 00:00:00 2001
From: Dimitris Sotirakis <dimitrios.sotirakis@grafana.com>
Date: Tue, 25 May 2021 11:32:41 +0300
Subject: [PATCH 40/43] HTTP Client: Make `ResponseHeaderTimeout` default
 timeout in http client (#34597)

* HTTP Client: Add `ResponseHeaderTimeout` - split from `DialContext` timeout

* Fixes according to reviewer's comments

* Use grafana-plugin-sdk-go v0.100.0
---
 conf/defaults.ini              | 5 ++++-
 conf/sample.ini                | 5 ++++-
 go.mod                         | 2 +-
 go.sum                         | 4 ++--
 pkg/models/datasource_cache.go | 1 +
 pkg/setting/setting.go         | 4 +++-
 6 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/conf/defaults.ini b/conf/defaults.ini
index c64eb7e9e43..b3afe596fea 100644
--- a/conf/defaults.ini
+++ b/conf/defaults.ini
@@ -139,10 +139,13 @@ connstr =
 # This enables data proxy logging, default is false
 logging = false
 
-# How long the data proxy waits before timing out, default is 30 seconds.
+# How long the data proxy waits to read the headers of the response before timing out, default is 30 seconds.
 # This setting also applies to core backend HTTP data sources where query requests use an HTTP client with timeout set.
 timeout = 30
 
+# How long the data proxy waits to establish a TCP connection before timing out, default is 10 seconds.
+dialTimeout = 10
+
 # How many seconds the data proxy waits before sending a keepalive request.
 keep_alive_seconds = 30
 
diff --git a/conf/sample.ini b/conf/sample.ini
index ed2e289432c..f86c70b5348 100644
--- a/conf/sample.ini
+++ b/conf/sample.ini
@@ -145,10 +145,13 @@
 # This enables data proxy logging, default is false
 ;logging = false
 
-# How long the data proxy waits before timing out, default is 30 seconds.
+# How long the data proxy waits to read the headers of the response before timing out, default is 30 seconds.
 # This setting also applies to core backend HTTP data sources where query requests use an HTTP client with timeout set.
 ;timeout = 30
 
+# How long the data proxy waits to establish a TCP connection before timing out, default is 10 seconds.
+;dialTimeout = 10
+
 # How many seconds the data proxy waits before sending a keepalive probe request.
 ;keep_alive_seconds = 30
 
diff --git a/go.mod b/go.mod
index a227ca86274..5ade367b175 100644
--- a/go.mod
+++ b/go.mod
@@ -51,7 +51,7 @@ require (
 	github.com/gosimple/slug v1.9.0
 	github.com/grafana/grafana-aws-sdk v0.4.0
 	github.com/grafana/grafana-live-sdk v0.0.6
-	github.com/grafana/grafana-plugin-sdk-go v0.99.0
+	github.com/grafana/grafana-plugin-sdk-go v0.100.0
 	github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103
 	github.com/grpc-ecosystem/go-grpc-middleware v1.3.0
 	github.com/hashicorp/go-hclog v0.16.0
diff --git a/go.sum b/go.sum
index ce078b50bf4..823e47bd3a1 100644
--- a/go.sum
+++ b/go.sum
@@ -922,8 +922,8 @@ github.com/grafana/grafana-live-sdk v0.0.6 h1:P1QFn0ZradOJp3zVpfG0STZMP+pgZrW0e0
 github.com/grafana/grafana-live-sdk v0.0.6/go.mod h1:f15hHmWyLdFjmuWLsjeKeZnq/HnNQ3QkoPcaEww45AY=
 github.com/grafana/grafana-plugin-sdk-go v0.79.0/go.mod h1:NvxLzGkVhnoBKwzkst6CFfpMFKwAdIUZ1q8ssuLeF60=
 github.com/grafana/grafana-plugin-sdk-go v0.91.0/go.mod h1:Ot3k7nY7P6DXmUsDgKvNB7oG1v7PRyTdmnYVoS554bU=
-github.com/grafana/grafana-plugin-sdk-go v0.99.0 h1:pEmoSSYw7VsF+rhRgG4z+azE3eLwznomxVg9Ezppqzo=
-github.com/grafana/grafana-plugin-sdk-go v0.99.0/go.mod h1:D7x3ah+1d4phNXpbnOaxa/osSaZlwh9/ZUnGGzegRbk=
+github.com/grafana/grafana-plugin-sdk-go v0.100.0 h1:BryvIFdx/HrsKMt2hkxN7cJ0WrCgKpgjdJW8y8TSol0=
+github.com/grafana/grafana-plugin-sdk-go v0.100.0/go.mod h1:D7x3ah+1d4phNXpbnOaxa/osSaZlwh9/ZUnGGzegRbk=
 github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103 h1:qCmofFVwQR9QnsinstVqI1NPLMVl33jNCnOCXEAVn6E=
 github.com/grafana/loki v1.6.2-0.20210520072447-15d417efe103/go.mod h1:GHIsn+EohCChsdu5YouNZewqLeV9L2FNw4DEJU3P9qE=
 github.com/gregjones/httpcache v0.0.0-20180305231024-9cad4c3443a7/go.mod h1:FecbI9+v66THATjSRHfNgh1IVFe/9kFxbXtjV0ctIMA=
diff --git a/pkg/models/datasource_cache.go b/pkg/models/datasource_cache.go
index 292c74560ef..1ef513bf64b 100644
--- a/pkg/models/datasource_cache.go
+++ b/pkg/models/datasource_cache.go
@@ -76,6 +76,7 @@ func (ds *DataSource) HTTPClientOptions() sdkhttpclient.Options {
 	opts := sdkhttpclient.Options{
 		Timeouts: &sdkhttpclient.TimeoutOptions{
 			Timeout:               ds.getTimeout(),
+			DialTimeout:           time.Duration(setting.DataProxyDialTimeout) * time.Second,
 			KeepAlive:             time.Duration(setting.DataProxyKeepAlive) * time.Second,
 			TLSHandshakeTimeout:   time.Duration(setting.DataProxyTLSHandshakeTimeout) * time.Second,
 			ExpectContinueTimeout: time.Duration(setting.DataProxyExpectContinueTimeout) * time.Second,
diff --git a/pkg/setting/setting.go b/pkg/setting/setting.go
index a2ecbb42f40..f34386e8b88 100644
--- a/pkg/setting/setting.go
+++ b/pkg/setting/setting.go
@@ -78,6 +78,7 @@ var (
 	// HTTP server options
 	DataProxyLogging               bool
 	DataProxyTimeout               int
+	DataProxyDialTimeout           int
 	DataProxyTLSHandshakeTimeout   int
 	DataProxyExpectContinueTimeout int
 	DataProxyMaxIdleConns          int
@@ -823,7 +824,8 @@ func (cfg *Cfg) Load(args *CommandLineArgs) error {
 	// read data proxy settings
 	dataproxy := iniFile.Section("dataproxy")
 	DataProxyLogging = dataproxy.Key("logging").MustBool(false)
-	DataProxyTimeout = dataproxy.Key("timeout").MustInt(30)
+	DataProxyTimeout = dataproxy.Key("timeout").MustInt(10)
+	DataProxyDialTimeout = dataproxy.Key("dialTimeout").MustInt(30)
 	DataProxyKeepAlive = dataproxy.Key("keep_alive_seconds").MustInt(30)
 	DataProxyTLSHandshakeTimeout = dataproxy.Key("tls_handshake_timeout_seconds").MustInt(10)
 	DataProxyExpectContinueTimeout = dataproxy.Key("expect_continue_timeout_seconds").MustInt(1)

From dcef87fd792764833aa8b8c8d3d1264de98d1f4e Mon Sep 17 00:00:00 2001
From: Peter Holmberg <peterholmberg@users.noreply.github.com>
Date: Tue, 25 May 2021 11:34:19 +0200
Subject: [PATCH 41/43] Alerting: Move query components to unified folder
 (#34587)

---
 .../components/rule-editor/QueryEditor.tsx}     | 17 ++++++++++-------
 .../components/rule-editor/QueryRows.tsx}       |  6 +++---
 .../components/rule-editor/QueryStep.tsx        |  4 ++--
 .../components/rule-editor/QueryWrapper.tsx}    |  8 ++++----
 .../state/AlertingQueryRunner.test.ts           |  0
 .../{ => unified}/state/AlertingQueryRunner.ts  |  2 +-
 6 files changed, 20 insertions(+), 17 deletions(-)
 rename public/app/features/alerting/{components/AlertingQueryEditor.tsx => unified/components/rule-editor/QueryEditor.tsx} (91%)
 rename public/app/features/alerting/{components/AlertingQueryRows.tsx => unified/components/rule-editor/QueryRows.tsx} (96%)
 rename public/app/features/alerting/{components/AlertingQueryWrapper.tsx => unified/components/rule-editor/QueryWrapper.tsx} (90%)
 rename public/app/features/alerting/{ => unified}/state/AlertingQueryRunner.test.ts (100%)
 rename public/app/features/alerting/{ => unified}/state/AlertingQueryRunner.ts (98%)

diff --git a/public/app/features/alerting/components/AlertingQueryEditor.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryEditor.tsx
similarity index 91%
rename from public/app/features/alerting/components/AlertingQueryEditor.tsx
rename to public/app/features/alerting/unified/components/rule-editor/QueryEditor.tsx
index 15d4fcaa343..bd480ca8f74 100644
--- a/public/app/features/alerting/components/AlertingQueryEditor.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryEditor.tsx
@@ -11,13 +11,16 @@ import {
 import { selectors } from '@grafana/e2e-selectors';
 import { Button, HorizontalGroup, Icon, stylesFactory, Tooltip } from '@grafana/ui';
 import { config } from '@grafana/runtime';
-import { AlertingQueryRows } from './AlertingQueryRows';
-import { dataSource as expressionDatasource, ExpressionDatasourceUID } from '../../expressions/ExpressionDatasource';
+import { QueryRows } from './QueryRows';
+import {
+  dataSource as expressionDatasource,
+  ExpressionDatasourceUID,
+} from 'app/features/expressions/ExpressionDatasource';
 import { getNextRefIdChar } from 'app/core/utils/query';
-import { defaultCondition } from '../../expressions/utils/expressionTypes';
-import { ExpressionQueryType } from '../../expressions/types';
+import { defaultCondition } from 'app/features/expressions/utils/expressionTypes';
+import { ExpressionQueryType } from 'app/features/expressions/types';
 import { GrafanaQuery } from 'app/types/unified-alerting-dto';
-import { AlertingQueryRunner } from '../state/AlertingQueryRunner';
+import { AlertingQueryRunner } from '../../state/AlertingQueryRunner';
 import { getDatasourceSrv } from 'app/features/plugins/datasource_srv';
 import { isExpressionQuery } from 'app/features/expressions/guards';
 
@@ -29,7 +32,7 @@ interface Props {
 interface State {
   panelDataByRefId: Record<string, PanelData>;
 }
-export class AlertingQueryEditor extends PureComponent<Props, State> {
+export class QueryEditor extends PureComponent<Props, State> {
   private runner: AlertingQueryRunner;
 
   constructor(props: Props) {
@@ -160,7 +163,7 @@ export class AlertingQueryEditor extends PureComponent<Props, State> {
 
     return (
       <div className={styles.container}>
-        <AlertingQueryRows
+        <QueryRows
           data={panelDataByRefId}
           queries={value}
           onQueriesChange={this.props.onChange}
diff --git a/public/app/features/alerting/components/AlertingQueryRows.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
similarity index 96%
rename from public/app/features/alerting/components/AlertingQueryRows.tsx
rename to public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
index 3372673892c..0023c41b39d 100644
--- a/public/app/features/alerting/components/AlertingQueryRows.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryRows.tsx
@@ -2,7 +2,7 @@ import React, { PureComponent } from 'react';
 import { DragDropContext, Droppable, DropResult } from 'react-beautiful-dnd';
 import { DataQuery, DataSourceInstanceSettings, PanelData, RelativeTimeRange } from '@grafana/data';
 import { getDataSourceSrv } from '@grafana/runtime';
-import { AlertingQueryWrapper } from './AlertingQueryWrapper';
+import { QueryWrapper } from './QueryWrapper';
 import { GrafanaQuery } from 'app/types/unified-alerting-dto';
 
 interface Props {
@@ -20,7 +20,7 @@ interface State {
   dataPerQuery: Record<string, PanelData>;
 }
 
-export class AlertingQueryRows extends PureComponent<Props, State> {
+export class QueryRows extends PureComponent<Props, State> {
   constructor(props: Props) {
     super(props);
 
@@ -148,7 +148,7 @@ export class AlertingQueryRows extends PureComponent<Props, State> {
                   }
 
                   return (
-                    <AlertingQueryWrapper
+                    <QueryWrapper
                       index={index}
                       key={`${query.refId}-${index}`}
                       dsSettings={dsSettings}
diff --git a/public/app/features/alerting/unified/components/rule-editor/QueryStep.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryStep.tsx
index 654ccf0bb87..6ca2b770351 100644
--- a/public/app/features/alerting/unified/components/rule-editor/QueryStep.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryStep.tsx
@@ -4,7 +4,7 @@ import { Field, InputControl } from '@grafana/ui';
 import { ExpressionEditor } from './ExpressionEditor';
 import { RuleEditorSection } from './RuleEditorSection';
 import { RuleFormType, RuleFormValues } from '../../types/rule-form';
-import { AlertingQueryEditor } from '../../../components/AlertingQueryEditor';
+import { QueryEditor } from './QueryEditor';
 
 export const QueryStep: FC = () => {
   const {
@@ -35,7 +35,7 @@ export const QueryStep: FC = () => {
         >
           <InputControl
             name="queries"
-            render={({ field: { ref, ...field } }) => <AlertingQueryEditor {...field} />}
+            render={({ field: { ref, ...field } }) => <QueryEditor {...field} />}
             control={control}
             rules={{
               validate: (queries) => Array.isArray(queries) && !!queries.length,
diff --git a/public/app/features/alerting/components/AlertingQueryWrapper.tsx b/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
similarity index 90%
rename from public/app/features/alerting/components/AlertingQueryWrapper.tsx
rename to public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
index 9add49978b6..f8f4a22048b 100644
--- a/public/app/features/alerting/components/AlertingQueryWrapper.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/QueryWrapper.tsx
@@ -9,9 +9,9 @@ import {
   getDefaultRelativeTimeRange,
 } from '@grafana/data';
 import { useStyles2, RelativeTimeRangePicker } from '@grafana/ui';
-import { QueryEditorRow } from '../../query/components/QueryEditorRow';
-import { VizWrapper } from '../unified/components/rule-editor/VizWrapper';
-import { isExpressionQuery } from '../../expressions/guards';
+import { QueryEditorRow } from '../../../../query/components/QueryEditorRow';
+import { VizWrapper } from './VizWrapper';
+import { isExpressionQuery } from '../../../../expressions/guards';
 import { GrafanaQuery } from 'app/types/unified-alerting-dto';
 import { cloneDeep } from 'lodash';
 
@@ -29,7 +29,7 @@ interface Props {
   index: number;
 }
 
-export const AlertingQueryWrapper: FC<Props> = ({
+export const QueryWrapper: FC<Props> = ({
   data,
   dsSettings,
   index,
diff --git a/public/app/features/alerting/state/AlertingQueryRunner.test.ts b/public/app/features/alerting/unified/state/AlertingQueryRunner.test.ts
similarity index 100%
rename from public/app/features/alerting/state/AlertingQueryRunner.test.ts
rename to public/app/features/alerting/unified/state/AlertingQueryRunner.test.ts
diff --git a/public/app/features/alerting/state/AlertingQueryRunner.ts b/public/app/features/alerting/unified/state/AlertingQueryRunner.ts
similarity index 98%
rename from public/app/features/alerting/state/AlertingQueryRunner.ts
rename to public/app/features/alerting/unified/state/AlertingQueryRunner.ts
index 145fec28736..c69bffd41b0 100644
--- a/public/app/features/alerting/state/AlertingQueryRunner.ts
+++ b/public/app/features/alerting/unified/state/AlertingQueryRunner.ts
@@ -14,7 +14,7 @@ import { FetchResponse, toDataQueryError } from '@grafana/runtime';
 import { BackendSrv, getBackendSrv } from 'app/core/services/backend_srv';
 import { preProcessPanelData } from 'app/features/query/state/runRequest';
 import { GrafanaQuery } from 'app/types/unified-alerting-dto';
-import { getTimeRangeForExpression } from '../unified/utils/timeRange';
+import { getTimeRangeForExpression } from '../utils/timeRange';
 import { isExpressionQuery } from 'app/features/expressions/guards';
 import { setStructureRevision } from 'app/features/query/state/processing/revision';
 import { cancelNetworkRequestsOnUnsubscribe } from 'app/features/query/state/processing/canceler';

From a9b88bc72c05e66a2881872969c403efa9a1560f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A1bor=20Farkas?= <gabor.farkas@gmail.com>
Date: Tue, 25 May 2021 12:59:37 +0200
Subject: [PATCH 42/43] fix modified yarn.lock (#34640)

---
 yarn.lock | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index dcb41f6a723..f9eae915217 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4837,11 +4837,6 @@
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-6.0.2.tgz#5e8b09f0e4af53034b1d0fb9977a277847836205"
   integrity sha512-G1Ggy7/9Nsa1Jt2yiBR2riEuyK2DFNnqow6R7cromXPMNynackRY1vqFTLz/gwnef1LHokbXThcPhqMRjUbkpQ==
 
-"@types/semver@^7.3.4":
-  version "7.3.4"
-  resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.3.4.tgz#43d7168fec6fa0988bb1a513a697b29296721afb"
-  integrity sha512-+nVsLKlcUCeMzD2ufHEYuJ9a2ovstb6Dp52A5VsoKxDXgvE051XgHI/33I1EymwkRGQkwnA0LkhnUzituGs4EQ==
-
 "@types/serve-static@*":
   version "1.13.3"
   resolved "https://registry.yarnpkg.com/@types/serve-static/-/serve-static-1.13.3.tgz#eb7e1c41c4468272557e897e9171ded5e2ded9d1"

From 2f14ef923501cf75e01ceb418ff9e4a1d51328f3 Mon Sep 17 00:00:00 2001
From: Simon Podlipsky <simon@podlipsky.net>
Date: Tue, 25 May 2021 13:10:54 +0200
Subject: [PATCH 43/43] Chore: Remove console.log() from AngularApp (#34641)

---
 public/app/angular/AngularApp.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/public/app/angular/AngularApp.ts b/public/app/angular/AngularApp.ts
index ae938be493e..ffa585766dc 100644
--- a/public/app/angular/AngularApp.ts
+++ b/public/app/angular/AngularApp.ts
@@ -107,8 +107,6 @@ export class AngularApp {
 
     monkeyPatchInjectorWithPreAssignedBindings(injector);
 
-    console.log('Angular app bootstrap');
-
     injector.invoke(() => {
       this.preBootModules.forEach((module) => {
         extend(module, this.registerFunctions);