From e2065ed6c71e544253fbf3effaea8434836e7d12 Mon Sep 17 00:00:00 2001
From: Mike Greiling <mike@pixelcog.com>
Date: Mon, 29 Jan 2018 13:49:04 -0600
Subject: [PATCH] add noData empty state to prometheus graphs

---
 .../javascripts/monitoring/components/dashboard.vue   |  8 +++++++-
 .../javascripts/monitoring/components/empty_state.vue | 11 +++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/monitoring/components/dashboard.vue b/app/assets/javascripts/monitoring/components/dashboard.vue
index 025e38ea99ae..5afae93724b0 100644
--- a/app/assets/javascripts/monitoring/components/dashboard.vue
+++ b/app/assets/javascripts/monitoring/components/dashboard.vue
@@ -76,7 +76,13 @@
             .then(data => this.store.storeDeploymentData(data))
             .catch(() => new Flash('Error getting deployment information.')),
         ])
-          .then(() => { this.showEmptyState = false; })
+          .then(() => {
+            if (this.store.groups.length < 1) {
+              this.state = 'noData';
+              return;
+            }
+            this.showEmptyState = false;
+          })
           .catch(() => { this.state = 'unableToConnect'; });
       },
 
diff --git a/app/assets/javascripts/monitoring/components/empty_state.vue b/app/assets/javascripts/monitoring/components/empty_state.vue
index 87d1975d5ade..56cd60c583b7 100644
--- a/app/assets/javascripts/monitoring/components/empty_state.vue
+++ b/app/assets/javascripts/monitoring/components/empty_state.vue
@@ -34,16 +34,23 @@
             svgUrl: this.emptyGettingStartedSvgPath,
             title: 'Get started with performance monitoring',
             description: `Stay updated about the performance and health
-of your environment by configuring Prometheus to monitor your deployments.`,
+              of your environment by configuring Prometheus to monitor your deployments.`,
             buttonText: 'Configure Prometheus',
           },
           loading: {
             svgUrl: this.emptyLoadingSvgPath,
             title: 'Waiting for performance data',
             description: `Creating graphs uses the data from the Prometheus server.
-If this takes a long time, ensure that data is available.`,
+              If this takes a long time, ensure that data is available.`,
             buttonText: 'View documentation',
           },
+          noData: {
+            svgUrl: this.emptyUnableToConnectSvgPath,
+            title: 'No data found',
+            description: `You are connected to the Prometheus server, but there is currently
+              no data to display.`,
+            buttonText: 'Configure Prometheus',
+          },
           unableToConnect: {
             svgUrl: this.emptyUnableToConnectSvgPath,
             title: 'Unable to connect to Prometheus server',
-- 
GitLab