PanelChrome: Allow panel to be dragged if set as draggable from the outside (#61698)

public/app/features/dashboard/dashgrid/DashboardGrid.tsx

@@ -240,6 +240,7 @@ export class DashboardGrid extends PureComponent<Props, State> {
                   cols={GRID_COLUMN_COUNT}
                   rowHeight={GRID_CELL_HEIGHT}
                   draggableHandle=".grid-drag-handle"
+                  draggableCancel=".grid-drag-cancel"
                   layout={this.buildLayout()}
                   onDragStop={this.onDragStop}
                   onResize={this.onResize}

public/app/features/dashboard/dashgrid/PanelStateWrapper.tsx

@@ -636,6 +636,8 @@ export class PanelStateWrapper extends PureComponent<Props, State> {
     const title = panel.getDisplayTitle();
     const padding: PanelPadding = plugin.noPadding ? 'none' : 'md';
 
+    const dragClass = !(isViewing || isEditing) ? 'grid-drag-handle' : '';
+
     const titleItems = [
       <PanelHeaderTitleItems
         key="title-items"
@@ -674,6 +676,8 @@ export class PanelStateWrapper extends PureComponent<Props, State> {
           description={!!panel.description ? this.onShowPanelDescription : undefined}
           titleItems={titleItems}
           menu={menu}
+          dragClass={dragClass}
+          dragClassCancel="grid-drag-cancel"
           padding={padding}
         >
           {(innerWidth, innerHeight) => (