From 5372dec0869a521d327b462ba09a06bf3fc235fb Mon Sep 17 00:00:00 2001
From: Josh Dover <me@joshdover.com>
Date: Wed, 1 Aug 2018 15:12:21 -0500
Subject: [PATCH] Add error handling

---
 .../public/components/status_app.js           | 21 +++++++++------
 .../status_page/public/lib/load_status.js     | 26 ++++++++++++++++---
 2 files changed, 35 insertions(+), 12 deletions(-)

diff --git a/src/core_plugins/status_page/public/components/status_app.js b/src/core_plugins/status_page/public/components/status_app.js
index c365dcc7cb1f..f7799e454fb8 100644
--- a/src/core_plugins/status_page/public/components/status_app.js
+++ b/src/core_plugins/status_page/public/components/status_app.js
@@ -41,25 +41,24 @@ class StatusApp extends Component {
     super();
     this.state = {
       loading: true,
+      fetchError: false,
       data: null
     };
   }
 
   componentDidMount = async function () {
-    try {
-      this.setState({
-        data: await loadStatus(),
-        loading: false
-      });
-    } catch (e) {
-      console.error(e);
+    const data = await loadStatus();
+
+    if (data) {
+      this.setState({ loading: false, data: data });
+    } else {
       this.setState({ fetchError: true, loading: false });
     }
   }
 
   render() {
     const { buildNum, buildSha } = this.props;
-    const { loading, data } = this.state;
+    const { loading, fetchError, data } = this.state;
 
     // If we're still loading, return early with a spinner
     if (loading) {
@@ -68,6 +67,12 @@ class StatusApp extends Component {
       );
     }
 
+    if (fetchError) {
+      return (
+        <EuiText color="danger">An error occurred loading the status</EuiText>
+      );
+    }
+
     // Extract the items needed to render each component
     const { metrics, statuses, serverState, name } = data;
 
diff --git a/src/core_plugins/status_page/public/lib/load_status.js b/src/core_plugins/status_page/public/lib/load_status.js
index 1106899ce908..9e3d814dfbee 100644
--- a/src/core_plugins/status_page/public/lib/load_status.js
+++ b/src/core_plugins/status_page/public/lib/load_status.js
@@ -20,6 +20,10 @@
 import _ from 'lodash';
 
 import chrome from 'ui/chrome';
+import { notify } from 'ui/notify';
+
+// Module-level error returned by notify.error
+let errorNotif;
 
 /*
 Returns an object of any keys that should be included for metrics.
@@ -62,12 +66,26 @@ function formatMetrics(data) {
 }
 
 async function loadStatus() {
-  const response = await fetch(chrome.addBasePath('/api/status'), {
-    method: 'get'
-  });
+  // Clear any existing error banner.
+  if (errorNotif) {
+    errorNotif.clear();
+    errorNotif = null;
+  }
+
+  let response;
+
+  try {
+    response = await fetch(chrome.addBasePath('/api/status'), { method: 'get' });
+  } catch (e) {
+    // If the fetch failed to connect, display an error and bail.
+    errorNotif = notify.error('Failed to request server status. Perhaps your server is down?');
+    return;
+  }
 
   if (response.status >= 400) {
-    throw new Error(`Request failed with status code: ${response.status}`);
+    // If the server does not respond with a successful status, display an error and bail.
+    errorNotif = notify.error(`Failed to request server status with status code ${response.status}`);
+    return;
   }
 
   const data = await response.json();