From 8497c854f644f8b7251b5e791283f4e39e87d94a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Wed, 12 Dec 2018 08:54:12 +0100
Subject: [PATCH] Adding mixed query

---
 .../app/features/dashboard/dashgrid/QueriesTab.tsx  | 13 ++++++++-----
 public/app/features/dashboard/panel_model.ts        |  5 +++--
 .../prometheus/partials/query.editor.html           |  4 ++--
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/public/app/features/dashboard/dashgrid/QueriesTab.tsx b/public/app/features/dashboard/dashgrid/QueriesTab.tsx
index a01914327ef..31480403743 100644
--- a/public/app/features/dashboard/dashgrid/QueriesTab.tsx
+++ b/public/app/features/dashboard/dashgrid/QueriesTab.tsx
@@ -236,14 +236,14 @@ export class QueriesTab extends PureComponent<Props, State> {
     return isLoadingHelp ? <LoadingPlaceholder text="Loading help..." /> : helpContent;
   };
 
-  onAddQuery = (query?: DataQuery) => {
+  onAddQuery = (query?: Partial<DataQuery>) => {
     this.props.panel.addQuery(query);
     this.forceUpdate();
   };
 
   onAddQueryClick = () => {
     if (this.state.currentDS.meta.mixed) {
-      this.setState({ isAddingMixed: true })
+      this.setState({ isAddingMixed: true });
       return;
     }
 
@@ -284,8 +284,6 @@ export class QueriesTab extends PureComponent<Props, State> {
   };
 
   renderMixedPicker = () => {
-    const { currentDS } = this.state;
-
     return (
       <DataSourcePicker
         datasources={this.datasources}
@@ -299,6 +297,7 @@ export class QueriesTab extends PureComponent<Props, State> {
 
   onAddMixedQuery = datasource => {
     this.onAddQuery({ datasource: datasource.name });
+    this.component.digest();
     this.setState({ isAddingMixed: false });
   };
 
@@ -348,7 +347,11 @@ export class QueriesTab extends PureComponent<Props, State> {
                 </span>
                 <span className="gf-form-query-letter-cell-letter">{panel.getNextQueryLetter()}</span>
               </label>
-              {!isAddingMixed && <button className="btn btn-secondary gf-form-btn" onClick={this.onAddQueryClick}>Add Query</button>}
+              {!isAddingMixed && (
+                <button className="btn btn-secondary gf-form-btn" onClick={this.onAddQueryClick}>
+                  Add Query
+                </button>
+              )}
               {isAddingMixed && this.renderMixedPicker()}
             </div>
           </div>
diff --git a/public/app/features/dashboard/panel_model.ts b/public/app/features/dashboard/panel_model.ts
index e0a3e6707cb..2d5a70b47dd 100644
--- a/public/app/features/dashboard/panel_model.ts
+++ b/public/app/features/dashboard/panel_model.ts
@@ -238,9 +238,10 @@ export class PanelModel {
     this.restorePanelOptions(pluginId);
   }
 
-  addQuery(query?: DataQuery) {
+  addQuery(query?: Partial<DataQuery>) {
     query = query || { refId: 'A' };
-    (query.refId = this.getNextQueryLetter()), (query.isNew = true);
+    query.refId = this.getNextQueryLetter();
+    query.isNew = true;
 
     this.targets.push(query);
   }
diff --git a/public/app/plugins/datasource/prometheus/partials/query.editor.html b/public/app/plugins/datasource/prometheus/partials/query.editor.html
index 11a857f37e7..0f0a4b09014 100644
--- a/public/app/plugins/datasource/prometheus/partials/query.editor.html
+++ b/public/app/plugins/datasource/prometheus/partials/query.editor.html
@@ -8,7 +8,7 @@
   </div>
 
   <div class="gf-form-inline">
-    <div class="gf-form max-width-26">
+    <div class="gf-form">
       <label class="gf-form-label width-8">Legend format</label>
       <input type="text" class="gf-form-input" ng-model="ctrl.target.legendFormat" spellcheck='false' placeholder="legend format"
         data-min-length=0 data-items=1000 ng-model-onblur ng-change="ctrl.refreshMetricData()">
@@ -58,4 +58,4 @@
       <div class="gf-form-label gf-form-label--grow"></div>
     </div>
   </div>
-</query-editor-row>
\ No newline at end of file
+</query-editor-row>