Dashboards: Canvas panel inline-edit enabled for read-only dashboards

[leventebalogh]

What happened?

Screen.Recording.2024-05-07.at.15.27.59.mov

It looks like even though making a dashboard "read-only" should disable all editing on a dashboard, inline-edits for canvas panels still work - even though the changes cannot be saved.

What did you expect to happen?

I would expect inline-editing to be disabled if a dashboard is set to read-only.

Did this work before?

I am not sure it worked before.

How do we reproduce it?

1. Open a dashboard with a Canvas panel on it
2. Enable inline editing for the Canvas panel
3. Make the dashboard read-only under Settings
4. Reload the page
5. Check if inline edit still works

Is the bug inside a dashboard panel?

Key	Value
Panel	canvas @ 11.1.0-70397
Grafana	Grafana v11.1.0-70397 (0c702d3) // Cloud Pro

Panel debug snapshot dashboard

{
  "panels": [
    {
      "datasource": {
        "type": "grafana",
        "uid": "grafana"
      },
      "fieldConfig": {
        "defaults": {
          "mappings": [],
          "thresholds": {
            "mode": "absolute",
            "steps": [
              {
                "color": "green",
                "value": null
              },
              {
                "color": "red",
                "value": 80
              }
            ]
          },
          "color": {
            "mode": "thresholds"
          }
        },
        "overrides": []
      },
      "gridPos": {
        "h": 13,
        "w": 15,
        "x": 0,
        "y": 0
      },
      "id": 2,
      "options": {
        "inlineEditing": true,
        "showAdvancedTypes": true,
        "panZoom": false,
        "infinitePan": false,
        "root": {
          "background": {
            "color": {
              "fixed": "transparent"
            }
          },
          "border": {
            "color": {
              "fixed": "dark-green"
            }
          },
          "elements": [
            {
              "background": {
                "color": {
                  "fixed": "#D9D9D9"
                }
              },
              "border": {
                "color": {
                  "fixed": "dark-green"
                }
              },
              "config": {
                "align": "center",
                "color": {
                  "fixed": "#000000"
                },
                "size": 20,
                "text": {
                  "field": "",
                  "fixed": "",
                  "mode": "field"
                },
                "valign": "middle"
              },
              "constraint": {
                "horizontal": "left",
                "vertical": "top"
              },
              "name": "Element 1",
              "placement": {
                "top": 102,
                "height": 50,
                "left": 185,
                "width": 260
              },
              "type": "metric-value"
            }
          ],
          "name": "Element 1715088083854",
          "type": "frame"
        }
      },
      "pluginVersion": "11.1.0-70397",
      "targets": [
        {
          "refId": "A",
          "datasource": {
            "type": "grafana",
            "uid": "grafana"
          },
          "queryType": "snapshot",
          "snapshot": []
        }
      ],
      "title": "Reproduced with embedded data",
      "type": "canvas"
    },
    {
      "gridPos": {
        "h": 7,
        "w": 9,
        "x": 15,
        "y": 0
      },
      "id": 5,
      "options": {
        "content": "<table width=\"100%\">\n    <tr>\n      <th width=\"2%\">Panel</th>\n      <td >canvas @ 11.1.0-70397</td>\n    </tr>\n    <tr>\n      <th>Queries</th>\n      <td>A[prometheus]</td>\n    </tr>\n    \n    <tr><th>Data</th><td> 0 frames, 0 fields, 0 rows </td></tr>\n    \n    <tr>\n      <th>Grafana</th>\n      <td>Grafana v11.1.0-70397 (0c702d335e) // Cloud Pro</td>\n    </tr>\n  </table>",
        "mode": "html"
      },
      "title": "Debug info",
      "type": "text"
    },
    {
      "id": 6,
      "title": "Original Panel JSON",
      "type": "text",
      "gridPos": {
        "h": 13,
        "w": 9,
        "x": 15,
        "y": 7
      },
      "options": {
        "content": "{\n  \"datasource\": {\n    \"type\": \"prometheus\",\n    \"uid\": \"grafanacloud-prom\"\n  },\n  \"fieldConfig\": {\n    \"defaults\": {\n      \"mappings\": [],\n      \"thresholds\": {\n        \"mode\": \"absolute\",\n        \"steps\": [\n          {\n            \"color\": \"green\",\n            \"value\": null\n          },\n          {\n            \"color\": \"red\",\n            \"value\": 80\n          }\n        ]\n      },\n      \"color\": {\n        \"mode\": \"thresholds\"\n      }\n    },\n    \"overrides\": []\n  },\n  \"gridPos\": {\n    \"h\": 8,\n    \"w\": 12,\n    \"x\": 0,\n    \"y\": 0\n  },\n  \"id\": 1,\n  \"options\": {\n    \"inlineEditing\": true,\n    \"showAdvancedTypes\": true,\n    \"panZoom\": false,\n    \"infinitePan\": false,\n    \"root\": {\n      \"background\": {\n        \"color\": {\n          \"fixed\": \"transparent\"\n        }\n      },\n      \"border\": {\n        \"color\": {\n          \"fixed\": \"dark-green\"\n        }\n      },\n      \"elements\": [\n        {\n          \"background\": {\n            \"color\": {\n              \"fixed\": \"#D9D9D9\"\n            }\n          },\n          \"border\": {\n            \"color\": {\n              \"fixed\": \"dark-green\"\n            }\n          },\n          \"config\": {\n            \"align\": \"center\",\n            \"color\": {\n              \"fixed\": \"#000000\"\n            },\n            \"size\": 20,\n            \"text\": {\n              \"field\": \"\",\n              \"fixed\": \"\",\n              \"mode\": \"field\"\n            },\n            \"valign\": \"middle\"\n          },\n          \"constraint\": {\n            \"horizontal\": \"left\",\n            \"vertical\": \"top\"\n          },\n          \"name\": \"Element 1\",\n          \"placement\": {\n            \"top\": 102,\n            \"height\": 50,\n            \"left\": 185,\n            \"width\": 260\n          },\n          \"type\": \"metric-value\"\n        }\n      ],\n      \"name\": \"Element 1715088083854\",\n      \"type\": \"frame\"\n    }\n  },\n  \"pluginVersion\": \"11.1.0-70397\",\n  \"targets\": [\n    {\n      \"datasource\": {\n        \"type\": \"prometheus\",\n        \"uid\": \"grafanacloud-prom\"\n      },\n      \"expr\": \"\",\n      \"instant\": false,\n      \"range\": true,\n      \"refId\": \"A\"\n    }\n  ],\n  \"title\": \"Panel Title\",\n  \"type\": \"canvas\"\n}",
        "mode": "code",
        "code": {
          "language": "json",
          "showLineNumbers": true,
          "showMiniMap": true
        }
      }
    },
    {
      "id": 3,
      "title": "Data from panel above",
      "type": "table",
      "datasource": {
        "type": "datasource",
        "uid": "-- Dashboard --"
      },
      "gridPos": {
        "h": 7,
        "w": 15,
        "x": 0,
        "y": 13
      },
      "options": {
        "showTypeIcons": true
      },
      "targets": [
        {
          "datasource": {
            "type": "datasource",
            "uid": "-- Dashboard --"
          },
          "panelId": 2,
          "withTransforms": true,
          "refId": "A"
        }
      ]
    }
  ],
  "schemaVersion": 37,
  "title": "Debug: Panel Title // 2024-05-07 15:39:57",
  "tags": [
    "debug",
    "debug-canvas"
  ],
  "time": {
    "from": "2024-05-07T07:39:57.246Z",
    "to": "2024-05-07T13:39:57.246Z"
  }
}

Environment (with versions)?

Grafana: 11.1.0-70397
OS: MacOS Sonoma
Browser: Chrome 124.0.6367.92

Grafana platform?

I use Grafana Cloud

Datasource(s)?

No response