From 352f22042c5f0dc22b1885a9d7d749da29d4276a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Mon, 11 May 2020 08:10:24 +0200
Subject: [PATCH] StatPanels: Hide calc option if all values is selected
 (#24416)

---
 .../components/DashLinks/editor.html          | 185 ++++++++++++++++++
 public/app/plugins/panel/stat/types.ts        |   2 +
 2 files changed, 187 insertions(+)
 create mode 100644 public/app/features/dashboard/components/DashLinks/editor.html

diff --git a/public/app/features/dashboard/components/DashLinks/editor.html b/public/app/features/dashboard/components/DashLinks/editor.html
new file mode 100644
index 00000000000..0aa73c8192d
--- /dev/null
+++ b/public/app/features/dashboard/components/DashLinks/editor.html
@@ -0,0 +1,185 @@
+<div class="page-action-bar">
+  <h3 class="dashboard-settings__header">
+    <a ng-click="ctrl.backToList()">Dashboard Links</a>
+    <span ng-show="ctrl.mode === 'new'"><icon name="'angle-right'"></icon> New</span>
+    <span ng-show="ctrl.mode === 'edit'"><icon name="'angle-right'"></icon> Edit</span>
+  </h3>
+
+  <div class="page-action-bar__spacer"></div>
+  <a
+    type="button"
+    class="btn btn-primary"
+    ng-click="ctrl.setupNew()"
+    ng-if="ctrl.dashboard.links.length > 0"
+    ng-hide="ctrl.mode === 'edit' || ctrl.mode === 'new'"
+  >
+    New
+  </a>
+</div>
+
+<div ng-if="ctrl.mode == 'list'">
+  <div ng-if="ctrl.dashboard.links.length === 0">
+    <empty-list-cta
+      on-click="ctrl.setupNew"
+      title="ctrl.emptyListCta.title"
+      buttonIcon="ctrl.emptyListCta.buttonIcon"
+      buttonTitle="ctrl.emptyListCta.buttonTitle"
+      infoBox="ctrl.emptyListCta.infoBox"
+      infoBoxTitle="ctrl.emptyListCta.infoBoxTitle"
+    />
+  </div>
+
+  <div ng-if="ctrl.dashboard.links.length > 0">
+    <table class="filter-table filter-table--hover">
+      <thead>
+        <tr>
+          <th>Type</th>
+          <th>Info</th>
+          <th colspan="3"></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr ng-repeat="link in ctrl.dashboard.links">
+          <td class="pointer" ng-click="ctrl.editLink(link)">
+            <icon name="'external-link-alt'"></icon>
+            {{ link.type }}
+          </td>
+          <td>
+            <div ng-if="link.title">
+              {{ link.title }}
+            </div>
+            <div ng-if="!link.title && link.url">
+              {{ link.url }}
+            </div>
+            <span
+              ng-if="!link.title && link.tags"
+              ng-repeat="tag in link.tags"
+              tag-color-from-name="tag"
+              class="label label-tag"
+              style="margin-right: 6px"
+            >
+              {{ tag }}
+            </span>
+          </td>
+          <td style="width: 1%">
+            <icon ng-click="ctrl.moveLink($index, -1)" ng-hide="$first" name="'arrow-up'"></icon>
+          </td>
+          <td style="width: 1%">
+            <icon ng-click="ctrl.moveLink($index, 1)" ng-hide="$last" name="'arrow-down'"></icon>
+          </td>
+          <td style="width: 1%">
+            <a ng-click="ctrl.deleteLink($index)" class="btn btn-danger btn-small" ng-hide="annotation.builtIn">
+              <icon name="'times'" style="margin-bottom: 0;"></icon>
+            </a>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+
+<div ng-if="ctrl.mode == 'edit' || ctrl.mode == 'new'">
+  <div class="gf-form-group">
+    <div class="gf-form-group">
+      <div class="gf-form">
+        <span class="gf-form-label width-8">Type</span>
+        <div class="gf-form-select-wrapper width-10">
+          <select
+            class="gf-form-input"
+            ng-model="ctrl.link.type"
+            ng-options="f for f in ['dashboards','link']"
+          ></select>
+        </div>
+      </div>
+
+      <div class="gf-form" ng-show="ctrl.link.type === 'dashboards'">
+        <span class="gf-form-label width-8">With tags</span>
+        <bootstrap-tagsinput
+          ng-model="ctrl.link.tags"
+          tagclass="label label-tag"
+          placeholder="add tags"
+          style="margin-right: .25rem"
+        ></bootstrap-tagsinput>
+      </div>
+
+      <gf-form-switch
+        ng-show="ctrl.link.type === 'dashboards'"
+        class="gf-form"
+        label="As dropdown"
+        checked="ctrl.link.asDropdown"
+        switch-class="max-width-4"
+        label-class="width-8"
+      ></gf-form-switch>
+      <div class="gf-form" ng-show="ctrl.link.type === 'dashboards' && ctrl.link.asDropdown">
+        <span class="gf-form-label width-8">Title</span>
+        <input type="text" ng-model="ctrl.link.title" class="gf-form-input max-width-10" ng-model-onblur />
+      </div>
+      <div ng-show="ctrl.link.type === 'link'">
+        <div class="gf-form">
+          <li class="gf-form-label width-8">Url</li>
+          <input type="text" ng-model="ctrl.link.url" class="gf-form-input width-20" ng-model-onblur />
+        </div>
+
+        <div class="gf-form">
+          <span class="gf-form-label width-8">Title</span>
+          <input type="text" ng-model="ctrl.link.title" class="gf-form-input width-20" ng-model-onblur />
+        </div>
+
+        <div class="gf-form">
+          <span class="gf-form-label width-8">Tooltip</span>
+          <input
+            type="text"
+            ng-model="ctrl.link.tooltip"
+            class="gf-form-input width-20"
+            placeholder="Open dashboard"
+            ng-model-onblur
+          />
+        </div>
+
+        <div class="gf-form">
+          <span class="gf-form-label width-8">Icon</span>
+          <div class="gf-form-select-wrapper width-20">
+            <select
+              class="gf-form-input"
+              ng-model="ctrl.link.icon"
+              ng-options="k as k for (k, v) in ctrl.iconMap"
+            ></select>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="gf-form-group">
+      <h5 class="section-heading">Include</h5>
+      <div>
+        <gf-form-switch
+          class="gf-form"
+          label="Time range"
+          checked="ctrl.link.keepTime"
+          switch-class="max-width-6"
+          label-class="width-9"
+        ></gf-form-switch>
+        <gf-form-switch
+          class="gf-form"
+          label="Variable values"
+          checked="ctrl.link.includeVars"
+          switch-class="max-width-6"
+          label-class="width-9"
+        ></gf-form-switch>
+        <gf-form-switch
+          class="gf-form"
+          label="Open in new tab"
+          checked="ctrl.link.targetBlank"
+          switch-class="max-width-6"
+          label-class="width-9"
+        ></gf-form-switch>
+      </div>
+    </div>
+  </div>
+  <button class="btn btn-primary" ng-if="ctrl.mode == 'new'" ng-click="ctrl.addLink()">
+    Add
+  </button>
+  <button class="btn btn-primary" ng-if="ctrl.mode == 'edit'" ng-click="ctrl.saveLink()">
+    Update
+  </button>
+</div>
diff --git a/public/app/plugins/panel/stat/types.ts b/public/app/plugins/panel/stat/types.ts
index d0ac9bd3c72..f7af3f3d1b4 100644
--- a/public/app/plugins/panel/stat/types.ts
+++ b/public/app/plugins/panel/stat/types.ts
@@ -61,6 +61,8 @@ export function addStandardDataReduceOptions(
     description: 'Choose a reducer function / calculation',
     editor: standardEditorsRegistry.get('stats-picker').editor as any,
     defaultValue: [ReducerID.mean],
+    // Hides it when all values mode is on
+    showIf: currentConfig => currentConfig.reduceOptions.values === false,
   });
 
   if (includeOrientation) {