Embed Grafana metrics in issue MVC
Problem to Solve
Our enterprise customers who are using GitLab monitoring (Prometheus) are making heavy use of Grafana visualizations. When there are incidents, we have found that incident responders are having to copy & paste screenshots of charts from Grafana in issues so that they can share knowledge and information with teammates as well as keep the issue up-to-date so that they can communicate the status of the incident to stakeholders.
We want to give them the ability to embed Grafana metrics in issues using a link. We want there to be two types of embeds:
- Static (i.e. set to a time frame) - this shows what was going on when the incident happened
- Live - updates as time progresses - this is helpful to communicate progress on the incident
Intended users
Sasha the Software Developer
Devon the DevOps Engineer
Sidney the Systems Administrator
Further details
This work contributes to the Incident Management Vision
Proposal
We want to figure out a way to embed interactive charts in GitLab issues, both live (i.e. updates with new data) . and static (set to a given time). Right now it is possible to insert an image snapshot of a Grafana using an img tag in GFM and pasting the src URL from play.grafana.org. These charts are not interactive, but they will update with new data when the page is refreshed. They can also be specified with a time frame achieving a static chart. This is possible today. We will be updating our documentation on how to do this.
We are also exploring how to embed interactive Grafana charts in issues. This make be via iframes or importing JSON objects of charts into our own echart formats.
Let's follow the same design patterns we are using for linking/unfurling metrics charts from the GitLab dashboard.
To minimize scope creep of the MVC, we will be limiting this implementation for public metrics only. In order to embed and share private or metrics with limited access, we will need to think about authentication for Grafana <> GitLab
User Journey 1
- User copies links to Grafana metric and pastes it into a GitLab issue template
- User configures auto-creation of issues using this templates
- Issue is created automatically upon receipt of a Prometheus alert
- Grafana metric unfurls in the issue
- User can click link back to the Grafana dashboard
- User can refresh the page to see new data
User Journey 2
- During a fire-fight User copies a link to a particular Grafana metric
- User pastes this metric into the issue description or comment and the visual unfurls
- User can refresh the page to see new data
Permissions and Security
Documentation
Testing
What does success look like, and how can we measure that?
What is the type of buyer?
Links / references
/label feature