[docs/update-grafana-dashboard-docs] Update Grafana dashboard instructions

Instructions to add Grafana dashboard do not work. The proposed
functions are wrong, according to
[grafana.libsonnet](https://github.com/brancz/kubernetes-grafana/blob/master/grafana/grafana.libsonnet)
`dashboards` and `rawDashboards` should be used in `grafana+::`
field.

This PR updates the existing documentation and fixes minor typos.

docs/developing-prometheus-rules-and-grafana-dashboards.md

@@ -312,7 +312,7 @@ local kp = (import 'kube-prometheus/kube-prometheus.libsonnet') + {
 { ['grafana-' + name]: kp.grafana[name] for name in std.objectFields(kp.grafana) }
 ```
 
-Incase you have lots of json dashboard exported out from grafan UI the above approch is going to take lots of time. to improve performance we can use `rawGrafanaDashboards` field and provide it's value as json string by using importstr
+In case you have lots of json dashboard exported out from grafana UI the above approach is going to take lots of time to improve performance we can use `rawDashboards` field and provide it's value as json string by using `importstr`
 [embedmd]:# (../examples/grafana-additional-rendered-dashboard-example-2.jsonnet)
 ```jsonnet
 local kp = (import 'kube-prometheus/kube-prometheus.libsonnet') + {

examples/grafana-additional-jsonnet-dashboard-example.jsonnet

@@ -9,30 +9,32 @@ local kp = (import 'kube-prometheus/kube-prometheus.libsonnet') + {
   _config+:: {
     namespace: 'monitoring',
   },
-  grafanaDashboards+:: {
+  grafana+:: {
-    'my-dashboard.json':
+    dashboards+:: {
-      dashboard.new('My Dashboard')
+      'my-dashboard.json':
-      .addTemplate(
+        dashboard.new('My Dashboard')
-        {
+        .addTemplate(
-          current: {
+          {
-            text: 'Prometheus',
+            current: {
-            value: 'Prometheus',
+              text: 'Prometheus',
+              value: 'Prometheus',
+            },
+            hide: 0,
+            label: null,
+            name: 'datasource',
+            options: [],
+            query: 'prometheus',
+            refresh: 1,
+            regex: '',
+            type: 'datasource',
           },
-          hide: 0,
+        )
-          label: null,
+        .addRow(
-          name: 'datasource',
+          row.new()
-          options: [],
+          .addPanel(graphPanel.new('My Panel', span=6, datasource='$datasource')
-          query: 'prometheus',
+                    .addTarget(prometheus.target('vector(1)')))
-          refresh: 1,
+        ),
-          regex: '',
+    },
-          type: 'datasource',
-        },
-      )
-      .addRow(
-        row.new()
-        .addPanel(graphPanel.new('My Panel', span=6, datasource='$datasource')
-                  .addTarget(prometheus.target('vector(1)')))
-      ),
   },
 };
 

examples/grafana-additional-rendered-dashboard-example-2.jsonnet

@@ -2,8 +2,10 @@ local kp = (import 'kube-prometheus/kube-prometheus.libsonnet') + {
   _config+:: {
     namespace: 'monitoring',
   },
-  rawGrafanaDashboards+:: {
+  grafana+:: {
-    'my-dashboard.json': (importstr 'example-grafana-dashboard.json'),
+    rawDashboards+:: {
+      'my-dashboard.json': (importstr 'example-grafana-dashboard.json'),
+    },
   },
 };
 

examples/grafana-additional-rendered-dashboard-example.jsonnet

@@ -2,9 +2,14 @@ local kp = (import 'kube-prometheus/kube-prometheus.libsonnet') + {
   _config+:: {
     namespace: 'monitoring',
   },
-  grafanaDashboards+:: {
+  grafanaDashboards+:: { //  monitoring-mixin compatibility
     'my-dashboard.json': (import 'example-grafana-dashboard.json'),
   },
+  grafana+:: {
+    dashboards+:: { // use this method to import your dashboards to Grafana
+      'my-dashboard.json': (import 'example-grafana-dashboard.json'),
+    },
+  },
 };
 
 { ['00namespace-' + name]: kp.kubePrometheus[name] for name in std.objectFields(kp.kubePrometheus) } +