"Release: Updated versions in package to 8.0.3" (#35929)

(cherry picked from commit 22203fd4df)

Co-authored-by: Torkel Ödegaard <torkel@grafana.org>

.circleci/config.yml

@@ -1,60 +1,11 @@
 version: 2.1
-
-aliases:
-  # Workflow filters
-  - &filter-only-main
-    branches:
-      only: main
-
 jobs:
-  scan-docker-image:
-    description: "Scans a docker image for vulnerabilities using trivy"
-    parameters:
-      image:
-        type: string
-      tag:
-        type: string
+  build:
     docker:
-      - image: circleci/buildpack-deps:stretch
+      - image: alpine:3.7
     steps:
-      - setup_remote_docker
-      - restore_cache:
-          key: vulnerability-db
       - run:
-          name: Install trivy
+          name: The First Step
           command: |
-            VERSION=$(
-                curl --silent "https://api.github.com/repos/aquasecurity/trivy/releases/latest" | \
-                grep '"tag_name":' | \
-                sed -E 's/.*"v([^"]+)".*/\1/'
-            )
+            echo 'Fake step!'
 
-            wget https://github.com/aquasecurity/trivy/releases/download/v${VERSION}/trivy_${VERSION}_Linux-64bit.tar.gz
-            tar zxvf trivy_${VERSION}_Linux-64bit.tar.gz
-            sudo mv trivy /usr/local/bin
-      - run:
-          name: Clear trivy cache
-          command: trivy --clear-cache
-      - run:
-          name: Scan Docker image for unkown/low/medium vulnerabilities
-          command: trivy --exit-code 0 --severity UNKNOWN,LOW,MEDIUM << parameters.image >>:<< parameters.tag >>
-      - run:
-          name: Scan Docker image for high/critical vulnerabilities
-          command: trivy --exit-code 1 --severity HIGH,CRITICAL << parameters.image >>:<< parameters.tag >>
-      - save_cache:
-          key: vulnerability-db
-          paths:
-            - $HOME/.cache/trivy
-
-workflows:
-  nightly:
-    triggers:
-      - schedule:
-          cron: "0 0 * * *"
-          filters: *filter-only-main
-    jobs:
-      - scan-docker-image:
-          matrix:
-            parameters:
-              image: [grafana/grafana, grafana/grafana-enterprise]
-              tag: [latest, main, latest-ubuntu, main-ubuntu]

.drone.star

@@ -2,9 +2,10 @@ load('scripts/pr.star', 'pr_pipelines')
 load('scripts/main.star', 'main_pipelines')
 load('scripts/release.star', 'release_pipelines', 'test_release_pipelines')
 load('scripts/version.star', 'version_branch_pipelines')
+load('scripts/job.star', 'cronjobs')
 load('scripts/vault.star', 'secrets')
 
 def main(ctx):
     edition = 'oss'
     return pr_pipelines(edition=edition) + main_pipelines(edition=edition) + release_pipelines() + \
-        test_release_pipelines() + version_branch_pipelines() + secrets()
+        test_release_pipelines() + version_branch_pipelines() + cronjobs(edition=edition) + secrets()

.drone.yml

@@ -165,7 +165,6 @@ steps:
   - mkdir -p /hugo/content/docs/grafana
   - cp -r docs/sources/* /hugo/content/docs/grafana/latest/
   - cd /hugo && make prod
-  failure: ignore
   depends_on:
   - initialize
   - build-frontend-docs
@@ -689,7 +688,7 @@ steps:
   image: plugins/slack
   settings:
     channel: grafana-ci-notifications
-    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nAuthor: {{build.author}}"
+    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nBranch: <https://github.com/{{ repo.owner }}/{{ repo.name }}/commits/{{ build.branch }}|{{ build.branch }}>\nAuthor: {{build.author}}"
     webhook:
       from_secret: slack_webhook
 
@@ -755,8 +754,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
 
@@ -1098,6 +1097,7 @@ steps:
   - rmdir bin
   - mv grafana-enterprise /tmp/
   - /tmp/grabpl init-enterprise /tmp/grafana-enterprise ${DRONE_TAG}
+  - mv /tmp/grafana-enterprise/deployment_tools_config.json deployment_tools_config.json
   - mkdir bin
   - mv /tmp/grabpl bin/
   - ./bin/grabpl verify-drone
@@ -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
 
@@ -1644,7 +1644,7 @@ steps:
   image: plugins/slack
   settings:
     channel: grafana-ci-notifications
-    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nAuthor: {{build.author}}"
+    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nBranch: <https://github.com/{{ repo.owner }}/{{ repo.name }}/commits/{{ build.branch }}|{{ build.branch }}>\nAuthor: {{build.author}}"
     webhook:
       from_secret: slack_webhook
 
@@ -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
 
@@ -2042,6 +2042,7 @@ steps:
   - rmdir bin
   - mv grafana-enterprise /tmp/
   - /tmp/grabpl init-enterprise /tmp/grafana-enterprise
+  - mv /tmp/grafana-enterprise/deployment_tools_config.json deployment_tools_config.json
   - mkdir bin
   - mv /tmp/grabpl bin/
   - ./bin/grabpl verify-drone
@@ -2074,8 +2075,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 +2141,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
 
@@ -2582,7 +2583,7 @@ steps:
   image: plugins/slack
   settings:
     channel: grafana-ci-notifications
-    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nAuthor: {{build.author}}"
+    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nBranch: <https://github.com/{{ repo.owner }}/{{ repo.name }}/commits/{{ build.branch }}|{{ build.branch }}>\nAuthor: {{build.author}}"
     webhook:
       from_secret: slack_webhook
 
@@ -2951,6 +2952,7 @@ steps:
   - rmdir bin
   - mv grafana-enterprise /tmp/
   - /tmp/grabpl init-enterprise /tmp/grafana-enterprise
+  - mv /tmp/grafana-enterprise/deployment_tools_config.json deployment_tools_config.json
   - mkdir bin
   - mv /tmp/grabpl bin/
   - ./bin/grabpl verify-drone
@@ -3416,7 +3418,7 @@ steps:
   image: plugins/slack
   settings:
     channel: grafana-ci-notifications
-    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nAuthor: {{build.author}}"
+    template: "Build {{build.number}} failed for commit: <https://github.com/{{repo.owner}}/{{repo.name}}/commit/{{build.commit}}|{{ truncate build.commit 8 }}>: {{build.link}}\nBranch: <https://github.com/{{ repo.owner }}/{{ repo.name }}/commits/{{ build.branch }}|{{ build.branch }}>\nAuthor: {{build.author}}"
     webhook:
       from_secret: slack_webhook
 
@@ -3432,6 +3434,49 @@ depends_on:
 - enterprise-build-release-branch
 - enterprise-windows-release-branch
 
+---
+kind: pipeline
+type: docker
+name: scan-docker-images
+
+platform:
+  os: linux
+  arch: amd64
+
+steps:
+- name: scan-docker-images-unkown-low-medium-vulnerabilities
+  image: aquasec/trivy:0.18.3
+  commands:
+  - trivy --exit-code 0 --severity UNKNOWN,LOW,MEDIUM grafana/grafana:latest
+  - trivy --exit-code 0 --severity UNKNOWN,LOW,MEDIUM grafana/grafana:main
+  - trivy --exit-code 0 --severity UNKNOWN,LOW,MEDIUM grafana/grafana:latest-ubuntu
+  - trivy --exit-code 0 --severity UNKNOWN,LOW,MEDIUM grafana/grafana:main-ubuntu
+
+- name: scan-docker-images-high-critical-vulnerabilities
+  image: aquasec/trivy:0.18.3
+  commands:
+  - trivy --exit-code 1 --severity HIGH,CRITICAL grafana/grafana:latest
+  - trivy --exit-code 1 --severity HIGH,CRITICAL grafana/grafana:main
+  - trivy --exit-code 1 --severity HIGH,CRITICAL grafana/grafana:latest-ubuntu
+  - trivy --exit-code 1 --severity HIGH,CRITICAL grafana/grafana:main-ubuntu
+
+- name: slack-notify-failure
+  image: plugins/slack
+  settings:
+    channel: grafana-backend
+    template: "Nightly docker image scan job for {{repo.name}} failed: {{build.link}}"
+    webhook:
+      from_secret: slack_webhook_backend
+  when:
+    status:
+    - failure
+
+trigger:
+  cron:
+  - nightly
+  event:
+  - cron
+
 ---
 kind: secret
 name: dockerconfigjson

.github/workflows/publish.yml

@@ -3,7 +3,7 @@ name: publish_docs
 on:
   push:
     branches:
-    - main
+    - v8.0.x
     paths:
     - 'docs/sources/**'
     - 'packages/grafana-*/**'
@@ -36,7 +36,7 @@ jobs:
         host: github.com
         github_pat: '${{ secrets.GH_BOT_ACCESS_TOKEN }}'
         source_folder: docs/sources
-        target_folder: content/docs/grafana/next
+        target_folder: content/docs/grafana/latest
         allow_no_changes: 'true'
     - shell: bash
       run: |

CHANGELOG.md

@@ -1,4 +1,200 @@
 
+<!-- 8.0.2 START -->
+
+# 8.0.2 (2021-06-14)
+
+### Features and enhancements
+
+* **Datasource:** Add support for max_conns_per_host in dataproxy settings. [#35520](https://github.com/grafana/grafana/pull/35520), [@jvrplmlmn](https://github.com/jvrplmlmn)
+
+### Bug fixes
+
+* **Configuration:** Fix changing org preferences in FireFox. [#35549](https://github.com/grafana/grafana/pull/35549), [@hugohaggmark](https://github.com/hugohaggmark)
+* **PieChart:** Fix legend dimension limits. [#35563](https://github.com/grafana/grafana/pull/35563), [@torkelo](https://github.com/torkelo)
+* **Postgres/MySQL/MSSQL:** Fix panic in concurrent map writes. [#35510](https://github.com/grafana/grafana/pull/35510), [@marefr](https://github.com/marefr)
+* **Variables:** Hide default data source if missing from regex. [#35561](https://github.com/grafana/grafana/pull/35561), [@hugohaggmark](https://github.com/hugohaggmark)
+
+<!-- 8.0.2 END -->
+
+<!-- 8.0.1 START -->
+
+# 8.0.1 (2021-06-10)
+
+### Bug fixes
+
+* **Alerting/SSE:** Fix "count_non_null" reducer validation. [#35451](https://github.com/grafana/grafana/pull/35451), [@kylebrandt](https://github.com/kylebrandt)
+* **Cloudwatch:** Fix duplicated time series. [#35433](https://github.com/grafana/grafana/pull/35433), [@sunker](https://github.com/sunker)
+* **Cloudwatch:** Fix missing defaultRegion. [#35436](https://github.com/grafana/grafana/pull/35436), [@andresmgot](https://github.com/andresmgot)
+* **Dashboard:** Fix Dashboard init failed error on dashboards with old singlestat panels in collapsed rows. [#35425](https://github.com/grafana/grafana/pull/35425), [@torkelo](https://github.com/torkelo)
+* **Datasource:** Fix storing timeout option as numeric. [#35441](https://github.com/grafana/grafana/pull/35441), [@marefr](https://github.com/marefr)
+* **Postgres/MySQL/MSSQL:** Fix annotation parsing for empty responses. [#35367](https://github.com/grafana/grafana/pull/35367), [@marcbachmann](https://github.com/marcbachmann)
+* **Postgres/MySQL/MSSQL:** Numeric/non-string values are now returned from query variables. [#35411](https://github.com/grafana/grafana/pull/35411), [@marefr](https://github.com/marefr)
+* **Postgres:** Fix an error that was thrown when the annotation query did not return any results. [#35382](https://github.com/grafana/grafana/pull/35382), [@dprokop](https://github.com/dprokop)
+* **StatPanel:** Fix an issue with the appearance of the graph when switching color mode. [#35460](https://github.com/grafana/grafana/pull/35460), [@torkelo](https://github.com/torkelo)
+* **Visualizations:** Fix an issue in the Stat/BarGauge/Gauge/PieChart panels where all values mode were showing the same name if they had the same value. [#35368](https://github.com/grafana/grafana/pull/35368), [@torkelo](https://github.com/torkelo)
+
+### Plugin development fixes & changes
+
+* **Toolkit:** Resolve external fonts when Grafana is served from a sub path. [#35352](https://github.com/grafana/grafana/pull/35352), [@jackw](https://github.com/jackw)
+
+<!-- 8.0.1 END -->
+
+<!-- 8.0.0 START -->
+
+# 8.0.0 (2021-06-08)
+
+### Features and enhancements
+
+* **AzureMonitor:** Require default subscription for workspaces() template variable query. [#35181](https://github.com/grafana/grafana/pull/35181), [@joshhunt](https://github.com/joshhunt)
+* **AzureMonitor:** Use resource type display names in the UI. [#35060](https://github.com/grafana/grafana/pull/35060), [@joshhunt](https://github.com/joshhunt)
+* **Dashboard:** Remove support for loading and deleting dashboard by slug. [#35104](https://github.com/grafana/grafana/pull/35104), [@dsotirakis](https://github.com/dsotirakis)
+* **InfluxDB:** Deprecate direct browser access in data source. [#35105](https://github.com/grafana/grafana/pull/35105), [@gabor](https://github.com/gabor)
+* **VizLegend:** Add a read-only property. [#35096](https://github.com/grafana/grafana/pull/35096), [@dprokop](https://github.com/dprokop)
+
+### Bug fixes
+
+* **AzureMonitor:** Fix Azure Resource Graph queries in Azure China. [#35235](https://github.com/grafana/grafana/pull/35235), [@kostrse](https://github.com/kostrse)
+* **Checkbox:** Fix vertical layout issue with checkboxes due to fixed height. [#35022](https://github.com/grafana/grafana/pull/35022), [@torkelo](https://github.com/torkelo)
+* **Dashboard:** Fix Table view when editing causes the panel data to not update. [#34998](https://github.com/grafana/grafana/pull/34998), [@axelavargas](https://github.com/axelavargas)
+* **Dashboard:** Fix issues where unsaved-changes warning is not displayed. [#34989](https://github.com/grafana/grafana/pull/34989), [@torkelo](https://github.com/torkelo)
+* **Login:** Fixes Unauthorized message showing when on login page or snapshot page. [#35311](https://github.com/grafana/grafana/pull/35311), [@torkelo](https://github.com/torkelo)
+* **NodeGraph:** Fix sorting markers in grid view. [#35200](https://github.com/grafana/grafana/pull/35200), [@aocenas](https://github.com/aocenas)
+* **Short URL:** Include orgId in generated short URLs. [#34696](https://github.com/grafana/grafana/pull/34696), [@farodin91](https://github.com/farodin91)
+* **Variables:** Support raw values of boolean type. [#34727](https://github.com/grafana/grafana/pull/34727), [@simPod](https://github.com/simPod)
+
+### Breaking changes
+
+
+The following endpoints were deprecated for Grafana v5.0 and support for them has now been removed:
+
+* GET `/dashboards/db/:slug`
+* GET `/dashboard-solo/db/:slug`
+* GET `/api/dashboard/db/:slug`
+* DELETE `/api/dashboards/db/:slug` Issue [#35104](https://github.com/grafana/grafana/issues/35104)
+
+<!-- 8.0.0 END -->
+
+<!-- 8.0.0-beta3 START -->
+
+# 8.0.0-beta3 (2021-06-01)
+
+### Features and enhancements
+
+* **API:** Support folder UID in dashboards API. [#33991](https://github.com/grafana/grafana/pull/33991), [@zserge](https://github.com/zserge)
+* **Alerting:** Add support for configuring avatar URL for the Discord notifier. [#33355](https://github.com/grafana/grafana/pull/33355), [@ChipWolf](https://github.com/ChipWolf)
+* **Alerting:** Clarify that Threema Gateway Alerts support only Basic IDs. [#34828](https://github.com/grafana/grafana/pull/34828), [@dbrgn](https://github.com/dbrgn)
+* **Azure:** Expose Azure settings to external plugins. [#34484](https://github.com/grafana/grafana/pull/34484), [@sunker](https://github.com/sunker)
+* **AzureMonitor:** Deprecate using separate credentials for Azure Monitor Logs. [#34758](https://github.com/grafana/grafana/pull/34758), [@andresmgot](https://github.com/andresmgot)
+* **AzureMonitor:** Display variables in resource picker for Azure Monitor Logs. [#34648](https://github.com/grafana/grafana/pull/34648), [@joshhunt](https://github.com/joshhunt)
+* **AzureMonitor:** Hide application insights for data sources not using it. [#34725](https://github.com/grafana/grafana/pull/34725), [@joshhunt](https://github.com/joshhunt)
+* **AzureMonitor:** Support querying subscriptions and resource groups in Azure Monitor Logs. [#34766](https://github.com/grafana/grafana/pull/34766), [@joshhunt](https://github.com/joshhunt)
+* **AzureMonitor:** remove requirement for default subscription. [#34787](https://github.com/grafana/grafana/pull/34787), [@kostrse](https://github.com/kostrse)
+* **CloudWatch:** Add Lambda@Edge Amazon CloudFront metrics. [#34561](https://github.com/grafana/grafana/pull/34561), [@razor-x](https://github.com/razor-x)
+* **CloudWatch:** Add missing AWS and AppSync metrics. [#34691](https://github.com/grafana/grafana/pull/34691), [@razor-x](https://github.com/razor-x)
+* **ConfirmModal:** Auto focus delete button. [#34917](https://github.com/grafana/grafana/pull/34917), [@torkelo](https://github.com/torkelo)
+* **Explore:** Add caching for queries that are run from logs navigation. [#34297](https://github.com/grafana/grafana/pull/34297), [@ivanahuckova](https://github.com/ivanahuckova)
+* **Loki:** Add formatting for annotations. [#34774](https://github.com/grafana/grafana/pull/34774), [@fredr](https://github.com/fredr)
+* **Loki:** Bring back processed bytes as meta information. [#34092](https://github.com/grafana/grafana/pull/34092), [@mmenbawy](https://github.com/mmenbawy)
+* **NodeGraph:** Display node graph collapsed by default with trace view. [#34491](https://github.com/grafana/grafana/pull/34491), [@aocenas](https://github.com/aocenas)
+* **Overrides:** Include a manual override option to hide something from visualization. [#34783](https://github.com/grafana/grafana/pull/34783), [@torkelo](https://github.com/torkelo)
+* **PieChart:** Support row data in pie charts. [#34755](https://github.com/grafana/grafana/pull/34755), [@torkelo](https://github.com/torkelo)
+* **Prometheus:** Update default HTTP method to POST for existing data sources. [#34599](https://github.com/grafana/grafana/pull/34599), [@ivanahuckova](https://github.com/ivanahuckova)
+* **Time series panel:** Position tooltip correctly when window is scrolled or resized. [#34782](https://github.com/grafana/grafana/pull/34782), [@dprokop](https://github.com/dprokop)
+
+### Bug fixes
+
+* **Admin:** Fix infinite loading edit on the profile page. [#34627](https://github.com/grafana/grafana/pull/34627), [@hugohaggmark](https://github.com/hugohaggmark)
+* **Color:** Fix issues with random colors in string and date fields. [#34913](https://github.com/grafana/grafana/pull/34913), [@torkelo](https://github.com/torkelo)
+* **Dashboard:** Fix issue with title or folder change has no effect after exiting settings view. [#34677](https://github.com/grafana/grafana/pull/34677), [@torkelo](https://github.com/torkelo)
+* **DataLinks:** Fix an issue __series.name is not working in data link. [#34932](https://github.com/grafana/grafana/pull/34932), [@torkelo](https://github.com/torkelo)
+* **Datasource:** Fix dataproxy timeout should always be applied for outgoing data source HTTP requests. [#34597](https://github.com/grafana/grafana/pull/34597), [@dsotirakis](https://github.com/dsotirakis)
+* **Elasticsearch:** Fix NewClient not passing httpClientProvider to client impl. [#34539](https://github.com/grafana/grafana/pull/34539), [@KiVirgil](https://github.com/KiVirgil)
+* **Explore:** Fix Browser title not updated on Navigation to Explore. [#34651](https://github.com/grafana/grafana/pull/34651), [@axelavargas](https://github.com/axelavargas)
+* **GraphNG:** Remove fieldName and hideInLegend properties from UPlotSeriesBuilder. [#34901](https://github.com/grafana/grafana/pull/34901), [@dprokop](https://github.com/dprokop)
+* **OAuth:** Fix fallback to auto_assign_org_role setting for Azure AD OAuth when no role claims exists. [#34838](https://github.com/grafana/grafana/pull/34838), [@idafurjes](https://github.com/idafurjes)
+* **PanelChrome:** Fix issue with empty panel after adding a non data panel and coming back from panel edit. [#34765](https://github.com/grafana/grafana/pull/34765), [@torkelo](https://github.com/torkelo)
+* **StatPanel:** Fix data link tooltip not showing for single value. [#34934](https://github.com/grafana/grafana/pull/34934), [@torkelo](https://github.com/torkelo)
+* **Table:** Fix sorting for number fields. [#34722](https://github.com/grafana/grafana/pull/34722), [@hugohaggmark](https://github.com/hugohaggmark)
+* **Table:** Have text underline for datalink, and add support for image datalink. [#34635](https://github.com/grafana/grafana/pull/34635), [@thisisobate](https://github.com/thisisobate)
+* **Time series panel:** Position tooltip correctly when window is scrolled or resized. [#34584](https://github.com/grafana/grafana/pull/34584), [@dprokop](https://github.com/dprokop)
+* **Transformations:** Prevent FilterByValue transform from crashing panel edit. [#34747](https://github.com/grafana/grafana/pull/34747), [@jackw](https://github.com/jackw)
+
+### Breaking changes
+
+
+The default HTTP method for Prometheus data source is now POST. Previously, it was GET. The POST APIs have been available since January 2018 (Prometheus 2.1.0) and they have fewer limitations than the GET APIs. For example, when dealing with high cardinality labels, GET hits the URL size limit. 
+
+If you have a Prometheus instance with version < 2.1.0, which uses the default HTTP method, update your HTTP method to GET. Issue [#34599](https://github.com/grafana/grafana/issues/34599)
+
+<!-- 8.0.0-beta3 END -->
+
+<!-- 8.0.0-beta2 START -->
+
+# 8.0.0-beta2 (2021-05-20)
+
+### Features and enhancements
+
+* **AppPlugins:** Expose react-router to apps. [#33775](https://github.com/grafana/grafana/pull/33775), [@dprokop](https://github.com/dprokop)
+* **AzureMonitor:** Add Azure Resource Graph. [#33293](https://github.com/grafana/grafana/pull/33293), [@shuotli](https://github.com/shuotli)
+* **AzureMonitor:** Managed Identity configuration UI. [#34170](https://github.com/grafana/grafana/pull/34170), [@kostrse](https://github.com/kostrse)
+* **AzureMonitor:** Token provider with support for Managed Identities. [#33807](https://github.com/grafana/grafana/pull/33807), [@kostrse](https://github.com/kostrse)
+* **AzureMonitor:** Update Logs workspace() template variable query to return resource URIs. [#34445](https://github.com/grafana/grafana/pull/34445), [@joshhunt](https://github.com/joshhunt)
+* **BarChart:** Value label sizing. [#34229](https://github.com/grafana/grafana/pull/34229), [@dprokop](https://github.com/dprokop)
+* **CloudMonitoring:** Add support for preprocessing. [#33011](https://github.com/grafana/grafana/pull/33011), [@sunker](https://github.com/sunker)
+* **CloudWatch:** Add AWS/EFS StorageBytes metric. [#33426](https://github.com/grafana/grafana/pull/33426), [@freshleafmedia](https://github.com/freshleafmedia)
+* **CloudWatch:** Allow use of missing AWS namespaces using custom metrics. [#30961](https://github.com/grafana/grafana/pull/30961), [@mmcoltman](https://github.com/mmcoltman)
+* **Datasource:** Shared HTTP client provider for core backend data sources and any data source using the data source proxy. [#33439](https://github.com/grafana/grafana/pull/33439), [@marefr](https://github.com/marefr)
+* **InfluxDB:** InfluxQL: allow empty tag values in the query editor. [#34311](https://github.com/grafana/grafana/pull/34311), [@gabor](https://github.com/gabor)
+* **Instrumentation:** Instrument incoming HTTP request with histograms by default. [#33921](https://github.com/grafana/grafana/pull/33921), [@bergquist](https://github.com/bergquist)
+* **Library Panels:** Add name endpoint & unique name validation to AddLibraryPanelModal. [#33987](https://github.com/grafana/grafana/pull/33987), [@kaydelaney](https://github.com/kaydelaney)
+* **Logs panel:** Support details view. [#34125](https://github.com/grafana/grafana/pull/34125), [@ivanahuckova](https://github.com/ivanahuckova)
+* **PieChart:** Always show the calculation options dropdown in the editor. [#34267](https://github.com/grafana/grafana/pull/34267), [@oscarkilhed](https://github.com/oscarkilhed)
+* **PieChart:** Remove beta flag. [#34098](https://github.com/grafana/grafana/pull/34098), [@oscarkilhed](https://github.com/oscarkilhed)
+* **Plugins:** Enforce signing for all plugins. [#34364](https://github.com/grafana/grafana/pull/34364), [@wbrowne](https://github.com/wbrowne)
+* **Plugins:** Remove support for deprecated backend plugin protocol version. [#34127](https://github.com/grafana/grafana/pull/34127), [@idafurjes](https://github.com/idafurjes)
+* **Tempo/Jaeger:** Add better display name to legend. [#34063](https://github.com/grafana/grafana/pull/34063), [@aocenas](https://github.com/aocenas)
+* **Timeline:** Add time range zoom. [#34079](https://github.com/grafana/grafana/pull/34079), [@torkelo](https://github.com/torkelo)
+* **Timeline:** Adds opacity & line width option. [#34118](https://github.com/grafana/grafana/pull/34118), [@torkelo](https://github.com/torkelo)
+* **Timeline:** Value text alignment option. [#34087](https://github.com/grafana/grafana/pull/34087), [@torkelo](https://github.com/torkelo)
+* **ValueMappings:** Add duplicate action, and disable dismiss on backdrop click. [#34100](https://github.com/grafana/grafana/pull/34100), [@torkelo](https://github.com/torkelo)
+* **Zipkin:** Add node graph view to trace response. [#34414](https://github.com/grafana/grafana/pull/34414), [@aocenas](https://github.com/aocenas)
+
+### Bug fixes
+
+* **Annotations panel:** Remove subpath from dashboard links. [#34134](https://github.com/grafana/grafana/pull/34134), [@jackw](https://github.com/jackw)
+* **Content Security Policy:** Allow all image sources by default. [#34265](https://github.com/grafana/grafana/pull/34265), [@aknuds1](https://github.com/aknuds1)
+* **Content Security Policy:** Relax default template wrt. loading of scripts, due to nonces not working. [#34363](https://github.com/grafana/grafana/pull/34363), [@aknuds1](https://github.com/aknuds1)
+* **Datasource:** Fix tracing propagation for alert execution by introducing HTTP client outgoing tracing middleware. [#34466](https://github.com/grafana/grafana/pull/34466), [@marefr](https://github.com/marefr)
+* **InfluxDB:** InfluxQL always apply time interval end. [#34308](https://github.com/grafana/grafana/pull/34308), [@gabor](https://github.com/gabor)
+* **Library Panels:** Fixes "error while loading library panels". [#34278](https://github.com/grafana/grafana/pull/34278), [@hugohaggmark](https://github.com/hugohaggmark)
+* **NewsPanel:** Fixes rendering issue in Safari. [#34067](https://github.com/grafana/grafana/pull/34067), [@kaydelaney](https://github.com/kaydelaney)
+* **PanelChrome:** Fix queries being issued again when scrolling in and out of view. [#34061](https://github.com/grafana/grafana/pull/34061), [@torkelo](https://github.com/torkelo)
+* **Plugins:** Fix Azure token provider cache panic and auth param nil value. [#34252](https://github.com/grafana/grafana/pull/34252), [@kostrse](https://github.com/kostrse)
+* **Snapshots:** Fix key and deleteKey being ignored when creating an external snapshot. [#33686](https://github.com/grafana/grafana/pull/33686), [@wengelbrecht-grafana](https://github.com/wengelbrecht-grafana)
+* **Table:** Fix issue with cell border not showing with colored background cells. [#34231](https://github.com/grafana/grafana/pull/34231), [@torkelo](https://github.com/torkelo)
+* **Table:** Makes tooltip scrollable for long JSON values. [#34120](https://github.com/grafana/grafana/pull/34120), [@hugohaggmark](https://github.com/hugohaggmark)
+* **TimeSeries:** Fix for Connected null values threshold toggle during panel editing. [#34452](https://github.com/grafana/grafana/pull/34452), [@leeoniya](https://github.com/leeoniya)
+* **Variables:** Fixes inconsistent `selected` states on dashboard load. [#34197](https://github.com/grafana/grafana/pull/34197), [@hugohaggmark](https://github.com/hugohaggmark)
+* **Variables:** Refreshes all panels even if panel is full screen. [#34097](https://github.com/grafana/grafana/pull/34097), [@hugohaggmark](https://github.com/hugohaggmark)
+
+### Breaking changes
+
+
+The `workspaces()` template variable, mainly for use with Azure Monitor Logs, has been changed to return resource URIs instead of Log Analytics Workspaces GUIDs. This should not impact Azure Monitor Logs queries, but if the variables are being used in other data sources which expect a Workspace GUID may no longer be compatible.
+
+Custom template variables used in the workspace or resource field in Azure Monitor Logs queries should resolve to an Azure Resource URI in the format `/subscriptions/{guid}/resourceGroups/{resource-group-name}/{resource-provider-namespace}/{resource-type}/{resource-name}`
+ Issue [#34445](https://github.com/grafana/grafana/issues/34445)
+
+Removes support for deprecated backend plugin protocol (v1) including usage of github.com/grafana/grafana-plugin-model.
+
+ Issue [#34127](https://github.com/grafana/grafana/issues/34127)
+
+### Plugin development fixes & changes
+
+* **QueryField:** Remove carriage return character from pasted text. [#34076](https://github.com/grafana/grafana/pull/34076), [@ivanahuckova](https://github.com/ivanahuckova)
+
+<!-- 8.0.0-beta2 END -->
+
 <!-- 8.0.0-beta1 START -->
 
 # 8.0.0-beta1 (2021-05-13)
@@ -131,6 +327,19 @@ The InfoBox & FeatureInfoBox are now deprecated please use the Alert component i
 
 <!-- 8.0.0-beta1 END -->
 
+<!-- 7.5.8 START -->
+
+# 7.5.8 (2021-06-16)
+
+### Features and enhancements
+
+* **Datasource:** Add support for max_conns_per_host in dataproxy settings. [#35519](https://github.com/grafana/grafana/pull/35519), [@jvrplmlmn](https://github.com/jvrplmlmn)
+* **Datasource:** Add support for max_idle_connections_per_host in dataproxy settings. [#35365](https://github.com/grafana/grafana/pull/35365), [@dsotirakis](https://github.com/dsotirakis)
+* **Instrumentation:** Add metrics for outbound HTTP connections. [#35321](https://github.com/grafana/grafana/pull/35321), [@dsotirakis](https://github.com/dsotirakis)
+* **Snapshots:** Remove dashboard links from dashboard snapshots. [#35567](https://github.com/grafana/grafana/pull/35567), [@torkelo](https://github.com/torkelo)
+
+<!-- 7.5.8 END -->
+
 <!-- 7.5.7 START -->
 
 # 7.5.7 (2021-05-19)

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
 
@@ -155,6 +158,11 @@ tls_handshake_timeout_seconds = 10
 # waiting for the server to approve.
 expect_continue_timeout_seconds = 1
 
+# Optionally limits the total number of connections per host, including connections in the dialing,
+# active, and idle states. On limit violation, dials will block.
+# A value of zero (0) means no limit.
+max_conns_per_host = 0
+
 # The maximum number of idle connections that Grafana will keep alive.
 max_idle_connections = 100
 
@@ -252,7 +260,8 @@ content_security_policy = false
 
 # Set Content Security Policy template used when adding the Content-Security-Policy header to your requests.
 # $NONCE in the template includes a random nonce.
-content_security_policy_template = """script-src 'self' 'unsafe-eval' 'unsafe-inline';object-src 'none';font-src 'self';style-src 'self' 'unsafe-inline';img-src * data:;base-uri 'self';connect-src 'self' grafana.com;manifest-src 'self';media-src 'none';form-action 'self';"""
+# $ROOT_PATH is server.root_url without the protocol.
+content_security_policy_template = """script-src 'self' 'unsafe-eval' 'unsafe-inline' 'strict-dynamic' $NONCE;object-src 'none';font-src 'self';style-src 'self' 'unsafe-inline' blob:;img-src * data:;base-uri 'self';connect-src 'self' grafana.com ws://$ROOT_PATH wss://$ROOT_PATH;manifest-src 'self';media-src 'none';form-action 'self';"""
 
 #################################### Snapshots ###########################
 [snapshots]
@@ -878,12 +887,20 @@ disable_sanitize_html = false
 [plugins]
 enable_alpha = false
 app_tls_skip_verify_insecure = false
-# Enter a comma-separated list of plugin identifiers to identify plugins that are allowed to be loaded even if they lack a valid signature.
+# Enter a comma-separated list of plugin identifiers to identify plugins to load even if they are unsigned. Plugins with modified signatures are never loaded.
 allow_loading_unsigned_plugins =
 # Enable or disable installing plugins directly from within Grafana.
 plugin_admin_enabled = false
+plugin_admin_external_manage_enabled = false
 plugin_catalog_url = https://grafana.com/grafana/plugins/
 
+#################################### Grafana Live ##########################################
+[live]
+# max_connections to Grafana Live WebSocket endpoint per Grafana server instance. See Grafana Live docs
+# if you are planning to make it higher than default 100 since this can require some OS and infrastructure
+# tuning. 0 disables Live, -1 means unlimited connections.
+max_connections = 100
+
 #################################### Grafana Image Renderer Plugin ##########################
 [plugin.grafana-image-renderer]
 # Instruct headless browser instance to use a default timezone when not provided by Grafana, e.g. when rendering panel image of alert.

conf/provisioning/access-control/sample.yaml

@@ -3,37 +3,42 @@
 
 # # list of default built-in role assignments that should be removed
 # removeDefaultAssignments:
-#   # <string, required>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
+#   # <string>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
 #   - builtInRole: "Grafana Admin"
-#     # <string, required>, must be one of the existing predefined roles
-#     predefinedRole: "grafana:roles:permissions:admin"
+#     # <string>, must be one of the existing fixed roles
+#     fixedRole: "fixed:permissions:admin"
 
 # # list of default built-in role assignments that should be added back
 # addDefaultAssignments:
-#   # <string, required>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
+#   # <string>, must be one of the Organization roles (`Viewer`, `Editor`, `Admin`) or `Grafana Admin`
 #   - builtInRole: "Admin"
-#     # <string, required>, must be one of the existing predefined roles
-#     predefinedRole: "grafana:roles:reporting:admin:read"
+#     # <string>, must be one of the existing fixed roles
+#     fixedRole: "fixed: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: "custom:roles:reporting:admin:edit"
+#   - name: "custom:reports:editor"
 #     # <string> uid of the role. Required if no name
-#     uid: customrolesreportingadminedit
+#     uid: "customreportseditor1"
 #     # <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
+#   - name: "custom:global:reports:reader"
+#     uid: "customglobalreportsreader1"
+#     # <bool> overwrite org id and removes a global role
+#     global: true
+#     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: custom:roles:users:editor
+#   - name: "custom:users:editor"
 #     # <string> uid of the role. Has to be unique for all orgs.
-#     uid: customrolesuserseditor
+#     uid: customuserseditor1
 #     # <string> description of the role, informative purpose only.
-#     description: "Role to allow users to create/read/write users"
+#     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
@@ -51,6 +56,21 @@
 #     # <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: "Admin"
+#       - name: "Editor"
 #         # <int> org id. will default to the role org id
-#         orgId: 1
+#         orgId: 1        
+#   - name: "custom:global:users:reader"
+#     uid: "customglobalusersreader1"
+#     description: "Global Role for custom user readers"
+#     version: 1
+#     # <bool> overwrite org id and creates a global role
+#     global: true
+#     permissions:
+#       - action: "users:read"
+#         scope: "users:*"
+#     builtInRoles:
+#       - name: "Viewer"
+#         orgId: 1        
+#       - name: "Editor"
+#         # <bool> overwrite org id and assign role globally
+#         global: true

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
 
@@ -161,6 +164,11 @@
 # waiting for the server to approve.
 ;expect_continue_timeout_seconds = 1
 
+# Optionally limits the total number of connections per host, including connections in the dialing,
+# active, and idle states. On limit violation, dials will block.
+# A value of zero (0) means no limit.
+;max_conns_per_host = 0
+
 # The maximum number of idle connections that Grafana will keep alive.
 ;max_idle_connections = 100
 
@@ -258,7 +266,8 @@
 
 # Set Content Security Policy template used when adding the Content-Security-Policy header to your requests.
 # $NONCE in the template includes a random nonce.
-;content_security_policy_template = """script-src 'self' 'unsafe-eval' 'unsafe-inline';object-src 'none';font-src 'self';style-src 'self' 'unsafe-inline';img-src * data:;base-uri 'self';connect-src 'self' grafana.com;manifest-src 'self';media-src 'none';form-action 'self';"""
+# $ROOT_PATH is server.root_url without the protocol.
+;content_security_policy_template = """script-src 'self' 'unsafe-eval' 'unsafe-inline' 'strict-dynamic' $NONCE;object-src 'none';font-src 'self';style-src 'self' 'unsafe-inline' blob:;img-src * data:;base-uri 'self';connect-src 'self' grafana.com ws://$ROOT_PATH wss://$ROOT_PATH;manifest-src 'self';media-src 'none';form-action 'self';"""
 
 #################################### Snapshots ###########################
 [snapshots]
@@ -864,12 +873,20 @@
 [plugins]
 ;enable_alpha = false
 ;app_tls_skip_verify_insecure = false
-# Enter a comma-separated list of plugin identifiers to identify plugins that are allowed to be loaded even if they lack a valid signature.
+# Enter a comma-separated list of plugin identifiers to identify plugins to load even if they are unsigned. Plugins with modified signatures are never loaded.
 ;allow_loading_unsigned_plugins =
 # Enable or disable installing plugins directly from within Grafana.
 ;plugin_admin_enabled = false
+;plugin_admin_external_manage_enabled = false
 ;plugin_catalog_url = https://grafana.com/grafana/plugins/
 
+#################################### Grafana Live ##########################################
+[live]
+# max_connections to Grafana Live WebSocket endpoint per Grafana server instance. See Grafana Live docs
+# if you are planning to make it higher than default 100 since this can require some OS and infrastructure
+# tuning. 0 disables Live, -1 means unlimited connections.
+;max_connections = 100
+
 #################################### Grafana Image Renderer Plugin ##########################
 [plugin.grafana-image-renderer]
 # Instruct headless browser instance to use a default timezone when not provided by Grafana, e.g. when rendering panel image of alert.

cue/data/gen.cue

@@ -133,10 +133,6 @@ Family: scuemata.#Family & {
 
                     // The values depend on panel type
                     options: {...}
-                    libraryPanel?: {
-                        name: string,
-                        uid: string
-                    }
                     fieldConfig: {
                         defaults: {
                             ...

devenv/README.md

@@ -45,7 +45,7 @@ make devenv sources=postgres,openldap,grafana postgres_version=9.2 grafana_versi
 The grafana block is pre-configured with the dev-datasources and dashboards.
 
 #### Jaeger
-Jaeger block runs both Jaeger and Loki container. Loki container sends traces to Jaeger and also logs its own logs into itself so it is possible to setup derived field for traceID from Loki to Jaeger. You need to install a docker plugin for the self logging to work, without it the container won't start. See https://github.com/grafana/loki/tree/master/cmd/docker-driver#plugin-installation for installation instructions.
+Jaeger block runs both Jaeger and Loki container. Loki container sends traces to Jaeger and also logs its own logs into itself so it is possible to setup derived field for traceID from Loki to Jaeger. You need to install a docker plugin for the self logging to work, without it the container won't start. See https://grafana.com/docs/loki/latest/clients/docker-driver/#installing for installation instructions.
 
 #### Graphite
 

devenv/dev-dashboards/panel-barchart/barchart-autosizing.json

@@ -15,7 +15,6 @@
   "editable": true,
   "gnetId": null,
   "graphTooltip": 0,
-  "id": 441,
   "links": [],
   "panels": [
     {
@@ -56,19 +55,21 @@
         "overrides": []
       },
       "gridPos": {
-        "h": 13,
-        "w": 24,
+        "h": 10,
+        "w": 12,
         "x": 0,
         "y": 0
       },
       "id": 9,
       "options": {
         "barWidth": 1,
-        "groupWidth": 1,
+        "groupWidth": 0.82,
         "legend": {
-          "calcs": [],
+          "calcs": [
+            "max"
+          ],
           "displayMode": "list",
-          "placement": "bottom"
+          "placement": "right"
         },
         "orientation": "auto",
         "showValue": "auto",
@@ -79,11 +80,85 @@
       },
       "targets": [
         {
+          "csvContent": "Name,Stat1,Stat2\nStockholm, 10, 15\nNew York, 19, 5\nLondon, 10, 1\nNegative, 15, -5\nLong value, 15,10",
           "refId": "A",
-          "scenarioId": "categorical_data"
+          "scenarioId": "csv_content"
         }
       ],
-      "title": "Plenty od data, automatic value sizing",
+      "title": "Auto  sizing & auto show values",
+      "type": "barchart"
+    },
+    {
+      "datasource": null,
+      "description": "Should be smaller given the longer value",
+      "fieldConfig": {
+        "defaults": {
+          "color": {
+            "mode": "palette-classic"
+          },
+          "custom": {
+            "axisLabel": "",
+            "axisPlacement": "auto",
+            "axisSoftMin": 0,
+            "fillOpacity": 80,
+            "gradientMode": "none",
+            "hideFrom": {
+              "graph": false,
+              "legend": false,
+              "tooltip": false
+            },
+            "lineWidth": 0
+          },
+          "decimals": 2,
+          "mappings": [],
+          "thresholds": {
+            "mode": "absolute",
+            "steps": [
+              {
+                "color": "green",
+                "value": null
+              },
+              {
+                "color": "red",
+                "value": 80
+              }
+            ]
+          }
+        },
+        "overrides": []
+      },
+      "gridPos": {
+        "h": 10,
+        "w": 12,
+        "x": 12,
+        "y": 0
+      },
+      "id": 15,
+      "options": {
+        "barWidth": 1,
+        "groupWidth": 0.82,
+        "legend": {
+          "calcs": [
+            "max"
+          ],
+          "displayMode": "list",
+          "placement": "right"
+        },
+        "orientation": "auto",
+        "showValue": "auto",
+        "text": {},
+        "tooltip": {
+          "mode": "single"
+        }
+      },
+      "targets": [
+        {
+          "csvContent": "Name,Stat1,Stat2\nStockholm, 10, 15\nNew York, 19, 5\nLondon, 10, 1\nNegative, 15, -5\nLong value, 15,10",
+          "refId": "A",
+          "scenarioId": "csv_content"
+        }
+      ],
+      "title": "Auto sizing & auto show values",
       "type": "barchart"
     },
     {
@@ -124,10 +199,152 @@
         "overrides": []
       },
       "gridPos": {
-        "h": 12,
-        "w": 24,
+        "h": 11,
+        "w": 8,
         "x": 0,
-        "y": 13
+        "y": 10
+      },
+      "id": 16,
+      "options": {
+        "barWidth": 1,
+        "groupWidth": 0.89,
+        "legend": {
+          "calcs": [
+            "max"
+          ],
+          "displayMode": "list",
+          "placement": "right"
+        },
+        "orientation": "auto",
+        "showValue": "auto",
+        "text": {},
+        "tooltip": {
+          "mode": "single"
+        }
+      },
+      "targets": [
+        {
+          "csvContent": "Name,Stat1,Stat2,Stat3,Stat4,Stat5,Stat6,Stat7,Stat8,Stat9,Stat10\nA, 10, 15,8,3,4,12,14,1,5,10\nB, 19, 5,8,3,4,12,14,6,7,2\nC, 15, 5,8,3,4,10,4,6,7,2\n",
+          "refId": "A",
+          "scenarioId": "csv_content"
+        }
+      ],
+      "title": "auto show values & No room for value",
+      "type": "barchart"
+    },
+    {
+      "datasource": null,
+      "fieldConfig": {
+        "defaults": {
+          "color": {
+            "mode": "palette-classic"
+          },
+          "custom": {
+            "axisLabel": "",
+            "axisPlacement": "auto",
+            "axisSoftMin": 0,
+            "fillOpacity": 80,
+            "gradientMode": "none",
+            "hideFrom": {
+              "graph": false,
+              "legend": false,
+              "tooltip": false
+            },
+            "lineWidth": 0
+          },
+          "mappings": [],
+          "thresholds": {
+            "mode": "absolute",
+            "steps": [
+              {
+                "color": "green",
+                "value": null
+              },
+              {
+                "color": "red",
+                "value": 80
+              }
+            ]
+          }
+        },
+        "overrides": []
+      },
+      "gridPos": {
+        "h": 11,
+        "w": 8,
+        "x": 8,
+        "y": 10
+      },
+      "id": 17,
+      "options": {
+        "barWidth": 1,
+        "groupWidth": 0.89,
+        "legend": {
+          "calcs": [
+            "max"
+          ],
+          "displayMode": "list",
+          "placement": "right"
+        },
+        "orientation": "auto",
+        "showValue": "always",
+        "text": {},
+        "tooltip": {
+          "mode": "single"
+        }
+      },
+      "targets": [
+        {
+          "csvContent": "Name,Stat1,Stat2,Stat3,Stat4,Stat5,Stat6,Stat7,Stat8,Stat9,Stat10\nA, 10, 15,8,3,4,12,14,1,5,10\nB, 19, 5,8,3,4,12,14,6,7,2\nC, 15, 5,8,3,4,10,4,6,7,2\n",
+          "refId": "A",
+          "scenarioId": "csv_content"
+        }
+      ],
+      "title": "auto show values & Always show value",
+      "type": "barchart"
+    },
+    {
+      "datasource": "-- Dashboard --",
+      "fieldConfig": {
+        "defaults": {
+          "color": {
+            "mode": "palette-classic"
+          },
+          "custom": {
+            "axisLabel": "",
+            "axisPlacement": "auto",
+            "axisSoftMin": 0,
+            "fillOpacity": 80,
+            "gradientMode": "none",
+            "hideFrom": {
+              "graph": false,
+              "legend": false,
+              "tooltip": false
+            },
+            "lineWidth": 0
+          },
+          "mappings": [],
+          "thresholds": {
+            "mode": "absolute",
+            "steps": [
+              {
+                "color": "green",
+                "value": null
+              },
+              {
+                "color": "red",
+                "value": 80
+              }
+            ]
+          }
+        },
+        "overrides": []
+      },
+      "gridPos": {
+        "h": 11,
+        "w": 8,
+        "x": 16,
+        "y": 10
       },
       "id": 10,
       "options": {
@@ -142,7 +359,7 @@
         "showValue": "auto",
         "text": {
           "size": 10,
-          "valueSize": 10
+          "valueSize": 25
         },
         "tooltip": {
           "mode": "single"
@@ -150,11 +367,11 @@
       },
       "targets": [
         {
-          "refId": "A",
-          "scenarioId": "categorical_data"
+          "panelId": 9,
+          "refId": "A"
         }
       ],
-      "title": "Plenty od data, fixed value sizing",
+      "title": "Fixed value sizing",
       "type": "barchart"
     },
     {
@@ -195,267 +412,42 @@
         "overrides": []
       },
       "gridPos": {
-        "h": 12,
+        "h": 11,
         "w": 12,
         "x": 0,
-        "y": 25
+        "y": 21
       },
-      "id": 11,
+      "id": 18,
       "options": {
         "barWidth": 1,
-        "groupWidth": 1,
+        "groupWidth": 0.82,
         "legend": {
-          "calcs": [],
+          "calcs": [
+            "max"
+          ],
           "displayMode": "list",
-          "placement": "bottom"
-        },
-        "orientation": "auto",
-        "showValue": "auto",
-        "text": {
-          "size": 10
-        },
-        "tooltip": {
-          "mode": "single"
-        }
-      },
-      "targets": [
-        {
-          "refId": "A",
-          "scenarioId": "categorical_data"
-        }
-      ],
-      "title": "Auto font size, value auto visible",
-      "transformations": [
-        {
-          "id": "filterByValue",
-          "options": {
-            "filters": [
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Bedroom"
-                  }
-                },
-                "fieldName": "location"
-              },
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Cellar"
-                  }
-                },
-                "fieldName": "location"
-              }
-            ],
-            "match": "any",
-            "type": "include"
-          }
-        }
-      ],
-      "type": "barchart"
-    },
-    {
-      "datasource": null,
-      "fieldConfig": {
-        "defaults": {
-          "color": {
-            "mode": "palette-classic"
-          },
-          "custom": {
-            "axisLabel": "",
-            "axisPlacement": "auto",
-            "axisSoftMin": 0,
-            "fillOpacity": 80,
-            "gradientMode": "none",
-            "hideFrom": {
-              "graph": false,
-              "legend": false,
-              "tooltip": false
-            },
-            "lineWidth": 0
-          },
-          "mappings": [],
-          "thresholds": {
-            "mode": "absolute",
-            "steps": [
-              {
-                "color": "green",
-                "value": null
-              },
-              {
-                "color": "red",
-                "value": 80
-              }
-            ]
-          }
-        },
-        "overrides": []
-      },
-      "gridPos": {
-        "h": 12,
-        "w": 12,
-        "x": 12,
-        "y": 25
-      },
-      "id": 12,
-      "options": {
-        "barWidth": 1,
-        "groupWidth": 1,
-        "legend": {
-          "calcs": [],
-          "displayMode": "list",
-          "placement": "bottom"
-        },
-        "orientation": "auto",
-        "showValue": "always",
-        "text": {
-          "size": 10
-        },
-        "tooltip": {
-          "mode": "single"
-        }
-      },
-      "targets": [
-        {
-          "refId": "A",
-          "scenarioId": "categorical_data"
-        }
-      ],
-      "title": "Auto font size, value always visible",
-      "transformations": [
-        {
-          "id": "filterByValue",
-          "options": {
-            "filters": [
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Bedroom"
-                  }
-                },
-                "fieldName": "location"
-              },
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Cellar"
-                  }
-                },
-                "fieldName": "location"
-              }
-            ],
-            "match": "any",
-            "type": "include"
-          }
-        }
-      ],
-      "type": "barchart"
-    },
-    {
-      "datasource": null,
-      "fieldConfig": {
-        "defaults": {
-          "color": {
-            "mode": "palette-classic"
-          },
-          "custom": {
-            "axisLabel": "",
-            "axisPlacement": "auto",
-            "axisSoftMin": 0,
-            "fillOpacity": 80,
-            "gradientMode": "none",
-            "hideFrom": {
-              "graph": false,
-              "legend": false,
-              "tooltip": false
-            },
-            "lineWidth": 0
-          },
-          "mappings": [],
-          "thresholds": {
-            "mode": "absolute",
-            "steps": [
-              {
-                "color": "green",
-                "value": null
-              },
-              {
-                "color": "red",
-                "value": 80
-              }
-            ]
-          }
-        },
-        "overrides": []
-      },
-      "gridPos": {
-        "h": 12,
-        "w": 12,
-        "x": 0,
-        "y": 37
-      },
-      "id": 13,
-      "options": {
-        "barWidth": 1,
-        "groupWidth": 1,
-        "legend": {
-          "calcs": [],
-          "displayMode": "list",
-          "placement": "bottom"
+          "placement": "right"
         },
         "orientation": "horizontal",
         "showValue": "auto",
-        "text": {
-          "size": 10
-        },
+        "text": {},
         "tooltip": {
           "mode": "single"
         }
       },
       "targets": [
         {
+          "csvContent": "Name,Stat1,Stat2\nStockholm, 10, 15\nNew York, 19, 5\nLondon, 10, 1\nLong value, 15,10",
           "refId": "A",
-          "scenarioId": "categorical_data"
-        }
-      ],
-      "title": "Auto font size, value auto visible",
-      "transformations": [
-        {
-          "id": "filterByValue",
-          "options": {
-            "filters": [
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Bedroom"
-                  }
-                },
-                "fieldName": "location"
-              },
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Cellar"
-                  }
-                },
-                "fieldName": "location"
-              }
-            ],
-            "match": "any",
-            "type": "include"
-          }
+          "scenarioId": "csv_content"
         }
       ],
+      "title": "Auto  sizing & auto show values",
       "type": "barchart"
     },
     {
       "datasource": null,
+      "description": "",
       "fieldConfig": {
         "defaults": {
           "color": {
@@ -492,65 +484,37 @@
         "overrides": []
       },
       "gridPos": {
-        "h": 12,
+        "h": 11,
         "w": 12,
         "x": 12,
-        "y": 37
+        "y": 21
       },
-      "id": 14,
+      "id": 19,
       "options": {
         "barWidth": 1,
-        "groupWidth": 1,
+        "groupWidth": 0.89,
         "legend": {
-          "calcs": [],
+          "calcs": [
+            "max"
+          ],
           "displayMode": "list",
-          "placement": "bottom"
+          "placement": "right"
         },
         "orientation": "horizontal",
-        "showValue": "always",
-        "text": {
-          "size": 10
-        },
+        "showValue": "auto",
+        "text": {},
         "tooltip": {
           "mode": "single"
         }
       },
       "targets": [
         {
+          "csvContent": "Name,Stat1,Stat2,Stat3,Stat4,Stat5,Stat6,Stat7,Stat8,Stat9,Stat10\nA, 10, 15,8,3,4,12,14,1,5,10\nB, 19, 5,8,3,4,12,14,6,7,2\nC, 15, 5,8,3,4,10,4,6,7,2\n",
           "refId": "A",
-          "scenarioId": "categorical_data"
-        }
-      ],
-      "title": "Auto font size, value always visible",
-      "transformations": [
-        {
-          "id": "filterByValue",
-          "options": {
-            "filters": [
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Bedroom"
-                  }
-                },
-                "fieldName": "location"
-              },
-              {
-                "config": {
-                  "id": "equal",
-                  "options": {
-                    "value": "Cellar"
-                  }
-                },
-                "fieldName": "location"
-              }
-            ],
-            "match": "any",
-            "type": "include"
-          }
+          "scenarioId": "csv_content"
         }
       ],
+      "title": "auto show values & little room",
       "type": "barchart"
     }
   ],
@@ -571,7 +535,7 @@
   },
   "timepicker": {},
   "timezone": "",
-  "title": "BarChart - value text sizing",
+  "title": "BarChart - Panel Tests - Value sizing",
   "uid": "WFlOM-jM1",
-  "version": 9
-}
+  "version": 3
+}

devenv/dev-dashboards/panel-graph/graph-ng-nulls.json

@@ -17,11 +17,14 @@
   "graphTooltip": 0,
   "links": [
     {
-      "icon": "external link",
-      "tags": ["gdev", "graph-ng"],
-      "type": "dashboards",
       "asDropdown": true,
-      "title": "Graph Tests"
+      "icon": "external link",
+      "tags": [
+        "gdev",
+        "graph-ng"
+      ],
+      "title": "Graph Tests",
+      "type": "dashboards"
     }
   ],
   "panels": [
@@ -35,13 +38,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -50,10 +55,16 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": false
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -82,6 +93,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -136,13 +148,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -151,11 +165,17 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": false
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "max": 120,
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -184,6 +204,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -246,13 +267,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -261,11 +284,17 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": false
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "max": 120,
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -294,6 +323,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -375,13 +405,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -390,10 +422,16 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": true
+            "spanNulls": true,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -422,6 +460,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -476,13 +515,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -491,11 +532,17 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": true
+            "spanNulls": true,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "max": 120,
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -524,6 +571,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -586,13 +634,15 @@
           "custom": {
             "axisLabel": "",
             "axisPlacement": "auto",
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fillGradient": "none",
             "fillOpacity": 0,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
@@ -601,11 +651,17 @@
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": true
+            "spanNulls": true,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "max": 120,
-          "nullValueMode": "null",
           "thresholds": {
             "mode": "absolute",
             "steps": [
@@ -634,6 +690,7 @@
       "options": {
         "graph": {},
         "legend": {
+          "calcs": [],
           "displayMode": "list",
           "placement": "bottom"
         },
@@ -713,48 +770,33 @@
             "mode": "palette-classic"
           },
           "custom": {
-            "axis": {
-              "grid": true,
-              "label": "Temperature",
-              "side": 3,
-              "width": 60
-            },
             "axisLabel": "",
             "axisPlacement": "auto",
-            "bars": {
-              "show": false
-            },
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fill": {
-              "alpha": 0
-            },
-            "fillGradient": "none",
             "fillOpacity": 10,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
-            },
-            "line": {
-              "color": {
-                "mode": "palette-classic"
-              },
-              "show": true,
-              "width": 1
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
-            "nullValues": "null",
             "pointSize": 5,
-            "points": {
-              "radius": 8,
-              "show": true
-            },
             "scaleDistribution": {
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": false
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "thresholds": {
@@ -818,6 +860,7 @@
         },
         "legend": {
           "asTable": false,
+          "calcs": [],
           "displayMode": "list",
           "isVisible": true,
           "placement": "bottom"
@@ -874,48 +917,33 @@
             "mode": "palette-classic"
           },
           "custom": {
-            "axis": {
-              "grid": true,
-              "label": "Temperature",
-              "side": 3,
-              "width": 60
-            },
             "axisLabel": "",
             "axisPlacement": "auto",
-            "bars": {
-              "show": false
-            },
+            "barAlignment": 0,
             "drawStyle": "line",
-            "fill": {
-              "alpha": 0
-            },
-            "fillGradient": "none",
             "fillOpacity": 10,
+            "gradientMode": "none",
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
-            },
-            "line": {
-              "color": {
-                "mode": "palette-classic"
-              },
-              "show": true,
-              "width": 1
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 2,
-            "nullValues": "null",
             "pointSize": 5,
-            "points": {
-              "radius": 8,
-              "show": true
-            },
             "scaleDistribution": {
               "type": "linear"
             },
             "showPoints": "auto",
-            "spanNulls": false
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "thresholds": {
@@ -979,6 +1007,7 @@
         },
         "legend": {
           "asTable": false,
+          "calcs": [],
           "displayMode": "list",
           "isVisible": true,
           "placement": "bottom"
@@ -1044,7 +1073,8 @@
             "hideFrom": {
               "graph": false,
               "legend": false,
-              "tooltip": false
+              "tooltip": false,
+              "viz": false
             },
             "lineInterpolation": "linear",
             "lineWidth": 1,
@@ -1053,7 +1083,14 @@
               "type": "linear"
             },
             "showPoints": "never",
-            "spanNulls": 3600000
+            "spanNulls": 3600000,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
           },
           "mappings": [],
           "thresholds": {
@@ -1124,11 +1161,97 @@
       "timeShift": null,
       "title": "Span nulls below 1hr",
       "type": "timeseries"
+    },
+    {
+      "datasource": null,
+      "fieldConfig": {
+        "defaults": {
+          "color": {
+            "mode": "palette-classic"
+          },
+          "custom": {
+            "axisLabel": "",
+            "axisPlacement": "auto",
+            "barAlignment": 0,
+            "drawStyle": "line",
+            "fillOpacity": 0,
+            "gradientMode": "none",
+            "hideFrom": {
+              "legend": false,
+              "tooltip": false,
+              "viz": false
+            },
+            "lineInterpolation": "linear",
+            "lineStyle": {
+              "fill": "solid"
+            },
+            "lineWidth": 1,
+            "pointSize": 5,
+            "scaleDistribution": {
+              "type": "linear"
+            },
+            "showPoints": "never",
+            "spanNulls": false,
+            "stacking": {
+              "group": "A",
+              "mode": "none"
+            },
+            "thresholdsStyle": {
+              "mode": "off"
+            }
+          },
+          "mappings": [],
+          "thresholds": {
+            "mode": "absolute",
+            "steps": [
+              {
+                "color": "green",
+                "value": null
+              },
+              {
+                "color": "red",
+                "value": 80
+              }
+            ]
+          }
+        },
+        "overrides": []
+      },
+      "gridPos": {
+        "h": 8,
+        "w": 7,
+        "x": 0,
+        "y": 22
+      },
+      "id": 15,
+      "options": {
+        "legend": {
+          "calcs": [],
+          "displayMode": "list",
+          "placement": "bottom"
+        },
+        "tooltip": {
+          "mode": "single"
+        }
+      },
+      "targets": [
+        {
+          "refId": "A",
+          "scenarioId": "csv_metric_values",
+          "stringInput": "30,null,1,20,90,null,30,null,5,0,null,30"
+        }
+      ],
+      "title": "Always show points between gaps",
+      "type": "timeseries"
     }
   ],
-  "schemaVersion": 27,
+  "schemaVersion": 30,
   "style": "dark",
-  "tags": ["gdev", "panel-tests", "graph-ng"],
+  "tags": [
+    "gdev",
+    "panel-tests",
+    "graph-ng"
+  ],
   "templating": {
     "list": []
   },
@@ -1140,5 +1263,5 @@
   "timezone": "",
   "title": "Panel Tests - Graph NG - Gaps and Connected",
   "uid": "8mmCAF1Mz",
-  "version": 1
-}
+  "version": 12
+}

devenv/dev-dashboards/panel-histogram/histogram_tests.json

@@ -0,0 +1,442 @@
+{
+    "annotations": {
+      "list": [
+        {
+          "builtIn": 1,
+          "datasource": "-- Grafana --",
+          "enable": true,
+          "hide": true,
+          "iconColor": "rgba(0, 211, 255, 1)",
+          "name": "Annotations & Alerts",
+          "type": "dashboard"
+        }
+      ]
+    },
+    "editable": true,
+    "gnetId": null,
+    "graphTooltip": 0,
+    "id": 632,
+    "links": [],
+    "panels": [
+      {
+        "datasource": null,
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "palette-classic"
+            },
+            "custom": {
+              "fillOpacity": 80,
+              "gradientMode": "none",
+              "hideFrom": {
+                "graph": false,
+                "legend": false,
+                "tooltip": false
+              },
+              "lineWidth": 1
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 8,
+          "w": 12,
+          "x": 0,
+          "y": 0
+        },
+        "id": 4,
+        "options": {
+          "bucketOffset": 0,
+          "combine": false,
+          "legend": {
+            "calcs": [],
+            "displayMode": "hidden",
+            "placement": "bottom"
+          }
+        },
+        "targets": [
+          {
+            "refId": "A",
+            "scenarioId": "random_walk",
+            "spread": 10
+          }
+        ],
+        "title": "Time series + Auto buckets",
+        "type": "histogram"
+      },
+      {
+        "datasource": "-- Dashboard --",
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "palette-classic"
+            },
+            "custom": {
+              "fillOpacity": 80,
+              "gradientMode": "none",
+              "hideFrom": {
+                "graph": false,
+                "legend": false,
+                "tooltip": false
+              },
+              "lineWidth": 1
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 8,
+          "w": 12,
+          "x": 12,
+          "y": 0
+        },
+        "id": 3,
+        "options": {
+          "bucketOffset": 0,
+          "bucketSize": 3,
+          "combine": false,
+          "legend": {
+            "calcs": [],
+            "displayMode": "hidden",
+            "placement": "bottom"
+          }
+        },
+        "targets": [
+          {
+            "panelId": 4,
+            "refId": "A"
+          }
+        ],
+        "title": "Time series + bucket size 3",
+        "type": "histogram"
+      },
+      {
+        "datasource": null,
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "palette-classic"
+            },
+            "custom": {
+              "fillOpacity": 80,
+              "gradientMode": "none",
+              "hideFrom": {
+                "graph": false,
+                "legend": false,
+                "tooltip": false
+              },
+              "lineWidth": 1
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 8,
+          "w": 12,
+          "x": 0,
+          "y": 8
+        },
+        "id": 5,
+        "options": {
+          "bucketOffset": 0,
+          "bucketSize": 1,
+          "combine": false,
+          "legend": {
+            "calcs": [],
+            "displayMode": "hidden",
+            "placement": "bottom"
+          }
+        },
+        "targets": [
+          {
+            "csvFileName": "weight_height.csv",
+            "refId": "A",
+            "scenarioId": "csv_file"
+          }
+        ],
+        "title": "People height distribution",
+        "transformations": [
+          {
+            "id": "filterFieldsByName",
+            "options": {
+              "include": {
+                "names": [
+                  "Height"
+                ]
+              }
+            }
+          }
+        ],
+        "type": "histogram"
+      },
+      {
+        "datasource": null,
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "palette-classic"
+            },
+            "custom": {
+              "fillOpacity": 80,
+              "gradientMode": "none",
+              "hideFrom": {
+                "graph": false,
+                "legend": false,
+                "tooltip": false
+              },
+              "lineWidth": 1
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 8,
+          "w": 12,
+          "x": 12,
+          "y": 8
+        },
+        "id": 6,
+        "options": {
+          "bucketOffset": 0,
+          "bucketSize": 5,
+          "combine": false,
+          "legend": {
+            "calcs": [],
+            "displayMode": "hidden",
+            "placement": "bottom"
+          }
+        },
+        "targets": [
+          {
+            "csvFileName": "weight_height.csv",
+            "refId": "A",
+            "scenarioId": "csv_file"
+          }
+        ],
+        "title": "People weight distribution",
+        "transformations": [
+          {
+            "id": "filterFieldsByName",
+            "options": {
+              "include": {
+                "names": [
+                  "Weight"
+                ]
+              }
+            }
+          }
+        ],
+        "type": "histogram"
+      },
+      {
+        "datasource": null,
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "thresholds"
+            },
+            "custom": {
+              "align": "auto",
+              "displayMode": "auto"
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 9,
+          "w": 12,
+          "x": 0,
+          "y": 16
+        },
+        "id": 8,
+        "options": {
+          "showHeader": true
+        },
+        "pluginVersion": "8.1.0-pre",
+        "targets": [
+          {
+            "csvFileName": "weight_height.csv",
+            "refId": "A",
+            "scenarioId": "csv_file"
+          }
+        ],
+        "title": "Standalone transform - Height",
+        "transformations": [
+          {
+            "id": "filterFieldsByName",
+            "options": {
+              "include": {
+                "names": [
+                  "Height"
+                ]
+              }
+            }
+          },
+          {
+            "id": "histogram",
+            "options": {
+              "combine": true,
+              "fields": {}
+            }
+          }
+        ],
+        "type": "table"
+      },
+      {
+        "datasource": null,
+        "fieldConfig": {
+          "defaults": {
+            "color": {
+              "mode": "thresholds"
+            },
+            "custom": {
+              "align": "auto",
+              "displayMode": "auto"
+            },
+            "mappings": [],
+            "thresholds": {
+              "mode": "absolute",
+              "steps": [
+                {
+                  "color": "green",
+                  "value": null
+                },
+                {
+                  "color": "red",
+                  "value": 80
+                }
+              ]
+            }
+          },
+          "overrides": []
+        },
+        "gridPos": {
+          "h": 9,
+          "w": 12,
+          "x": 12,
+          "y": 16
+        },
+        "id": 9,
+        "options": {
+          "showHeader": true
+        },
+        "pluginVersion": "8.1.0-pre",
+        "targets": [
+          {
+            "csvFileName": "weight_height.csv",
+            "refId": "A",
+            "scenarioId": "csv_file"
+          }
+        ],
+        "title": "Standalone transform - Weight",
+        "transformations": [
+          {
+            "id": "filterFieldsByName",
+            "options": {
+              "include": {
+                "names": [
+                  "Weight"
+                ]
+              }
+            }
+          },
+          {
+            "id": "histogram",
+            "options": {
+              "combine": true,
+              "fields": {}
+            }
+          }
+        ],
+        "type": "table"
+      }
+    ],
+    "schemaVersion": 30,
+    "style": "dark",
+    "tags": [
+      "gdev",
+      "panel-tests"
+    ],
+    "templating": {
+      "list": []
+    },
+    "time": {
+      "from": "now-6h",
+      "to": "now"
+    },
+    "timepicker": {},
+    "timezone": "",
+    "title": "Panel Tests - Histogram",
+    "uid": "UTv--wqMk",
+    "version": 4
+  }

devenv/dev-dashboards/panel-timeline/timeline-demo.json

@@ -389,7 +389,7 @@
         }
       ],
       "title": "Status map",
-      "type": "status-grid"
+      "type": "status-history"
     }
   ],
   "refresh": false,

devenv/dev-dashboards/panel-timeline/timeline-modes.json

@@ -350,7 +350,7 @@
         }
       ],
       "title": "Status grid",
-      "type": "status-grid"
+      "type": "status-history"
     }
   ],
   "refresh": false,

docs/Makefile

@@ -15,7 +15,7 @@ docs-quick: pull
 	docker run -v $(shell pwd)/sources:$(CONTENT_PATH):Z -p $(PORT) --rm -it $(IMAGE) /bin/bash -c "ln -s /frontend-docs/packages_api /hugo/content/docs/grafana/next/packages_api && make server-quick"
 
 docs-no-pull:
-	docker run -v $(shell pwd)/sources:$(CONTENT_PATH):Z -p $(PORT) --rm -it $(IMAGE) /bin/bash -c "make server-quick"
+	docker run -v $(shell pwd)/sources:$(CONTENT_PATH):Z -p $(PORT) --rm -it $(IMAGE) /bin/bash -c "make server"
 
 docs-test: pull
 	docker run -v $(shell pwd)/sources:$(CONTENT_PATH):Z --rm -it $(IMAGE) /bin/bash -c 'make prod'

docs/sources/_index.md

@@ -1,8 +1,8 @@
 +++
 title = "Grafana documentation"
-description = "Guides, Installation and Feature Documentation"
+description = "Guides, installation, and feature documentation"
 keywords = ["grafana", "installation", "documentation"]
-aliases = ["/docs/grafana/v1.1", "/docs/grafana/latest/guides/reference/admin", "/docs/grafana/v3.1"]
+aliases = ["/docs/grafana/latest/guides/reference/admin"]
 +++
 
 # Grafana documentation
@@ -51,7 +51,7 @@ aliases = ["/docs/grafana/v1.1", "/docs/grafana/latest/guides/reference/admin",
     <a href="{{< relref "basics/_index.md" >}}" class="nav-cards__item nav-cards__item--guide">
         <h4>Grafana basics</h4>
         <p>Learn basic observability.</p>
-    </a>  
+    </a>
     <a href="{{< relref "administration/configuration.md" >}}" class="nav-cards__item nav-cards__item--guide">
         <h4>Configure Grafana</h4>
         <p>Review the configuration and setup options.</p>
@@ -64,8 +64,8 @@ aliases = ["/docs/grafana/v1.1", "/docs/grafana/latest/guides/reference/admin",
         <h4>Provisioning</h4>
         <p>Learn how to automate your Grafana configuration.</p>
     </a>
-    <a href="{{< relref "whatsnew/whats-new-in-v7-5.md" >}}" class="nav-cards__item nav-cards__item--guide">
-        <h4>What's new in v7.5</h4>
+    <a href="{{< relref "whatsnew/whats-new-in-v8-0.md" >}}" class="nav-cards__item nav-cards__item--guide">
+        <h4>What's new in v8.0</h4>
         <p>Explore the features and enhancements in the latest release.</p>
     </a>
 
@@ -75,51 +75,51 @@ aliases = ["/docs/grafana/v1.1", "/docs/grafana/latest/guides/reference/admin",
 
 <div class="nav-cards">
     <a href="{{< relref "datasources/graphite.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_graphite.svg" >
+      <img src="/static/img/docs/logos/icon_graphite.svg" >
       <h5>Graphite</h5>
     </a>
     <a href="{{< relref "datasources/elasticsearch.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_elasticsearch.svg" >
+      <img src="/static/img/docs/logos/icon_elasticsearch.svg" >
       <h5>Elasticsearch</h5>
     </a>
     <a href="{{< relref "datasources/influxdb/_index.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_influxdb.svg" >
+      <img src="/static/img/docs/logos/icon_influxdb.svg" >
       <h5>InfluxDB</h5>
     </a>
     <a href="{{< relref "datasources/prometheus.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_prometheus.svg" >
+      <img src="/static/img/docs/logos/icon_prometheus.svg" >
       <h5>Prometheus</h5>
     </a>
     <a href="{{< relref "datasources/google-cloud-monitoring/_index.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_cloudmonitoring.svg">
+      <img src="/static/img/docs/logos/icon_cloudmonitoring.svg">
       <h5>Google Cloud Monitoring</h5>
     </a>
     <a href="{{< relref "datasources/cloudwatch.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_cloudwatch.svg">
+      <img src="/static/img/docs/logos/icon_cloudwatch.svg">
       <h5>AWS CloudWatch</h5>
     </a>
     <a href="{{< relref "datasources/azuremonitor.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_azure_monitor.jpg">
+      <img src="/static/img/docs/logos/icon_azure_monitor.jpg">
       <h5>Azure Monitor</h5>
     </a>
     <a href="{{< relref "datasources/loki.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_loki.svg">
+      <img src="/static/img/docs/logos/icon_loki.svg">
       <h5>Loki</h5>
     </a>
     <a href="{{< relref "datasources/mysql.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_mysql.png" >
+      <img src="/static/img/docs/logos/icon_mysql.png" >
       <h5>MySQL</h5>
     </a>
     <a href="{{< relref "datasources/postgres.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_postgres.svg" >
+      <img src="/static/img/docs/logos/icon_postgres.svg" >
       <h5>Postgres</h5>
     </a>
     <a href="{{< relref "datasources/mssql.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/sql_server_logo.svg">
+      <img src="/static/img/docs/logos/sql_server_logo.svg">
       <h5>Microsoft SQL Server</h5>
     </a>
     <a href="{{< relref "datasources/opentsdb.md" >}}" class="nav-cards__item nav-cards__item--ds">
-      <img src="/img/docs/logos/icon_opentsdb.png" >
+      <img src="/static/img/docs/logos/icon_opentsdb.png" >
       <h5>OpenTSDB</h5>
     </a>
 </div>

docs/sources/administration/configuration.md

@@ -414,6 +414,11 @@ The length of time that Grafana will wait for a successful TLS handshake with th
 
 The length of time that Grafana will wait for a datasource’s first response headers after fully writing the request headers, if the request has an “Expect: 100-continue” header. A value of `0` will result in the body being sent immediately. Default is `1` second. For more details check the [Transport.ExpectContinueTimeout](https://golang.org/pkg/net/http/#Transport.ExpectContinueTimeout) documentation.
 
+### max_conns_per_host
+
+Optionally limits the total number of connections per host, including connections in the dialing, active, and idle states. On limit violation, dials are blocked. A value of `0` means that there are no limits. Default is `0`.
+For more details check the [Transport.MaxConnsPerHost](https://golang.org/pkg/net/http/#Transport.MaxConnsPerHost) documentation.
+
 ### max_idle_connections
 
 The maximum number of idle connections that Grafana will maintain. Default is `100`. For more details check the [Transport.MaxIdleConns](https://golang.org/pkg/net/http/#Transport.MaxIdleConns) documentation.
@@ -1469,15 +1474,19 @@ Set to `true` if you want to test alpha plugins that are not yet ready for gener
 
 ### allow_loading_unsigned_plugins
 
-Enter a comma-separated list of plugin identifiers to identify plugins that are allowed to be loaded even if they lack a valid signature.
+Enter a comma-separated list of plugin identifiers to identify plugins to load even if they are unsigned. Plugins with modified signatures are never loaded.
+
+We do _not_ recommend using this option. For more information, refer to [Plugin signatures]({{< relref "../plugins/plugin-signatures.md" >}}).
 
 ### plugin_admin_enabled
 
-
 Available to Grafana administrators only, the plugin admin app is set to `false` by default. Set it to `true` to enable the app.
 
 For more information, refer to [Plugin catalog]({{< relref "../plugins/catalog.md" >}}).
 
+### plugin_admin_external_manage_enabled
+
+Set to `true` if you want to enable external management of plugins. Default is `false`. This is only applicable to Grafana Cloud users.
 
 ### plugin_catalog_url
 
@@ -1485,6 +1494,20 @@ Custom install/learn more URL for enterprise plugins. Defaults to https://grafan
 
 <hr>
 
+## [live]
+
+### max_connections
+
+> **Note**: Available in Grafana v8.0 and later versions.
+
+The `max_connections` option specifies the maximum number of connections to the Grafana Live WebSocket endpoint per Grafana server instance. Default is `100`.
+
+Refer to [Grafana Live configuration documentation]({{< relref "../live/configure-grafana-live.md" >}}) if you specify a number higher than default since this can require some operating system and infrastructure tuning.
+
+0 disables Grafana Live, -1 means unlimited connections.
+
+<hr>
+
 ## [plugin.grafana-image-renderer]
 
 For more information, refer to [Image rendering]({{< relref "image_rendering.md" >}}).

docs/sources/administration/image_rendering.md

@@ -7,7 +7,7 @@ weight = 300
 
 # Image rendering
 
-Grafana supports automatic rendering of panels as PNG images. This allows Grafana to automatically generate images of your panels to include in [alert notifications]({{< relref "../alerting/notifications.md" >}}).
+Grafana supports automatic rendering of panels as PNG images. This allows Grafana to automatically generate images of your panels to include in [alert notifications]({{< relref "../alerting/old-alerting/notifications.md" >}}).
 
 >**Note:** Image rendering of dashboards is not supported at this time.
 
@@ -150,7 +150,7 @@ ldd chrome-linux/chrome
 On Ubuntu 18.10 the following dependencies have been confirmed as needed for the image rendering to function.
 
 ```bash
-libx11-6 libx11-xcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrender1 libxtst6 libglib2.0-0 libnss3 libcups2  libdbus-1-3 libxss1 libxrandr2 libgtk-3-0 libgtk-3-0 libasound2
+libx11-6 libx11-xcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrender1 libxtst6 libglib2.0-0 libnss3 libcups2  libdbus-1-3 libxss1 libxrandr2 libgtk-3-0 libgtk-3-0 libasound2 libxcb-dri3-0 libgbm1
 ```
 
 **Debian:**
@@ -172,7 +172,7 @@ libxdamage1 libxext6 libxi6 libxtst6 libnss3 libnss3 libcups2 libxss1 libxrandr2
 On a minimal Centos installation, the following dependencies have been confirmed as needed for the image rendering to function:
 
 ```bash
-libXcomposite libXdamage libXtst cups libXScrnSaver pango atk adwaita-cursor-theme adwaita-icon-theme at at-spi2-atk at-spi2-core cairo-gobject colord-libs dconf desktop-file-utils ed emacs-filesystem gdk-pixbuf2 glib-networking gnutls gsettings-desktop-schemas gtk-update-icon-cache gtk3 hicolor-icon-theme jasper-libs json-glib libappindicator-gtk3 libdbusmenu libdbusmenu-gtk3 libepoxy liberation-fonts liberation-narrow-fonts liberation-sans-fonts liberation-serif-fonts libgusb libindicator-gtk3 libmodman libproxy libsoup libwayland-cursor libwayland-egl libxkbcommon m4 mailx nettle patch psmisc redhat-lsb-core redhat-lsb-submod-security rest spax time trousers xdg-utils xkeyboard-config
+libXcomposite libXdamage libXtst cups libXScrnSaver pango atk adwaita-cursor-theme adwaita-icon-theme at at-spi2-atk at-spi2-core cairo-gobject colord-libs dconf desktop-file-utils ed emacs-filesystem gdk-pixbuf2 glib-networking gnutls gsettings-desktop-schemas gtk-update-icon-cache gtk3 hicolor-icon-theme jasper-libs json-glib libappindicator-gtk3 libdbusmenu libdbusmenu-gtk3 libepoxy liberation-fonts liberation-narrow-fonts liberation-sans-fonts liberation-serif-fonts libgusb libindicator-gtk3 libmodman libproxy libsoup libwayland-cursor libwayland-egl libxkbcommon m4 mailx nettle patch psmisc redhat-lsb-core redhat-lsb-submod-security rest spax time trousers xdg-utils xkeyboard-config alsa-lib
 ```
 
 ### Certificate signed by internal certificate authorities

docs/sources/administration/preferences/change-grafana-theme.md

@@ -23,13 +23,13 @@ The theme affects how Grafana displays graphs, menus, other UI elements.
 
 Here is an example of the dark theme.
 
-![Dark theme example](/img/docs/preferences/dark-theme-7-4.png)
+![Dark theme example](/static/img/docs/preferences/dark-theme-7-4.png)
 
 ### Light
 
 Here is an example of the light theme.
 
-![Light theme example](/img/docs/preferences/light-theme-7-4.png)
+![Light theme example](/static/img/docs/preferences/light-theme-7-4.png)
 
 ## Change server UI theme
 

docs/sources/administration/provisioning.md

@@ -152,7 +152,7 @@ Since not all datasources have the same configuration settings we only have the
 | timeInterval            | string  | Prometheus, Elasticsearch, InfluxDB, MySQL, PostgreSQL and MSSQL | Lowest interval/step value that should be used for this data source.                        |
 | httpMode                | string  | Influxdb                                                         | HTTP Method. 'GET', 'POST', defaults to GET                                                 |
 | maxSeries               | number  | Influxdb                                                         | Max number of series/tables that Grafana processes                                          |
-| httpMethod              | string  | Prometheus                                                       | HTTP Method. 'GET', 'POST', defaults to GET                                                 |
+| httpMethod              | string  | Prometheus                                                       | HTTP Method. 'GET', 'POST', defaults to POST                                                 |
 | customQueryParameters   | string  | Prometheus                                                       | Query parameters to add, as a URL-encoded string.                                                 |
 | esVersion               | string  | Elasticsearch                                                    | Elasticsearch version (E.g. `7.0.0`, `7.6.1`)                                            |
 | timeField               | string  | Elasticsearch                                                    | Which field that should be used as timestamp                                                |
@@ -305,7 +305,7 @@ Grafana offers options to export the JSON definition of a dashboard. Either `Cop
 
 Note: The JSON definition in the input field when using `Copy JSON to Clipboard` or `Save JSON to file` will have the `id` field automatically removed to aid the provisioning workflow.
 
-{{< docs-imagebox img="/img/docs/v51/provisioning_cannot_save_dashboard.png" max-width="500px" class="docs-image--no-shadow" >}}
+{{< figure src="/static/img/docs/v51/provisioning_cannot_save_dashboard.png" max-width="500px" class="docs-image--no-shadow" >}}
 
 ### Reusable Dashboard URLs
 
@@ -437,6 +437,14 @@ The following sections detail the supported settings and secure settings for eac
 | sound      |                |
 | okSound    |                |
 
+#### Alert notification `discord`
+
+| Name           | Secure setting |
+| -------------- | -------------- |
+| url            | yes            |
+| avatar_url     |                |
+| message        |                |
+
 #### Alert notification `slack`
 
 | Name           | Secure setting |
@@ -575,3 +583,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" >}})

docs/sources/administration/set-up-for-high-availability.md

@@ -11,7 +11,7 @@ Setting up Grafana for high availability is fairly simple. You just need a share
 and other persistent data. So the default embedded SQLite database will not work, you will have to switch to MySQL or Postgres.
 
 <div class="text-center">
-  <img src="/img/docs/tutorials/grafana-high-availability.png"  max-width= "800px" class="center" />
+  <img src="/static/img/docs/tutorials/grafana-high-availability.png"  max-width= "800px" class="center" />
 </div>
 
 ## Configure multiple servers to use the same database
@@ -22,7 +22,7 @@ Grafana will now persist all long term data in the database. How to configure th
 
 ## Alerting
 
-Currently alerting supports a limited form of high availability. [Alert notifications]({{< relref "../alerting/notifications.md" >}}) are deduplicated when running multiple servers. This means all alerts are executed on every server but alert notifications are only sent once per alert. Grafana does not support load distribution between servers.
+Currently alerting supports a limited form of high availability. [Alert notifications]({{< relref "../alerting/old-alerting/notifications.md" >}}) are deduplicated when running multiple servers. This means all alerts are executed on every server but alert notifications are only sent once per alert. Grafana does not support load distribution between servers.
 
 ## User sessions
 

docs/sources/alerting/8.0/_index.md

@@ -1,8 +0,0 @@
-+++
-title = "Alerts"
-aliases = ["/docs/grafana/latest/alerting/rules/", "/docs/grafana/latest/alerting/metrics/"]
-weight = 110
-+++
-
-# Alerts v2.0 overview
-

docs/sources/alerting/_index.md

@@ -4,51 +4,23 @@ aliases = ["/docs/grafana/latest/alerting/rules/", "/docs/grafana/latest/alertin
 weight = 110
 +++
 
-# Alerts overview
+# Grafana alerts
 
-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:
+Grafana 8.0 has new and improved alerts. The new alerting system are an [opt-in]({{< relref "./unified-alerting/opt-in.md" >}}) feature that centralizes alerting information for Grafana managed alerts and alerts from Prometheus-compatible data sources in one UI and API.
 
-- 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.
+Alerts have four main components:
 
-Currently only the graph panel visualization supports alerts.
+- Alerting rule - One or more query and/or expression, a condition, the frequency of evaluation, and the (optional) duration that a condition must be met before creating an alert.
+- Contact point - A channel for sending notifications when the conditions of an alerting 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 create and edit alerting rules for Grafana managed alerts, Cortex alerts, and Loki alerts as well as see alerting information from prometheus-compatible data sources in a single, searchable view. For more information, on how to create and edit alerts and notifications, refer to [Overview of Grafana 8.0 alerts]({{< relref "../alerting/unified-alerting/_index.md" >}}).
 
-You can perform the following tasks for alerts:
+As part of the new alert changes, we have introduced a new data source, Alertmanager, which includes built-in support for Prometheus Alertmanager. It is presently in alpha and it not accessible unless alpha plugins are enabled in Grafana settings. For more information, refer to [Alertmanager data source]({{< relref "../datasources/alertmanager.md" >}}).
 
-- [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" >}})
+> **Note:** Out of the box, Grafana still supports old Grafana alerts. They are legacy alerts at this time, and will be deprecated in a future release. For more information, refer to [Legacy Grafana alerts]({{< relref "./old-alerting/_index.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
-
-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.
-
-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`,
-`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" >}}))
-
-## Metrics from the alert engine
-
-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
----------- | ----------- | ----------
-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`
+To learn more about the differences between new alerts and the legacy alerts, refer to [What's New with Grafana 8 Alerts]({{< relref "../alerting/difference-old-new.md" >}}).

docs/sources/alerting/difference-old-new.md

@@ -1,18 +1,21 @@
 +++
-title = "Difference between new and old alerts"
-description = "Pause an existing alert rule"
-keywords = ["grafana", "alerting", "guide", "rules", "view"]
-weight = 400
+title = "What's New with Grafana 8 Alerts"
+description = "What's New with Grafana 8 Alerts"
+keywords = ["grafana", "alerting", "guide"]
+weight = 112
 +++
 
-# Difference between new and old alerts
+# What's New with Grafana 8 Alerts
+The Alerts released with Grafana 8.0 are an opt-in feature that centralizes alerting information for Grafana managed alerts and alerts from Prometheus-compatible datasources in one UI and API. You are able to create and edit alerting rules for Grafana managed alerts, Cortex alerts, and Loki alerts as well as see alerting information from prometheus-compatible datasources in a single, searchable view.
 
-The `ngalert` feature toggle enables the beta version of our new alerting system. 
+## Multi-dimensional alerting
+Create alerts that will give you system-wide visibility with a single alerting rule. With Grafana 8 alerts, you are able to generate multiple alert instances from a single rule eg. creating a rule to monitor disk usage for multiple mount points on a single host. The evaluation engine is able to return multiple time series from a single query. Each time series is identified by its label set. 
 
->**Note:** It is recommended to backup Grafana's database before enabling this feature.
+## Create alerts outside of Dashboards
+Grafana legacy alerts were tied to a dashboard. Grafana 8 Alerts allow you to create queries and expressions that can combine data from multiple sources, in unique ways. You are still able to link dashboards and panels to alerting rules, allowing you to quickly troubleshoot the system under observation, by linking a dashboard and/or panel ID to the alerting rule. 
 
-When the feature flag is enabled, dashboard alerting is disabled and dashboard alerts are migrated into the system. Going to "Alert List" will take you to the new system.
+## Create Loki and Cortex alerting rules
+With Grafana 8 Alerts you are able to manage your Loki and Cortex alerting rules using the same UI and API as your Grafana managed alerts. 
 
-Once you disable the new alters, all migrated and newly created alerts in the new system are deleted, and dashboard alerting will be enabled again.
-
-During beta, the migration of existing dashboard rules may change.
+## View and search for alerts from Prometheus
+You can now display all of your alerting information in one, searchable UI. Alerts for Prometheus compatible datasources are listed below Grafana managed alerts. Search for labels across multiple datasources to quickly find all of the relevant alerts.

docs/sources/alerting/old-alerting/_index.md

@@ -0,0 +1,57 @@
++++
+title = "Legacy Grafana Alerts"
+aliases = ["/docs/grafana/latest/alerting/rules/", "/docs/grafana/latest/alerting/metrics/"]
+weight = 114
++++
+
+# Legacy Grafana alerts
+
+Grafana 8.0 has [new and improved alerts]({{< relref "../unified-alerting/_index.md" >}}). The new alerting system are an opt-in feature that centralizes alerting information for Grafana managed alerts and alerts from Prometheus-compatible data sources in one UI and API.
+
+Out of the box, Grafana still supports legacy dashboard alerts. Legacy Grafana alerts consists of two parts:
+
+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.
+
+Legacy aerts have two main components:
+
+- Alert rule - 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.
+
+## Alert tasks
+
+You can perform the following tasks for alerts:
+
+- [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.
+
+## Alert evaluation
+
+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.
+
+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" >}}))
+
+## Metrics from the alert engine
+
+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" >}}).
+
+Metric Name | Type | Description
+---------- | ----------- | ----------
+`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

docs/sources/alerting/old-alerting/add-notification-template.md

@@ -17,7 +17,7 @@ This topic explains how you can use alert query labels in alert notifications.
 1. Navigate to the panel you want to add or edit an alert rule for.
 1. Click on the panel title, and then click **Edit**.
 1. On the Alert tab, click **Create Alert**. If an alert already exists for this panel, then you can edit the alert directly.
-1. Refer to the alert query labels in the alert rule name and/or alert notification message field by using the `${Label}` syntax.    
+1. Refer to the alert query labels in the alert rule name and/or alert notification message field by using the `${Label}` syntax.
 1. Click **Save** in the upper right corner to save the alert rule and the dashboard.
 
-![Alerting notification template](/img/docs/alerting/alert-notification-template-7-4.png)
+![Alerting notification template](/static/img/docs/alerting/alert-notification-template-7-4.png)

docs/sources/alerting/old-alerting/create-alerts.md

@@ -9,7 +9,7 @@ weight = 200
 
 Grafana alerting allows you to attach rules to your dashboard panels. When you save the dashboard, Grafana extracts the alert rules into a separate alert rule storage and schedules them for evaluation.
 
-![Alerting overview](/img/docs/alerting/drag_handles_gif.gif)
+![Alerting overview](/static/img/docs/alerting/drag_handles_gif.gif)
 
 In the Alert tab of the graph panel you can configure how often the alert rule should be evaluated and the conditions that need to be met for the alert to change state and trigger its [notifications]({{< relref "notifications.md" >}}).
 
@@ -37,7 +37,7 @@ This section describes the fields you fill out to create an alert.
 - **Evaluate every -** Specify how often the scheduler should evaluate the alert rule. This is referred to as the _evaluation interval_.
 - **For -** Specify how long the query needs to violate the configured thresholds before the alert notification triggers.
 
-You can set a minimum evaluation interval in the `alerting.min_interval_seconds` configuration field, to set a minimum time between evaluations. Refer to [Configuration]({{< relref "../administration/configuration.md" >}}#min-interval-seconds) for more information.
+You can set a minimum evaluation interval in the `alerting.min_interval_seconds` configuration field, to set a minimum time between evaluations. Refer to [Configuration]({{< relref "../../administration/configuration.md" >}}#min-interval-seconds) for more information.
 
 > **Caution:** Do not use `For` with the `If no data or all values are null` setting set to `No Data`. The triggering of `No Data` will trigger instantly and not take `For` into consideration. This may also result in that an OK notification not being sent if alert transitions from `No Data -> Pending -> OK`.
 
@@ -46,9 +46,9 @@ If an alert rule has a configured `For` and the query violates the configured th
 Typically, it's always a good idea to use this setting since it's often worse to get false positive than wait a few minutes before the alert notification triggers. Looking at the `Alert list` or `Alert list panels` you will be able to see alerts in pending state.
 
 Below you can see an example timeline of an alert using the `For` setting. At ~16:04 the alert state changes to `Pending` and after 4 minutes it changes to `Alerting` which is when alert notifications are sent. Once the series falls back to normal the alert rule goes back to `OK`.
-{{< imgbox img="/img/docs/v54/alerting-for-dark-theme.png" caption="Alerting For" >}}
+{{< figure class="float-right"  src="/static/img/docs/v54/alerting-for-dark-theme.png" caption="Alerting For" >}}
 
-{{< imgbox max-width="40%" img="/img/docs/v4/alerting_conditions.png" caption="Alerting Conditions" >}}
+{{< figure class="float-right"  max-width="40%" src="/static/img/docs/v4/alerting_conditions.png" caption="Alerting Conditions" >}}
 
 ### Conditions
 

docs/sources/alerting/old-alerting/notifications.md

@@ -52,7 +52,7 @@ Alert rule evaluation interval | Send reminders every | Reminder sent every (aft
 Name | Type | Supports images | Support alert rule tags
 -----|------|---------------- | -----------------------
 [DingDing](#dingdingdingtalk) | `dingding` | yes, external only | no
-Discord | `discord` | yes | no
+[Discord](#discord) | `discord` | yes | no
 [Email](#email) | `email` | yes | no
 [Google Hangouts Chat](#google-hangouts-chat) | `googlechat` | yes, external only | no
 Hipchat | `hipchat` | yes, external only | no
@@ -74,7 +74,7 @@ VictorOps | `victorops` | yes, external only | yes
 
 ### Email
 
-To enable email notifications you have to set up [SMTP settings]({{< relref "../administration/configuration/#smtp" >}})
+To enable email notifications you have to set up [SMTP settings]({{< relref "../../administration/configuration/#smtp" >}})
 in the Grafana config. Email notifications will upload an image of the alert graph to an
 external image destination if available or fallback to attaching the image to the email.
 Be aware that if you use the `local` image storage email servers and clients might not be
@@ -89,7 +89,7 @@ Addresses | Email addresses to recipients. You can enter multiple email addresse
 
 ### Slack
 
-{{< imgbox max-width="40%" img="/img/docs/v4/slack_notification.png" caption="Alerting Slack Notification" >}}
+{{< figure class="float-right"  max-width="40%" src="/static/img/docs/v4/slack_notification.png" caption="Alerting Slack Notification" >}}
 
 To set up Slack, you need to configure an incoming Slack webhook URL. You can follow
 [Sending messages using Incoming Webhooks](https://api.slack.com/incoming-webhooks) on how to do that. If you want to include screenshots of the
@@ -162,7 +162,7 @@ API Token | Application token
 User key(s) | A comma-separated list of user keys
 Device(s) | A comma-separated list of devices
 Priority | The priority alerting nottifications are sent
-OK priority | The priority OK notifications are sent; if not set, then OK notifications are sent with the priority set for alerting notifications 
+OK priority | The priority OK notifications are sent; if not set, then OK notifications are sent with the priority set for alerting notifications
 Retry | How often (in seconds) the Pushover servers send the same notification to the user. (minimum 30 seconds)
 Expire | How many seconds your notification will continue to be retried for (maximum 86400 seconds)
 Alerting sound | The sound for alerting notifications
@@ -220,6 +220,19 @@ In DingTalk PC Client:
 
 6. There will be a Webhook URL in the panel, looks like this: https://oapi.dingtalk.com/robot/send?access_token=xxxxxxxxx. Copy this URL to the Grafana DingTalk setting page and then click "finish".
 
+### Discord
+
+To set up Discord, you must create a Discord channel webhook. For instructions on how to create the channel, refer to 
+[Intro to Webhooks](https://support.discord.com/hc/en-us/articles/228383668-Intro-to-Webhooks) f.
+
+Setting | Description
+---------- | -----------
+Webhook URL | Discord webhook URL.
+Message Content | Mention a group using @ or a user using <@ID> when notifying in a channel.
+Avatar URL | Optionally, provide a URL to an image to use as the avatar for the bot's message.
+
+Alternately, use the [Slack](#slack) notifier by appending `/slack` to a Discord webhook URL.
+
 ### Kafka
 
 Notifications can be sent to a Kafka topic from Grafana using the [Kafka REST Proxy](https://docs.confluent.io/1.0/kafka-rest/docs/index.html).
@@ -252,19 +265,19 @@ Alertmanager handles alerts sent by client applications such as Prometheus serve
 ## Enable images in notifications {#external-image-store}
 
 Grafana can render the panel associated with the alert rule as a PNG image and include that in the notification. Read more about the requirements and how to configure
-[image rendering]({{< relref "../administration/image_rendering/" >}}).
+[image rendering]({{< relref "../../administration/image_rendering/" >}}).
 
-You must configure an [external image storage provider]({{< relref "../administration/configuration/#external-image-storage" >}}) in order to receive images in alert notifications. If your notification channel requires that the image be publicly accessible (e.g. Slack, PagerDuty), configure a provider which uploads the image to a remote image store like Amazon S3, Webdav, Google Cloud Storage, or Azure Blob Storage. Otherwise, the local provider can be used to serve the image directly from Grafana.
+You must configure an [external image storage provider]({{< relref "../../administration/configuration/#external-image-storage" >}}) in order to receive images in alert notifications. If your notification channel requires that the image be publicly accessible (e.g. Slack, PagerDuty), configure a provider which uploads the image to a remote image store like Amazon S3, Webdav, Google Cloud Storage, or Azure Blob Storage. Otherwise, the local provider can be used to serve the image directly from Grafana.
 
 Notification services which need public image access are marked as 'external only'.
 
 ## Configure the link back to Grafana from alert notifications
 
 All alert notifications contain a link back to the triggered alert in the Grafana instance.
-This URL is based on the [domain]({{< relref "../administration/configuration/#domain" >}}) setting in Grafana.
+This URL is based on the [domain]({{< relref "../../administration/configuration/#domain" >}}) setting in Grafana.
 
 ## Notification templating
 
 > **Note:** Alert notification templating is only available in Grafana v7.4 and above.
 
-The alert notification template feature allows you to take the [label]({{< relref "../basics/timeseries-dimensions.md#labels" >}}) value from an alert query and [inject that into alert notifications]({{< relref "./add-notification-template.md" >}}).
+The alert notification template feature allows you to take the [label]({{< relref "../../basics/timeseries-dimensions.md#labels" >}}) value from an alert query and [inject that into alert notifications]({{< relref "./add-notification-template.md" >}}).

docs/sources/alerting/old-alerting/troubleshoot-alerts.md

@@ -9,7 +9,7 @@ weight = 500
 
 If alerts are not behaving as you expect, here are some steps you can take to troubleshoot and figure out what is going wrong.
 
-![Test Rule](/img/docs/v4/alert_test_rule.png)
+![Test Rule](/static/img/docs/v4/alert_test_rule.png)
 
 The first level of troubleshooting you can do is click **Test Rule**. You will get result back that you can expand to the point where you can see the raw data that was returned from your query.
 

docs/sources/alerting/unified-alerting/_index.md

@@ -0,0 +1,60 @@
++++
+title = "Grafana 8 Alerts"
+aliases = ["/docs/grafana/latest/alerting/metrics/"]
+weight = 113
++++
+
+# Overview of Grafana 8 alerts
+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.
+
+>**Note:** This information is for the new, Grafana 8 Alerts. This is an [opt-in]({{< relref"./opt-in.md" >}}) feature released in Grafana 8.0. Grafana still supports [legacy dashboard alerts]({{< relref "../old-alerting/_index.md" >}}) out of the box
+
+Alerts have four main components:
+
+- Alerting rule - One or more query and/or expression, a condition, the frequency of evaluation, and the (optional) duration that a condition must be met before creating an alert.
+- Contact point - A channel for sending notifications when the conditions of an alerting 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.
+
+## Alerting tasks
+
+You can perform the following tasks for alerts:
+
+
+- [Create a Grafana managed alert rule]({{< relref "alerting-rules/create-grafana-managed-rule.md" >}})
+- [Create a Cortex or Loki managed alert rule]({{< relref "alerting-rules/create-cortex-loki-managed-rule.md" >}})
+- [View existing alert rules and their current state]({{< relref "alerting-rules/rule-list.md" >}})
+- [Test alert rules and troubleshoot]({{< relref "./troubleshoot-alerts.md" >}})
+- [Add or edit an alert contact point]({{< relref "./contact-points.md" >}})
+- [Add or edit notification policies]({{< relref "./notification-policies.md" >}})
+- [Create and edit silences]({{< relref "./silences.md" >}})
+
+## Clustering
+
+Currently alerting supports a limited form of high availability. 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.
+
+## Alert evaluation
+
+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.
+
+Alerting 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" >}}))
+
+## Metrics from the alerting engine
+
+The alerting engine publishes some internal metrics about itself. You can read more about how Grafana publishes [internal metrics]({{< relref "../../administration/view-server/internal-metrics.md" >}}).
+
+Metric Name | Type | Description
+---------- | ----------- | ----------
+`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
+
+
+- [View alert rules and their current state]({{< relref "alerting-rules/rule-list.md" >}})

docs/sources/alerting/unified-alerting/alerting-rules/_index.md

@@ -0,0 +1,13 @@
++++
+title = "Create and manage rules"
+aliases = ["/docs/grafana/latest/alerting/rules/"]
+weight = 130
++++
+
+# Create and manage alerting Rules
+One or more queries and/or expressions, a condition, the frequency of evaluation, and the (optional) duration that a condition must be met before creating an alert. Alerting rules are how you express the criteria for creating an alert. Queries and expressions select and can operate on the data you wish to alert on. A condition sets the threshold that an alert must meet or exceed to create an alert. The interval specifies how frequently the rule should be evaluated. The duration, when configured, sets a period that a condition must be met or exceeded before an alert is created. Alerting rules also can contain settings for what to do when your query does not return any data, or there is an error attempting to execute the query. 
+
+- [Create Cortex or Loki managed alert rule]({{< relref "./create-cortex-loki-managed-rule.md" >}})
+- [Create Grafana managed alert rule]({{< relref "./create-grafana-managed-rule.md" >}})
+- [State and Health of alerting rules]({{< relref "./state-and-health.md" >}})
+- [View existing alert rules and their current state]({{< relref "./rule-list.md" >}})

docs/sources/alerting/unified-alerting/alerting-rules/create-cortex-loki-managed-rule.md

@@ -0,0 +1,62 @@
++++
+title = "Create Cortex or Loki managed alert rule"
+description = "Create Cortex or Loki managed alerting rule"
+keywords = ["grafana", "alerting", "guide", "rules", "create"]
+weight = 400
++++
+
+# Create a Cortex or Loki managed alerting rule
+
+Grafana allows you manage alerting rules for an external Cortex or Loki instance. 
+
+## Add or edit a Cortex or Loki managed alerting rule
+
+1. In the Grafana menu hover your cursor over the Alerting (bell) icon.
+1. To create a new alert rule, click **New alert rule**. To edit an existing rule, expand one of the rules in the **Cortex / Loki** section and click **Edit**.
+1. Click on the **Alert type** drop down and select **Cortex / Loki managed alert**.
+1. Fill out the rest of the fields. Descriptions are listed below in [Alert rule fields](#alert-rule-fields).
+1. When you have finished writing your rule, click **Save** in the upper right corner to save the rule,, or **Save and exit** to save and exit rule editing.
+
+## Alert rule fields
+
+This section describes the fields you fill out to create an alert.
+
+### Alert type
+
+  - **Alert name -** Enter a descriptive name. The name will be displayed in the alert rule list, as well as added as `alertname` label to every alert instance that is created from this rule.
+  - **Alert type -** Select **Cortex / Loki managed alert**.
+  - **Data source -** Select a Prometheus or Loki data source. Only Prometheus data sources that support Cortex ruler API will be available. 
+  - **Namespace -** Select an existing rule namespace or click **Add new** to create a new one.
+  - **Group -** Select an existing group within the selected namespace or click **Add new** to create a new one. Newly created rules will be added to the end of the rule group.
+
+![Alert type section screenshot](/static/img/docs/alerting/unified/rule-edit-cortex-alert-type-8-0.png 'Alert type section screenshot')
+
+### Query
+
+Enter a PromQL or LogQL expression. Rule will fire if evaluation result has at least one series with value > 0. An alert will be created per each such series.
+
+![Query section](/static/img/docs/alerting/unified/rule-edit-cortex-query-8-0.png 'Query section screenshot')
+
+### Conditions
+
+  - **For -** For how long the selected condition should violated before an alert enters `Firing` state. When condition threshold is violated for the first time, an alert becomes `Pending`. If the **for** time elapses and the condition is still violated, it becomes `Firing`. Else it reverts back to `Normal`. 
+
+![Conditions section](/static/img/docs/alerting/unified/rule-edit-cortex-conditions-8-0.png 'Conditions section screenshot')
+
+### Details
+
+Annotations and labels can be optionally added in the details section.
+
+#### Annotations
+
+Annotations are key and value pairs that provide additional meta information about the alert, for example description, summary, runbook URL. They are displayed in rule and alert details in the UI and can be used in contact type message templates. Annotations can also be templated, for example `Instance {{ $labels.instance }} down` will have the evaluated `instance` label value added for every alert this rule produces. 
+
+#### Labels
+
+Labels are key value pairs that categorize or identify an alert. Labels are  used to match alerts in silences or match and groups alerts in notification policies. Labels are also shown in rule or alert details in the UI and can be used in contact type message templates. For example, it is common to add a `severity` label and then configure a separate notification policy for each severity. Or one could add a `team` label and configure team specific notification policies, or silence all alerts for a particular team.
+
+![Details section](/static/img/docs/alerting/unified/rule-edit-details-8-0.png 'Details section screenshot')
+
+## Preview alerts
+
+To evaluate the rule and see what alerts it would produce, click **Preview alerts**. It will display a list of alerts with state and value of for each one.

docs/sources/alerting/unified-alerting/alerting-rules/create-grafana-managed-rule.md

@@ -0,0 +1,108 @@
++++
+title = "Create Grafana managed alert rule"
+description = "Create Grafana managed alert rule"
+keywords = ["grafana", "alerting", "guide", "rules", "create"]
+weight = 400
++++
+
+# Create a Grafana managed alerting rule
+
+Grafana allows you to create alerting rules that query one or more data sources, reduce or transform the results and compare them to each other or to fix thresholds. These rules will be executed and notifications sent by Grafana itself. 
+
+## Add or edit a Grafana managed alerting rule
+
+1. In the Grafana menu hover your cursor over the Alerting (bell) icon.
+1. To create a new alert rule, click **New alert rule**. To edit an existing rule, expand one of the rules in the **Grafana** section and click **Edit**.
+1. Click on the **Alert type** drop down and select **Grafana managed alert**.
+1. Fill out the rest of the fields. Descriptions are listed below in [Alert rule fields](#alert-rule-fields).
+1. When you have finished writing your rule, click **Save** in the upper right corner to save the rule,, or **Save and exit** to save and exit rule editing.
+
+## Alert rule fields
+
+This section describes the fields you fill out to create an alert.
+
+### Alert type
+
+  - **Alert name -** Enter a descriptive name. The name will be displayed in the alert rule list, as well as added as `alertname` label to every alert instance that is created from this rule.
+  - **Alert type -** Select **Grafana managed alert**.
+  - **Folder -** Select a folder this alert rule will belong to. To create a new folder, click on the drop down and type in a new folder name.
+
+![Alert type section screenshot](/static/img/docs/alerting/unified/rule-edit-grafana-alert-type-8-0.png 'Alert type section screenshot')
+
+### Query
+
+Add one or more [queries]({{< relref "../../../panels/queries.md" >}}) or [expressions]({{< relref "../../../panels/expressions.md" >}}). You can use classic condition expression to create a rule that will trigger a single alert if it's threshold is met, or use reduce and math expressions to create a multi dimensional alert rule that can trigger multiple alerts, one per matching series in the query result. 
+
+#### Rule with classic condition
+
+You can use classic condition expression to create a rule that will trigger a single alert if it's conditions is met. It works about the same way as dashboard alerts in previous versions of Grafana.
+
+1. Add one or more queries
+1. Add an expression. Click on **Operation** dropdown and select **Classic condition**.
+1. Add one or more conditions. For each condition you can specify operator (`AND` / `OR`), aggregation function, query letter and threshold value.
+
+If a query returns multiple series, then the aggregation function and threshold check will be evaluated for each series.It will not track alert state **per series**. This has implications that are detailed in the scenario below. 
+
+- Alert condition with query that returns 2 series: **server1** and **server2**
+- **server1** series causes the alert rule to fire and switch to state `Firing`
+- Notifications are sent out with message: _load peaking (server1)_
+- In a subsequent evaluation of the same alert rule, the **server2** series also causes the alert rule to fire
+- No new notifications are sent as the alert rule is already in state `Firing`.
+
+So, as you can see from the above scenario Grafana will not send out notifications when other series cause the alert to fire if the rule already is in state `Firing`. If you want to have alert per series, create a multi dimensional alert rule as described in the section below.
+
+![Query section classic condition](/static/img/docs/alerting/unified/rule-edit-classic-8-0.png 'Query section classic condition screenshot')
+
+#### Multi dimensional rule
+
+You can use reduce and math expressions to create a rule that will create an alert per series returned by the query.
+
+1. Add one or more queries
+2. Add a `reduce` expression for each query to aggregate values in the selected time range into a single value. With some data sources this is not needed for [rules using numeric data]({{< relref "../grafana-managed-numeric-rule.md" >}}).
+3. Add a `math` expressions with the condition for the rule. Not needed in case a query or a reduce expression already returns 0 if rule should not be firing, or > 0 if it should be firing. Some examples: `$B > 70` if it should fire in case value of B query/expression is more than 70. `$B < $C * 100` in case it should fire if value of B is less than value of C multiplied by 100. If queries being compared have multiple series in their results, series from different queries are matched if they have the same labels or one is a subset of the other.
+
+See or [expressions documentation]({{< relref "../../../panels/expressions.md" >}}) for in depth explanation of `math` and `reduce` expressions.
+
+![Query section multi dimensional](/static/img/docs/alerting/unified/rule-edit-multi-8-0.png 'Query section multi dimensional screenshot')
+
+### Conditions
+
+  - **Condition -** Select the letter of the query or expression whose result will trigger the alert rule. You will likely want to select either a `classic condition` or a `math` expression.
+  - **Evaluate every -** How often the rule should be evaluated, executing the defined queries and expressions. Must be no less than 10 seconds and a multiple of 10 seconds. Examples: `1m`, `30s`
+  - **Evaluate for -** For how long the selected condition should violated before an alert enters `Alerting` state. When condition threshold is violated for the first time, an alert becomes `Pending`. If the **for** time elapses and the condition is still violated, it becomes `Alerting`. Else it reverts back to `Normal`. 
+
+#### No Data & Error handling
+ 
+ Toggle **Configure no data and error handling** switch to configure how the rule should handle cases where evaluation results in error or returns no data.
+
+| No Data Option  | Description                                                                                |
+| --------------- | ------------------------------------------------------------------------------------------ |
+| No Data         | Set alert state to `NoData` and rule state to `Normal`                                     |
+| Alerting        | Set alert rule state to `Alerting`                                                         |
+| Ok              | Set alert rule state to `Normal`                                                           |
+
+
+| Error or timeout option | Description                                         |
+| ----------------------- | --------------------------------------------------- |
+| Alerting                | Set alert rule state to `Alerting`                  |
+| OK                      | Set alert rule state to `Normal`                    |
+
+![Conditions section](/static/img/docs/alerting/unified/rule-edit-grafana-conditions-8-0.png 'Conditions section screenshot')
+
+### Details
+
+Annotations and labels can be optionally added in the details section.
+
+#### Annotations
+
+Annotations are key and value pairs that provide additional meta information about the alert, for example description, summary, runbook URL. They are displayed in rule and alert details in the UI and can be used in contact type message templates. Annotations can also be templated, for example `Instance {{ $labels.instance }} down` will have the evaluated `instance` label value added for every alert this rule produces. 
+
+#### Labels
+
+Labels are key value pairs that categorize or identify an alert. Labels are  used to match alerts in silences or match and groups alerts in notification policies. Labels are also shown in rule or alert details in the UI and can be used in contact type message templates. For example, it is common to add a `severity` label and then configure a separate notification policy for each severity. Or one could add a `team` label and configure team specific notification policies, or silence all alerts for a particular team. Labels can also be templated like annotations, for example `{{ $labels.namespace }}/{{ $labels.job }}` will produce a new rule label that will have the evaluated `namespace` and `job` label value added for every alert this rule produces. The rule labels take precedence over the labels produced by the query/condition.
+
+![Details section](/static/img/docs/alerting/unified/rule-edit-details-8-0.png 'Details section screenshot')
+
+## Preview alerts
+
+To evaluate the rule and see what alerts it would produce, click **Preview alerts**. It will display a list of alerts with state and value for each one.

docs/sources/alerting/unified-alerting/alerting-rules/rule-list.md

@@ -0,0 +1,48 @@
++++
+title = "View alert rules"
+description = "View alert rules"
+keywords = ["grafana", "alerting", "guide", "rules", "view"]
+weight = 400
++++
+
+# View alert rules
+
+To view alerts:
+1. In the Grafana menu hover your cursor over the Alerting (bell) icon.
+1. Click **Alert Rules**. You can see all configured Grafana alert rules as well as any rules from Loki or Prometheus data sources. 
+By default, the group view is shown. You can toggle between group or state views by clicking the relevant **View as** buttons in the options area at the top of the page.
+
+### Group view
+
+Group view shows Grafana alert rules grouped by folder and Loki or Prometheus alert rules grouped by `namespace` + `group`. This is the default rule list view, intended for managing rules. You can expand each group to view a list of rules in this group. Each rule can be further expanded to view its details. Action buttons and any alerts spawned by this rule, and each alert can be further expanded to view its details.
+
+![Grouped alert rule view](/static/img/docs/alerting/unified/rule-list-group-view-8-0.png 'Screenshot of grouped alert rule view')
+
+### State view
+
+State view shows alert rules grouped by state. Use this view to get an overview of which rules are in what state. Each rule can be expanded to view its details. Action buttons and any alerts spawned by this rule, and each alert can be further expanded to view its details.
+
+![Alert rule state view](/static/img/docs/alerting/unified/rule-list-state-view-8-0.png 'Screenshot of alert rule state view')
+
+## Filter alert rules
+You can use the following filters to view only alert rules that match specific criteria:
+
+- **Filter alerts by name or label -** Type an alert name, label name or value in the **Search** input.
+- **Filter alerts by state -** In **States** Select which alert states you want to see. All others are hidden.
+- **Filter alerts by data source -** Click the **Select data source** and select an alerting data source. Only alert rules that query selected data source will be visible.
+
+## Rule details
+
+A rule row shows the rule state, health, and summary annotation if the rule has one. You can expand the rule row to display rule labels, all annotations, data sources this rule queries, and a list of alert instances spawned from this rule.
+
+![Alert rule details](/static/img/docs/alerting/unified/rule-details-8-0.png 'Screenshot of alert rule details')
+
+### Edit or delete rule
+
+Grafana rules can only be edited or deleted by users with Edit permissions for the folder which contains the rule. Prometheus or Loki rules can be edited or deleted by users with Editor or Admin roles. 
+
+To edit or delete a rule:
+
+1. Expand this rule to reveal rule controls. 
+1. Click **Edit** to go to the rule editing form. Make changes following [instructions listed here]({{< relref "./create-grafana-managed-rule.md" >}}).
+1. Click **Delete"** to delete a rule. 

docs/sources/alerting/unified-alerting/alerting-rules/state-and-health.md

@@ -0,0 +1,27 @@
++++
+title = "State and Health of alerting rules"
+description = "State and Health of alerting rules"
+keywords = ["grafana", "alerting", "guide", "state"]
++++
+
+The concepts of state and health for alerting rules help you understand, at a glance, several key status indicators about your alerts. Alert state, alerting rule state, and alerting rule health are related, but they each convey subtly different information.
+
+## Alerting rule state
+Indicates whether any of the timeseries resulting from evaluation of the alerting rule are in an alerting state. Alerting rule state only requires a single alerting instance to be in a pending or firing state for the alerting rule state to not be normal.
+- Normal: none of the timeseries returned are in an alerting state.
+- Pending: at least one of the timeseries returned are in a pending state.
+- Firing: at least one of the timeseries returned are in an alerting state.
+
+## Alert state
+Alert state is an indication of the output of the alerting evaluation engine.
+- Normal: the condition for the alerting rule has evaluated to **false** for every timeseries returned by the evaluation engine.
+- Alerting: the condition for the alerting rule has evaluated to **true** for at least one timeseries returned by the evaluation engine and the duration, if set, **has** been met or exceeded.
+- Pending: the condition for the alerting rule has evaluated to **true** for at least one timeseries returned by the evaluation engine and the duration, if set, **has not** been met or exceeded.
+- NoData: the alerting rule has not returned a timeseries, all values for the timeseries are null, or all values for the timeseries are zero.
+- Error: There was an error encountered when attempting to evaluate the alerting rule.
+
+## Alerting rule health
+Indicates the status of alerting rule evaluation.
+- Ok: the rule is being evaluated, data is being returned, and no errors have been encountered.
+- Error: an error was encountered when evaluating the alerting rule.
+- NoData: at least one of the timeseries returned during evaluation is in a NoData state.

docs/sources/alerting/unified-alerting/contact-points.md

@@ -0,0 +1,73 @@
++++
+title = "Contact points"
+description = "Create or edit contact point"
+keywords = ["grafana", "alerting", "guide", "contact point", "notification channel", "create"]
+weight = 400
++++
+
+# Contact points
+
+Contact points define where to send notifications about alerts that match a particular [notification policy]({{< relref "./notification-policies.md" >}}). A contact point can contain one or more contact point types, eg email, slack, webhook and so on. A notification will dispatched to all contact point types defined on a contact point. [Templating]({{< relref "./message-templating/_index.md" >}}) can be used to customize contact point type message with alert data. Grafana alerting UI can be used to configure both Grafana managed contact points and contact points for an [external Alertmanager if one is configured]({{< relref "../../datasources/alertmanager.md" >}}).
+
+## Add a contact point
+
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Click **Add contact point**.
+1. Enter a **Name** for the contact point 
+1. Select contact point type and fill out mandatory fields. **Optional settings** can be expanded for more options.
+1. If you'd like this contact point to notify via multiple channels, for example both email and slack, click **New contact point type** and fill out additional contact point type details.
+1. Click **Save contact point** button at the bottom of the page.
+
+## Editing a contact point
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Find the contact point you want to edit in the contact points table and click the **pen icon** on the right side.
+1. Make any changes and click **Save contact point** button at the bottom of the page.
+
+## Deleting a contact point 
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Find the contact point you want to edit in the contact points table and click the **trash can icon** on the right side.
+1. A confirmation dialog will open. Click **Yes, delete**.
+
+**Note** You will not be able to delete contact points that are currently used by any notification policy. If you want to delete such contact point, you will have to first go to [notification policies]({{< relref "./notification-policies.md" >}}) and delete the policy or update it to use another contact point.
+
+## List of notifiers supported by Grafana
+
+Name | Type 
+-----|-----
+[DingDing](#dingdingdingtalk) | `dingding`
+[Discord](#discord) | `discord`
+[Email](#email) | `email`
+[Google Hangouts Chat](#google-hangouts-chat) | `googlechat`
+[Kafka](#kafka) | `kafka`
+Line | `line`
+Microsoft Teams | `teams`
+[Opsgenie](#opsgenie) | `opsgenie`
+[Pagerduty](#pagerduty) | `pagerduty`
+Prometheus Alertmanager | `prometheus-alertmanager`
+[Pushover](#pushover) | `pushover`
+Sensu | `sensu`
+[Sensu Go](#sensu-go) | `sensugo`
+[Slack](#slack) | `slack`
+Telegram | `telegram`
+Threema | `threema`
+VictorOps | `victorops`
+[Webhook](#webhook) | `webhook`
+[Zenduty](#zenduty) | `webhook` 
+
+## Manage contact points for an external Alertmanager
+
+Grafana alerting UI supports managing external Alertmanager configuration. Once you add an [Alertmanager data source]({{< relref "../../datasources/alertmanager.md" >}}), a dropdown displays at the top of the page where you can select either `Grafana` or an external Alertmanager as your data source. 
+
+{{< figure max-width="40%" src="/static/img/docs/alerting/unified/contact-points-select-am-8-0.gif" caption="Select Alertmanager" >}}
+
+### Edit Alertmanager global config
+
+To edit global configuration options for an alertmanager, like SMTP server that is used by default for all email contact types:
+
+
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. In the dropdown at the top of the page, select an Alertmanager data source.
+1. Click **Edit global config** button at the bottom of the page.
+1. Fill out the form and click **Save global config**.
+
+**Note** this is only for external Alertmanagers. Some global options for Grafana contact types, like email settings, can be configured via [Grafana configuration]({{< relref "../../administration/configuration.md" >}}).

docs/sources/alerting/unified-alerting/grafana-managed-numeric-rule.md

@@ -0,0 +1,67 @@
++++
+title = "Grafana managed alert rules for numeric data"
+description = "Grafana managed alert rules for numeric data"
+keywords = ["grafana", "alerting", "guide", "rules", "create"]
+weight = 400
++++
+
+# Alerting on numeric data
+
+Among certain data sources numeric data that is not time series can be directly alerted on, or passed into Server Side Expressions (SSE). This allows for more processing and resulting efficiency within the data source, and it can also simplify alert rules.
+When alerting on numeric data instead of time series data, there is no need to reduce each labeled time series into a single number. Instead labeled numbers are returned to Grafana instead.
+
+## Tabular Data
+
+This feature is supported with backend data sources that query tabular data:
+
+- SQL data sources such as MySQL, Postgres, MSSQL, and Oracle.
+- The Azure Kusto based services: Azure Monitor (Logs), Azure Monitor (Azure Resource Graph), and Azure Data Explorer.
+
+A query with Grafana managed alerts or SSE is considered numeric with these data sources, if:
+
+- The "Format AS" option is set to "Table" in the data source query.
+- The table response returned to Grafana from the query includes only one numeric (e.g. int, double, float) column, and optionally additional string columns.
+
+If there are string columns then those columns become labels. The name of column becomes the label name, and the value for each row becomes the value of the corresponding label. If multiple rows are returned, then each row should be uniquely identified their labels.
+
+## Example
+
+For a MySQL table called "DiskSpace":
+
+| Time        | Host | Disk | PercentFree
+| ----------- | ---  | -----| --------
+| 2021-June-7 | web1 | /etc | 3
+| 2021-June-7 | web2 | /var | 4
+| 2021-June-7 | web3 | /var | 8
+| ...         | ...  | ...  | ...
+
+You can query the data filtering on time, but without returning the time series to Grafana. For example, an alert that would trigger per Host, Disk when there is less than 5% free space:
+
+```sql
+SELECT Host, Disk, CASE WHEN PercentFree < 5.0 THEN PercentFree ELSE 0 END FROM (
+  SELECT 
+      Host, 
+      Disk, 
+      Avg(PercentFree) 
+  FROM DiskSpace
+  Group By 
+    Host, 
+    Disk
+  Where __timeFilter(Time)
+```
+
+This query returns the following Table response to Grafana:
+
+| Host | Disk | PercentFree
+| ---  | -----| --------
+| web1 | /etc | 3
+| web2 | /var | 4
+| web3 | /var | 0
+
+When this query is used as the **condition** in an alert rule, then the non-zero will be alerting. As a result, three alert instances are produced:
+
+| Labels                | Status
+| ----------------------| ------
+| {Host=web1,disk=/etc} | Alerting
+| {Host=web2,disk=/var} | Alerting
+| {Host=web3,disk=/var} | Normal

docs/sources/alerting/unified-alerting/message-templating/_index.md

@@ -0,0 +1,102 @@
++++
+title = "Message templating"
+description = "Message templating"
+aliases = ["/docs/grafana/latest/alerting/message-templating/"]
+keywords = ["grafana", "alerting", "guide", "contact point", "templating"]
+weight = 400
++++
+
+# Message templating
+
+Notifications sent via [contact points]({{< relref "../contact-points.md" >}}) are built using templates. Grafana comes with default templates which you can customize. Grafana's notification templates are based on the [Go templating system](https://golang.org/pkg/text/template) where some fields are evaluated as text, while others are evaluated as HTML which can affect escaping. Since most of the contact point fields can be templated, you can create reusable templates and them in multiple contact points. See [template data reference]({{< relref "./template-data.md" >}}) to check what variables are available in the templates.
+
+
+## Using templating in contact point fields
+
+This section shows an example of using templating to render a number of firing or resolved alerts in Slack message title, and listing alerts with status and name in the message body:
+
+<img  src="/static/img/docs/alerting/unified/contact-points-template-fields-8-0.png" width="600px">
+
+## Reusable templates
+
+You can create named templates and then reuse them in contact point fields or other templates.
+
+### Create a template
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Click **Add template**.
+1. Fill in **Name** and **Content** fields.
+1. Click **Save template** button at the bottom of the page.
+
+**Note** The template name used to reference this template in templating is not the value of the **Name** field, but the parameter to `define` tag in the content. When creating a template you can omit `define` entirely and it will be added automatically with same value as **Name** field. It's recommended to use the same name for `define` and **Name** field to avoid confusion.
+
+
+<img  src="/static/img/docs/alerting/unified/templates-create-8-0.png" width="600px">
+
+### Edit a template
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Find the template you want to edit in the templates table and click the **pen icon** on the right side.
+1. Make any changes and click **Save template** button at the bottom of the page.
+
+### Delete a template
+1. In the Grafana side bar, hover your cursor over the **Alerting** (bell) icon and then click **Contact points**.
+1. Find the template you want to edit in the templates table and click the **trash can icon** on the right side.
+1. A confirmation dialog will open. Click **Yes, delete**. 
+
+**Note** You are not prevented from deleting templates that are in use somewhere in contact points or other templates. Be careful!
+
+### Use a template in a contact point field
+
+To use a template:
+
+Enter `{{ template "templatename" . }}` into a contact point field, where `templatename` is the `define` parameter of a template. 
+
+<img  src="/static/img/docs/alerting/unified/contact-points-use-template-8-0.png" width="600px">
+
+
+### Template examples
+
+Here is an example of a template to render a single alert:
+```
+{{ define "alert" }}
+  [{{.Status}}] {{ .Labels.alertname }}
+  
+  Labels:
+  {{ range .Labels.SortedPairs }}
+    {{ .Name }}: {{ .Value }}
+  {{ end }}
+  
+  {{ if gt (len .Annotations) 0 }}
+  Annotations:
+  {{ range .Annotations.SortedPairs }}
+    {{ .Name }}: {{ .Value }}
+  {{ end }}
+  {{ end }}
+
+  {{ if gt (len .SilenceURL ) 0 }}
+    Silence alert: {{ .SilenceURL }}
+  {{ end }}
+  {{ if gt (len .DashboardURL ) 0 }}
+    Go to dashboard: {{ .DashboardURL }}
+  {{ end }}
+{{ end }}
+```
+
+Template to render entire notification message:
+```
+{{ define "message" }}
+  {{ if gt (len .Alerts.Firing) 0 }}
+    {{ len .Alerts.Firing }} firing:
+    {{ range .Alerts.Firing }} {{ template "alert" .}} {{ end }}
+  {{ end }}
+  {{ if gt (len .Alerts.Resolved) 0 }}
+    {{ len .Alerts.Resolved }} resolved:
+    {{ range .Alerts.Resolved }} {{ template "alert" .}} {{ end }}
+  {{ end }}
+{{ end }}
+```
+
+## Manage templates for an external Alertmanager
+
+Grafana alerting UI supports managing external Alertmanager configuration. Once you add an [Alertmanager data source]({{< relref "../../../datasources/alertmanager.md" >}}), a dropdown displays at the top of the page, allowing you to select either `Grafana` or an external Alertmanager data source. 
+
+{{< figure max-width="40%" src="/static/img/docs/alerting/unified/contact-points-select-am-8-0.gif" caption="Select Alertmanager" >}}

docs/sources/alerting/unified-alerting/message-templating/template-data.md

@@ -0,0 +1,75 @@
++++
+title = "Template data"
+keywords = ["grafana", "alerting", "guide", "contact point", "templating"]
++++
+
+
+# Template data
+
+Template data is passed on to [message templates]({{< relref "./_index.md" >}}) as well as sent as payload to webhook pushes.
+
+Name              | Type     | Notes
+------------------|----------|-----------------------------------------------------------------
+Receiver          | string   | Name of the contact point that the notification is being sent to.
+Status            | string   | `firing` if at least one alert is firing, otherwise `resolved`.
+Alerts            | Alert    | List of alert objects that are included in this notification (see below).
+GroupLabels       | KeyValue | Labels these alerts were grouped by.
+CommonLabels      | KeyValue | Labels common to all the alerts included in this notification.
+CommonAnnotations | KeyValue | Annotations common to all the alerts included in this notification.
+ExternalURL       | string   | Back link to the Grafana that sent the notification. If using external Alertmanager, back link to this Alertmanager.
+
+The `Alerts` type exposes functions for filtering alerts:
+
+* `Alerts.Firing` returns a list of firing alerts.
+* `Alerts.Resolved` returns a list of resolved alerts.
+
+## Alert
+
+Name         | Type      | Notes
+-------------|-----------|---------------------------------------------------------------------
+Status       | string    | `firing` or `resolved`.
+Labels       | KeyValue  | A set of labels attached to the alert.
+Annotations  | KeyValue  | A set of annotations attached to the alert.
+StartsAt     | time.Time | Time the alert started firing.
+EndsAt       | time.Time | Only set if the end time of an alert is known. Otherwise set to a configurable timeout period from the time since the last alert was received.
+GeneratorURL | string    | A back link to Grafana or external Alertmanager.
+SilenceURL   | string    | Link to grafana silence for with labels for this alert pre-filled. Only for Grafana managed alerts.
+DashboardURL | string    | Link to grafana dashboard, if alert rule belongs to one. Only for Grafana managed alerts.
+PanelURL     | string    | Link to grafana dashboard panel, if alert rule belongs to one. Only for Grafana managed alerts.
+Fingerprint  | string    | Fingerprint that can be used to identify the alert.
+
+## KeyValue
+
+`KeyValue` is a set of key/value string pairs that represent labels and annotations.
+
+Here is an example containing two annotations:
+
+```json
+{
+  "summary": "alert summary",
+  "description": "alert description"
+}
+```
+
+In addition to direct access of data (labels and annotations) stored as KeyValue, there are also methods for sorting, removing and transforming.
+
+Name        | Arguments | Returns                                 | Notes
+------------|-----------|-----------------------------------------|----------------
+SortedPairs |           | Sorted list of key & value string pairs |
+Remove      | []string  | KeyValue                                | Returns a copy of the Key/Value map without the given keys.
+Names       |           | []string                                | List of label names
+Values      |           | []string                                | List of label values
+
+## Functions
+
+Some functions to transform values are also available, along with [default functions provided by Go templating](https://golang.org/pkg/text/template/#hdr-Functions).
+
+Name         | Arguments                    | Returns
+-------------|------------------------------|----------------------------------------------
+title        | string                       | Capitalizes first character of each word.
+toUpper      | string                       | Converts all characters to upper case.
+match        | pattern, string              | Match a string using RegExp.
+reReplaceAll | pattern, replacement, string | RegExp substitution, unanchored.
+join         | string, []string             | Concatenates the elements of the second argument to create a single string. First argument is the separator. 
+safeHtml     | string                       | Marks string as HTML, not requiring auto-escaping.
+stringSlice  | ...string                    | Returns passed strings as slice of strings.

docs/sources/alerting/unified-alerting/notification-policies.md

@@ -0,0 +1,76 @@
++++
+title = "Notification policies"
+description = "Notification policies"
+keywords = ["grafana", "alerting", "guide", "notification policies", "routes"]
+weight = 400
++++
+
+# Notification policies
+
+Notification policies determine how alerts are routed to contact points. Policies have a tree structure, where each policy can have one or more child policies. Each policy except for the root policy can also match specific alert labels. Each alert enters policy tree at the root and then traverses each child policy. If `Continue matching subsequent sibling nodes` is not checked, it stops at the first matching node, otherwise, it continues matching it's siblings as well. If an alert does not match any children of a policy, the alert is handled based on the configuration settings of this policy and notified to the contact point configured on this policy. Alert that does not match any specific policy is handled by the root policy.
+
+Grafana alerting UI allows you to configure Grafana notification policies as well as notification policies (routes) for an [external Alertmanager if one is configured]({{< relref "../../datasources/alertmanager.md" >}}).
+
+
+## Edit notification policies
+
+To access notification policy editing page, In the Grafana side bar, hover your cursor over the **Alerting (bell)** icon and then click **Notification policies**.
+
+### Edit root notification policy
+
+1. Click **edit** button on the top right of the root policy box.
+1. Make changes and click **save** button. 
+
+### Add new specific policy
+
+To add a top level specific policy, click **New policy** button in the **Specific routing** section, fill in the form and click **Save policy**.
+
+To add a nested policy to an existing specific policy, expand the parent policy in specific routing table and click **Add nested policy**. fill in the form and click **Save policy**.
+
+### Edit specific policy
+
+To edit a specific policy, find it in the specific routing table and click **Edit** button. Make your changes and click **Save policy**.
+
+
+### Root policy fields
+
+- **Default contact point -** The [contact point]({{< relref "./contact-points.md" >}}) to send notifications to that did not match any specific policy.
+- **Group by -** Labels to group alerts by. If multiple alerts are matched for this policy, they will be grouped based on these labels and a notification will be sent per group. Mandatory for root policy, optional for nested specific policies. If a specific policy does not specify own grouping, root policy grouping will be used.
+
+Group timing options
+
+- **Group wait -** - How long to wait to buffer alerts of the same group before sending a notification initially. Default is 30 seconds.
+- **Group interval -** - How long to wait before sending an notification when an alert has been added to a group for which there has already been a notification. Default is 5 minutes.
+- **Repeat interval -** - How long to wait before re-sending a notification after one has already been sent and no new alerts were added to the group. Default is 4 hours.
+
+
+### Specific policy fields
+
+- **Contact point -** The [contact point]({{< relref "./contact-points.md" >}}) to send notification to if alert matched this specific policy but did not match any of it's nested policies, or there were no nested specific policies.
+- **Matching labels -** Rules for matching alert labels. See ["How label matching works"](#how-label-matching-works) below for details.
+- **Continue matching subsequent sibling nodes -** If not enabled and an alert matches this policy but not any of it's nested policies, matching will stop and a notification will be sent to the contact point defined on this policy. If enabled, notification will be sent but alert will continue matching subsequent siblings of this policy, thus sending more than one notification. Use this if for example you want to send notification to a catch-all contact point as well as to one of more specific contact points handled by subsequent policies. 
+- **Override grouping** - Toggle if you want to override grouping for this policy. If toggled, you will be able to specify grouping same as for root policy described above. If not toggled, root policy grouping will be used. 
+- **Override group timings** Toggle if you want to override group timings for this policy. If toggled, you will be able to specify group timings same as for root policy described above. If not toggled, root policy group timings will be used.
+
+
+### How label matching works
+
+A policy will match an alert if alert's labels match all of the "Matching Labels" specified on the policy.
+
+- The **Label** field is the name of the label to match. It must exactly match the label name.
+- The **Value** field matches against the corresponding value for the specified **Label** name. How it matches depends on the **Regex** and **Equal** checkboxes.
+- The **Regex** checkbox specifies if the inputted **Value** should be matched against labels as a regular expression. The regular expression is always anchored. If not selected it is an exact string match.
+- The **Equal** checkbox specifies if the match should include alert instances that match or do not match. If not checked, the silence includes alert instances _do not_ match.
+
+
+## Example setup
+
+One usage example would be:
+* Create a "default" contact point for most alerts with a non invasive contact point type, like a slack message, and set it on root policy
+* Edit root policy grouping to group alerts by `cluster`, `namespace` and `alertname` so you get a notification per alert rule and specific k8s cluster & namespace.
+* Create specific route for alerts coming from development cluster with an appropriate contact point
+* Create a specific route for alerts with "critical" severity with a more invasive contact point type, like pager duty notification
+* Create specific routes for particular teams that handle their own onduty rotations
+
+![Notification policies screenshot](/static/img/docs/alerting/unified/notification-policies-8-0.png 'Notification policies screenshot')
+

docs/sources/alerting/unified-alerting/opt-in.md

@@ -0,0 +1,31 @@
++++
+title = "Opt-in to Grafana 8 Alerts"
+description = "Enable Grafana 8 Alerts"
+weight = 128
++++
+
+# Enable Grafana 8 Alerts
+
+Setting the `ngalert` feature toggle enables the new Grafana 8 alerting system.
+
+>**Note:** It is recommended to backup Grafana's database before enabling this feature. If you are using PostgreSQL as the backend data source, then the minimum required version is 9.5.
+
+At startup, when [the feature toggle is enabled]({{< relref "../../administration/configuration.md">}}#feature_toggles), the legacy Grafana dashboard alerting is disabled and existing dashboard alerts are migrated into a format that is compatible with the Grafana 8 alerting system. You can view these migrated rules, alongside any new alerts you create after the migration, from the Alerting page of your Grafana instance.
+
+Read and write access to dashboard alerts in Grafana versions 7 and earlier were governed by the dashboard and folder permissions under which the alerts were stored. In Grafana 8, alerts are stored in folders and inherit the permissions of those folders. During the migration, dashboard alert permissions are matched to the new rules permissions as follows:
+
+- If alert's dashboard has permissions, it will create a folder named like `Migrated {"dashboardUid": "UID", "panelId": 1, "alertId": 1}` to match permissions of the dashboard (including the inherited permissions from the folder).
+- If there are no dashboard permissions and the dashboard is under a folder, then the rule is linked to this folder and inherits its permissions.
+- If there are no dashboard permissions and the dashboard is under the General folder, then the rule is linked to the `General Alerting` folder and the rule inherits the default permissions.
+
+During beta, Grafana 8 alerting system can retrieve rules from all available Prometheus, Loki, and Alertmanager data sources. It might not be able to fetch rules from all other supported data sources at this time. 
+
+Also notification channels are migrated to an Alertmanager configuration with the appropriate routes and receivers. Default notification channels are added as contact points to the default route. Notification channels not associated with any Dashboard alert go to the `autogen-unlinked-channel-recv` route.
+
+Since `Hipchat` and `Sensu` are discontinued, they are not migrated to the new alerting. If you have dashboard alerts associated with those types of channels and you want to migrate to the new alerting, make sure you assign another supported notification channel, so that you continue to receive notifications for those alerts.
+Finally, silences (expiring after one year) are created for all paused dashboard alerts.
+
+## Disabling Grafana 8 Alerting after migration
+To disable Grafana 8 Alerting, remove or disable the `ngalert` feature toggle. Dashboard alerts will be re-enabled and any alerts created during or after the migration are deleted.
+
+>**Note:** Any alerting rules created in the Grafana 8 Alerting system will be lost when migrating back to dashboard alerts

docs/sources/alerting/unified-alerting/silences.md

@@ -0,0 +1,53 @@
++++
+title = "Silence alert notifications"
+description = "Silence alert notifications"
+keywords = ["grafana", "alerting", "silence", "mute"]
+weight = 400
++++
+
+# Silence alert notifications
+
+Grafana allows to you to prevent notifications from one or more alert rules by creating a silence. This silence lasts for a specified window of time.
+
+Silences do not prevent alert rules from being evaluated. They also do not stop alert instances being shown in the user interface. Silences only prevent notifications from being created.
+
+## Add a silence
+
+To add a silence:
+
+1. In the Grafana menu, hover your cursor over the **Alerting** (bell) icon and then select **Silences** (crossed out bell icon).
+1. Click the **New Silence** button.
+1. Select the start and end date in **Silence start and end** to indicate when the silence should go into effect and expire.
+1. Optionally, update the **Duration** to alter the time for the end of silence in the previous step to correspond to the start plus the duration.
+1. Enter one or more *Matching Labels* by filling out the **Name** and **Value** fields. Matchers determine which rules the silence will apply to.
+1. Enter a **Comment**.
+1. Enter the name of the owner in **Creator**.
+1. Click **Create**.
+
+## How label matching works
+
+Alert instances that have labels that match all of the "Matching Labels" specified in the silence will have their notifications suppressed.
+
+- The **Label** field is the name of the label to match. It must exactly match the label name.
+- The **Value** field matches against the corresponding value for the specified **Label** name. How it matches depends on the **Regex** and **Equal** checkboxes.
+- The **Regex** checkbox specifies if the inputted **Value** should be matched against labels as a regular expression. The regular expression is always anchored. If not selected it is an exact string match.
+- The **Equal** checkbox specifies if the match should include alert instances that match or do not match. If not checked, the silence includes alert instances _do not_ match.
+
+## Viewing and editing silences
+
+1. In the Grafana menu hover your cursor over the **Alerting** (bell) icon, then select **Silences** (crossed out bell icon).
+1. To end the silence, click the **Unsilence** option next to the listed silence. Silences that have ended are still listed and are automatically removed after 5 days. There is no method for manual removal.
+1. To edit a silence, click the pencil icon next to the listed silence. Edit the silence using instructions on how to create a silence.
+1. Click **Submit** to save your changes.
+
+## Manage silences for an external Alertmanager
+
+Grafana alerting UI supports managing external Alertmanager silences. Once you add an [Alertmanager data source]({{< relref "../../datasources/alertmanager.md" >}}), a dropdown displays at the top of the page where you can select either `Grafana` or an external Alertmanager as your data source. 
+
+## Create a URL to silence form with defaults filled in
+
+When linking to silence form, you can provide default matching labels and comment via `matchers` and `comment` query parameters. `matchers` expects one more matching labels of type `[label][operator][value]` joined by a comma. `operator` can be one of `=` (equals, not regex), `!=` (not equals, not regex), `=~` (equals, regex), `!~` (not equals, not regex).
+
+For example, to link to silence form with matching labels `severity=critical` & `cluster!~europe-.*` and comment `Silence critical EU alerts`, create a URL `https://mygrafana/aleting/silence/new?matchers=severity%3Dcritical%2Ccluster!~europe-*&comment=Silence%20critical%20EU%20alert`. 
+
+To link to a new silence page for an [external Alertmanager]({{< relref "../../datasources/alertmanager.md" >}}), add a `alertmanager` query parameter with the Alertmanager data source name.

docs/sources/auth/ldap.md

@@ -100,7 +100,7 @@ Grafana has an LDAP debug view built-in which allows you to test your LDAP confi
 
 Within this view, you'll be able to see which LDAP servers are currently reachable and test your current configuration.
 
-{{< docs-imagebox img="/img/docs/ldap_debug.png" class="docs-image--no-shadow" max-width="600px" >}}
+{{< figure src="/static/img/docs/ldap_debug.png" class="docs-image--no-shadow" max-width="600px" >}}
 
 
 To use the debug view:
@@ -109,7 +109,7 @@ To use the debug view:
  1. Then, press "Run"
  1. If the user is found within any of your LDAP instances, the mapping information is displayed
 
-{{< docs-imagebox img="/img/docs/ldap_debug_mapping_testing.png" class="docs-image--no-shadow" max-width="600px" >}}
+{{< figure src="/static/img/docs/ldap_debug_mapping_testing.png" class="docs-image--no-shadow" max-width="600px" >}}
 
 ### Bind
 

docs/sources/auth/team-sync.md

@@ -12,7 +12,7 @@ With Team Sync, you can set up synchronization between your auth provider's team
 of certain teams/groups to automatically be added/removed as members to certain teams in Grafana. Currently the synchronization will only happen every
 time a user logs in, unless LDAP is used together with active background synchronization that was added in Grafana 6.3.
 
-{{< docs-imagebox img="/img/docs/enterprise/team_members_ldap.png" class="docs-image--no-shadow docs-image--right" max-width= "600px" >}}
+{{< figure src="/static/img/docs/enterprise/team_members_ldap.png" class="docs-image--no-shadow docs-image--right" max-width= "600px" >}}
 
 Grafana keeps track of all synchronized users in teams and you can see which users have been synchronized in the team members list, see `LDAP` label in screenshot.
 This mechanism allows Grafana to remove an existing synchronized user from a team when its LDAP group membership (for example) changes. This mechanism also enables you to manually add a user as member of a team and it will not be removed when the user signs in. This gives you flexibility to combine LDAP group memberships and Grafana team memberships.

docs/sources/basics/exemplars/_index.md

@@ -11,14 +11,14 @@ An exemplar is a specific trace representative of a repeated pattern of data in
 
 Suppose your company website is experiencing a surge in traffic volumes. While more than eighty percent of the users are able to access the website in under two seconds, some users are experiencing a higher than normal response time resulting in bad user experience
 
-To identify the factors that are contributing to the latency, you must compare a trace for a fast response against a trace for a slow response. Given the vast amount of data in a typical production environment, it will be extremely laborious and time-consuming effort. 
+To identify the factors that are contributing to the latency, you must compare a trace for a fast response against a trace for a slow response. Given the vast amount of data in a typical production environment, it will be extremely laborious and time-consuming effort.
 
 Use exemplars to help isolate problems within your data distribution by pinpointing query traces exhibiting high latency within a time interval. Once you localize the latency problem to a few exemplar traces, you can combine it with additional system based information or location properties to perform a root cause analysis faster, leading to quick resolutions to performance issues.
 
 Support for exemplars is available for the Prometheus data source only. Once you enable the functionality, exemplars data is available by default. For more information on exemplar configuration and how to enable exemplars, refer to [configuring exemplars in Prometheus data source]({{< relref "../../datasources/prometheus.md#configuring-exemplars" >}}).
 
-Grafana shows exemplars alongside a metric in the Explore view and in dashboards. Each exemplar displays as a highlighted star. You can hover your cursor over an exemplar to view the unique traceID, which is a combination of a key value pair. To investigate further, click the blue button next to the `traceID` property. 
+Grafana shows exemplars alongside a metric in the Explore view and in dashboards. Each exemplar displays as a highlighted star. You can hover your cursor over an exemplar to view the unique traceID, which is a combination of a key value pair. To investigate further, click the blue button next to the `traceID` property.
 
-{{< docs-imagebox img="/img/docs/v74/exemplars.png" class="docs-image--no-shadow" max-width= "750px" caption="Screenshot showing the detail window of an Exemplar" >}}
+{{< figure src="/static/img/docs/v74/exemplars.png" class="docs-image--no-shadow" max-width= "750px" caption="Screenshot showing the detail window of an Exemplar" >}}
 
 Refer to [View exemplar data]({{< relref "./view-exemplars.md" >}}) for instructions on how to drill down and view exemplar trace details from metrics and logs. To know more about exemplars, refer to the blogpost [Intro to exemplars, which enable Grafana Tempo’s distributed tracing at massive scale](https://grafana.com/blog/2021/03/31/intro-to-exemplars-which-enable-grafana-tempos-distributed-tracing-at-massive-scale/).

docs/sources/basics/exemplars/view-exemplars.md

@@ -7,7 +7,7 @@ weight = 400
 
 # View exemplar data
 
-When support for exemplar support is enabled for a Prometheus data source, you can view exemplar data either in the Explore view or from the Loki log details. 
+When support for exemplar support is enabled for a Prometheus data source, you can view exemplar data either in the Explore view or from the Loki log details.
 
 ## In Explore
 
@@ -15,13 +15,13 @@ Explore visualizes exemplar traces as highlighted stars alongside metrics data.
 
 To examine the details of an exemplar trace:
 
-1. Place your cursor over an exemplar (highlighted star). Depending on your backend trace data source, you will see a blue button with the label `Query with <data source name>`. In the following example, the tracing data source is Tempo. 
+1. Place your cursor over an exemplar (highlighted star). Depending on your backend trace data source, you will see a blue button with the label `Query with <data source name>`. In the following example, the tracing data source is Tempo.
 
-    {{< docs-imagebox img="/img/docs/basics/exemplar-details.png" class="docs-image--no-shadow" max-width= "275px" caption="Screenshot showing Exemplar details" >}}
+    {{< figure src="/static/img/docs/basics/exemplar-details.png" class="docs-image--no-shadow" max-width= "275px" caption="Screenshot showing Exemplar details" >}}
 
 1. Click the **Query with Tempo** option next to the `traceID` property. The trace details, including the spans within the trace are listed in a separate panel on the right.
 
-    {{< docs-imagebox img="/img/docs/basics/exemplar-explore-view.png" class="docs-image--no-shadow" max-width= "750px" caption="Explorer view with panel showing trace details" >}}
+    {{< figure src="/static/img/docs/basics/exemplar-explore-view.png" class="docs-image--no-shadow" max-width= "750px" caption="Explorer view with panel showing trace details" >}}
 
 For more information on how to drill down and analyze the trace and span details, refer to the [Analyze trace and span details](#analyze-trace-and-spans) section.
 
@@ -32,32 +32,32 @@ You can also view exemplar trace details from the Loki logs in Explore. Use rege
 
 To view the details of an exemplar trace:
 
-1. Expand a log line and scroll down to the `Detected fields` section. Depending on your backend trace data source, you will see a blue button with the label `<data source name>`. 
+1. Expand a log line and scroll down to the `Detected fields` section. Depending on your backend trace data source, you will see a blue button with the label `<data source name>`.
 
 1. Click the blue button next to the `traceID` property. Typically, it will have the name of the backend data source. In the following example, the tracing data source is Tempo. The trace details, including the spans within the trace are listed in a separate panel on the right.
 
-{{< docs-imagebox img="/img/docs/basics/exemplar-loki-logs.png" class="docs-image--no-shadow" max-width= "750px" caption="Explorer view with panel showing trace details" >}}
+{{< figure src="/static/img/docs/basics/exemplar-loki-logs.png" class="docs-image--no-shadow" max-width= "750px" caption="Explorer view with panel showing trace details" >}}
 
 For more information on how to drill down and analyze the trace and span details, refer to the [Analyze trace and span details](#analyze-trace-and-spans) section.
- 
+
  ## Analyze trace and spans
 
- This panel shows the details of the trace in different segments. 
- 
- - The top segment shows the Trace ID to indicate that the query results correspond to the specific trace. 
+ This panel shows the details of the trace in different segments.
+
+ - The top segment shows the Trace ID to indicate that the query results correspond to the specific trace.
 
     You can add more traces to the results using the `Add query` button.
-    
+
 - The next segment shows the entire span for the specific trace as a narrow strip. All levels of the trace from the client all the way down to database query is displayed, which provides a bird's eye view of the time distribution across all layers over which the HTTP request was processed.
 
     1. You can click within this strip view to display a magnified view of a smaller time segment within the span. This magnified view shows up in the bottom segment of the panel.
 
-    1. In the magnified view, you can expand or collapse the various levels of the trace to drill down to the specific span of interest. 
+    1. In the magnified view, you can expand or collapse the various levels of the trace to drill down to the specific span of interest.
 
         For example, if the strip view shows that most of the latency was within the app layer, you can expand the trace down the app layer to investigate the problem further. To expand a particular layer of span, click the icon on the left. The same button can collapse an expanded span.
 
-- To see the details of the span at any level, click the span itself. 
+- To see the details of the span at any level, click the span itself.
 
     This displays additional metadata associated with the span. The metadata itself is initially shown in a narrow strip but you can see more details by clicking the metadata strip.
 
-    {{< docs-imagebox img="/img/docs/basics/exemplar-span-details.png" class="docs-image--no-shadow" max-width= "750px" caption="Span details" >}}
+    {{< figure src="/static/img/docs/basics/exemplar-span-details.png" class="docs-image--no-shadow" max-width= "750px" caption="Span details" >}}

docs/sources/basics/intro-histograms.md

@@ -16,13 +16,18 @@ and the bar height represents the frequency (such as count) of values that fell
 
 ## Histogram example
 
-This histogram shows the value distribution of a couple of time series. You can easily see that
+This _histogram_ shows the value distribution of a couple of time series. You can easily see that
 most values land between 240-300 with a peak between 260-280.
 
-![](/img/docs/v43/heatmap_histogram.png)
+![](/static/img/docs/v43/heatmap_histogram.png)
 
-Histograms only look at _value distributions_ over a specific time range. The problem with histograms is you cannot see any trends or changes in the distribution over time.
-This is where heatmaps become useful.
+Here is an example showing height distribution of people.
+
+{{< figure src="/static/img/docs/histogram-panel/histogram-example-v8-0.png" max-width="625px" caption="Bar chart example" >}}
+
+For more information about histogram visualization options, refer to [Histogram]({{< relref "../panels/visualizations/histogram.md" >}}).
+
+Histograms only look at _value distributions_ over a specific time range. The problem with histograms is you cannot see any trends or changes in the distribution over time. This is where heatmaps become useful.
 
 ## Heatmaps
 
@@ -30,7 +35,9 @@ A _heatmap_ is like a histogram, but over time where each time slice represents
 
 In this example, you can clearly see what values are more common and how they trend over time.
 
-![](/img/docs/v43/heatmap_histogram_over_time.png)
+![](/static/img/docs/v43/heatmap_histogram_over_time.png)
+
+For more information about heatmap visualization options, refer to [Heatmap]({{< relref "../panels/visualizations/heatmap.md" >}}).
 
 ## Pre-bucketed data
 

docs/sources/basics/timeseries-dimensions.md

@@ -14,7 +14,7 @@ In [Introduction to time series]({{< relref "timeseries.md#time-series-databases
 
 With time series data, the data often contain more than a single series, and is a set of multiple time series. Many Grafana data sources support this type of data.
 
-{{< docs-imagebox img="/img/docs/example_graph_multi_dim.png" class="docs-image--no-shadow" max-width="850px" >}}
+{{< figure src="/static/img/docs/example_graph_multi_dim.png" class="docs-image--no-shadow" max-width="850px" >}}
 
 The common case is issuing a single query for a measurement with one or more additional properties as dimensions. For example, querying a temperature measurement along with a location property. In this case, multiple series are returned back from that single query and each series has unique location as a dimension.
 
@@ -76,7 +76,7 @@ In this case the labels that represent the dimensions will have two keys based o
 
 > **Note:** More than one dimension is currently only supported in the Logs queries within the Azure Monitor service as of version 7.1.
 
-> **Note:** Multiple dimensions are not supported in a way that maps to multiple alerts in Grafana, but rather they are treated as multiple conditions to a single alert. See the documentation on [creating alerts with multiple series]({{< relref "../alerting/create-alerts.md#multiple-series" >}}).
+> **Note:** Multiple dimensions are not supported in a way that maps to multiple alerts in Grafana, but rather they are treated as multiple conditions to a single alert. See the documentation on [creating alerts with multiple series]({{< relref "../alerting/old-alerting/create-alerts.md#multiple-series" >}}).
 
 ### Multiple values
 

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
@@ -19,7 +19,7 @@ Temperature data like this is one example of what we call a *time series*—a se
 
 Tables are useful when you want to identify individual measurements but make it difficult to see the big picture. A more common visualization for time series is the _graph_, which instead places each measurement along a time axis. Visual representations like the graph make it easier to discover patterns and features of the data that otherwise would be difficult to see.
 
-{{< docs-imagebox img="/img/docs/example_graph.png" class="docs-image--no-shadow" max-width="850px" >}}
+{{< figure src="/static/img/docs/example_graph.png" class="docs-image--no-shadow" max-width="850px" >}}
 
 Temperature data like the one in the example, is far from the only example of a time series. Other examples of time series are:
 

docs/sources/best-practices/dashboard-management-maturity-levels.md

@@ -38,11 +38,11 @@ How can you tell you are here?
 - Methodical dashboards according to an [observability strategy]({{< relref "common-observability-strategies.md" >}}).
 - Hierarchical dashboards with drill-downs to the next level.
 
-  {{< imgbox max-width="100%" img="/img/docs/best-practices/drill-down-example.png" caption="Example of using drill-down" >}}
+  {{< figure class="float-right"  max-width="100%" src="/static/img/docs/best-practices/drill-down-example.png" caption="Example of using drill-down" >}}
 
 - Dashboard design reflects service hierarchies. The example shown below uses the RED method (request and error rate on the left, latency duration on the right) with one row per service. The row order reflects the data flow.
 
-  {{< imgbox max-width="100%" img="/img/docs/best-practices/service-hierarchy-example.png" caption="Example of a service hierarchy" >}}
+  {{< figure class="float-right"  max-width="100%" src="/static/img/docs/best-practices/service-hierarchy-example.png" caption="Example of a service hierarchy" >}}
 
 - Compare like to like: split service dashboards when the magnitude differs. Make sure aggregated metrics don't drown out important information.
 - Expressive charts with meaningful use of color and normalizing axes where you can.

docs/sources/dashboards/_index.md

@@ -10,7 +10,7 @@ A _dashboard_ is a set of one or more panels organized and arranged into one or
 
 ## Dashboard UI
 
-<img src="/img/docs/v50/dashboard_annotated.png" class="no-shadow" width="700px">
+<img src="/static/img/docs/v50/dashboard_annotated.png" class="no-shadow" width="700px">
 
 1. Zoom out time range
 1. Time picker dropdown. Here you can access relative time range options, auto refresh options and set custom absolute time ranges.
@@ -22,7 +22,7 @@ A _dashboard_ is a set of one or more panels organized and arranged into one or
 
 Click the new Dashboard link on the right side of the Dashboard picker. You now have a blank Dashboard.
 
-<img class="no-shadow" src="/img/docs/v50/top_nav_annotated.png" width="580px">
+<img class="no-shadow" src="/static/img/docs/v50/top_nav_annotated.png" width="580px">
 
 The image above shows you the top header for a Dashboard.
 

docs/sources/dashboards/annotations.md

@@ -7,7 +7,7 @@ weight = 2
 
 # Annotations
 
-{{< docs-imagebox img="/img/docs/v46/annotations.png" max-width="800px" >}}
+{{< figure src="/static/img/docs/v46/annotations.png" max-width="800px" >}}
 
 Annotations provide a way to mark points on the graph with rich events. When you hover over an annotation
 you can get event description and event tags. The text field can include links to other systems with more detail.
@@ -20,17 +20,17 @@ Grafana comes with a native annotation store and the ability to add annotation e
 
 By holding down Ctrl/Cmd+Click. Adding tags to the annotation will make it searchable from other dashboards.
 
-{{< docs-imagebox img="/img/docs/annotations/annotation-still.png"
-max-width="600px" animated-gif="/img/docs/annotations/annotation.gif" >}}
+{{< figure src="/static/img/docs/annotations/annotation-still.png"
+max-width="600px" animated-gif="/static/img/docs/annotations/annotation.gif" >}}
 
 ### Adding regions events
 
 You can also hold down Ctrl/Cmd and select region to create a region annotation.
 
-{{< docs-imagebox img="/img/docs/annotations/region-annotation-still.png"
-max-width="600px" animated-gif="/img/docs/annotations/region-annotation.gif" >}}
+{{< figure src="/static/img/docs/annotations/region-annotation-still.png"
+max-width="600px" animated-gif="/static/img/docs/annotations/region-annotation.gif" >}}
 
-### Built in query
+### Built-in query
 
 After you added an annotation they will still be visible. This is due to the built in annotation query that exists on all dashboards. This annotation query will
 fetch all annotation events that originate from the current dashboard and show them on the panel where they were created. This includes alert state history annotations. You can
@@ -46,7 +46,7 @@ one tag. For example create an annotation query name `outages` and specify a tag
 
 In Grafana v5.3+ it's possible to use template variables in the tag query. So if you have a dashboard showing stats for different services and a template variable that dictates which services to show, you can now use the same template variable in your annotation query to only show annotations for those services.
 
-{{< docs-imagebox img="/img/docs/v53/annotation_tag_filter_variable.png" max-width="600px" >}}
+{{< figure src="/static/img/docs/v53/annotation_tag_filter_variable.png" max-width="600px" >}}
 
 ## Querying other data sources
 
@@ -54,8 +54,8 @@ Annotation events are fetched via annotation queries. To add a new annotation qu
 open the dashboard settings menu, then select `Annotations`. This will open the dashboard annotations
 settings view. To create a new annotation query hit the `New` button.
 
-<!--![](/img/docs/v50/annotation_new_query.png)-->
-{{< docs-imagebox img="/img/docs/v50/annotation_new_query.png" max-width="600px" >}}
+<!--![](/static/img/docs/v50/annotation_new_query.png)-->
+{{< figure src="/static/img/docs/v50/annotation_new_query.png" max-width="600px" >}}
 
 Specify a name for the annotation query. This name is given to the toggle (checkbox) that will allow
 you to enable/disable showing annotation events from this query. For example you might have two

docs/sources/dashboards/dashboard_folders.md

@@ -21,7 +21,7 @@ On the Create Folder page, fill in a unique name for the folder and then click C
 
 ## Manage Dashboards
 
-{{< docs-imagebox img="/img/docs/v50/manage_dashboard_menu.png" max-width="300px" class="docs-image--right" >}}
+{{< figure src="/static/img/docs/v50/manage_dashboard_menu.png" max-width="300px" class="docs-image--right" >}}
 
 There is a new Manage Dashboards page where you can carry out a variety of tasks:
 

docs/sources/dashboards/dashboard_history.md

@@ -10,7 +10,7 @@ weight = 100
 
 Whenever you save a version of your dashboard, a copy of that version is saved so that previous versions of your dashboard are never lost. A list of these versions is available by entering the dashboard settings and then selecting "Versions" in the left side menu.
 
-<img class="no-shadow" src="/img/docs/v50/dashboard_versions_list.png">
+<img class="no-shadow" src="/static/img/docs/v50/dashboard_versions_list.png">
 
 The dashboard version history feature lets you compare and restore to previously saved dashboard versions.
 
@@ -18,11 +18,11 @@ The dashboard version history feature lets you compare and restore to previously
 
 To compare two dashboard versions, select the two versions from the list that you wish to compare. Once selected, the "Compare versions" button will become clickable. Click the button to view the diff between the two versions.
 
-<img class="no-shadow" src="/img/docs/v50/dashboard_versions_select.png">
+<img class="no-shadow" src="/static/img/docs/v50/dashboard_versions_select.png">
 
 Upon clicking the button, you'll be brought to the diff view. By default, you'll see a textual summary of the changes, like in the image below.
 
-<img class="no-shadow" src="/img/docs/v50/dashboard_versions_diff_basic.png">
+<img class="no-shadow" src="/static/img/docs/v50/dashboard_versions_diff_basic.png">
 
 If you want to view the diff of the raw JSON that represents your dashboard, you can do that as well by clicking the "View JSON Diff" button at the bottom.
 
@@ -32,6 +32,6 @@ If you want to restore to the version you are diffing against, you can do so by
 
 If you need to restore to a previously saved dashboard version, you can do so by either clicking the "Restore" button on the right of a row in the dashboard version list, or by clicking the "Restore to version \<x\>" button appearing in the diff view. Clicking the button will bring up the following popup prompting you to confirm the restoration.
 
-<img class="no-shadow" src="/img/docs/v50/dashboard_versions_restore.png">
+<img class="no-shadow" src="/static/img/docs/v50/dashboard_versions_restore.png">
 
 After restoring to a previous version, a new version will be created containing the same exact data as the previous version, only with a different version number. This is indicated in the "Notes column" for the row in the new dashboard version. This is done simply to ensure your previous dashboard versions are not affected by the change.

docs/sources/dashboards/export-import.md

@@ -15,7 +15,7 @@ Dashboards are exported in Grafana JSON format, and contain everything you need
 
 The export feature is accessed in the share window which you open by clicking the share button in the dashboard menu.
 
-{{< docs-imagebox img="/img/docs/export/export-modal.png" max-width="800px" >}}
+{{< figure src="/static/img/docs/export/export-modal.png" max-width="800px" >}}
 
 ### Making a dashboard portable
 
@@ -25,16 +25,16 @@ add template variables for things like a metric prefix (use constant variable) a
 A template variable of the type `Constant` will automatically be hidden in
 the dashboard, and will also be added as a required input when the dashboard is imported.
 
-## Importing a dashboard
+## Import dashboard
 
 To import a dashboard click the + icon in the side menu, and then click **Import**.
 
-{{< docs-imagebox img="/img/docs/v70/import_step1.png" max-width="700px" >}}
+{{< figure src="/static/img/docs/v70/import_step1.png" max-width="700px" >}}
 
 From here you can upload a dashboard JSON file, paste a [Grafana.com](https://grafana.com) dashboard
 URL or paste dashboard JSON text directly into the text area.
 
-{{< docs-imagebox img="/img/docs/v70/import_step2_grafana.com.png"  max-width="700px" >}}
+{{< figure src="/static/img/docs/v70/import_step2_grafana.com.png"  max-width="700px" >}}
 
 In step 2 of the import process Grafana will let you change the name of the dashboard, pick what
 data source you want the dashboard to use and specify any metric prefixes (if the dashboard use any).
@@ -43,7 +43,7 @@ data source you want the dashboard to use and specify any metric prefixes (if th
 
 Find dashboards for common server applications at [Grafana.com/dashboards](https://grafana.com/dashboards).
 
-{{< docs-imagebox img="/img/docs/v50/gcom_dashboard_list.png" max-width="700px" >}}
+{{< figure src="/static/img/docs/v50/gcom_dashboard_list.png" max-width="700px" >}}
 
 ## Import and sharing with Grafana 2.x or 3.0
 

docs/sources/dashboards/playlist.md

@@ -14,7 +14,7 @@ Grafana automatically scales dashboards to any resolution, which makes them perf
 
 You can access the Playlist feature from Grafana's side menu, in the Dashboards submenu.
 
-{{< docs-imagebox img="/img/docs/v50/playlist.png" max-width="25rem">}}
+{{< figure src="/static/img/docs/v50/playlist.png" max-width="25rem">}}
 
 ## Create a playlist
 

docs/sources/dashboards/reporting.md

@@ -10,6 +10,6 @@ weight = 8
 
 Reporting allows you to generate PDFs from any of your dashboards and have them sent out to interested parties on a schedule.
 
-{{< docs-imagebox img="/img/docs/enterprise/reports_list.png" max-width="500px" class="docs-image--no-shadow" >}}
+{{< figure src="/static/img/docs/enterprise/reports_list.png" max-width="500px" class="docs-image--no-shadow" >}}
 
 > Reporting is only available in Grafana Enterprise, v6.4 or later. For more information, refer to [Reporting]({{< relref "../enterprise/reporting.md" >}}) in [Grafana Enterprise]({{< relref "../enterprise" >}}).

docs/sources/dashboards/search.md

@@ -10,7 +10,7 @@ weight = 5
 
 Dashboards can be searched by the dashboard name, filtered by one (or many) tags or filtered by starred status. The dashboard search is accessed through the dashboard picker, available in the dashboard top nav area. The dashboard search can also be opened by using the shortcut `F`.
 
-<img class="no-shadow" src="/img/docs/v50/dashboard_search_annotated.png" width="700px">
+<img class="no-shadow" src="/static/img/docs/v50/dashboard_search_annotated.png" width="700px">
 
 1. `Search Bar`: The search bar allows you to enter any string and search both database and file based dashboards in real-time.
 1. `Starred`: Here you find all your starred dashboards.

docs/sources/dashboards/time-range-controls.md

@@ -37,7 +37,7 @@ Here are some examples:
 
 The dashboard and panel time controls have a common user interface (UI).
 
-<img class="no-shadow" src="/img/docs/time-range-controls/common-time-controls-7-0.png" max-width="700px">
+<img class="no-shadow" src="/static/img/docs/time-range-controls/common-time-controls-7-0.png" max-width="700px">
 
 The options are defined below.
 
@@ -47,11 +47,11 @@ The current time range, also called the _time picker_, shows the time range curr
 
 Hover your cursor over the field to see the exact time stamps in the range and their source (such as the local browser).
 
-<img class="no-shadow" src="/img/docs/time-range-controls/time-picker-7-0.png" max-width="300px">
+<img class="no-shadow" src="/static/img/docs/time-range-controls/time-picker-7-0.png" max-width="300px">
 
 Click on the current time range to change the time range. You can change the current time using a _relative time range_, such as the last 15 minutes, or an _absolute time range_, such as `2020-05-14 00:00:00 to 2020-05-15 23:59:59`.
 
-<img class="no-shadow" src="/img/docs/time-range-controls/change-current-time-range-7-0.png" max-width="900px">
+<img class="no-shadow" src="/static/img/docs/time-range-controls/change-current-time-range-7-0.png" max-width="900px">
 
 ### Relative time range
 

docs/sources/datasources/_index.md

@@ -16,6 +16,7 @@ Each data source has a specific Query Editor that is customized for the features
 
 The following data sources are officially supported:
 
+- [Alertmanager]({{< relref "alertmanager.md" >}})
 - [AWS CloudWatch]({{< relref "cloudwatch.md" >}})
 - [Azure Monitor]({{< relref "azuremonitor.md" >}})
 - [Elasticsearch]({{< relref "elasticsearch.md" >}})

docs/sources/datasources/add-a-data-source.md

@@ -13,21 +13,21 @@ Before you can create your first dashboard, you need to add your data source.
 To add a data source:
 
 1. Move your cursor to the cog icon on the side menu which will show the configuration options.
-   
-    {{< docs-imagebox img="/img/docs/v75/sidemenu-datasource-7-5.png" max-width="150px" class="docs-image--no-shadow">}}
+
+    {{< figure src="/static/img/docs/v75/sidemenu-datasource-7-5.png" max-width="150px" class="docs-image--no-shadow">}}
 
 1. Click on **Data sources**. The data sources page opens showing a list of previously configured data sources for the Grafana instance.
 
 1. Click **Add data source** to see a list of all supported data sources.
-   
-    {{< docs-imagebox img="/img/docs/v75/add-data-source-7-5.png" max-width="600px" class="docs-image--no-shadow">}}
-   
+
+    {{< figure src="/static/img/docs/v75/add-data-source-7-5.png" max-width="600px" class="docs-image--no-shadow">}}
+
 1. Search for a specific data source by entering the name in the search dialog. Or you can scroll through supported data sources grouped into time series, logging, tracing and other categories.
 
 1. Move the cursor over the data source you want to add.
 
-    {{< docs-imagebox img="/img/docs/v75/select-data-source-7-5.png" max-width="700px" class="docs-image--no-shadow">}}
-   
+    {{< figure src="/static/img/docs/v75/select-data-source-7-5.png" max-width="700px" class="docs-image--no-shadow">}}
+
 1. Click **Select**. The data source configuration page opens.
 
 1. Configure the data source following instructions specific to that data source. See [Data sources]({{< relref "_index.md" >}}) for links to configuration instructions for all supported data sources.

docs/sources/datasources/alertmanager.md

@@ -0,0 +1,35 @@
++++
+title = "Alertmanager"
+description = "Guide for using Alertmanager in Grafana"
+keywords = ["grafana", "prometheus", "guide"]
+aliases = ["/docs/grafana/latest/features/datasources/alertmanager"]
+weight = 1300
++++
+
+# Alertmanager data source
+
+Grafana includes built-in support for Prometheus Alertmanager. It is presently in alpha and not accessible unless [alpha plugins are enabled in Grafana settings](https://grafana.com/docs/grafana/latest/administration/configuration/#enable_alpha). Once you add it as a data source, you can use the [Grafana alerting UI](https://grafana.com/docs/grafana/latest/alerting/) to manage silences, contact points as well as notification policies. A drop down option in these pages allows you to switch between Grafana and any configured Alertmanager data sources .
+
+>**Note:** New in Grafana 8.0.
+
+>**Note:** Currently only the [Cortex implementation of Prometheus alertmanager](https://cortexmetrics.io/docs/proposals/scalable-alertmanager/) is supported. 
+
+## Provision the Alertmanager data source
+
+Configure the Alertmanager data sources by updating Grafana's configuration files. For more information on how it works and the settings available, refer to the [provisioning docs page]({{< relref "../administration/provisioning/#datasources" >}}).
+
+Here is an example for provisioning the Alertmanager data source:
+
+```yaml
+apiVersion: 1
+
+datasources:
+  - name: Alertmanager
+    type: alertmanager
+    url: http://localhost:9090
+    access: proxy
+    # optionally
+    basicAuth: true
+    basicAuthUser: my_user
+    basicAuthPassword: test_password
+```

docs/sources/datasources/azuremonitor.md

@@ -10,24 +10,22 @@ weight = 300
 
 The Azure Monitor data source supports multiple services in the Azure cloud:
 
-- **[Azure Monitor Metrics]({{< relref "#querying-the-azure-monitor-service" >}})** (or Metrics) is the platform service that provides a single source for monitoring Azure resources.
-- **[Azure Monitor Logs]({{< relref "#querying-the-azure-log-analytics-service" >}})** (or Logs) gives you access to log data collected by Azure Monitor.
-- **[Application Insights]({{< relref "#querying-the-application-insights-service" >}})** is an extensible Application Performance Management (APM) service for web developers on multiple platforms and can be used to monitor your live web application - it will automatically detect performance anomalies.
-- **[Application Insights Analytics]({{< relref "#query-the-application-insights-analytics-service" >}})** allows you to query [Application Insights data](https://docs.microsoft.com/en-us/azure/azure-monitor/app/analytics) using the same query language used for Azure Log Analytics.
+- **[Azure Monitor Metrics]({{< relref "#query-the-metrics-service" >}})** (or Metrics) is the platform service that provides a single source for monitoring Azure resources.
+- **[Azure Monitor Logs]({{< relref "#query-the-logs-service" >}})** (or Logs) gives you access to log data collected by Azure Monitor.
+- **[Azure Resource Graph]({{< relref "#query-the-azure-resource-graph-service" >}})** allows you to query the resources on your Azure subscription.
 
 ## Add the data source
 
-The data source can access metrics from four different services. You can configure access to the services that you use. It is also possible to use the same credentials for multiple services if that is how you have set it up in Azure AD.
+The Azure Monitor data source can access metrics from three different services. Configure access to the services that you plan to use. To use different credentials for different Azure services, configure multiple Azure Monitor data sources.
 
 - [Guide to setting up an Azure Active Directory Application for Azure Monitor.](https://docs.microsoft.com/en-us/azure/azure-resource-manager/resource-group-create-service-principal-portal)
 - [Guide to setting up an Azure Active Directory Application for Azure Monitor Logs.](https://dev.loganalytics.io/documentation/Authorization/AAD-Setup)
-- [Quickstart Guide for Application Insights.](https://dev.applicationinsights.io/quickstart/)
 
 1. Accessed from the Grafana main menu, newly installed data sources can be added immediately within the Data Sources section. Next, click the "Add data source" button in the upper right. The Azure Monitor data source will be available for selection in the Cloud section in the list of data sources.
 
 1. In the name field, Grafana will automatically fill in a name for the data source - `Azure Monitor` or something like `Azure Monitor - 3`. If you are going to configure multiple data sources, then change the name to something more informative.
 
-1. If you are using Azure Monitor, you need 4 pieces of information from the Azure portal (see link above for detailed instructions):
+1. Fill in the Azure AD App Registration details:
 
    - **Tenant Id** (Azure Active Directory -> Properties -> Directory ID)
    - **Client Id** (Azure Active Directory -> App Registrations -> Choose your app -> Application ID)
@@ -35,25 +33,12 @@ The data source can access metrics from four different services. You can configu
    - **Default Subscription Id** (Subscriptions -> Choose subscription -> Overview -> Subscription ID)
 
 1. Paste these four items into the fields in the Azure Monitor API Details section:
-   {{< docs-imagebox img="/img/docs/v62/config_1_azure_monitor_details.png" class="docs-image--no-shadow" caption="Azure Monitor Configuration Details" >}}
+   {{< figure src="/static/img/docs/v62/config_1_azure_monitor_details.png" class="docs-image--no-shadow" caption="Azure Monitor Configuration Details" >}}
 
    - The Subscription Id can be changed per query. Save the data source and refresh the page to see the list of subscriptions available for the specified Client Id.
 
-1. If you are also using the Azure Monitor Logs service, then you need to specify these two configuration values (or you can reuse the Client Id and Secret from the previous step).
-
-   - Client Id (Azure Active Directory -> App Registrations -> Choose your app -> Application ID)
-   - Client Secret (Azure Active Directory -> App Registrations -> Choose your app -> Keys -> Create a key -> Use client secret)
-
-1. If you are using Application Insights, then you need two pieces of information from the Azure Portal (see link above for detailed instructions):
-
-   - Application ID
-   - API Key
-
-1. Paste these two items into the appropriate fields in the Application Insights API Details section:
-   {{< docs-imagebox img="/img/docs/v62/config_2_app_insights_api_details.png" class="docs-image--no-shadow" caption="Application Insights Configuration Details" >}}
-
 1. Test that the configuration details are correct by clicking on the "Save & Test" button:
-   {{< docs-imagebox img="/img/docs/v62/config_3_save_and_test.png" class="docs-image--no-shadow" caption="Save and Test" >}}
+   {{< figure src="/static/img/docs/v62/config_3_save_and_test.png" class="docs-image--no-shadow" caption="Save and Test" >}}
 
 Alternatively on step 4 if creating a new Azure Active Directory App, use the [Azure CLI](https://docs.microsoft.com/en-us/cli/azure/?view=azure-cli-latest):
 
@@ -63,19 +48,15 @@ az ad sp create-for-rbac -n "http://localhost:3000"
 
 ## Choose a Service
 
-In the query editor for a panel, after choosing your Azure Monitor data source, the first option is to choose a service. There are four options here:
+In the query editor for a panel, after choosing your Azure Monitor data source, the first option is to choose a service. There are three options here:
 
-- `Metrics`
-- `Application Insights`
-- `Logs`
-- `Insights Analytics`
-- `Azure Resource Graph`
+- Metrics
+- Logs
+- Azure Resource Graph
 
 The query editor changes depending on which one you pick. Metrics is the default.
 
-Starting in Grafana 7.1, Insights Analytics replaced the former edit mode from within Application Insights.
-
-Starting in Grafana 7.4, the Azure Monitor query type was renamed to Metrics and Azure Logs Analytics was renamed to Logs.
+In Grafana 7.4, the Azure Monitor query type was renamed to Metrics, and Azure Logs Analytics was renamed to Logs. In Grafana 8.0 Application Insights and Insights Analytics is unavailable for new panels, in favor of querying through Metrics and Logs.
 
 ## Query the Metrics service
 
@@ -89,7 +70,7 @@ Examples of metrics that you can get from the service are:
 - `Microsoft.Network/networkInterfaces - Bytes sent`
 - `Microsoft.Storage/storageAccounts - Used Capacity`
 
-{{< docs-imagebox img="/img/docs/v60/azuremonitor-service-query-editor.png" class="docs-image--no-shadow" caption="Metrics Query Editor" >}}
+{{< figure src="/static/img/docs/v60/azuremonitor-service-query-editor.png" class="docs-image--no-shadow" caption="Metrics Query Editor" >}}
 
 As of Grafana 7.1, the query editor allows you to query multiple dimensions for metrics that support them. Metrics that support multiple dimensions are those listed in the [Azure Monitor supported Metrics List](https://docs.microsoft.com/en-us/azure/azure-monitor/platform/metrics-supported) that have one or more values listed in the "Dimension" column for the metric.
 
@@ -147,7 +128,7 @@ Examples:
 - Chaining template variables: `ResourceNames($rg, $ns)`
 - Do not quote parameters: `MetricNames(hg, Microsoft.Network/publicIPAddresses, grafanaIP)`
 
-{{< docs-imagebox img="/img/docs/v60/azuremonitor-service-variables.png" class="docs-image--no-shadow" caption="Nested Azure Monitor Template Variables" >}}
+{{< figure src="/static/img/docs/v60/azuremonitor-service-variables.png" class="docs-image--no-shadow" caption="Nested Azure Monitor Template Variables" >}}
 
 Check out the [Templating]({{< relref "../variables/_index.md" >}}) documentation for an introduction to the templating feature and the different
 types of template variables.
@@ -160,7 +141,7 @@ Not all metrics returned by the Azure Monitor Metrics API have values. To make i
 
 Grafana alerting is supported for the Azure Monitor service. This is not Azure Alerts support. For more information about Grafana alerting, refer to [how alerting in Grafana works]({{< relref "../alerting/_index.md" >}}).
 
-{{< docs-imagebox img="/img/docs/v60/azuremonitor-alerting.png" class="docs-image--no-shadow" caption="Azure Monitor Alerting" >}}
+{{< figure src="/static/img/docs/v60/azuremonitor-alerting.png" class="docs-image--no-shadow" caption="Azure Monitor Alerting" >}}
 
 ## Query the Logs service
 
@@ -202,7 +183,7 @@ Perf
 
 > **Tip**: In the above query, the Kusto syntax `Samples=count()` and `["Avg Value"]=...` is used to rename those columns — the second syntax allowing for the space. This changes the name of the metric that Grafana uses, and as a result, things like series legends and table columns will match what you specify. Here `Samples` is displayed instead of `_count`.
 
-{{< docs-imagebox img="/img/docs/azuremonitor/logs_multi-value_multi-dim.png" class="docs-image--no-shadow" caption="Azure Logs query with multiple values and multiple dimensions" >}}
+{{< figure src="/static/img/docs/azure-monitor/logs_multi-value_multi-dim.png" class="docs-image--no-shadow" caption="Azure Logs query with multiple values and multiple dimensions" >}}
 
 ### Table queries
 
@@ -221,7 +202,7 @@ The default display name format is:
 
 `metricName{dimensionName=dimensionValue,dimensionTwoName=DimensionTwoValue}`
 
-This can be customized by using the [display name field option]({{< relref "../panels/field-options/_index.md#display-name" >}}).
+This can be customized by using the [display name field option]({{< relref "../panels/standard-options.md#display-name" >}}).
 
 ### Logs macros
 
@@ -294,7 +275,7 @@ Perf
 
 > Only available in Grafana v7.0+.
 
-{{< docs-imagebox img="/img/docs/v70/azure-log-analytics-deep-linking.png" max-width="500px" class="docs-image--right" caption="Logs deep linking" >}}
+{{< figure src="/static/img/docs/v70/azure-log-analytics-deep-linking.png" max-width="500px" class="docs-image--right" caption="Logs deep linking" >}}
 
 Click on a time series in the panel to see a context menu with a link to `View in Azure Portal`. Clicking that link opens the Azure Metric Logs query editor in the Azure Portal and runs the query from the Grafana panel there.
 
@@ -302,128 +283,15 @@ If you're not currently logged in to the Azure Portal, then the link opens the l
 
 <div class="clearfix"></div>
 
-### Logs alerting
-
-> Only available in Grafana v7.0+.
-
-Grafana alerting is supported for Application Insights. This is not Azure Alerts support. Read more about how alerting in Grafana works in [Alerting rules]({{< relref "../alerting/_index.md" >}}).
-
-## Query Application Insights service
-
-{{< docs-imagebox img="/img/docs/azuremonitor/insights_metrics_multi-dim.png" class="docs-image--no-shadow" caption="Application Insights Query Editor" >}}
-
-As of Grafana 7.1, you can select more than one group by dimension.
-
-### Format legend keys with aliases for Application Insights
-
-The default legend formatting is:
-
-`metricName{dimensionName=dimensionValue,dimensionTwoName=DimensionTwoValue}`
-
-In the Legend Format field, the aliases which are defined below can be combined any way you want.
-
-Application Insights examples:
-
-- `city: {{ client/city }}`
-- `{{ metric }} [Location: {{ client/countryOrRegion }}, {{ client/city }}]`
-
-### Alias patterns for Application Insights
-
-- `{{ groupbyvalue }}` = _Legacy as of 7.1+ (for backwards compatibility)_ replaced with the first dimension's key/label (as sorted by the key/label)
-- `{{ groupbyname }}` = _Legacy as of 7.1+ (for backwards compatibility)_ replaced with first dimension's value (as sorted by the key/label) (e.g. BlockBlob)
-- `{{ metric }}` = replaced with metric name (e.g. requests/count)
-- `{{ arbitraryDim }}` = _Available in 7.1+_ replaced with the value of the corresponding dimension. (e.g. `{{ client/city }}` becomes Chicago)
-
-### Filter expressions for Application Insights
-
-The filter field takes an OData filter expression.
-
-Examples:
-
-- `client/city eq 'Boydton'`
-- `client/city ne 'Boydton'`
-- `client/city ne 'Boydton' and client/city ne 'Dublin'`
-- `client/city eq 'Boydton' or client/city eq 'Dublin'`
-
-### Templating with variables for Application Insights
-
-Use the one of the following queries in the `Query` field in the Variable edit view.
-
-Check out the [Templating]({{< relref "../variables/_index.md" >}}) documentation for an introduction to the templating feature and the different types of template variables.
-
-| Name                               | Description                                                  |
-| ---------------------------------- | ------------------------------------------------------------ |
-| `AppInsightsMetricNames()`         | Returns a list of metric names.                              |
-| `AppInsightsGroupBys(aMetricName)` | Returns a list of "group bys" for the specified metric name. |
-
-Examples:
-
-- Metric Names query: `AppInsightsMetricNames()`
-- Passing in metric name variable: `AppInsightsGroupBys(requests/count)`
-- Chaining template variables: `AppInsightsGroupBys($metricnames)`
-
-{{< docs-imagebox img="/img/docs/v60/appinsights-service-variables.png" class="docs-image--no-shadow" caption="Nested Application Insights Template Variables" >}}
-
-### Application Insights alerting
-
-Grafana alerting is supported for Application Insights. This is not Azure Alerts support. For more information about Grafana alerting, refer to [Alerts overview]({{< relref "../alerting/_index.md" >}}).
-
-{{< docs-imagebox img="/img/docs/v60/azuremonitor-alerting.png" class="docs-image--no-shadow" caption="Azure Monitor Alerting" >}}
-
-## Query the Application Insights Analytics service
-
-If you change the service type to **Insights Analytics**, then a similar editor to the Log Analytics service is available. This service also uses the Kusto language, so the instructions for querying data are identical to [querying the log analytics service]({{< relref "#querying-the-azure-log-analytics-service" >}}), except that you query Application Insights Analytics data instead.
-
-{{< docs-imagebox img="/img/docs/azuremonitor/insights_analytics_multi-dim.png" class="docs-image--no-shadow" caption="Azure Application Insights Analytics query with multiple dimensions" >}}
-
-## Configure the data source with provisioning
-
-It's now possible to configure data sources using config files with Grafana's provisioning system. You can read more about how it works and all the settings you can set for data sources on the [provisioning docs page]({{< relref "../administration/provisioning/#datasources" >}})
-
-Here are some provisioning examples for this data source.
-
-```yaml
-# config file version
-apiVersion: 1
-
-datasources:
-  - name: Azure Monitor
-    type: grafana-azure-monitor-datasource
-    access: proxy
-    jsonData:
-      appInsightsAppId: <app-insights-app-id>
-      clientId: <client-id>
-      cloudName: azuremonitor
-      subscriptionId: <subscription-id>
-      tenantId: <tenant-id>
-      logAnalyticsClientId: <log-analytics-client-id>
-      logAnalyticsDefaultWorkspace: <log-analytics-default-workspace>
-      logAnalyticsSubscriptionId: <log-analytics-subscription-id>
-      logAnalyticsTenantId: <log-analytics-tenant-id>
-    secureJsonData:
-      clientSecret: <client-secret>
-      appInsightsApiKey: <app-insights-api-key>
-      logAnalyticsClientSecret: <log-analytics-client-secret>
-    version: 1
-```
-
-## Deprecating Application Insights and Insights Analytics
-
-Application Insights and Insights Analytics are two ways to query the same Azure Application Insights data. That same data can also be queried from Metrics. In the upcoming Grafana 8.0 release, the Logs query type will be improved to allow querying of Application Insights data using KQL.
-
-> **Note** In Grafana 8.0, Application Insights and Insights Analytics will be deprecated and made read-only in favor of querying this data through Metrics and Logs. Existing queries will continue to work, but you cannot edit them.
-
-To prepare for this upcoming change, Application Insights queries can now be made in Metrics, under the "microsoft.insights/components" Namespace. Insights Analytics queries cannot be made within Logs with KQL at this time.
-
-## Query Azure Resource Graph service
+## Query the Azure Resource Graph service
 
 Azure Resource Graph (ARG) is a service in Azure that is designed to extend Azure Resource Management by providing efficient and performant resource exploration with the ability to query at scale across a given set of subscriptions so that you can effectively govern your environment. By querying ARG, you can query resources with complex filtering, iteratively explore resources based on governance requirements, and assess the impact of applying policies in a vast cloud environment.
 
-{{< docs-imagebox img="/img/docs/azure-monitor/azure-resource-graph-8-0.png" class="docs-image--no-shadow" caption="Azure Resource Graph Editor" >}}
+{{< figure src="/static/img/docs/azure-monitor/azure-resource-graph.png" class="docs-image--no-shadow" caption="Azure Resource Graph editor" max-width="650px" >}}
 
 ### Table queries
 
-Queries are written in the [Kusto Query Language](https://docs.microsoft.com/en-us/azure/data-explorer/kusto/query/). An Azure Resource Graph query is formatted as table data.
+Queries are written in the [Kusto Query Language](https://docs.microsoft.com/en-us/azure/governance/resource-graph/concepts/query-language). Not all Kusto language features are available in ARG. An Azure Resource Graph query is formatted as table data.
 
 If your credentials give you access to multiple subscriptions, then you can choose multiple subscriptions before entering queries.
 
@@ -453,7 +321,7 @@ Resources
 
 ### Group and aggregate the values by property
 
-You can also use `summarize` and `count` to define how to group and aggregate the values by property. For example, returning count of healthy, unhealthy, and not applicable resources per recommendation.:
+You can also use `summarize` and `count` to define how to group and aggregate the values by property. For example, returning count of healthy, unhealthy, and not applicable resources per recommendation:
 
 ```kusto
 securityresources
@@ -476,3 +344,91 @@ securityresources
     portalLink=properties.links.azurePortal
 | summarize numberOfResources=count(resourceId) by tostring(recommendationName), tostring(recommendationState)
 ```
+
+## Configure the data source with provisioning
+
+You can configure data sources using config files with Grafana’s provisioning system. For more information on how it works and all the settings you can set for data sources on the [provisioning docs page]({{< relref "../administration/provisioning/#datasources" >}})
+
+Here are some provisioning examples for this data source.
+
+### Azure AD App Registration (client secret)
+
+```yaml
+# config file version
+apiVersion: 1
+
+datasources:
+  - name: Azure Monitor
+    type: grafana-azure-monitor-datasource
+    access: proxy
+    jsonData:
+      azureAuthType: clientsecret
+      cloudName: azuremonitor # See table below
+      tenantId: <tenant-id>
+      clientId: <client-id>
+      subscriptionId: <subscription-id> # Optional, default subscription
+    secureJsonData:
+      clientSecret: <client-secret>
+    version: 1
+```
+
+### Managed Identity
+
+```yaml
+# config file version
+apiVersion: 1
+
+datasources:
+  - name: Azure Monitor
+    type: grafana-azure-monitor-datasource
+    access: proxy
+    jsonData:
+      azureAuthType: msi
+      subscriptionId: <subscription-id> # Optional, default subscription
+    version: 1
+```
+
+### App Registration (client secret)
+
+```yaml
+datasources:
+  - name: Azure Monitor
+    type: grafana-azure-monitor-datasource
+    access: proxy
+    jsonData:
+      azureAuthType: clientsecret
+      cloudName: azuremonitor # See table below
+      tenantId: <tenant-id>
+      clientId: <client-id>
+      subscriptionId: <subscription-id> # Optional, default subscription
+    secureJsonData:
+      clientSecret: <client-secret>
+    version: 1
+```
+
+### Supported cloud names
+
+| Azure Cloud                                      | Value                      |
+| ------------------------------------------------ | -------------------------- |
+| Microsoft Azure public cloud                     | `azuremonitor` (_default_) |
+| Microsoft Chinese national cloud                 | `chinaazuremonitor`        |
+| US Government cloud                              | `govazuremonitor`          |
+| Microsoft German national cloud ("Black Forest") | `germanyazuremonitor`      |
+
+## Deprecated Application Insights and Insights Analytics
+
+Application Insights and Insights Analytics are two ways to query the same Azure Application Insights data, which can also be queried from Metrics and Logs. In Grafana 8.0, Application Insights and Insights Analytics are deprecated and made read-only in favor of querying this data through Metrics and Logs. Existing queries will continue to work, but you cannot edit them. New panels are not able to use Application Insights or Insights Analytics.
+
+For Application Insights, new queries can be made with the Metrics query type by selecting the "Application Insights" resource type.
+
+{{< figure src="/static/img/docs/azure-monitor/app-insights-metrics.png" max-width="650px" class="docs-image--no-shadow" caption="Azure Monitor Application Insights example" >}}
+
+For Insights Analaytics, new queries can be written with Kusto in the Logs query type by selecting your Application Insights resource.
+
+{{< figure src="/static/img/docs/azure-monitor/app-insights-logs.png" max-width="650px" class="docs-image--no-shadow" caption="Azure Logs Application Insights example" >}}
+
+The new resource picker for Logs shows all resources on your Azure subscription compatible with Logs.
+
+{{< figure src="/static/img/docs/azure-monitor/app-insights-resource-picker.png" max-width="650px" class="docs-image--no-shadow" caption="Azure Logs Application Insights resource picker" >}}
+
+Azure Monitor Metrics and Azure Monitor Logs do not use Application Insights API keys, so make sure the data source is configured with an Azure AD app registration that has access to Application Insights

docs/sources/datasources/cloudwatch.md

@@ -137,8 +137,8 @@ region = us-west-2
 
 The CloudWatch data source can query data from both CloudWatch metrics and CloudWatch Logs APIs, each with its own specialized query editor. You select which API you want to query with using the query mode switch on top of the editor.
 
-{{< docs-imagebox img="/img/docs/v70/cloudwatch-metrics-query-field.png" max-width="800px" class="docs-image--left" caption="CloudWatch metrics query field" >}}
-{{< docs-imagebox img="/img/docs/v70/cloudwatch-logs-query-field.png" max-width="800px" class="docs-image--right" caption="CloudWatch Logs query field" >}}
+{{< figure src="/static/img/docs/v70/cloudwatch-metrics-query-field.png" max-width="800px" class="docs-image--left" caption="CloudWatch metrics query field" >}}
+{{< figure src="/static/img/docs/v70/cloudwatch-logs-query-field.png" max-width="800px" class="docs-image--right" caption="CloudWatch Logs query field" >}}
 
 ## Using the Metric Query Editor
 
@@ -150,7 +150,7 @@ To create a valid query, you need to specify the namespace, metric name and at l
 
 In Grafana 6.5 or higher, you’re able to monitor a dynamic list of metrics by using the asterisk (\*) wildcard for one or more dimension values.
 
-{{< docs-imagebox img="/img/docs/v65/cloudwatch-dimension-wildcard.png" max-width="800px" class="docs-image--right" caption="CloudWatch dimension wildcard" >}}
+{{< figure src="/static/img/docs/v65/cloudwatch-dimension-wildcard.png" max-width="800px" class="docs-image--right" caption="CloudWatch dimension wildcard" >}}
 
 In the example, all metrics in the namespace `AWS/EC2` with a metric name of `CPUUtilization` and ANY value for the `InstanceId` dimension are queried. This can help you monitor metrics for AWS resources, like EC2 instances or containers. For example, when new instances get created as part of an auto scaling event, they will automatically appear in the graph without you having to track the new instance IDs. This capability is currently limited to retrieving up to 100 metrics. You can click on `Show Query Preview` to see the search expression that is automatically built to support wildcards. To learn more about search expressions, visit the [CloudWatch documentation](https://docs.aws.amazon.com/AmazonCloudWatch/latest/monitoring/search-expression-syntax.html).
 
@@ -184,7 +184,7 @@ If the period field is left blank or set to `auto`, then it calculates automatic
 
 ### Deep linking from Grafana panels to the CloudWatch console
 
-{{< docs-imagebox img="/img/docs/v65/cloudwatch-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch deep linking" >}}
+{{< figure src="/static/img/docs/v65/cloudwatch-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch deep linking" >}}
 
 Left clicking a time series in the panel shows a context menu with a link to `View in CloudWatch console`. Clicking that link will open a new tab that will take you to the CloudWatch console and display all the metrics for that query. If you're not currently logged in to the CloudWatch console, the link will forward you to the login page. The provided link is valid for any account but will only display the right metrics if you're logged in to the account that corresponds to the selected data source in Grafana.
 
@@ -198,11 +198,11 @@ To query CloudWatch Logs, select the region and up to 20 log groups which you wa
 
 You can also write queries returning time series data by using the [`stats` command](https://docs.aws.amazon.com/AmazonCloudWatch/latest/logs/CWL_Insights-Visualizing-Log-Data.html). When making `stats` queries in Explore, you have to make sure you are in Metrics Explore mode.
 
-{{< docs-imagebox img="/img/docs/v70/explore-mode-switcher.png" max-width="500px" class="docs-image--right" caption="Explore mode switcher" >}}
+{{< figure src="/static/img/docs/v70/explore-mode-switcher.png" max-width="500px" class="docs-image--right" caption="Explore mode switcher" >}}
 
 To the right of the query input field is a CloudWatch Logs Insights link that opens the CloudWatch Logs Insights console with your query. You can continue exploration there if necessary.
 
-{{< docs-imagebox img="/img/docs/v70/cloudwatch-logs-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch Logs deep linking" >}}
+{{< figure src="/static/img/docs/v70/cloudwatch-logs-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch Logs deep linking" >}}
 
 ### Using template variables
 
@@ -211,7 +211,7 @@ See the [Templating]({{< relref "../variables/_index.md" >}}) documentation for
 
 ### Deep linking from Grafana panels to the CloudWatch console
 
-{{< docs-imagebox img="/img/docs/v70/cloudwatch-logs-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch Logs deep linking" >}}
+{{< figure src="/static/img/docs/v70/cloudwatch-logs-deep-linking.png" max-width="500px" class="docs-image--right" caption="CloudWatch Logs deep linking" >}}
 If you'd like to view your query in the CloudWatch Logs Insights console, simply click the `CloudWatch Logs Insights` button next to the query editor.
 If you're not currently logged in to the CloudWatch console, the link will forward you to the login page. The provided link is valid for any account but will only display the right metrics if you're logged in to the account that corresponds to the selected data source in Grafana.
 
@@ -232,7 +232,7 @@ The updated CloudWatch data source ships with pre-configured dashboards for five
 
 To import the pre-configured dashboards, go to the configuration page of your CloudWatch data source and click on the `Dashboards` tab. Click `Import` for the dashboard you would like to use. To customize the dashboard, we recommend saving the dashboard under a different name, because otherwise the dashboard will be overwritten when a new version of the dashboard is released.
 
-{{< docs-imagebox img="/img/docs/v65/cloudwatch-dashboard-import.png" caption="CloudWatch dashboard import" >}}
+{{< figure src="/static/img/docs/v65/cloudwatch-dashboard-import.png" caption="CloudWatch dashboard import" >}}
 
 ## Templated queries
 

docs/sources/datasources/elasticsearch.md

@@ -49,7 +49,7 @@ http.cors.allow-origin: "*"
 
 ### Index settings
 
-![Elasticsearch data source details](/img/docs/elasticsearch/elasticsearch-ds-details-7-4.png)
+![Elasticsearch data source details](/static/img/docs/elasticsearch/elasticsearch-ds-details-7-4.png)
 
 Here you can specify a default for the `time field` and specify the name of your Elasticsearch index. You can use
 a time pattern for the index name or a wildcard.
@@ -57,7 +57,7 @@ a time pattern for the index name or a wildcard.
 ### Elasticsearch version
 
 Select the version of your Elasticsearch data source from the version selection dropdown. Different query compositions and functionalities are available in the query editor for different versions.
-Available Elasticsearch versions are `2.x`, `5.x`, `5.6+`, `6.0+`, and `7.0+`. Select the option that best matches your data source version.
+Available Elasticsearch versions are `2.x`, `5.x`, `5.6+`, `6.0+`, `7.0+` and `7.7+`. Select the option that best matches your data source version.
 
 Grafana assumes that you are running the lowest possible version for a specified range. This ensures that new features or breaking changes in a future Elasticsearch release will not affect your configuration.
 
@@ -101,7 +101,7 @@ Each data link configuration consists of:
 
 ## Metric Query editor
 
-![Elasticsearch Query Editor](/img/docs/elasticsearch/query-editor-7-4.png)
+![Elasticsearch Query Editor](/static/img/docs/elasticsearch/query-editor-7-4.png)
 
 The Elasticsearch query editor allows you to select multiple metrics and group by multiple terms or filters. Use the plus and minus icons to the right to add/remove
 metrics or group by clauses. Some metrics and group by clauses haves options, click the option text to expand the row to view and edit metric or group by options.
@@ -120,7 +120,7 @@ You can control the name for time series via the `Alias` input field.
 
 Some metric aggregations are called Pipeline aggregations, for example, *Moving Average* and *Derivative*. Elasticsearch pipeline metrics require another metric to be based on. Use the eye icon next to the metric to hide metrics from appearing in the graph. This is useful for metrics you only have in the query for use in a pipeline metric.
 
-![Pipeline aggregation editor](/img/docs/elasticsearch/pipeline-aggregation-editor-7-4.png)
+![Pipeline aggregation editor](/static/img/docs/elasticsearch/pipeline-aggregation-editor-7-4.png)
 
 ## Templating
 
@@ -170,7 +170,7 @@ There are two syntaxes:
 Why two ways? The first syntax is easier to read and write but does not allow you to use a variable in the middle of a word. When the *Multi-value* or *Include all value*
 options are enabled, Grafana converts the labels from plain text to a lucene compatible condition.
 
-![Query with template variables](/img/docs/elasticsearch/elastic-templating-query-7-4.png)
+![Query with template variables](/static/img/docs/elasticsearch/elastic-templating-query-7-4.png)
 
 In the above example, we have a lucene query that filters documents based on the `@hostname`  property using a variable named `$hostname`. It is also using
 a variable in the *Terms* group by field input box. This allows you to use a variable to quickly change how the data is grouped.
@@ -246,6 +246,10 @@ datasources:
       esVersion: "7.0.0"
       logMessageField: message
       logLevelField: fields.level
+      dataLinks:
+        - datasourceUid: my_jaeger_uid # Target UID needs to be known
+          field: traceID
+          url: "$${__value.raw}" # Careful about the double "$$" because of env var expansion
 ```
 
 ## Amazon Elasticsearch Service
@@ -262,4 +266,4 @@ In order to sign requests to your Amazon Elasticsearch Service domain, SigV4 can
 
 Once AWS SigV4 is enabled, it can be configured on the Elasticsearch data source configuration page. Refer to [Cloudwatch authentication]({{<relref "./cloudwatch.md#authentication" >}}) for more information about authentication options.
 
-{{< docs-imagebox img="/img/docs/v73/elasticsearch-sigv4-config-editor.png" max-width="500px" class="docs-image--no-shadow" caption="SigV4 configuration for AWS Elasticsearch Service" >}}
+{{< figure src="/static/img/docs/v73/elasticsearch-sigv4-config-editor.png" max-width="500px" class="docs-image--no-shadow" caption="SigV4 configuration for AWS Elasticsearch Service" >}}

docs/sources/datasources/google-cloud-monitoring/_index.md

@@ -39,31 +39,31 @@ The following APIs need to be enabled first:
 
 Click on the links above and click the `Enable` button:
 
-{{< docs-imagebox img="/img/docs/v71/cloudmonitoring_enable_api.png" max-width="450px" class="docs-image--no-shadow" caption="Enable GCP APIs" >}}
+{{< figure src="/static/img/docs/v71/cloudmonitoring_enable_api.png" max-width="450px" class="docs-image--no-shadow" caption="Enable GCP APIs" >}}
 
 #### Create a GCP Service Account for a Project
 
 1. Navigate to the [APIs and Services Credentials page](https://console.cloud.google.com/apis/credentials).
 1. Click on the `Create credentials` dropdown/button and choose the `Service account key` option.
 
-   {{< docs-imagebox img="/img/docs/v71/cloudmonitoring_create_service_account_button.png" max-width="500px" class="docs-image--no-shadow" caption="Create service account button" >}}
+   {{< figure src="/static/img/docs/v71/cloudmonitoring_create_service_account_button.png" max-width="500px" class="docs-image--no-shadow" caption="Create service account button" >}}
 
 1. On the `Create service account key` page, choose key type `JSON`. Then in the `Service Account` dropdown, choose the `New service account` option:
 
-   {{< docs-imagebox img="/img/docs/v71/cloudmonitoring_create_service_account_key.png" max-width="500px" class="docs-image--no-shadow" caption="Create service account key" >}}
+   {{< figure src="/static/img/docs/v71/cloudmonitoring_create_service_account_key.png" max-width="500px" class="docs-image--no-shadow" caption="Create service account key" >}}
 
 1. Some new fields will appear. Fill in a name for the service account in the `Service account name` field and then choose the `Monitoring Viewer` role from the `Role` dropdown:
 
-   {{< docs-imagebox img="/img/docs/v71/cloudmonitoring_service_account_choose_role.png" max-width="600px" class="docs-image--no-shadow" caption="Choose role" >}}
+   {{< figure src="/static/img/docs/v71/cloudmonitoring_service_account_choose_role.png" max-width="600px" class="docs-image--no-shadow" caption="Choose role" >}}
 
 1. Click the Create button. A JSON key file will be created and downloaded to your computer. Store this file in a secure place as it allows access to your Google Cloud Monitoring data.
 1. Upload it to Grafana on the data source Configuration page. You can either upload the file or paste in the contents of the file.
 
-   {{< docs-imagebox img="/img/docs/v71/cloudmonitoring_grafana_upload_key.png" max-width="550px" class="docs-image--no-shadow" caption="Upload service key file to Grafana" >}}
+   {{< figure src="/static/img/docs/v71/cloudmonitoring_grafana_upload_key.png" max-width="550px" class="docs-image--no-shadow" caption="Upload service key file to Grafana" >}}
 
 1. The file contents will be encrypted and saved in the Grafana database. Don't forget to save after uploading the file!
 
-   {{< docs-imagebox img="/img/docs/v71/cloudmonitoring_grafana_key_uploaded.png" max-width="600px" class="docs-image--no-shadow" caption="Service key file is uploaded to Grafana" >}}
+   {{< figure src="/static/img/docs/v71/cloudmonitoring_grafana_key_uploaded.png" max-width="600px" class="docs-image--no-shadow" caption="Service key file is uploaded to Grafana" >}}
 
 ### Using GCE Default Service Account
 
@@ -81,7 +81,7 @@ The Google Cloud Monitoring query editor allows you to build two types of querie
 
 ### Metric Queries
 
-{{< docs-imagebox img="/img/docs/google-cloud-monitoring/metric-query-builder-8-0.png" max-width= "400px" class="docs-image--right" >}}
+{{< figure src="/static/img/docs/google-cloud-monitoring/metric-query-builder-8-0.png" max-width= "400px" class="docs-image--right" >}}
 
 The metric query editor allows you to select metrics, group/aggregate by labels and by time, and use filters to specify which time series you want in the results.
 
@@ -111,7 +111,7 @@ When the operator is set to `=~` or `!=~` it is possible to add regular expressi
 
 Preprocessing options are displayed in the UI when the selected metric has a metric kind of `delta` or `cumulative`. If the selected metric has a metric kind of `gauge`, no pre-processing option will be displayed.
 
-If you select 'Rate', data points are aligned and converted to a rate per time series. If you select 'Delta', data points are aligned by their delta (difference) per time series.
+If you select `Rate`, data points are aligned and converted to a rate per time series. If you select `Delta`, data points are aligned by their delta (difference) per time series.
 
 #### Grouping
 
@@ -195,7 +195,7 @@ Example Result: `gce_instance - compute.googleapis.com/instance/cpu/usage_time`
 
 > **Note:** Available in Grafana v7.1 and later versions.
 
-{{< docs-imagebox img="/img/docs/v71/cloudmonitoring_deep_linking.png" max-width="500px" class="docs-image--right" caption="Google Cloud Monitoring deep linking" >}}
+{{< figure src="/static/img/docs/v71/cloudmonitoring_deep_linking.png" max-width="500px" class="docs-image--right" caption="Google Cloud Monitoring deep linking" >}}
 
 Click on a time series in the panel to see a context menu with a link to View in Metrics Explorer in Google Cloud Console. Clicking that link opens the Metrics Explorer in the Google Cloud Console and runs the query from the Grafana panel there.
 The link navigates the user first to the Google Account Chooser and after successfully selecting an account, the user is redirected to the Metrics Explorer. The provided link is valid for any account, but it only displays the query if your account has access to the GCP project specified in the query.
@@ -208,7 +208,7 @@ Grafana issues one query to the Cloud Monitoring API per query editor row, and e
 
 > **Note:** Available in Grafana v7.0 and later versions.
 
-{{< docs-imagebox img="/img/docs/google-cloud-monitoring/slo-query-builder-8-0.png" max-width= "400px" class="docs-image--right" >}}
+{{< figure src="/static/img/docs/google-cloud-monitoring/slo-query-builder-8-0.png" max-width= "400px" class="docs-image--right" >}}
 
 The SLO query builder in the Google Cloud Monitoring data source allows you to display SLO data in time series format. To get an understanding of the basic concepts in service monitoring, please refer to Google Cloud Monitoring's [official docs](https://cloud.google.com/monitoring/service-monitoring).
 
@@ -303,7 +303,7 @@ Why two ways? The first syntax is easier to read and write but does not allow yo
 
 ## Annotations
 
-{{< docs-imagebox img="/img/docs/google-cloud-monitoring/annotations-8-0.png" max-width= "400px" class="docs-image--right" >}}
+{{< figure src="/static/img/docs/google-cloud-monitoring/annotations-8-0.png" max-width= "400px" class="docs-image--right" >}}
 
 [Annotations]({{< relref "../../dashboards/annotations.md" >}}) allow you to overlay rich event information on top of graphs. You add annotation
 queries via the Dashboard menu / Annotations view. Annotation rendering is expensive so it is important to limit the number of rows returned. There is no support for showing Google Cloud Monitoring annotations and events yet but it works well with [custom metrics](https://cloud.google.com/monitoring/custom-metrics/) in Google Cloud Monitoring.

docs/sources/datasources/google-cloud-monitoring/preconfig-cloud-monitoring-dashboards.md

@@ -21,4 +21,4 @@ The data source of the newly created dashboard panels will be the one selected a
 
 In case you want to customize a dashboard, we recommend that you save it under a different name.  Otherwise the dashboard will be overwritten when a new version of the dashboard is released.
 
-{{< docs-imagebox img="/img/docs/google-cloud-monitoring/curated-dashboards-7-4.png" max-width= "650px" >}}
+{{< figure src="/static/img/docs/google-cloud-monitoring/curated-dashboards-7-4.png" max-width= "650px" >}}

docs/sources/datasources/graphite.md

@@ -55,8 +55,8 @@ To see the raw text of the query that is sent to Graphite, click the **Toggle te
 
 Click **Select metric** to start navigating the metric space. Once you start, you can continue using the mouse or keyboard arrow keys. You can select a wildcard and still continue.
 
-{{< docs-imagebox img="/img/docs/graphite/graphite-query-editor-still.png"
-                  animated-gif="/img/docs/graphite/graphite-query-editor.gif" >}}
+{{< figure src="/static/img/docs/graphite/graphite-query-editor-still.png"
+                  animated-gif="/static/img/docs/graphite/graphite-query-editor.gif" >}}
 
 ### Functions
 
@@ -65,8 +65,8 @@ a function is selected, it will be added and your focus will be in the text box
 - To edit or change a parameter, click on it and it will turn into a text box.
 - To delete a function, click the function name followed by the x icon.
 
-{{< docs-imagebox img="/img/docs/graphite/graphite-functions-still.png"
-                  animated-gif="/img/docs/graphite/graphite-functions-demo.gif" >}}
+{{< figure src="/static/img/docs/graphite/graphite-functions-still.png"
+                  animated-gif="/static/img/docs/graphite/graphite-functions-demo.gif" >}}
 
 Some functions like aliasByNode support an optional second argument. To add an argument, hover your mouse over the first argument and then click the `+` symbol that appears. To remove the second optional parameter, click on it and leave it blank and the editor will remove it.
 
@@ -141,12 +141,12 @@ For more details, see the [Graphite docs on the autocomplete API for tags](http:
 The query you specify in the query field should be a metric find type of query. For example, a query like `prod.servers.*` fills the
 variable with all possible values that exist in the wildcard position.
 
-The results contain all possible values occurring only at the last level of the query. To get full metric names matching the query 
-use expand function (`expand(*.servers.*)`). 
+The results contain all possible values occurring only at the last level of the query. To get full metric names matching the query
+use expand function (`expand(*.servers.*)`).
 
 #### Comparison between expanded and non-expanded metric search results
 
-The expanded query returns the full names of matching metrics. In combination with regex, it can extract any part of the metric name. By contrast, a non-expanded query only returns the last part of the metric name. It does not allow you to extract other parts of metric names. 
+The expanded query returns the full names of matching metrics. In combination with regex, it can extract any part of the metric name. By contrast, a non-expanded query only returns the last part of the metric name. It does not allow you to extract other parts of metric names.
 
 Here are some example metrics:
 - `prod.servers.001.cpu`
@@ -190,7 +190,7 @@ tag_values(server, server=~${__searchFilter:regex})
 ### Variable usage
 
 You can use a variable in a metric node path or as a parameter to a function.
-![variable](/img/docs/v2/templated_variable_parameter.png)
+![variable](/static/img/docs/v2/templated_variable_parameter.png)
 
 There are two syntaxes:
 

docs/sources/datasources/influxdb/_index.md

@@ -19,7 +19,7 @@ To access data source settings, hover your mouse over the **Configuration** (gea
 InfluxDB data source options differ depending on which [query language](#query-languages) you select: InfluxQL or Flux.
 
 > **Note:** Though not required, it's a good practice to append the language choice to the data source name. For example:
-> 
+>
  - InfluxDB-InfluxQL
  - InfluxDB-Flux
 
@@ -33,6 +33,7 @@ Name        | Description
 `Default`   | Default data source means that it will be pre-selected for new panels.
 `URL`       | The HTTP protocol, IP address and port of your InfluxDB API. InfluxDB API port is by default 8086.
 `Access`    | Server (default) = URL needs to be accessible from the Grafana backend/server, Browser = URL needs to be accessible from the browser.
+**Note**: Browser access is deprecated and will be removed in a future release.
 `Whitelisted Cookies`| Cookies that will be forwarded to the data source. All other cookies will be deleted.
 `Database`  | The ID of the bucket you want to query from, copied from the [Buckets page](https://docs.influxdata.com/influxdb/v2.0/organizations/buckets/view-buckets/) of the InfluxDB UI.
 `User`      | The username you use to sign into InfluxDB.
@@ -74,7 +75,7 @@ To help you choose the best language for your needs, here’s a comparison of [F
 
 Enter edit mode by clicking the panel title and clicking **Edit**. The editor allows you to select metrics and tags.
 
-![InfluxQL query editor](/img/docs/influxdb/influxql-query-editor-7-5.png)
+![InfluxQL query editor](/static/img/docs/influxdb/influxql-query-editor-8-0.png)
 
 ### Filter data (WHERE)
 
@@ -89,7 +90,7 @@ You can type in regex patterns for metric names or tag filter values. Be sure to
 In the `SELECT` row you can specify what fields and functions you want to use. If you have a
 group by time you need an aggregation function. Some functions like derivative require an aggregation function. The editor tries to simplify and unify this part of the query. For example:
 
-![](/img/docs/influxdb/select_editor.png)
+![](/static/img/docs/influxdb/select_editor.png)
 
 The above generates the following InfluxDB `SELECT` clause:
 

docs/sources/datasources/jaeger.md

@@ -33,17 +33,17 @@ This is a configuration for the [trace to logs feature]({{< relref "../explore/t
 - **Data source -** Target data source.
 - **Tags -** The tags that will be used in the Loki query. Default is `'cluster', 'hostname', 'namespace', 'pod'`.
 
-![Trace to logs settings](/img/docs/explore/trace-to-logs-settings-7-4.png 'Screenshot of the trace to logs settings')
+![Trace to logs settings](/static/img/docs/explore/trace-to-logs-settings-7-4.png 'Screenshot of the trace to logs settings')
 
 ## Query traces
 
 You can query and display traces from Jaeger via [Explore]({{< relref "../explore/_index.md" >}}).
 
-{{< docs-imagebox img="/img/docs/explore/jaeger-search-form.png" class="docs-image--no-shadow" caption="Screenshot of the Jaeger query editor" >}}
+{{< figure src="/static/img/docs/explore/jaeger-search-form.png" class="docs-image--no-shadow" caption="Screenshot of the Jaeger query editor" >}}
 
 You can query by trace ID or use the search form to find traces. To query by trace ID, select the TraceID from the Query type selector and insert the ID into the text input.
 
-{{< docs-imagebox img="/img/docs/explore/jaeger-trace-id.png" class="docs-image--no-shadow" caption="Screenshot of the Jaeger query editor with trace ID selected" >}}
+{{< figure src="/static/img/docs/explore/jaeger-trace-id.png" class="docs-image--no-shadow" caption="Screenshot of the Jaeger query editor with trace ID selected" >}}
 
 To perform a search, set the query type selector to Search, then use the following fields to find traces:
 

docs/sources/datasources/loki.md

@@ -18,12 +18,12 @@ Add it as a data source and you are ready to build dashboards or query your log
 
 To access Loki settings, click the **Configuration** (gear) icon, then click **Data Sources**, and then click the Loki data source.
 
-| Name                  | Description                                                                                                                                   |
-| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
-| `Name`                | The data source name. This is how you refer to the data source in panels, queries, and Explore.                                               |
-| `Default`             | Default data source means that it will be pre-selected for new panels.                                                                        |
-| `URL`                 | The URL of the Loki instance, e.g., `http://localhost:3100`                                                                                   |
-| `Whitelisted Cookies` | Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source.                      |
+| Name                  | Description                                                                                                                                               |
+| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `Name`                | The data source name. This is how you refer to the data source in panels, queries, and Explore.                                                           |
+| `Default`             | Default data source that is pre-selected for new panels.                                                                                    |
+| `URL`                 | URL of the Loki instance, e.g., `http://localhost:3100`.                                                                                             |
+| `Whitelisted Cookies` | Grafana Proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source.                                  |
 | `Maximum lines`       | Upper limit for the number of log lines returned by Loki (default is 1000). Lower this limit if your browser is sluggish when displaying logs in Explore. |
 
 ### Derived fields
@@ -33,7 +33,7 @@ The Derived Fields configuration allows you to:
 - Add fields parsed from the log message.
 - Add a link that uses the value of the field.
 
-You can use this functionality to link to your tracing backend directly from your logs, or link to a user profile page if a userId is present in the log line. These links appear in the [log details](/explore/logs-integration/#labels-and-detected-fields).
+You can use this functionality to link to your tracing backend directly from your logs, or link to a user profile page if a userId is present in the log line. These links appear in the [log details]({{< relref "../explore/logs-integration/#labels-and-detected-fields" >}}).
 
 Each derived field consists of:
 
@@ -43,30 +43,31 @@ Each derived field consists of:
 - **Internal link -** Select if the link is internal or external. In case of internal link, a data source selector allows you to select the target data source. Only tracing data sources are supported.
 
 You can use a debug section to see what your fields extract and how the URL is interpolated. Click **Show example log message** to show the text area where you can enter a log message.
-{{< docs-imagebox img="/img/docs/v75/loki_derived_fields_settings.png" class="docs-image--no-shadow" max-width="800px" caption="Screenshot of the derived fields debugging" >}}
+{{< figure src="/static/img/docs/v75/loki_derived_fields_settings.png" class="docs-image--no-shadow" max-width="800px" caption="Screenshot of the derived fields debugging" >}}
 
 The new field with the link shown in log details:
-{{< docs-imagebox img="/img/docs/explore/detected-fields-link-7-4.png" max-width="800px" caption="Detected fields link in Explore" >}}
+{{< figure src="/static/img/docs/explore/detected-fields-link-7-4.png" max-width="800px" caption="Detected fields link in Explore" >}}
 
 ## Loki query editor
 
 You can use the Loki query editor to create log and metric queries.
 
-| Name               | Description                                                                                                                                                                                                 |
-| ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `Query expression` | Loki query expression, refer to the [LogQL documentation](https://grafana.com/docs/loki/latest/logql/) for more information.                                                                                                    |
+| Name               | Description                                                                                                                                                                                   |
+| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `Query expression` | Loki query expression, refer to the [LogQL documentation](https://grafana.com/docs/loki/latest/logql/) for more information.                                                                  |
 | `Query type`       | Choose the type of query to run. The instant type queries against a single point in time. We are using "To" time from the time range. The range type queries over the selected range of time. |
-| `Line limit`       | Upper limit for number of log lines returned by query. The default is the Maximum lines limit set in Loki settings.                                                                                         |
-| `Legend`           | Available only in Dashboard. Controls the name of the time series, using name or pattern. For example `{{hostname}}` is replaced with the label value for the label `hostname`.                             |
+| `Line limit`       | Upper limit for number of log lines returned by query. The default is the Maximum lines limit set in Loki settings.                                                                           |
+| `Legend`           | Available only in Dashboard. Controls the name of the time series, using name or pattern. For example `{{hostname}}` is replaced with the label value for the label `hostname`.               |
 
 ### Log browser
 
 With Loki log browser you can easily navigate trough your list of labels and values and construct the query of your choice. Log browser has multi-step selection:
+
 1. Choose the labels you would like to consider for your search.
-2. Pick the values for selected labels. Log browser supports facetting and therefore it shows you only possible label combinations. 
+2. Pick the values for selected labels. Log browser supports facetting and therefore it shows you only possible label combinations.
 3. Choose the type of query - logs query or rate metrics query. Additionally, you can also validate selector.
 
-{{< docs-imagebox img="/img/docs/v75/loki_log_browser.png" class="docs-image--no-shadow" max-width="800px" caption="Screenshot of the derived fields debugging" >}}
+{{< figure src="/static/img/docs/v75/loki_log_browser.png" class="docs-image--no-shadow" max-width="800px" caption="Screenshot of the log browser for Loki" >}}
 
 ## Querying with Loki
 

docs/sources/datasources/mssql.md

@@ -69,7 +69,7 @@ If possible, we recommend you to use the latest service pack available for optim
 
 ## Query Editor
 
-{{< docs-imagebox img="/img/docs/v51/mssql_query_editor.png" class="docs-image--no-shadow" >}}
+{{< figure src="/static/img/docs/v51/mssql_query_editor.png" class="docs-image--no-shadow" >}}
 
 You will find the MSSQL query editor in the metrics tab in Graph, Singlestat or Table panel's edit mode. You enter edit mode by clicking the
 panel title, then edit. The editor allows you to define a SQL query to select data to be visualized.
@@ -145,7 +145,7 @@ SELECT
 
 Query editor with example query:
 
-{{< docs-imagebox img="/img/docs/v51/mssql_table_query.png" max-width="500px" class="docs-image--no-shadow" >}}
+{{< figure src="/static/img/docs/v51/mssql_table_query.png" max-width="500px" class="docs-image--no-shadow" >}}
 
 The query:
 
@@ -164,7 +164,7 @@ FROM
 
 The resulting table panel:
 
-{{< docs-imagebox img="/img/docs/v51/mssql_table_result.png" max-width="1489px" class="docs-image--no-shadow" >}}
+{{< figure src="/static/img/docs/v51/mssql_table_result.png" max-width="1489px" class="docs-image--no-shadow" >}}
 
 ## Time series queries
 
@@ -199,7 +199,7 @@ INSERT metric_values (time, measurement, valueOne, valueTwo) VALUES('2018-03-15
 
 ```
 
-{{< docs-imagebox img="/img/docs/v51/mssql_time_series_one.png" class="docs-image--no-shadow docs-image--right" >}}
+{{< figure src="/static/img/docs/v51/mssql_time_series_one.png" class="docs-image--no-shadow docs-image--right" >}}
 
 **Example with one `value` and one `metric` column.**
 
@@ -219,7 +219,7 @@ When the above query is used in a graph panel, it will produce two series named
 
 <div class="clearfix"></div>
 
-{{< docs-imagebox img="/img/docs/v51/mssql_time_series_two.png" class="docs-image--no-shadow docs-image--right" >}}
+{{< figure src="/static/img/docs/v51/mssql_time_series_two.png" class="docs-image--no-shadow docs-image--right" >}}
 
 **Example with multiple `value` columns:**
 
@@ -239,7 +239,7 @@ When the above query is used in a graph panel, it will produce two series named
 
 <div class="clearfix"></div>
 
-{{< docs-imagebox img="/img/docs/v51/mssql_time_series_three.png" class="docs-image--no-shadow docs-image--right" >}}
+{{< figure src="/static/img/docs/v51/mssql_time_series_three.png" class="docs-image--no-shadow docs-image--right" >}}
 
 **Example using the \$\_\_timeGroup macro:**
 
@@ -263,7 +263,7 @@ Any two series lacking a value in a three-minute window will render a line betwe
 
 <div class="clearfix"></div>
 
-{{< docs-imagebox img="/img/docs/v51/mssql_time_series_four.png" class="docs-image--no-shadow docs-image--right" >}}
+{{< figure src="/static/img/docs/v51/mssql_time_series_four.png" class="docs-image--no-shadow docs-image--right" >}}
 
 **Example using the \$\_\_timeGroup macro with fill parameter set to zero:**
 
@@ -440,7 +440,7 @@ Please note that any macro function will not work inside a stored procedure.
 
 ### Examples
 
-{{< docs-imagebox img="/img/docs/v51/mssql_metrics_graph.png" class="docs-image--no-shadow docs-image--right" >}}
+{{< figure src="/static/img/docs/v51/mssql_metrics_graph.png" class="docs-image--no-shadow docs-image--right" >}}
 For the following examples, the database table is defined in [Time series queries](#time-series-queries). Let's say that we want to visualize four series in a graph panel, such as all combinations of columns `valueOne`, `valueTwo` and `measurement`. Graph panel to the right visualizes what we want to achieve. To solve this, we need to use two queries:
 
 **First query:**

docs/sources/datasources/mysql.md

@@ -21,17 +21,18 @@ Grafana ships with a built-in MySQL data source plugin that allows you to query
 
 ### Data source options
 
-Name           | Description
--------------- | -------------
-`Name`         | The data source name. This is how you refer to the data source in panels and queries.
-`Default`      | Default data source means that it will be pre-selected for new panels.
-`Host`         | The IP address/hostname and optional port of your MySQL instance.
-`Database`     | Name of your MySQL database.
-`User`         | Database user's login/username
-`Password`     | Database user's password
-`Max open`     | The maximum number of open connections to the database, default `unlimited` (Grafana v5.4+).
-`Max idle`     | The maximum number of connections in the idle connection pool, default `2` (Grafana v5.4+).
-`Max lifetime` | The maximum amount of time in seconds a connection may be reused, default `14400`/4 hours. This should always be lower than configured [wait_timeout](https://dev.mysql.com/doc/refman/8.0/en/server-system-variables.html#sysvar_wait_timeout) in MySQL (Grafana v5.4+).
+Name               | Description
+------------------ | -------------
+`Name`             | The data source name. This is how you refer to the data source in panels and queries.
+`Default`          | Default data source means that it will be pre-selected for new panels.
+`Host`             | The IP address/hostname and optional port of your MySQL instance.
+`Database`         | Name of your MySQL database.
+`User`             | Database user's login/username
+`Password`         | Database user's password
+`Session Timezone` | Specify the time zone used in the database session, such as `Europe/Berlin` or `+02:00`. This is necessary, if the timezone of the database (or the host of the database) is set to something other than UTC. Set the value used in the session with `SET time_zone='...'`. If you leave this field empty, then the time zone is not updated. For more information, refer to the [MySQL documentation](https://dev.mysql.com/doc/refman/8.0/en/time-zone-support.html).
+`Max open`         | The maximum number of open connections to the database, default `unlimited` (Grafana v5.4+).
+`Max idle`         | The maximum number of connections in the idle connection pool, default `2` (Grafana v5.4+).
+`Max lifetime`     | The maximum amount of time in seconds a connection may be reused, default `14400`/4 hours. This should always be lower than configured [wait_timeout](https://dev.mysql.com/doc/refman/8.0/en/server-system-variables.html#sysvar_wait_timeout) in MySQL (Grafana v5.4+).
 
 ### Min time interval
 
@@ -71,7 +72,7 @@ You can use wildcards (`*`)  in place of database or table if you want to grant
 
 > Only available in Grafana v5.4+.
 
-{{< docs-imagebox img="/img/docs/v54/mysql_query_still.png" class="docs-image--no-shadow" animated-gif="/img/docs/v54/mysql_query.gif" >}}
+{{< figure src="/static/img/docs/v54/mysql_query_still.png" class="docs-image--no-shadow" animated-gif="/static/img/docs/v54/mysql_query.gif" >}}
 
 You find the MySQL query editor in the metrics tab in a panel's edit mode. You enter edit mode by clicking the
 panel title, then edit.
@@ -154,7 +155,7 @@ If the `Format as` query option is set to `Table` then you can basically do any
 
 Query editor with example query:
 
-{{< docs-imagebox img="/img/docs/v45/mysql_table_query.png" >}}
+{{< figure src="/static/img/docs/v45/mysql_table_query.png" >}}
 
 The query:
 
@@ -172,7 +173,7 @@ You can control the name of the Table panel columns by using regular `as ` SQL c
 
 The resulting table panel:
 
-![](/img/docs/v43/mysql_table.png)
+![](/static/img/docs/v43/mysql_table.png)
 
 ## Time series queries
 

docs/sources/datasources/opentsdb.md

@@ -30,7 +30,7 @@ Open a graph in edit mode by click the title. Query editor will differ if the da
 In the former version, only tags can be used to query OpenTSDB. But in the latter version, filters as well as tags
 can be used to query opentsdb. Fill Policy is also introduced in OpenTSDB 2.2.
 
-![](/img/docs/v43/opentsdb_query_editor.png)
+![](/static/img/docs/v43/opentsdb_query_editor.png)
 
 > **Note:** While using OpenTSDB 2.2 data source, make sure you use either Filters or Tags as they are mutually exclusive. If used together, might give you weird results.
 

docs/sources/datasources/postgres.md

@@ -22,7 +22,7 @@ Name               | Description
 `Database`         | Name of your PostgreSQL database.
 `User`             | Database user's login/username
 `Password`         | Database user's password
-`SSL Mode`         | Determines whether or with what priority a secure SSL TCP/IP connection will be negotiated with the server. When SSL Mode is disabled, SSL Method and Auth Details would not be visible. 
+`SSL Mode`         | Determines whether or with what priority a secure SSL TCP/IP connection will be negotiated with the server. When SSL Mode is disabled, SSL Method and Auth Details would not be visible.
 `SSL Auth Details Method`       | Determines whether the SSL Auth details will be configured as a file path or file content. Grafana v7.5+
 `SSL Auth Details Value` | File path or file content of SSL root certificate, client certificate and client key
 `Max open`         | The maximum number of open connections to the database, default `unlimited` (Grafana v5.4+).
@@ -68,7 +68,7 @@ Make sure the user does not get any unwanted privileges from the public role.
 
 ## Query editor
 
-{{< docs-imagebox img="/img/docs/v53/postgres_query_still.png" class="docs-image--no-shadow" animated-gif="/img/docs/v53/postgres_query.gif" >}}
+{{< figure src="/static/img/docs/v53/postgres_query_still.png" class="docs-image--no-shadow" animated-gif="/static/img/docs/v53/postgres_query.gif" >}}
 
 You find the PostgreSQL query editor in the metrics tab in Graph or Singlestat panel's edit mode. You enter edit mode by clicking the
 panel title, then edit.
@@ -98,7 +98,7 @@ The available functions in the query editor depend on the PostgreSQL version you
 If you use aggregate functions you need to group your resultset. The editor will automatically add a `GROUP BY time` if you add an aggregate function.
 
 The editor tries to simplify and unify this part of the query. For example:<br>
-![](/img/docs/v53/postgres_select_editor.png)<br>
+![](/static/img/docs/v53/postgres_select_editor.png)<br>
 
 The above will generate the following PostgreSQL `SELECT` clause:
 
@@ -160,7 +160,7 @@ If the `Format as` query option is set to `Table` then you can basically do any
 
 Query editor with example query:
 
-![](/img/docs/v46/postgres_table_query.png)
+![](/static/img/docs/v46/postgres_table_query.png)
 
 
 The query:
@@ -179,7 +179,7 @@ You can control the name of the Table panel columns by using regular `as ` SQL c
 
 The resulting table panel:
 
-![postgres table](/img/docs/v46/postgres_table.png)
+![postgres table](/static/img/docs/v46/postgres_table.png)
 
 ## Time series queries
 

docs/sources/datasources/prometheus.md

@@ -14,22 +14,22 @@ Grafana includes built-in support for Prometheus. This topic explains options, v
 
 To access Prometheus settings, hover your mouse over the **Configuration** (gear) icon, then click **Data Sources**, and then click the Prometheus data source.
 
-| Name                      | Description                                                                                                                                                                                             |
-| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `Name`                    | The data source name. This is how you refer to the data source in panels and queries.                                                                                                                   |
-| `Default`                 | Default data source means that it will be pre-selected for new panels.                                                                                                                                  |
-| `Url`                     | The URL of your Prometheus server, e.g. `http://prometheus.example.org:9090`.                                                                                                                           |
-| `Access`                  | Server (default) = URL needs to be accessible from the Grafana backend/server, Browser = URL needs to be accessible from the browser.                                                                   |
-| `Basic Auth`              | Enable basic authentication to the Prometheus data source.                                                                                                                                              |
-| `User`                    | User name for basic authentication.                                                                                                                                                                     |
-| `Password`                | Password for basic authentication.                                                                                                                                                                      |
-| `Scrape interval`         | Set this to the typical scrape and evaluation interval configured in Prometheus. Defaults to 15s.             
-| `HTTP method`             | Use either POST or GET HTTP method to query your data source. POST is the recommended and pre-selected method as it allows bigger queries. Change this to GET if you have a Prometheus version older than 2.1 or if POST requests are restricted in your network.                                                                                       |
-| `Disable metrics lookup`  | Checking this option will disable the metrics chooser and metric/label support in the query field's autocomplete. This helps if you have performance issues with bigger Prometheus instances.           |
-| `Custom Query Parameters` | Add custom parameters to the Prometheus query URL. For example `timeout`, `partial_response`, `dedup`, or `max_source_resolution`. Multiple parameters should be concatenated together with an '&'. |
-| `Label name`              | Add the name of the field in the label object.                                                                                                                                                          |
-| `URL`                     | If the link is external, then enter the full link URL. You can interpolate the value from the field with `${__value.raw }` macro.                                                                       |
-| `Internal link`           | Select if the link is internal or external. In the case of an internal link, a data source selector allows you to select the target data source. Supports tracing data sources only.                    |
+| Name                      | Description                                                                                                                                                                                                                                                       |
+| ------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `Name`                    | The data source name. This is how you refer to the data source in panels and queries.                                                                                                                                                                             |
+| `Default`                 | Default data source that is pre-selected for new panels.                                                                                                                                                                                                          |
+| `Url`                     | The URL of your Prometheus server, for example, `http://prometheus.example.org:9090`.                                                                                                                                                                             |
+| `Access`                  | Server (default) = URL needs to be accessible from the Grafana backend/server, Browser = URL needs to be accessible from the browser.                                                                                                                             |
+| `Basic Auth`              | Enable basic authentication to the Prometheus data source.                                                                                                                                                                                                        |
+| `User`                    | User name for basic authentication.                                                                                                                                                                                                                               |
+| `Password`                | Password for basic authentication.                                                                                                                                                                                                                                |
+| `Scrape interval`         | Set this to the typical scrape and evaluation interval configured in Prometheus. Defaults to 15s.                                                                                                                                                                 |
+| `HTTP method`             | Use either POST or GET HTTP method to query your data source. POST is the recommended and pre-selected method as it allows bigger queries. Change this to GET if you have a Prometheus version older than 2.1 or if POST requests are restricted in your network. |
+| `Disable metrics lookup`  | Checking this option will disable the metrics chooser and metric/label support in the query field's autocomplete. This helps if you have performance issues with bigger Prometheus instances.                                                                     |
+| `Custom Query Parameters` | Add custom parameters to the Prometheus query URL. For example `timeout`, `partial_response`, `dedup`, or `max_source_resolution`. Multiple parameters should be concatenated together with an '&'.                                                           |
+| `Label name`              | Add the name of the field in the label object.                                                                                                                                                                                                                    |
+| `URL`                     | If the link is external, then enter the full link URL. You can interpolate the value from the field with `${__value.raw }` macro.                                                                                                                                 |
+| `Internal link`           | Select if the link is internal or external. In the case of an internal link, a data source selector allows you to select the target data source. Supports tracing data sources only.                                                                              |
 
 ## Prometheus query editor
 
@@ -39,8 +39,8 @@ Below you can find information and options for Prometheus query editor in dashbo
 
 Open a graph in edit mode by clicking the title > Edit (or by pressing `e` key while hovering over panel).
 
-{{< docs-imagebox img="/img/docs/v45/prometheus_query_editor_still.png"
-                  animated-gif="/img/docs/v45/prometheus_query_editor.gif" >}}
+{{< figure src="/static/img/docs/v45/prometheus_query_editor_still.png"
+                  animated-gif="/static/img/docs/v45/prometheus_query_editor.gif" >}}
 
 | Name                | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
 | ------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
@@ -76,6 +76,29 @@ To show a horizontal line across the whole graph, add a series override and sele
 | `Query type`       | `Range`, `Instant`, or `Both`. When running **Range query**, the result of the query is displayed in graph and table. Instant query returns only the latest value that Prometheus has scraped for the requested time series and it is displayed in the table. When **Both** is selected, both instant query and range query is run. Result of range query is displayed in graph and the result of instant query is displayed in the table. |
 | `Exemplars`        | Run and show exemplars in the graph.                                                                                                                                                                                                                                                                                                                                                                                                       |
 
+### Metrics browser
+
+The metrics browser allows you to quickly find metrics and select relevant labels to build basic queries.
+When you open the browser you will see all available metrics and labels.
+If supported by your Prometheus instance, each metric will show its HELP and TYPE as a tooltip.
+
+{{< figure src="/static/img/docs/v8/prometheus_metrics_browser.png" class="docs-image--no-shadow" max-width="800px" caption="Screenshot of the metrics browser for Prometheus" >}}
+
+When you select a metric, the browser narrows down the available labels to show only the ones applicable to the metric.
+You can then select one or more labels for which the available label values are shown in lists in the bottom section.
+Select one or more values for each label to tighten your query scope.
+
+> **Note:** If you do not remember a metric name to start with, you can also select a few labels first, to narrow down the list and then find relevant label values.
+
+All lists in the metrics browser have a search field above them to quickly filter for metrics or labels that match a certain string. The values section only has one search field. Its filtering applies to all labels to help you find values across labels once they have been selected, for example, among your labels `app`, `job`, `job_name` only one might with the value you are looking for.
+
+Once you are satisfied with your query, click "Use query" to run the query. The button "Use as rate query" adds a `rate(...)[$__interval]` around your query to help write queries for counter metrics.
+The "Validate selector" button will check with Prometheus how many time series are available for that selector.
+
+#### Limitations
+
+The metrics browser has a hard limit of 10,000 labels (keys) and 50,000 label values (including metric names). If your Prometheus instance returns more results, the browser will continue functioning. However, the result sets will be cut off above those maximum limits.
+
 ## Templating
 
 Instead of hard-coding things like server, application and sensor name in your metric queries, you can use variables in their place.
@@ -188,9 +211,9 @@ datasources:
     type: prometheus
     # Access mode - proxy (server in the UI) or direct (browser in the UI).
     access: proxy
-    httpMethod: POST
     url: http://localhost:9090
     jsonData:
+      httpMethod: POST
       exemplarTraceIdDestinations:
         # Field with internal link pointing to data source in Grafana.
         # datasourceUid value can be anything, but it should be unique across all defined data source uids.
@@ -218,7 +241,7 @@ If you are running Grafana in an Amazon EKS cluster, follow the AWS guide to [Qu
 
 Grafana 7.4 and later versions have the capability to show exemplars data alongside a metric both in Explore and Dashboards.
 Exemplars are a way to associate higher cardinality metadata from a specific event with traditional timeseries data.
-{{< docs-imagebox img="/img/docs/v74/exemplars.png" class="docs-image--no-shadow" caption="Screenshot showing the detail window of an Exemplar" >}}
+{{< figure src="/static/img/docs/v74/exemplars.png" class="docs-image--no-shadow" caption="Screenshot showing the detail window of an Exemplar" >}}
 
 Configure Exemplars in the data source settings by adding external or internal links.
-{{< docs-imagebox img="/img/docs/v74/exemplars-setting.png" class="docs-image--no-shadow" caption="Screenshot of the Exemplars configuration" >}}
+{{< figure src="/static/img/docs/v74/exemplars-setting.png" class="docs-image--no-shadow" caption="Screenshot of the Exemplars configuration" >}}

docs/sources/datasources/tempo.md

@@ -32,14 +32,18 @@ This is a configuration for the [trace to logs feature]({{< relref "../explore/t
 - **Data source -** Target data source.
 - **Tags -** The tags that will be used in the Loki query. Default is `'cluster', 'hostname', 'namespace', 'pod'`.
 
-![Trace to logs settings](/img/docs/explore/trace-to-logs-settings-7-4.png 'Screenshot of the trace to logs settings')
+![Trace to logs settings](/static/img/docs/explore/trace-to-logs-settings-7-4.png 'Screenshot of the trace to logs settings')
 
 ## Query traces
 
 You can query and display traces from Tempo via [Explore]({{< relref "../explore/_index.md" >}}).
-To query a particular trace, insert its trace ID into the query text input.
+You can search for traces if you set up the trace to logs setting in the data source configuration page. To find traces to visualize, use the [Loki query editor]({{< relref "loki.md#loki-query-editor" >}}). To get search results, you must have [derived fields]({{< relref "loki.md#derived-fields" >}}) configured, which point to this data source.
 
-{{< docs-imagebox img="/img/docs/v73/tempo-query-editor.png" class="docs-image--no-shadow" caption="Screenshot of the Tempo query editor" >}}
+{{< figure src="/static/img/docs/tempo/query-editor-search.png" class="docs-image--no-shadow" caption="Screenshot of the Tempo query editor showing the search tab" >}}
+
+To query a particular trace, select the **TraceID** query type, and then put the ID into the Trace ID field.
+
+{{< figure src="/static/img/docs/tempo/query-editor-traceid.png" class="docs-image--no-shadow" caption="Screenshot of the Tempo TraceID query type" >}}
 
 ## Linking Trace ID from logs
 

docs/sources/datasources/testdata.md

@@ -24,14 +24,14 @@ The `TestData DB` data source is not enabled by default. To enable it:
 
 Once `TestData DB` is enabled, you can use it as a data source in any metric panel.
 
-![](/img/docs/v41/test_data_add.png)
+![](/static/img/docs/v41/test_data_add.png)
 
 ## CSV
 
 The comma separated values scenario is the most powerful one since it lets you create any kind of graph you like.
 Once you provided the numbers, `TestData DB` distributes them evenly based on the time range of your query.
 
-![](/img/docs/v41/test_data_csv_example.png)
+![](/static/img/docs/v41/test_data_csv_example.png)
 
 ## Dashboards
 

docs/sources/datasources/zipkin.md

@@ -33,17 +33,17 @@ This is a configuration for the [trace to logs feature]({{< relref "../explore/t
 - **Data source -** Target data source.
 - **Tags -** The tags that will be used in the Loki query. Default is `'cluster', 'hostname', 'namespace', 'pod'`.
 
-![Trace to logs settings](/img/docs/explore/trace-to-logs-settings-7-4.png "Screenshot of the trace to logs settings")
+![Trace to logs settings](/static/img/docs/explore/trace-to-logs-settings-7-4.png "Screenshot of the trace to logs settings")
 
 ## Query traces
 
 Querying and displaying traces from Zipkin is available via [Explore]({{< relref "../explore" >}}).
 
-{{< docs-imagebox img="/img/docs/v70/zipkin-query-editor.png" class="docs-image--no-shadow" caption="Screenshot of the Zipkin query editor" >}}
+{{< figure src="/static/img/docs/v70/zipkin-query-editor.png" class="docs-image--no-shadow" caption="Screenshot of the Zipkin query editor" >}}
 
 The Zipkin query editor allows you to query by trace ID directly or selecting a trace from trace selector. To query by trace ID, insert the ID into the text input.
 
-{{< docs-imagebox img="/img/docs/v70/zipkin-query-editor-open.png" class="docs-image--no-shadow" caption="Screenshot of the Zipkin query editor with trace selector expanded" >}}
+{{< figure src="/static/img/docs/v70/zipkin-query-editor-open.png" class="docs-image--no-shadow" caption="Screenshot of the Zipkin query editor with trace selector expanded" >}}
 
 Use the trace selector to pick particular trace from all traces logged in the time range you have selected in Explore. The trace selector has three levels of nesting:
 

docs/sources/developers/plugins/add-authentication-for-data-source-plugins.md

@@ -3,23 +3,114 @@ title = "Add authentication for data source plugins"
 aliases = ["/docs/grafana/latest/plugins/developing/auth-for-datasources/", "/docs/grafana/next/developers/plugins/authentication/"]
 +++
 
-# Add authentication for data source plugins
+ # Add authentication for data source plugins
 
-This page explains how to use the Grafana data source proxy to authenticate against a third-party API from a data source plugin.
+This page explains how to configure your data source plugin to authenticate against a third-party API.
 
-When a user saves a password or any other sensitive data as a data source option, Grafana encrypts the data and stores it in the Grafana database. Any encrypted data source options can only be decrypted on the Grafana server. This means that any data source that makes authenticated queries needs to request the decrypted data to be sent to the browser.
+There are two ways you can perform authenticated requests from your plugin—using the [_data source proxy_](#authenticate-using-the-data-source-proxy), or by building a [_backend plugin_](#authenticate-using-a-backend-plugin). The one you choose depends on how your plugin authenticates against the third-party API.
 
-To minimize the amount of sensitive information sent to and from the browser, data source plugins can use the Grafana _data source proxy_. When using the data source proxy, any requests containing sensitive information go through the Grafana server. No sensitive data is sent to the browser after the data is saved.
+- Use the data source proxy if you need to authenticate using Basic Auth or API keys
+- Use the data source proxy if the API supports OAuth 2.0 using client credentials
+- Use a backend plugin if the API uses a custom authentication method that isn't supported by the data source proxy, or if your API communicates over a different protocol than HTTP
 
-Some data sources, like [Prometheus]({{< relref "../../datasources/prometheus.md" >}}) and [InfluxDB]({{< relref "../../datasources/influxdb" >}}), allow users to configure whether to use the data source proxy, through a setting called _access modes_.
+Regardless of which approach you use, you first need to encrypt any sensitive information that the plugin needs to store.
 
-## Add a proxy route to your plugin
+## Encrypt data source configuration
 
-To forward requests through the Grafana proxy, you need to configure one or more _routes_. A route specifies how the proxy transforms outgoing requests. All routes for a given plugin are defined in the [plugin.json]({{< relref "metadata.md" >}}) file.
+Data source plugins have two ways of storing custom configuration: `jsonData` and `secureJsonData`.
 
-Let's add a route to proxy requests to `https://api.example.com/foo/bar`.
+Users with the _Viewer_ role can access data source configuration—such as the contents of `jsonData`—in cleartext. If you've enabled anonymous access, anyone that can access Grafana in their browser can see the contents of `jsonData`. **Only use `jsonData` to store non-sensitive configuration.**
 
-1. Add the route to `plugin.json`. Note that you need to reload the Grafana server every time you make a change to your `plugin.json` file.
+> **Note:** You can see the settings that the current user has access to by entering `window.grafanaBootData` in the developer console of your browser.
+
+> **Note:** Users of [Grafana Enterprise](https://grafana.com/products/enterprise/grafana/) can restrict access to data sources to specific users and teams. For more information, refer to [Data source permissions](https://grafana.com/docs/grafana/latest/enterprise/datasource_permissions).
+
+If you need to store sensitive information, such as passwords, tokens and API keys, use `secureJsonData` instead. Whenever the user saves the data source configuration, the secrets in `secureJsonData` are sent to the Grafana server and encrypted before they're stored.
+
+Once the secure configuration has been encrypted, it can no longer be accessed from the browser. The only way to access secrets after they've been saved is by using the [_data source proxy_](#authenticate-using-the-data-source-proxy).
+
+#### Add secret configuration to your data source plugin
+
+To demonstrate how you can add secrets to a data source plugin, let's add support for configuring an API key.
+
+Create a new interface in `types.go` to hold the API key.
+
+```ts
+export interface MySecureJsonData {
+  apiKey?: string;
+}
+```
+
+Add type information to your `secureJsonData` object by updating the props for your `ConfigEditor` to accept the interface as a second type parameter.
+
+```ts
+interface Props extends DataSourcePluginOptionsEditorProps<MyDataSourceOptions, MySecureJsonData> {}
+```
+
+You can access the value of the secret from the `options` prop inside your `ConfigEditor` until the user saves the configuration. When the user saves the configuration, Grafana clears the value. After that, you can use the `secureJsonFields` to determine whether the property has been configured.
+
+```ts
+const { secureJsonData, secureJsonFields } = options;
+const { apiKey } = secureJsonData;
+```
+
+To securely update the secret in your plugin's configuration editor, update the `secureJsonData` object using the `onOptionsChange` prop.
+
+```ts
+const onAPIKeyChange = (event: ChangeEvent<HTMLInputElement>) => {
+  onOptionsChange({
+    ...options,
+    secureJsonData: {
+      apiKey: event.target.value,
+    },
+  });
+};
+```
+
+Next, define a component that can accept user input.
+
+```ts
+<Input
+  type="password"
+  placeholder={secureJsonFields?.apiKey ? 'configured' : ''}
+  value={secureJsonData.apiKey ?? ''}
+  onChange={onAPIKeyChange}
+/>
+```
+
+Finally, if you want the user to be able to reset the API key, then you need to set the property to `false` in the `secureJsonFields` object.
+
+```ts
+const onResetAPIKey = () => {
+  onOptionsChange({
+    ...options,
+    secureJsonFields: {
+      ...options.secureJsonFields,
+      apiKey: false,
+    },
+    secureJsonData: {
+      ...options.secureJsonData,
+      apiKey: '',
+    },
+  });
+};
+```
+
+Now that users can configure secrets, the next step is to see how we can add them to our requests.
+
+## Authenticate using the data source proxy
+
+Once the user has saved the configuration for a data source, any secret data source configuration will no longer be available in the browser. Encrypted secrets can only be accessed on the server. So how do you add them to you request?
+
+The Grafana server comes with a proxy that lets you define templates for your requests. We call them _proxy routes_. Grafana sends the proxy route to the server, decrypts the secrets along with other configuration, and adds them to the request before sending it off.
+
+> **Note:** Be sure not to confuse the data source proxy with the [auth proxy]({{< relref "../../auth/auth-proxy.md" >}}). The data source proxy is used to authenticate a data source, while the auth proxy is used to log into Grafana itself.
+
+### Add a proxy route to your plugin
+
+To forward requests through the Grafana proxy, you need to configure one or more proxy routes. A proxy route is a template for any outgoing request that is handled by the proxy. You can configure proxy routes in the [plugin.json](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/) file.
+
+1. Add the route to plugin.json. Note that you need to restart the Grafana server every time you make a change to your plugin.json file.
 
    ```json
    "routes": [
@@ -43,27 +134,30 @@ Let's add a route to proxy requests to `https://api.example.com/foo/bar`.
      }
 
      // ...
-
    }
    ```
 
-1. In the `query` method, make a request using [BackendSrv]({{< relref "../../packages_api/runtime/backendsrv.md" >}}).
+1. In the `query` method, make a request using `BackendSrv`. The first section of the URL path needs to match the `path` of your proxy route. The data source proxy replaces `this.url + routePath` with the `url` of the route. The following request will be made to `https://api.example.com/v1/users`.
+
+   ```ts
+   import { getBackendSrv } from '@grafana/runtime';
+   ```
 
    ```ts
    const routePath = '/example';
 
    getBackendSrv()
      .datasourceRequest({
-       url: this.url + routePath + '/foo/bar',
+       url: this.url + routePath + '/v1/users',
        method: 'GET',
      });
    ```
 
-## Add a dynamic proxy route to your plugin
+### Add a dynamic proxy route to your plugin
 
-In the example above, the URL stays the same for everyone using the plugin. Let's look at how you can create dynamic routes based on data source options that are provided by the user.
+Grafana sends the proxy route to the server, where the data source proxy decrypts any sensitive data and interpolates the template variables with the decrypted data before making the request.
 
-Many of the properties in the `route` object can use templates in the form of `{{ .JsonData.YOUR_OPTION_NAME }}`, where `YOUR_OPTION_NAME` is the name of a property in the `jsonData` object.
+To add user-defined configuration to your routes, add `{{ .JsonData.apiKey }}` to the route, where `apiKey` is the name of a property in the `jsonData` object.
 
 ```json
 "routes": [
@@ -74,7 +168,7 @@ Many of the properties in the `route` object can use templates in the form of `{
 ]
 ```
 
-You can also access sensitive data in your route configuration by changing `.JsonData` into `.SecureJsonData`.
+You can also configure your route to use sensitive data by using `.SecureJsonData`.
 
 ```json
 "routes": [
@@ -85,17 +179,9 @@ You can also access sensitive data in your route configuration by changing `.Jso
 ]
 ```
 
-Now you know how to define routes for your data source plugin. Next, let's look at how to authenticate requests for your routes.
+In addition to the URL, you can also add headers, URL parameters, and a request body, to a proxy route.
 
-## Configure the authentication method for a route
-
-The Grafana proxy supports a number of different authentication methods. For more information on how to configure each authentication method, refer to [plugin.json]({{< relref "metadata.md" >}}).
-
-For any sensitive data, make sure that you encrypt data source options, and that you use `{{ .SecureJsonData.YOUR_OPTION_NAME }}` when using sensitive data source options in your routes.
-
-### Add HTTP header
-
-To add HTTP headers to proxied requests, use the `headers` property.
+#### Add HTTP headers to a proxy route
 
 ```json
 "routes": [
@@ -112,9 +198,7 @@ To add HTTP headers to proxied requests, use the `headers` property.
 ]
 ```
 
-### Add URL parameters
-
-To add URL parameters to proxied requests, use the `urlParams` property.
+#### Add URL parameters to a proxy route
 
 ```json
 "routes": [
@@ -131,9 +215,7 @@ To add URL parameters to proxied requests, use the `urlParams` property.
 ]
 ```
 
-### Set body content
-
-To set the body content and length of proxied requests, use the `body` property.
+#### Add a request body to a proxy route
 
 ```json
 "routes": [
@@ -148,25 +230,79 @@ To set the body content and length of proxied requests, use the `body` property.
 ]
 ```
 
-### Enable token authentication
+### Add a OAuth 2.0 proxy route to your plugin
 
-To enable token-based authentication for proxied requests, use the `tokenAuth` property.
+The data source proxy supports OAuth 2.0 authentication.
 
-Grafana automatically renews the token when it expires.
+Since the request to each route is made server-side, only machine-to-machine authentication is supported. In order words, if you need to use a different grant than client credentials, you need to implement it yourself.
+
+To authenticate using OAuth 2.0, add a `tokenAuth` object to the proxy route definition. If necessary, Grafana performs a request to the URL defined in `tokenAuth` to retrieve a token before making the request to the URL in your proxy route. Grafana automatically renews the token when it expires.
+
+Any parameters defined in `tokenAuth.params` are encoded as `application/x-www-form-urlencoded` and sent to the token URL.
 
 ```json
-"routes": [
-  {
-    "path": "example",
-    "url": "https://api.example.com",
-    "tokenAuth": {
-      "url": "https://login.example.com/oauth2/token",
-      "params": {
-        "grant_type": "client_credentials",
-        "client_id": "{{ .JsonData.clientId }}",
-        "client_secret": "{{ .SecureJsonData.clientSecret }}"
+{
+  "routes": [
+    {
+      "path": "api",
+      "url": "https://api.example.com/v1",
+      "tokenAuth": {
+        "url": "https://api.example.com/v1/oauth/token",
+        "params": {
+          "grant_type": "client_credentials",
+          "client_id": "{{ .SecureJsonData.clientId }}",
+          "client_secret": "{{ .SecureJsonData.clientSecret }}"
+        }
       }
     }
-  }
-]
+  ]
+}
 ```
+
+## Authenticate using a backend plugin
+
+While the data source proxy supports the most common authentication methods for HTTP APIs, using proxy routes has a few limitations:
+
+- Proxy routes only support HTTP or HTTPS
+- Proxy routes don't support custom token authentication
+
+If any of these limitations apply to your plugin, you need to add a [backend plugin]({{< relref "./backend/_index.md" >}}). Since backend plugins run on the server they can access decrypted secrets, which makes it easier to implement custom authentication methods.
+
+The decrypted secrets are available from the `DecryptedSecureJSONData` field in the instance settings.
+
+```go
+func (ds *dataSource) QueryData(ctx context.Context, req *backend.QueryDataRequest) (*backend.QueryDataResponse, error) {
+  instanceSettings := req.PluginContext.DataSourceInstanceSettings
+
+  if apiKey, exists := settings.DecryptedSecureJSONData["apiKey"]; exists {
+    // Use the decrypted API key.
+  }
+
+  // ...
+}
+```
+
+## Forward OAuth identity for the logged-in user
+
+If your data source uses the same OAuth provider as Grafana itself, for example using [Generic OAuth Authentication]({{< relref "../../auth/generic-oauth.md" >}}), your data source plugin can reuse the access token for the logged-in Grafana user.
+
+To allow Grafana to pass the access token to the plugin, the user needs to enable **Forward OAuth Identity** on the data source configuration page. This tells Grafana to pass the token to the plugin in a Authorization header. Note that your plugin needs to use the [DataSourceHttpSettings](https://developers.grafana.com/ui/latest/index.html?path=/story/data-source-datasourcehttpsettings--basic) component in the configuration editor to expose the setting for your data source plugin.
+
+The Authorization header is available on the `DataQuery` object on the query data request in your backend data source.
+
+```go
+func (ds *dataSource) QueryData(ctx context.Context, req *backend.QueryDataRequest) (*backend.QueryDataResponse, error) {
+    for _, q := range req.Queries {
+        token := strings.Fields(q.Headers.Get("Authorization"))
+
+        var (
+          tokenType = token[0]
+          accessToken = token[1]
+        )
+
+        // ...
+    }
+}
+```
+
+> **Note:** Due to a bug in Grafana, using this feature with PostgreSQL can cause a deadlock. For more information, refer to [Grafana causes deadlocks in PostgreSQL, while trying to refresh users token](https://github.com/grafana/grafana/issues/20515).

docs/sources/developers/plugins/backend/_index.md

@@ -12,7 +12,7 @@ However, one limitation with these plugins are that they execute on the client-s
 
 We use the term _backend plugin_ to denote that a plugin has a backend component. Still, normally a backend plugin requires frontend components as well. This is for example true for backend data source plugins which normally need configuration and query editor components implemented for the frontend.
 
-Data source plugins can be extended with a backend component. In the future we plan to support additional types and possibly new kinds of plugins, such as [notifiers for Grafana Alerting]({{< relref "../../../alerting/notifications.md" >}}) and custom authentication to name a few.
+Data source plugins can be extended with a backend component. In the future we plan to support additional types and possibly new kinds of plugins, such as [notifiers for Grafana Alerting]({{< relref "../../../alerting/old-alerting/notifications.md" >}}) and custom authentication to name a few.
 
 ## Use cases for implementing a backend plugin
 

docs/sources/developers/plugins/error-handling.md

@@ -31,7 +31,7 @@ throw new Error('An error occurred');
 
 Grafana displays the error message in the top-left corner of the panel.
 
-{{< docs-imagebox img="/img/docs/panel_error.png" class="docs-image--no-shadow" max-width="850px" >}}
+{{< figure src="/static/img/docs/panel_error.png" class="docs-image--no-shadow" max-width="850px" >}}
 
 Avoid displaying overly-technical error messages to the user. If you want to let technical users report an error, consider logging it instead.
 

docs/sources/developers/plugins/legacy/apps.md

@@ -10,7 +10,7 @@ App plugins are Grafana plugins that can bundle data source and panel plugins wi
 
 Data source and panel plugins will show up like normal plugins. The app pages will be available in the main menu.
 
-{{< imgbox img="/img/docs/v3/app-in-main-menu.png" caption="App in Main Menu" >}}
+{{< figure class="float-right"  src="/static/img/docs/v3/app-in-main-menu.png" caption="App in Main Menu" >}}
 
 ## Enabling app plugins
 
@@ -45,7 +45,7 @@ ConfigCtrl.templateUrl = 'components/config/config.html';
 
 If possible, a link to a dashboard or custom page should be shown after enabling the app to guide the user to the appropriate place.
 
-{{< imgbox img="/img/docs/app_plugin_after_enable.png" caption="After enabling" >}}
+{{< figure class="float-right"  src="/static/img/docs/app_plugin_after_enable.png" caption="After enabling" >}}
 
 ### Develop your own App
 

docs/sources/developers/plugins/legacy/defaults-and-editor-mode.md

@@ -96,7 +96,7 @@ Then each pair, label and field is wrapped in a div with a gf-form class.
 
 Note that there are some Angular attributes here. *ng-model* will update the panel data. *ng-change* will render the panel when you change the value. This change will occur on the onblur event due to the *ng-model-onblur* attribute. This means you can see the effect of your changes on the panel while editing.
 
-{{< imgbox img="/assets/img/blog/clock-panel-editor.png" caption="Panel Editor" >}}
+{{< figure class="float-right"  src="/assets/img/blog/clock-panel-editor.png" caption="Panel Editor" >}}
 
 On the editor tab we use a drop down for 12/24 hour clock, an input field for font size and a color picker for the background color.
 

docs/sources/developers/plugins/legacy/snapshot-mode.md

@@ -5,11 +5,11 @@ aliases = ["/docs/grafana/latest/plugins/developing/snapshot-mode/"]
 
 # Legacy snapshot mode
 
-{{< imgbox img="/img/docs/Grafana-snapshot-example.png" caption="A dashboard using snapshot data and not live data." >}}
+{{< figure class="float-right"  src="/static/img/docs/Grafana-snapshot-example.png" caption="A dashboard using snapshot data and not live data." >}}
 
 Grafana has this great feature where you can [save a snapshot of your dashboard]({{< relref "../../../dashboards/json-model.md" >}}). Instead of sending a screenshot of a dashboard to someone, you can send them a working, interactive Grafana dashboard with the snapshot data embedded inside it. The snapshot can be saved on your Grafana server and is available to all your co-workers. Raintank also hosts a [snapshot server](http://snapshot.raintank.io/) if you want to send the snapshot to someone who does not have access to your Grafana server.
 
-{{< imgbox img="/img/docs/animated_gifs/snapshots.gif" caption="Selecting a snapshot" >}}
+{{< figure class="float-right"  src="/static/img/docs/animated_gifs/snapshots.gif" caption="Selecting a snapshot" >}}
 
 This all works because Grafana saves a snapshot of the current data in the dashboard json instead of fetching the data from a data source. However, if you are building a custom panel plugin then this will not work straight out of the box. You will need to make some small (and easy!) changes first.
 
@@ -41,7 +41,7 @@ This will cover most use cases for snapshot support. Sometimes you will want to
 
 Data that is not time series data from a Grafana data source is not saved automatically by Grafana. Saving custom data for snapshot mode has to be done manually.
 
-{{< imgbox img="/img/docs/Grafana-save-snapshot.png" caption="Save snapshot" >}}
+{{< figure class="float-right"  src="/static/img/docs/Grafana-save-snapshot.png" caption="Save snapshot" >}}
 
 Grafana gives us a chance to save data to the dashboard json when it is creating a snapshot. In the 'data-received' event handler, you can check the snapshot flag on the dashboard object. If this is true, then Grafana is creating a snapshot and you can manually save custom data to the panel json. In the example, a new field called snapshotLocationData in the panel json is initialized with a snapshot of the custom data.
 

docs/sources/developers/plugins/migration-guide.md

@@ -37,7 +37,7 @@ For more information, refer to [@grafana/toolkit](https://www.npmjs.com/package/
 
 ### Field options
 
-Grafana 7.0 introduced the concept of [_field options_]({{< relref "../../panels/field-options/_index.md#field-options" >}}), a new way of configuring your data before it gets visualized. Since this was not available in previous versions, any plugin that enables field-based configuration will not work in previous versions of Grafana.
+Grafana 7.0 introduced the concept of _field options_, a new way of configuring your data before it gets visualized. Since this was not available in previous versions, any plugin that enables field-based configuration will not work in previous versions of Grafana.
 
 For plugins prior to Grafana 7.0, all options are considered _Display options_. The tab for field configuration isn't available.
 

docs/sources/developers/plugins/working-with-data-frames.md

@@ -90,7 +90,7 @@ view.forEach(row => {
 
 ## Display values from a data frame
 
-[Field options]({{< relref "../../panels/field-options/_index.md" >}}) let the user control how Grafana displays the data in a data frame.
+Field options let the user control how Grafana displays the data in a data frame.
 
 To apply the field options to a value, use the `display` method on the corresponding field. The result contains information such as the color and suffix to use when display the value.
 

docs/sources/enterprise/_index.md

@@ -43,7 +43,9 @@ 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.
+- [Data source query caching]({{< relref "query-caching.md" >}}) to temporarily store query results in Grafana to reduce data source load and rate limiting.
 - [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" >}})
 - [White labeling]({{< relref "white-labeling.md" >}}) to customize Grafana from the brand and logo to the footer links.
@@ -51,6 +53,7 @@ With Grafana Enterprise, you get access to new features, including:
 - [Vault integration]({{< relref "vault.md" >}}) to manage your configuration or provisioning secrets with Vault.
 - [Auditing]({{< relref "auditing.md" >}}) tracks important changes to your Grafana instance to help you manage and mitigate suspicious activity and meet compliance requirements.
 - [Request security]({{< relref "request-security.md" >}}) makes it possible to restrict outgoing requests from the Grafana server.
+- [Settings updates at runtime]({{< relref "settings-updates.md" >}}) allows you to update Grafana settings at runtime without requiring a restart.
 
 ## Enterprise data sources
 
@@ -74,4 +77,3 @@ With a Grafana Enterprise license, you get access to premium data sources, inclu
 ## Try Grafana Enterprise
 
 To purchase or obtain a trial license contact the Grafana Labs [Sales Team](https://grafana.com/contact?about=support&topic=Grafana%20Enterprise).
-

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" >}}).

docs/sources/enterprise/access-control/fine-grained-access-control-references.md

@@ -0,0 +1,31 @@
++++
+title = "Fine-grained access control references"
+description = "Refer to fine-grained access control references"
+keywords = ["grafana", "fine-grained-access-control", "roles", "fixed-roles", "built-in-role-assignments", "permissions", "enterprise"]
+weight = 130
++++
+
+# Fine-grained access control references
+The reference information that follows complements conceptual information about [Roles]({{< relref "./roles.md" >}}).
+
+## Fine-grained access fixed roles
+
+Fixed roles | Permissions | Descriptions
+--- | --- | ---
+fixed:permissions:admin:read | roles:read<br>roles:list<br>roles.builtin:list | Allows to list and get available roles and built-in role assignments.
+fixed:permissions:admin:edit | All permissions from `fixed: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.
+fixed:reporting:admin:read | reports:read<br>reports:send<br>reports.settings:read | Allows to read reports and report settings.
+fixed:reporting:admin:edit | All permissions from `fixed: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. 
+fixed: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.
+fixed:users:admin:edit | All permissions from `fixed: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. 
+fixed:users:org:read | org.users:read | Allows to get user organizations.
+fixed:users:org:edit | All permissions from `fixed: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.
+fixed:ldap:admin:read | ldap.user:read<br>ldap.status:read | Allows to read LDAP information and status.
+fixed:ldap:admin:edit | All permissions from `fixed:ldap:admin:read` and <br>ldap.user:sync | Allows every read action for LDAP and in addition allows to administer LDAP.
+
+## Default built-in role assignments
+
+Built-in roles | Associated roles | Descriptions
+--- | --- | ---
+Grafana Admin | fixed:permissions:admin:edit<br>fixed:permissions:admin:read<br>fixed:reporting:admin:edit<br>fixed:reporting:admin:read<br>fixed:users:admin:edit<br>fixed:users:admin:read<br>fixed:users:org:edit<br>fixed:users:org:read<br>fixed:ldap:admin:edit<br>fixed:ldap:admin:read | Allows access to resources which [Grafana Server Admin]({{< relref "../../permissions/_index.md#grafana-server-admin-role" >}}) has permissions by default.
+Admin | fixed:users:org:edit<br>fixed:users:org:read<br>fixed:reporting:admin:edit<br>fixed:reporting:admin:read | Allows access to resource which [Admin]({{< relref "../../permissions/organization_roles.md" >}}) has permissions by default.

docs/sources/enterprise/access-control/permissions.md

@@ -0,0 +1,77 @@
++++
+title = "Permissions"
+description = "Understand fine-grained access control permissions"
+keywords = ["grafana", "fine-grained access-control", "roles", "permissions", "enterprise"]
+weight = 115
++++
+
+# Permissions
+
+A permission is an action and a scope. When creating a fine-grained access control, consider what specific action a user should be allowed to perform, and on what resources (its scope).
+
+To grant permissions to a user, you create a built-in role assignment to map a role to a built-in role. A built-in role assignment *modifies* 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.
+
+## Action definitions
+
+The following list contains fine-grained access control actions.
+
+Actions | Applicable scopes | Descriptions
+--- | --- | ---
+roles:list | roles:* | List available roles without permissions.
+roles:read | roles:* | Read a specific role with it's permissions.
+roles:write | permissions:delegate | Create or update a custom role.
+roles:delete | permissions:delegate | Delete a custom role.
+roles.builtin:list | roles:* | List built-in role assignments.
+roles.builtin:add | permissions:delegate | Create a built-in role assignment.
+roles.builtin:remove | permissions:delegate | Delete a built-in role assignment.
+reports.admin:create | reports:* | Create reports.
+reports.admin:write | reports:* | Update reports.
+reports:delete | reports:* | Delete reports.
+reports:read | reports:* | List all available reports or get a specific report.
+reports:send | reports:* | Send a report email.
+reports.settings:write | n/a | Update report settings.
+reports.settings:read | n/a | Read report settings.
+provisioning:reload | service:access-control | Reload provisioning files.
+users:read | global:users:* | Read or search user profiles.
+users:write | global:users:* | Update a user’s profile.
+users.teams:read | global:users:* | Read a user’s teams.
+users.authtoken:list | global:users:* | List authentication tokens that are assigned to a user.
+users.authtoken:update | global:users:* | Update authentication tokens that are assigned to a user.
+users.password:update | global:users:* | Update a user’s password.
+users:delete | global:users:* | Delete a user.
+users:create | n/a | Create a user.
+users:enable | global:users:* | Enable a user.
+users:disable | global:users:* | Disable a user.
+users.permissions:update | global:users:* | Update a user’s organization-level permissions.
+users:logout | global:users:* | Log out a user.
+users.quotas:list | global:users:* | List a user’s quotas.
+users.quotas:update | global:users:* | Update a user’s quotas.
+org.users.read | users:* | Get user profiles within an organization.
+org.users.add | users:* | Add a user to an organization.
+org.users.remove | users:* | Remove a user from an organization.
+org.users.role:update | users:* | Update the organization role (`Viewer`, `Editor`, `Admin`) for an organization.
+ldap.user:read | n/a | Get a user via LDAP.
+ldap.user:sync | n/a | Sync a user via LDAP.
+ldap.status:read | n/a | Verify the LDAP servers’ availability.
+status:accesscontrol | service:access-control | Get access-control enabled status.
+
+## Scope definitions
+
+The following list contains fine-grained access control scopes.
+
+Scopes | Descriptions
+--- | ---
+roles:* | Restrict an action to a set of roles. For example, `roles:*` matches any role, `roles:randomuid` matches only the role with UID `randomuid` and `roles:custom:reports:{editor,viewer}` matches both `custom:reports:editor` and `custom:reports:viewer` roles.
+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:* | Restrict an action to a set of reports. For example, `reports:*` matches any report and `reports:1` matches the report with id `1`.
+service:accesscontrol | Restrict an action to target only the fine-grained access control service. For example, you can use this in conjunction with the `provisioning:reload` or the `status:accesscontrol` actions.
+global:users:* | Restrict an action to a set of global users.
+users:* | Restrict an action to a set of users from an organization.

docs/sources/enterprise/access-control/provisioning.md

@@ -0,0 +1,264 @@
++++
+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 placed in [`provisioning/access-control/`]({{< relref "../../administration/configuration/#provisioning" >}}).
+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.
+
+### Create or update roles
+
+To create or update custom roles, you can add a list of `roles` in the configuration.
+
+Every role has a [version]({{< relref "./roles.md#custom-roles" >}}) number. For each role you update, you must remember to increment it, otherwise changes won't be accounted for.
+
+When you update a role, the existing role inside grafana is altered to be exactly what is specified in the YAML file, including permissions.
+
+Here is an example YAML file to create a local role with a set of permissions:
+
+```yaml
+# config file version
+apiVersion: 1
+
+# Roles to insert into the database, or roles to update in the database
+roles:
+  - name: custom:users:editor
+    description: "This role allows users to list, create, or update other users within the organization."
+    version: 1
+    orgId: 1
+    permissions:
+      - action: "users:read"
+        scope: "users:*"
+      - action: "users:write"
+        scope: "users:*"
+      - action: "users:create"
+        scope: "users:*"
+```
+
+Here is an example YAML file to create a global role with a set of permissions, where the `global:true` option makes a role global:
+
+```yaml
+# config file version
+apiVersion: 1
+
+# Roles to insert into the database, or roles to update in the database
+roles:
+  - name: custom:users:editor
+    description: "This role allows users to list, create, or update other users within the organization."
+    version: 1
+    global: true
+    permissions:
+      - action: "users:read"
+        scope: "users:*"
+      - action: "users:write"
+        scope: "users:*"
+      - action: "users:create"
+        scope: "users:*"
+```
+The `orgId` is lost when the role is set to global.
+
+### Delete roles 
+
+To delete a role, you can add a list of roles under the `deleteRoles` section in the configuration file. Such a deletion is performed after a role is inserted or updated.
+
+Here is an example YAML file to delete a role:
+```yaml
+# config file version
+apiVersion: 1
+
+# list of roles that should be deleted
+deleteRoles:
+  - name: custom:reports:editor
+    orgId: 1
+    force: true
+```
+
+### Assign your custom role to specific built-in roles
+
+To assign roles to built-in roles, add said built-in roles to the `builtInRoles` section of your roles. To remove a specific assignment, remove it from the list.
+
+For example, the following role is assigned to an organization editor or an organization administrator:
+
+```yaml
+# config file version
+apiVersion: 1
+
+# Roles to insert/update in the database
+roles:
+  - name: custom:users:editor
+    description: "This role allows users to list/create/update other users in the organization"
+    version: 1
+    orgId: 1
+    permissions:
+      - action: "users:read"
+        scope: "users:*"
+      - action: "users:write"
+        scope: "users:*"
+      - action: "users:create"
+        scope: "users:*"
+    builtInRoles:
+      - name: "Editor"
+      - name: "Admin"
+```
+
+## Manage default built-in role assignments
+
+During startup, Grafana creates [default built-in role assignments]({{< relref "./roles#default-built-in-role-assignments" >}}) with [fixed roles]({{< relref "./roles#fixed-roles" >}}). You can remove and later restore those assignments with provisioning.
+
+### Remove default assignment
+
+To remove default built-in role assignments, use the `removeDefaultAssignments` element in the configuration file. You need to provide the built-in role name and fixed role name.
+
+Here is an example:
+```yaml
+# config file version
+apiVersion: 1
+
+# list of default built-in role assignments that should be removed
+removeDefaultAssignments:
+  - builtInRole: "Grafana Admin"
+    fixedRole: "fixed:permissions:admin"
+
+```
+
+### Restore default assignment
+
+To restore the default built-in role assignment, use the `addDefaultAssignments` element in the configuration file. You need to provide the built-in role name and the fixed-role name.
+
+Here is an example:
+```yaml
+# config file version
+apiVersion: 1
+
+# list of default built-in role assignments that should be added back
+addDefaultAssignments:
+  - builtInRole: "Admin"
+    fixedRole: "fixed:reporting:admin:read"
+```
+
+## Full 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 fixed roles
+    fixedRole: "fixed: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 fixed roles
+    fixedRole: "fixed: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: "custom:reports:editor"
+    # <string> uid of the role. Required if no name
+    uid: "customreportseditor1"
+    # <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
+  - name: "custom:global:reports:reader"
+    uid: "customglobalreportsreader1"
+    # <bool> overwrite org id and removes a global role
+    global: true
+    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: "custom:users:editor"
+    # <string> uid of the role. Has to be unique for all orgs.
+    uid: customuserseditor1
+    # <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> 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        
+  - name: "custom:global:users:reader"
+    uid: "customglobalusersreader1"
+    description: "Global Role for custom user readers"
+    version: 1
+    # <bool> overwrite org id and creates a global role
+    global: true
+    permissions:
+      - action: "users:read"
+        scope: "users:*"
+    builtInRoles:
+      - name: "Viewer"
+        orgId: 1        
+      - name: "Editor"
+        # <bool> overwrite org id and assign role globally
+        global: true
+```
+
+## 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 `fixed:` prefix. 
+
+### Permissions
+
+- `name` must not be empty
+
+### 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`. For global roles the default `orgId` is used.
+- `orgId` in the `role` and in the assignment must be the same for none global roles. 
+
+### Role deletion
+
+- Either the role `name` or `uid` must be provided

docs/sources/enterprise/access-control/roles.md

@@ -0,0 +1,85 @@
++++
+title = "Roles"
+description = "Understand roles in fine-grained access control"
+keywords = ["grafana", "fine-grained-access-control", "roles", "fixed-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:
+- [Fixed roles]({{< relref "./roles.md#fixed-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.
+
+## Fixed roles
+
+Fixed roles provide convenience and guarantee of consistent behaviour by combining relevant [permissions]({{< relref "./permissions.md" >}}) together. Fixed roles are created and updated by Grafana during startup.
+There are few basic rules for fixed roles:
+
+- All fixed roles are _global_.
+- All fixed roles have a `fixed:` prefix. 
+- You can’t change or delete a fixed role.
+
+For more information, refer to [Fine-grained access control references]({{< relref "./fine-grained-access-control-references.md#fine-grained-access-fixed-roles" >}}).
+
+## 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 `fixed:` are fixed 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 [Fixed roles]({{< ref "#fixed-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.
+
+For more information, refer to [Fine-grained access control references]({{< relref "./fine-grained-access-control-references.md#default-built-in-role-assignments" >}}).
+
+## 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.