Add related dashboard links in metrics dashboard
### Problem to solve Grafana has a handy section that contains links to related dashboards based on user preferences; from what I can understand, this could prove useful to whoever is working on triaging an issue that might need to dig deeper into a particular system and or label. ![Screen_Shot_2020-02-05_at_15.32.36](/uploads/4f82f16243049049791f6894f9cdb0e1/Screen_Shot_2020-02-05_at_15.32.36.png) We should allow users customize this either via the YML configuration files or through a specific UI made for this particular purpose ### Intended users * [Devon (DevOps Engineer)](https://about.gitlab.com/handbook/marketing/product-marketing/roles-personas/#devon-devops-engineer) * [Sidney (Systems Administrator)](https://about.gitlab.com/handbook/marketing/product-marketing/roles-personas/#sidney-systems-administrator) ### Further details ### WIP Proposal #### MVC * The links will be set up in the .yml file, the user should be able to define different links for any of their dashboards * Similar to the [chart links](https://gitlab.com/gitlab-org/gitlab/-/issues/214436), in the first iteration all links will look the same, and will open in the same tab. The user can right click on the link to open it in a new tab. * Chart links should lead to a full screen chart view. | MVC with one row of links | | ------ | | ![Dashboard_links_MVC_-_one_row_of_links](/uploads/242036b698636563dbc6567ce0e05535/Dashboard_links_MVC_-_one_row_of_links.png) | #### 2nd iteration * When there are more than 1 row of links, there will be an option to collapse/ expand links. We should keep the links panel collapsed by default. * User can set up collections of links that will show up in the UI as dropdowns * User will define the collection name and the links within it in a .yml * The links will retain the time range of the current dashboard. * We should visually differentiate between link types (chart/ dashboard/ external link) * External links will open in a new tab (only charts and dashboards will open in the same tab) | More links (collapsed) | More links (expanded) | | ------ | ------ | | ![Dashboard_links_MVC_-_many_links_collapsed_panel](/uploads/c32e1d80e9e0911242f9718b882f3aff/Dashboard_links_MVC_-_many_links_collapsed_panel.png) | ![Dashboard_links_MVC_-_many_links_expanded_panel](/uploads/b318993fccf4b960b58c7d05942acdf4/Dashboard_links_MVC_-_many_links_expanded_panel.png) | | Different link types with icons | Dropdown | | ------ | ------ | | ![Dashboard_links_MVC_-_link_dropdowns](/uploads/94f958acf76cdf8bd02eb9dcae86a497/Dashboard_links_MVC_-_link_dropdowns.png)| ![Dashboard_links_MVC_-_link_dropdown_open](/uploads/131ecd1131f31f53cb5cbf13771d954a/Dashboard_links_MVC_-_link_dropdown_open.png) | #### 3rd iteration * [Configure links within GitLab UI](https://gitlab.com/gitlab-org/gitlab/-/issues/217341) ### Permissions and Security ### Documentation This feature needs to be documented. * How can the user set up the links for each dashboard? ### Availability & Testing ### What does success look like, and how can we measure that? ### What is the type of buyer? ### Links / references
epic