dashboard: fix rendering link to panel in collapsed row

public/app/features/dashboard/view_state_srv.ts

 import angular from 'angular';
 import angular from 'angular';
 import _ from 'lodash';
 import _ from 'lodash';
 import config from 'app/core/config';
 import config from 'app/core/config';
+import { DashboardModel } from './dashboard_model';
 
 
 // represents the transient view state
 // represents the transient view state
 // like fullscreen panel & edit
 // like fullscreen panel & edit
@@ -8,7 +9,7 @@ export class DashboardViewState {
   state: any;
   state: any;
   panelScopes: any;
   panelScopes: any;
   $scope: any;
   $scope: any;
-  dashboard: any;
+  dashboard: DashboardModel;
   editStateChanged: any;
   editStateChanged: any;
   fullscreenPanel: any;
   fullscreenPanel: any;
   oldTimeRange: any;
   oldTimeRange: any;
@@ -89,6 +90,12 @@ export class DashboardViewState {
       }
       }
     }
     }
 
 
+    if (this.state.fullscreen && this.state.panelId) {
+      // Trying to render panel in fullscreen when it's in the collapsed row causes an issue.
+      // So in this case expand collapsed row first.
+      this.toggleCollapsedPanelRow(this.state.panelId);
+    }
+
     // if no edit state cleanup tab parm
     // if no edit state cleanup tab parm
     if (!this.state.edit) {
     if (!this.state.edit) {
       delete this.state.tab;
       delete this.state.tab;
@@ -103,6 +110,19 @@ export class DashboardViewState {
     this.syncState();
     this.syncState();
   }
   }
 
 
+  toggleCollapsedPanelRow(panelId) {
+    for (let panel of this.dashboard.panels) {
+      if (panel.collapsed) {
+        for (let rowPanel of panel.panels) {
+          if (rowPanel.id === panelId) {
+            this.dashboard.toggleRow(panel);
+            return;
+          }
+        }
+      }
+    }
+  }
+
   syncState() {
   syncState() {
     if (this.panelScopes.length === 0) {
     if (this.panelScopes.length === 0) {
       return;
       return;