From 04540dcec4d8cf4690d2f17af224e542224cc806 Mon Sep 17 00:00:00 2001 From: Kevin Fitzpatrick Date: Fri, 14 Oct 2016 11:34:08 -0700 Subject: [PATCH] WIP --- npm-debug.log | 19 ++++++++++ ui/src/alerts/components/AlertsTable.js | 47 +++++++++++++------------ ui/src/alerts/containers/AlertsApp.js | 3 +- ui/src/utils/getInitialState.js | 5 ++- 4 files changed, 49 insertions(+), 25 deletions(-) create mode 100644 npm-debug.log diff --git a/npm-debug.log b/npm-debug.log new file mode 100644 index 000000000..28201934a --- /dev/null +++ b/npm-debug.log @@ -0,0 +1,19 @@ +0 info it worked if it ends with ok +1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'start' ] +2 info using npm@2.15.9 +3 info using node@v4.6.0 +4 verbose stack Error: ENOENT: no such file or directory, open '/Users/kfitzpatrick/workspace/go/src/github.com/influxdata/mrfusion/package.json' +4 verbose stack at Error (native) +5 verbose cwd /Users/kfitzpatrick/workspace/go/src/github.com/influxdata/mrfusion +6 error Darwin 14.5.0 +7 error argv "/usr/local/bin/node" "/usr/local/bin/npm" "start" +8 error node v4.6.0 +9 error npm v2.15.9 +10 error path /Users/kfitzpatrick/workspace/go/src/github.com/influxdata/mrfusion/package.json +11 error code ENOENT +12 error errno -2 +13 error syscall open +14 error enoent ENOENT: no such file or directory, open '/Users/kfitzpatrick/workspace/go/src/github.com/influxdata/mrfusion/package.json' +14 error enoent This is most likely not a problem with npm itself +14 error enoent and is related to npm not being able to find a file. +15 verbose exit [ -2, true ] diff --git a/ui/src/alerts/components/AlertsTable.js b/ui/src/alerts/components/AlertsTable.js index 85d725c87..184670dc9 100644 --- a/ui/src/alerts/components/AlertsTable.js +++ b/ui/src/alerts/components/AlertsTable.js @@ -3,10 +3,12 @@ import _ from 'lodash'; const AlertsTable = React.createClass({ propTypes: { - hosts: PropTypes.arrayOf(PropTypes.shape({ + alerts: PropTypes.arrayOf(PropTypes.shape({ name: PropTypes.string, - cpu: PropTypes.number, - load: PropTypes.number, + time: PropTypes.string, + value: PropTypes.string, + host: PropTypes.string, + severity: PropTypes.string, })), source: PropTypes.shape({ id: PropTypes.string.isRequired, @@ -17,19 +19,19 @@ const AlertsTable = React.createClass({ getInitialState() { return { searchTerm: '', - filteredHosts: this.props.hosts, + filteredAlerts: this.props.alerts, sortDirection: null, sortKey: null, }; }, componentWillReceiveProps(newProps) { - this.filterHosts(newProps.hosts, this.state.searchTerm); + this.filterAlerts(newProps.alerts, this.state.searchTerm); }, - filterHosts(allHosts, searchTerm) { - const hosts = allHosts.filter((h) => h.name.search(searchTerm) !== -1); - this.setState({searchTerm, filteredHosts: hosts}); + filterAlerts(allAlerts, searchTerm) { + const alerts = allAlerts.filter((h) => h.name.search(searchTerm) !== -1); + this.setState({searchTerm, filteredAlerts: alerts}); }, changeSort(key) { @@ -42,44 +44,45 @@ const AlertsTable = React.createClass({ } }, - sort(hosts, key, direction) { + sort(alerts, key, direction) { switch (direction) { case 'asc': - return _.sortBy(hosts, (e) => e[key]); + return _.sortBy(alerts, (e) => e[key]); case 'desc': - return _.sortBy(hosts, (e) => e[key]).reverse(); + return _.sortBy(alerts, (e) => e[key]).reverse(); default: - return hosts; + return alerts; } }, render() { - const hosts = this.sort(this.state.filteredHosts, this.state.sortKey, this.state.sortDirection); + const alerts = this.sort(this.state.filteredAlerts, this.state.sortKey, this.state.sortDirection); const {source} = this.props; return (
-

{this.props.hosts.length} Hosts

- +

{this.props.alerts.length} Alerts

+
- - - - + + + + + { - hosts.map(({name, cpu, load}) => { + alerts.map(({name, cpu, load}) => { return ( - + @@ -111,7 +114,7 @@ const SearchBar = React.createClass({ diff --git a/ui/src/alerts/containers/AlertsApp.js b/ui/src/alerts/containers/AlertsApp.js index 620abc45e..2e7418813 100644 --- a/ui/src/alerts/containers/AlertsApp.js +++ b/ui/src/alerts/containers/AlertsApp.js @@ -17,7 +17,6 @@ const AlertsApp = React.createClass({ getInitialState() { return { alerts: [], - hosts: [], }; }, @@ -39,7 +38,7 @@ const AlertsApp = React.createClass({
- +
diff --git a/ui/src/utils/getInitialState.js b/ui/src/utils/getInitialState.js index 2c957ce15..dc3e53052 100644 --- a/ui/src/utils/getInitialState.js +++ b/ui/src/utils/getInitialState.js @@ -1,4 +1,4 @@ -export default function getInitialState(localStorage, hosts) { +export default function getInitialState(localStorage, hosts, alerts) { const existingTimeSettingsString = localStorage.getItem('time'); const h = {}; @@ -14,8 +14,11 @@ export default function getInitialState(localStorage, hosts) { groupByInterval: 60, }, JSON.parse(existingTimeSettingsString || '{}')); + // Why are we getting hosts for all pages? + // I've copied alerts here in the same way. return { hosts: h, + alerts: alerts, time, }; }
this.changeSort('name')} className="sortable-header">HostnameStatus this.changeSort('cpu')} className="sortable-header">CPU this.changeSort('load')} className="sortable-header">Load this.changeSort('name')} className="sortable-header">AlertTime this.changeSort('value')} className="sortable-header">Value this.changeSort('host')} className="sortable-header">Host this.changeSort('severity')} className="sortable-header">Severity Apps
{name}{name}
{`${cpu.toFixed(2)}%`} {`${load.toFixed(2)}`}