From 575fcaaeff8db6f658e16c6c417d1dac9560b096 Mon Sep 17 00:00:00 2001 From: Andrew Watkins Date: Wed, 3 Jan 2018 13:13:56 -0800 Subject: [PATCH] Add environment variables and links to chronograf --- ui/src/hosts/apis/index.js | 10 +++++----- ui/src/hosts/containers/HostsPage.js | 24 +++++++++++++++++++----- ui/src/shared/actions/auth.js | 18 ++++++++++++++---- ui/src/shared/apis/env.js | 12 +++++++++--- ui/src/utils/ajax.js | 3 +++ 5 files changed, 50 insertions(+), 17 deletions(-) diff --git a/ui/src/hosts/apis/index.js b/ui/src/hosts/apis/index.js index 8cef7d3a8..6da596105 100644 --- a/ui/src/hosts/apis/index.js +++ b/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 => { diff --git a/ui/src/hosts/containers/HostsPage.js b/ui/src/hosts/containers/HostsPage.js index 50783bc6e..ce801b258 100644 --- a/ui/src/hosts/containers/HostsPage.js +++ b/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) diff --git a/ui/src/shared/actions/auth.js b/ui/src/shared/actions/auth.js index 79aeaa510..5e8308deb 100644 --- a/ui/src/shared/actions/auth.js +++ b/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()) diff --git a/ui/src/shared/apis/env.js b/ui/src/shared/apis/env.js index 96210773f..77070e9c8 100644 --- a/ui/src/shared/apis/env.js +++ b/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) - throw error + console.error('Error retreieving envs: ', error) + return DEFAULT_ENVS } } diff --git a/ui/src/utils/ajax.js b/ui/src/utils/ajax.js index 232fa8125..48e9591ef 100644 --- a/ui/src/utils/ajax.js +++ b/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, } }