Add environment variables and links to chronograf

ui/src/hosts/apis/index.js

@@ -2,19 +2,19 @@ import {proxy} from 'utils/queryUrlGenerator'
 import AJAX from 'utils/ajax'
 import _ from 'lodash'
 
-export function getCpuAndLoadForHosts(
+export const getCpuAndLoadForHosts = (
   proxyLink,
   telegrafDB,
-  uptimeInverval = '1m'
+  telegrafSystemInterval
-) {
+) => {
   return proxy({
     source: proxyLink,
     query: `SELECT mean("usage_user") FROM cpu WHERE "cpu" = 'cpu-total' AND time > now() - 10m GROUP BY host;
       SELECT mean("load1") FROM "system" WHERE time > now() - 10m GROUP BY host;
-      SELECT non_negative_derivative(mean(uptime)) AS deltaUptime FROM "system" WHERE time > now() - 10m GROUP BY host, time(${uptimeInverval}) fill(0);
+      SELECT non_negative_derivative(mean(uptime)) AS deltaUptime FROM "system" WHERE time > now() - 10m GROUP BY host, time(${telegrafSystemInterval}) fill(0);
       SELECT mean("Percent_Processor_Time") FROM win_cpu WHERE time > now() - 10m GROUP BY host;
       SELECT mean("Processor_Queue_Length") FROM win_system WHERE time > now() - 10s GROUP BY host;
-      SELECT non_negative_derivative(mean("System_Up_Time")) AS winDeltaUptime FROM win_system WHERE time > now() - 10m GROUP BY host, time(${uptimeInverval}) fill(0);
+      SELECT non_negative_derivative(mean("System_Up_Time")) AS winDeltaUptime FROM win_system WHERE time > now() - 10m GROUP BY host, time(${telegrafSystemInterval}) fill(0);
       SHOW TAG VALUES WITH KEY = "host";`,
     db: telegrafDB,
   }).then(resp => {

ui/src/hosts/containers/HostsPage.js

@@ -1,4 +1,5 @@
 import React, {PropTypes, Component} from 'react'
+import {connect} from 'react-redux'
 import _ from 'lodash'
 
 import HostsTable from 'src/hosts/components/HostsTable'
@@ -19,12 +20,16 @@ class HostsPage extends Component {
   }
 
   async componentDidMount() {
-    const {source: {links, telegraf}, addFlashMessage} = this.props
+    const {source, links, addFlashMessage} = this.props
 
-    const {data: {telegrafSystemInterval}} = await getEnv(links.env)
+    const {telegrafSystemInterval} = await getEnv(links.environment)
 
     Promise.all([
-      getCpuAndLoadForHosts(links.proxy, telegraf, telegrafSystemInterval),
+      getCpuAndLoadForHosts(
+        source.links.proxy,
+        source.telegraf,
+        telegrafSystemInterval
+      ),
       getLayouts(),
       new Promise(resolve => {
         this.setState({hostsLoading: true})
@@ -36,7 +41,7 @@ class HostsPage extends Component {
           hosts,
           hostsLoading: false,
         })
-        getAppsForHosts(links.proxy, hosts, layouts, telegraf)
+        getAppsForHosts(source.links.proxy, hosts, layouts, source.telegraf)
           .then(newHosts => {
             this.setState({
               hosts: newHosts,
@@ -101,6 +106,12 @@ class HostsPage extends Component {
 
 const {func, shape, string} = PropTypes
 
+const mapStateToProps = ({links}) => {
+  return {
+    links,
+  }
+}
+
 HostsPage.propTypes = {
   source: shape({
     id: string.isRequired,
@@ -111,7 +122,10 @@ HostsPage.propTypes = {
     }).isRequired,
     telegraf: string.isRequired,
   }),
+  links: shape({
+    environment: string.isRequired,
+  }),
   addFlashMessage: func,
 }
 
-export default HostsPage
+export default connect(mapStateToProps, null)(HostsPage)

ui/src/shared/actions/auth.js

@@ -61,13 +61,15 @@ export const getMeAsync = ({shouldResetMe = false} = {}) => async dispatch => {
     const {
       data: me,
       auth,
-      logoutLink,
-      external,
       users,
-      organizations,
       meLink,
       config,
+      external,
+      logoutLink,
+      organizations,
+      environment,
     } = await getMeAJAX()
+
     dispatch(
       meGetCompleted({
         me,
@@ -75,8 +77,16 @@ export const getMeAsync = ({shouldResetMe = false} = {}) => async dispatch => {
         logoutLink,
       })
     )
+
     dispatch(
-      linksReceived({external, users, organizations, me: meLink, config})
+      linksReceived({
+        external,
+        users,
+        organizations,
+        me: meLink,
+        config,
+        environment,
+      })
     ) // TODO: put this before meGetCompleted... though for some reason it doesn't fire the first time then
   } catch (error) {
     dispatch(meGetFailed())

ui/src/shared/apis/env.js

@@ -1,13 +1,19 @@
 import AJAX from 'src/utils/ajax'
 
+const DEFAULT_ENVS = {
+  telegrafSystemInterval: '1m',
+}
+
 export const getEnv = async url => {
   try {
-    return await AJAX({
+    const {data} = await AJAX({
       method: 'GET',
       url,
     })
+
+    return data
   } catch (error) {
-    console.error(error)
+    console.error('Error retreieving envs: ', error)
-    throw error
+    return DEFAULT_ENVS
   }
 }

ui/src/utils/ajax.js

@@ -18,7 +18,9 @@ const generateResponseWithLinks = (response, newLinks) => {
     organizations,
     me: meLink,
     config,
+    environment,
   } = newLinks
+
   return {
     ...response,
     auth: {links: auth},
@@ -28,6 +30,7 @@ const generateResponseWithLinks = (response, newLinks) => {
     organizations,
     meLink,
     config,
+    environment,
   }
 }