diff --git a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.jsx b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.jsx
index cf4ce0714e..c6b8ddcfa0 100644
--- a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.jsx
+++ b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.jsx
@@ -2,7 +2,7 @@ import React, { Component, PropTypes } from 'react';
import AceEditor from 'react-ace';
import { connect } from 'react-redux';
import { push } from 'react-router-redux';
-import { orderBy, sortBy } from 'lodash';
+import { filter, orderBy, sortBy } from 'lodash';
import entityGetter from 'redux/utilities/entityGetter';
import { getStatusLabelCounts, setDisplay } from 'redux/nodes/components/ManageHostsPage/actions';
@@ -134,6 +134,20 @@ export class ManageHostsPage extends Component {
return false;
}
+ filterHosts = () => {
+ const { hosts: allHosts, selectedLabel } = this.props;
+
+ // TODO: Filter custom labels by their host_ids attribute
+ if (!selectedLabel || selectedLabel.type === 'custom' || selectedLabel.type === 'all') {
+ return allHosts;
+ }
+
+ const { type } = selectedLabel;
+ const filterObject = type === 'status' ? { status: selectedLabel.slug } : { [type]: selectedLabel[type] };
+
+ return filter(allHosts, filterObject);
+ }
+
sortHosts = (hosts) => {
const alphaHosts = sortBy(hosts, (h) => { return h.hostname; });
const orderedHosts = orderBy(alphaHosts, 'status', 'desc');
@@ -214,14 +228,15 @@ export class ManageHostsPage extends Component {
}
renderHosts = () => {
- const { display, hosts, isAddLabel } = this.props;
- const { onHostDetailActionClick, sortHosts } = this;
+ const { display, isAddLabel } = this.props;
+ const { onHostDetailActionClick, filterHosts, sortHosts } = this;
if (isAddLabel) {
return false;
}
- const sortedHosts = sortHosts(hosts);
+ const filteredHosts = filterHosts();
+ const sortedHosts = sortHosts(filteredHosts);
if (display === 'Grid') {
return sortedHosts.map((host) => {
diff --git a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tests.jsx b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tests.jsx
index 112fbe1c33..c2505028e3 100644
--- a/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tests.jsx
+++ b/frontend/pages/hosts/ManageHostsPage/ManageHostsPage.tests.jsx
@@ -5,24 +5,12 @@ import { noop } from 'lodash';
import ConnectedManageHostsPage, { ManageHostsPage } from 'pages/hosts/ManageHostsPage/ManageHostsPage';
import { connectedComponent, createAceSpy, reduxMockStore, stubbedOsqueryTable } from 'test/helpers';
+import { hostStub } from 'test/stubs';
-const host = {
- detail_updated_at: '2016-10-25T16:24:27.679472917-04:00',
- hostname: 'jmeller-mbp.local',
- id: 1,
- ip: '192.168.1.10',
- mac: '10:11:12:13:14:15',
- memory: 4145483776,
- os_version: 'Mac OS X 10.11.6',
- osquery_version: '2.0.0',
- platform: 'darwin',
- status: 'online',
- updated_at: '0001-01-01T00:00:00Z',
- uptime: 3600000000000,
- uuid: '1234-5678-9101',
-};
const allHostsLabel = { id: 1, display_text: 'All Hosts', slug: 'all-hosts', type: 'all', count: 22 };
const windowsLabel = { id: 2, display_text: 'Windows', slug: 'windows', type: 'platform', count: 22 };
+const offlineHost = { ...hostStub, id: 111, status: 'offline' };
+const offlineHostsLabel = { id: 5, display_text: 'OFFLINE', slug: 'offline', status: 'offline', type: 'status', count: 1 };
const mockStore = reduxMockStore({
components: {
ManageHostsPage: {
@@ -35,12 +23,19 @@ const mockStore = reduxMockStore({
},
},
entities: {
+ hosts: {
+ data: {
+ [hostStub.id]: hostStub,
+ [offlineHost.id]: offlineHost,
+ },
+ },
labels: {
data: {
1: allHostsLabel,
2: windowsLabel,
3: { id: 3, display_text: 'Ubuntu', slug: 'ubuntu', type: 'platform', count: 22 },
4: { id: 4, display_text: 'ONLINE', slug: 'online', type: 'status', count: 22 },
+ 5: offlineHostsLabel,
},
},
},
@@ -77,13 +72,13 @@ describe('ManageHostsPage - component', () => {
describe('host rendering', () => {
it('renders hosts as HostDetails by default', () => {
- const page = mount();
+ const page = mount();
expect(page.find('HostDetails').length).toEqual(1);
});
it('renders hosts as HostsTable when the display is "List"', () => {
- const page = mount();
+ const page = mount();
expect(page.find('HostsTable').length).toEqual(1);
});
@@ -104,6 +99,26 @@ describe('ManageHostsPage - component', () => {
expect(mockStore.getActions()).toInclude(toggleDisplayAction);
});
+
+ it('filters hosts', () => {
+ const allHostsLabelPageNode = mount(
+
+ ).node;
+ const offlineHostsLabelPageNode = mount(
+
+ ).node;
+
+ expect(allHostsLabelPageNode.filterHosts()).toEqual([hostStub, offlineHost]);
+ expect(offlineHostsLabelPageNode.filterHosts()).toEqual([offlineHost]);
+ });
});
describe('Adding a new label', () => {